﻿/* ----------------------------------------------
	Template Name : Keep It Simple
	Template Code : S-0027
	Version : 1.0   
	Author : Erwin Aligam
	Author URI : http://www.styleshout.com/       
	Last Date Modified : September 29, 2008	
 ------------------------------------------------ */

/* ----------------------------------------------
   HTML ELEMENTS
------------------------------------------------- */


html
{
    min-height: 101%;
}

body
{
    font: 12px/165% 'Arial' , Verdana, Helvetica, sans-serif;
    color: #000000;
    margin: 0;
    padding: 0 0 50px 0;
    background: #F6F5F5 url(images/bgd.gif);
    background-position: 9px 9px;
    text-align: left;
}
/* Links */
a:link, a:visited
{
    text-decoration: none;
    color: #ff4400;
}
a:hover
{
    text-decoration:underline;
}


a.no-border
{
    border: 0;
}


a.image
{
     border: 1px solid transparent;
}

a:hover.image
{
    border: 1px solid #ff4400;
}


a.black
{
    color: black;
}

a.black:hover
{
 color: #ff4400;

}


a:hover img
{
    border: 0px;

}



/* Headers */
h1, h2, h3, h4
{
    font-family: arial;
    color: #ff4400;
    margin: 0px;
    font-weight: normal;
    padding: 5px 15px 7px 0px;
}
h1
{
    font-size: 20px;
}
h2
{
    font-size: 18px;
    color: #663333;
}
h3
{
    font-size: 16px;
    line-height: 22px;
}
h4
{
    font-size: 13px;
    color: #000000;
    font-size: 13px;
}

strong
{
    font-weight: bold;
}

/* Lists */
ul, ol
{
    margin: 10px 20px 20px 5px;
    padding: 0 20px 20px 5px;
}

ul
{
    list-style: none;
}

li
{
    line-height: 25px;
}

ol
{
    list-style: decimal;
}

dt
{
    font-weight: bold;
    color: #7BA857;
}
dd
{
    padding-left: 25px;
}

p, dl
{
    padding: 5px 25px 8px 0px;
    margin: 0px;
}

/* Images */
img
{
    border: none;
}
img.float-right
{
    margin: 5px 0px 10px 10px;
}
img.float-left
{
    margin: 5px 10px 10px 0px;
}

code
{
    margin: 3px 0;
    padding: 15px;
    text-align: left;
    display: block;
    overflow: auto;
    font: 500 1em/1.5em 'Lucida Console' , 'Courier New' , Monospace; /* white-space: pre; */
    border: 1px solid #F0F0F0;
    background: #f8f8f8;
}
acronym
{
    cursor: help;
    border-bottom: 1px dotted #895F30;
}
blockquote
{
    margin: 10px;
    padding: 10px 10px 10px 32px;
    border: 1px solid #F0F0F0;
    background: #f8f8f8 url(../images/quote.gif) no-repeat 12px 12px;
    font-weight: normal;
    font-size: 17px;
    line-height: 1.5em;
    font-style: italic;
    font-family: Georgia, 'Times New Roman' , Times, Serif;
    color: #555;
}

/* start - table */
table
{
    border-collapse: collapse;
    margin: 10px 0px 10px 0px;
}
tr
{
    background: #fff;
}
tr.altrow
{
    background: #F9F9F9;
}
th, td
{
    text-align: left;
    border-width: 1px;
    border-style: solid;
}
th
{
    color: #7BA857;
    background: #EFFAE6;
    padding: .8em 1em;
    border-color: #DFF4D5 #D3EFC3 #A7DF8A #D3EFC3;
}
td
{
    border-color: #EFEFEF;
    padding: .7em 1em;
}
/* end - table */

