/* ------   Layout ------*/

/* pixel to em
 * 5px 0.357em : 0.357em
 * 10px 0.714em : 0.714em
 * 15px 1.071em : 1.071em
 * 20px 1.429em : 1.429em
 */
/*  Main sections */

#header{
	background: #fff url(../images/header-image.png) 95% 0 no-repeat;
  height: 150px;
	overflow: hidden;
}

.banner{
	border-top: solid 1px #d6f0f9;
	height: 260px;
	overflow: hidden;
	position: relative;
}

.banner-hdr{
	background-color: #380f54;
	border-top: solid 1px #303030;
	border-bottom: solid 1px #303030;
	color: #fff;	  
  font-size: 1.2em; 
  font-weight: 200 !important;
	padding: 0.5em 1em;
	margin-bottom: 0;
	opacity: 0.5;
	
	width: 100%;
	
	position: absolute;
	opacity: 0.89;
	left: 0;
	bottom: 0;
}

.banner-hdr span{
 font-size: 1.5em;
}

.splab{
	padding: 2em 2em 0 2em;
}

.splab-links{
	padding: 0.5em 2em 2em 2em;
}

[class^="col-"] .inner{
	padding: 1.429em;
}

/* 12-column responsive grid */
#container{
    width: 945px;
    margin: 0 auto;	
}

.row {
    clear: both;
}

[class^="col-"] {
    float: left;
    margin: 0 3.84615384615% 0 0;
    list-style: none;
    position: relative;
}

[class^="col-"]:last-child {
    margin: 0;
}

.col-1 { width: 4.8076923077% }
.col-2 { width: 13.4615384615% }
.col-3 { width: 22.1153846154% }
.col-4 { width: 30.7692307692% }
.col-5 { width: 39.4230769231% }
.col-6 { width: 48.0769230769% }
.col-7 { width: 56.7307692308% }
.col-8 { width: 65.3846153846% }
.col-9 { width: 74.0384615385% }
.col-10 { width: 82.6923076923% }
.col-11 { width: 91.3461538462% }
.col-12 { width: 100%; margin: 0 }


/*-- Add padding __*/
.pad-1{
	padding: 2em;
}

.pad-1-lst{
	padding: 0 2em 2em 2em;
}

.pad-1-bttm-1{
	padding-bottom: 2em;
}

.pad-1-bttm-2{
	padding-bottom: 1em;
}

.pad-2{
	padding: 0.714em;
}

/*____ Floats, push 'n pulls, indents _____*/

.float-right{
	float: right;
}


.float-left{
	float: left;
}

.indent{
	margin: 2em 0 0 2em;
}

.relative{
	position: relative;
}


/*______ Over rides, clear fixes _____*/
.cf, .row{
	overflow: hidden;
}
.cf:before,
        .cf:after {
            content:"";
            display:table;
        }

        .cf:after {
            clear:both;
        }

        /* For IE 6/7 (trigger hasLayout) */
        .cf {
            *zoom:1;
        }

.clear-both{
  clear: both;
}


/*** ----- Grid testing ---***/

.holding-div{
	background-color: #eee;
	height: 200px;
	width: 100%;
}

.dark-holding{
	background-color: #a0a0a0;
	height: 200px;
	width: 100%;	
}