/* form elements */
.site-form
{
    margin: 10px;
    padding: 15px 25px 25px 20px;
    border: 1px solid #F0F0F0;
    background: #f8f8f8;
}
site-form p
{
    border-bottom: 1px solid #E6E6E6;
    padding: 12px 0 5px 0;
    margin: 0;
    color: #7BA857;
}
label
{
    font-weight: bold;
    color: #000000;
}
input, select, textarea
{
    margin: 5px 0;
    padding: 5px;
    color: #6A6969;
    border-width: 1px;
    border-style: solid;
    border-color: #d4d4d4 #ebebeb #ebebeb #d4d4d4;
    font: 11px 'Lucida Grande' , Verdana, Helvetica, sans-serif;
}
input:focus, select:focus, textarea:focus
{
    background: #fff0ea;
}
#name, #email, #message, #website
{
    width: 380px;
}
input.button
{
    font: bold 12px Arial, Sans-serif;
    height: 30px;
    margin: 0;
    padding: 2px 3px;
    color: #fff;
    background: #9CCF5F;
    border-width: 1px;
    border-style: solid;
    border-color: #B6DE8F #8DB836 #8DB836 #B6DE8F;
}

/* ------------------------------------------
   LAYOUT
------------------------------------------- */

#content-wrapper
{
    width: 1000px;
    margin: 0 auto;
    padding: 0px;
}
#header-wrap
{
    width: 100%;
    background: #fff url(../images/bg.gif) repeat-x;
    margin: 0;
    padding: 0;
}
#header
{
    /*background-color: #ff4400;*/
 background-color: #000;
    padding:0px 20px 50px 20px;
 
 overflow:hidden;
}


#header-left
{
    float: left;
    width: 200px;
    margin: 15px 0px 0px 0px;
padding-top:70px
}

#admin
{
    position: relative;
    top: 30px;
    left: 890px;
    color: #ff4400;
    width:100px;

}

#admin a
{
    color: #ff4400;
    text-decoration:none;
}

#admin a:hover
{
    color: #fff;
    text-decoration:none;
}

#header-left img
{
    vertical-align: top;
}

#header-left a:hover
{
border:none;
}

#header-left h1
{
    display: none;
    margin: 0;
    padding: 0;
}

#header-right
{
    float: right;
    width: 758px;
padding-top:62px

}




#small-header
{
    background-color: #000;
    padding:0px 20px 0px 20px;
    height: 50px;
 overflow:hidden;

}

#small-header-left
{
    width:200px;
    float:left;
}

#small-header-right
{
    width:350px;
    float:right;
   text-align:right;
}

#small-header-right p
{
	margin:0px;
	padding:0px 0px 20px;
	line-height:50px;
}

#small-header-right p a
{
  text-decoration:none;
}

#small-header-right p a:hover
{
  color:#fff;
  text-decoration:none;
}

#small-header-left h1
{
    display:none;
}





/*  navigation  */
#nav
{
    /*background-color: #ff4400;*/
    margin: 0;
    padding: 0px 20px 0px 20px;
    background-color: #000;
    width: 960px;
   overflow:hidden;
  
}
#nav ul
{
    float: left;
    list-style: none;
    margin: 5px 0 0 0;
    padding: 0 0 0 0px;
    overflow:hidden;
    width:100%;
    border-bottom:1px dotted #ff4400;
 
}
#nav ul li
{
    float: left;
    margin: 0;
    padding: 0 0 0 0px;
    color: #ffffff;
}
#nav ul li a
{
    float: left;
    margin: 0;
    padding: 0 7px 0 0px;
    color: #fff;
    font: normal 13px/30px 'Arial' , 'Helvetica Neue' , Arial, Sans-Serif;
    text-decoration:none;
}
#nav ul li a:hover, #header #nav ul li a:active
{
    border: none;
    color: #ff4400;
    background: transparent;
    text-decoration:none;
}
#nav ul li#current
{
}
#nav ul li a.current
{
    border: none;
    color: #ffffff;
    background: transparent;
    text-decoration:none;
}


#sub-nav
{
    background-color: #000000;
    margin: 0px 0px 0px 0px;
    padding: 20px 20px 20px 20px;
    width: 960px;
    height: 135px;
}

.sub-nav-col
{
    float: left;
    width: 190px;
    position: relative;
}

.sub-nav-divider
{
    float: left;
    width: 63px;
    background-image: url(images/subnavdivider.gif);
    background-repeat: no-repeat;
    background-position: 5px 8px;
    height: 100px;
}

#sub-nav h3
{
    color: white;
    font-family: Arial;
    font-size: 18px;
    padding: 0px;
    font-weight: normal;
    margin: 0px 0px 10px 0px;
}

#sub-nav p
{
    color: #ff4400;
    margin: 0px 0px 0px 0px;
    padding: 0px;
    font-size: 12px;
}


#sub-nav .info
{
    color: White;
    font-family: Arial;
    font-size: 18px;
    padding: 0px;
    margin: 0px 0px 0px 0px;
}

#sub-nav .info a
{
    color: White;
    font-family: Arial;
    font-size: 12px;
    padding: 0px;
    margin: 0px 0px 0px 0px;
}

#sub-nav p.learn
{
    position: absolute;
    top: 120px;
    margin: 0px;
    padding: 0px;
    clear: both;
}

#sub-nav a
{
    color: White;
}


/* Content */
.home-content-wrap
{
    clear: both;
    padding: 20px 0px 40px 20px;
    margin: 0px;
    background-color: #ffffff;
}

.content-wrap, .col-4-content-wrap
{
    clear: both;
    padding: 20px 20px 40px 20px;
    margin: 0px;
    background-color: #ffffff;
}


.content-wrap-clear
{
    clear: both;
    background-color: transparent;
    padding: 20px 0px 40px 0px;
    margin: 0px;
}

.content-black-full
{
 clear: both;
    background-color: black;
    padding: 20px 0px 40px 0px;
    margin: 0px;
}


.home-content-wrap .col1
{
    float: left;
    width: 250px;
}

.home-content-wrap .col2
{
    float: left;
    width: 250px;
}

.home-content-wrap .col3
{
    float: right;
    width: 475px;
}


.black-content-wrap, .col-4-black-content-wrap
{
    clear: both;
    background-color: #000000;
    padding: 20px 0px 40px 20px;
    margin: 0px;
}



.content-wrap .col1, .black-content-wrap .col1
{
    float: left;
    width: 250px;
}

.content-wrap .col2, .black-content-wrap .col2
{
    float: left;
    width: 250px;
}

.content-wrap .col3, .black-content-wrap .col3
{
    float: left;
    margin-left: 7px;
    width: 447px;
}




.col-4-content-wrap .col1, .col-4-black-content-wrap .col1
{
    float: left;
    width: 252px;
}
.col-4-content-wrap .col2, .col-4-black-content-wrap .col2
{
    float: left;
    width: 252px;
}
.col-4-content-wrap .col3, .col-4-black-content-wrap .col3
{
    float: left;
    width: 252px;
}
.col-4-content-wrap .col4, .col-4-black-content-wrap .col4
{
    float: left;
    width: 204px;
}


.col-4-black-content-wrap p, .col-4-black-content-wrap td, .col-4-black-content-wrap th, .black-content-wrap p, .black-content-wrap td, .black-content-wrap th
{
    color: #ffffff;
}

.col-4-black-content-wrap .orange, .black-content-wrap .orange, .orange
{
    color: #ff4400;
}

.col-4-black-content-wrap .white, .black-content-wrap .white, .white
{
    color: #ffffff;
}

.col-4-black-content-wrap .black, .black-content-wrap .black, .black
{
    color: #000000;
}


.span3col
{
    float:left;
   
    width:708px;
}

.portfolio
{
    border-bottom:1px solid #000000;
    margin-right:10px;
}

.portfolio-p
{
    padding-bottom:0px;
}

#portfolio-list
{
    margin-left:0px;
    padding-left:0px;
    margin-top:2px;
}


#portfolio-list li
{
    margin-left:0px;
    padding-left:0px;
}


.project-wrap
{
    margin-top:34px;
}
.project-title
{
    border-top:1px solid #000000;
    border-bottom:1px solid #000000;
    padding:4px 0px 4px 0px;
}

.project-links
{
    text-align:right;
      border-bottom:1px solid #ff4400;
     color:#ff4400;  
       padding:2px 0px 2px 0px;
     margin-bottom:8px;
}

.project-links ul
{
    margin:0px;
    padding:0px;
}

.project-links ul li 
{
       display:inline;
}

.project-links ul li a
{
 
    margin-left:5px;
    margin-right:5px;
}


.project-subwrap
{
	clear:both;
	overflow:hidden;
    margin-bottom:20px;
   
}

/* accordian */

.accordionHeader
{
    background-color: #000000;
}

.accordionHeader a
{
    color: #ffffff;
    text-decoration: none;
    display: block;
    padding: 3px 3px 3px 10px;
        border-bottom:1px solid #ffffff;
    
}

.accordionHeader a:hover
{
    color: #ffffff;
    text-decoration: underline;
    display: block;

}

.accordionContent
{
    background-color: #fff0ea;
    padding: 10px 20px 10px 20px;
}




.blog-list 
{
    width:90%;
    margin:1px 0px 20px 0px;
     padding:0px 0px 0px 0px;
}


.blog-list td

{
    border:none;
    border-bottom:1px solid #ff4400;
    padding:3px 0px 3px 0px;
}

.blog-list h3
{
    margin:0px;
       padding:1px 0px 0px 0px;
    font-size:12px;
    font-weight:bold;
}

.blog-list p
{
    color:#ff4400;
    margin:0px;
    padding:0px 0px 6px 0px;
}

.blog-list-selected h3,
.blog-list-selected p,
.blog-list-selected a
{
    color:Black;
}


.blog-list-pager 
{
      text-align:right;
}

.blog-list-pager td
{
    text-align:right;
    border:none;
}


.blog-list-pager table
{
     
    border:none;
    
    float:right;
}



.post-title h3
{
    color:  #ff4400;
    margin:0px;
    padding:0px;
    font-size:12px;
}

.caption-wrap
{
    border-top:1px solid  #ff4400;
     border-bottom:1px solid  #ff4400;
     overflow:hidden;
     margin:0px 0px 8px 0px;
     width:90%;
}

.caption-wrap p
{
    padding:0;
    margin:0px;
    float:left;
    font-size:10px;
    color:#ff4400;
}

.caption-wrap p.caption-wrap-date
{
    float:right;
}
    
    
#signup
{
    border-top:1px dotted #ff4400;
    overflow: hidden;
    margin-right:10px;
    padding-top:10px;
}   


#signup .email
{
    border:1px solid #ff4400;
    color:Black;
    width:200px;
    margin:0px 0px 10px 0px;
}

#signup .button
{
    display:block;
    background-color:#ff4400;
    border-color:#ff4400;
    padding:1px;
    width:100px;
    color:White;
    height:24px;
} 
    
/* main column */
#main h2
{
    font: normal 3.7em Georgia, 'Times New Roman' , Times, Serif;
    color: #444;
    letter-spacing: -2.2px;
    margin-left: 5px;
    margin-right: 15px;
    padding-left: 5px;
    padding-bottom: 3px;
    border-bottom: 1px solid #ebebeb;
}
#main h2 a
{
    color: #444;
    border: none;
}


/* footer */
#footer-wrapper
{
    width: 1000px;
    margin: 0 auto;
    padding: 0px;
    border-top: 1px solid #ff4400;
    position: relative;
    background: #ffffff;
}

#footer-content
{
    position: absolute;
    top: -1px;
    left: 0px;
    background-color: #ff4400;
    margin: 0px;
    padding: 6px 7px 7px 20px;
    float: left;
    vertical-align: top;
}

#footer-content p
{
    line-height: 13px;
    margin: 0px;
    padding: 0px;
    color: #ff9463;
}

#footer-content a
{
    color: #ff9463;
text-decoration:none;
}

#footer-content a:hover
{
    color: #ffffff;
text-decoration:none;
}


#footer-content a.current
{
    color: #ffffff;
text-decoration:none;
}



#footer-content p span
{
    color: White;
}



/* thumbnails */


/* alignment classes & additional classes*/
.float-left
{
    float: left;
}
.float-right
{
    float: right;
}
.align-left
{
    text-align: left;
}
.align-right
{
    text-align: right;
}
.no-border
{
    border: none;
}

/* clearing */
.clearer
{
    clear: both;
}
.clear
{
    display: inline-block;
}
.clear:after
{
    display: block;
    