body{
    margin:0 auto;
    padding:0;
    text-align: center;
    font-family:'Lato', Arial, sans-serif;
    font-weight:400;
    background-color:#eeeeee;
}

#wrapper{
    max-width:100%;
    position:relative;
    text-align: left;
}
#header{
    position:fixed;
    top:0;
    background-image:url('headerBackground.png');
    background-repeat: repeat-x;
    width:100%;
    height:126px;
}

/*  SECTIONS  */
.section {
	clear: both;
	padding: 0px 20px;
	margin: 0 auto;
    max-width:900px;
}

/*  COLUMN SETUP  */
.col {
	display: block;
	float:left;
	margin: 1% 0 1% 1.6%;
}
.col:first-child { margin-left: 0; }
.fixedWidth{
    width:800px;
}

/*  GROUPING  */
.group:before,
.group:after {
	content:"";
	display:table;
}
.group:after {
	clear:both;
}
.group {
    zoom:1; /* For IE 6/7 */
}
                                               
					
/*  GRID OF THREE  */
.span3of3 {
	width: 100%;
}
.span2of3 {
	width: 66.13%;
}
.span1of3 {
	width: 32.26%;
}
/* GRID OF FOUR */
.span4of4 {
	width: 100%; 
}
.span3of4 {
	width: 74.6%; 
}
.span2of4 {
	width: 49.2%; 
}
.span1of4 {
	width: 23.8%; 
}


/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col { 
		margin: 1% 0 1% 0%;
	}
}

@media only screen and (max-width: 480px) {
    .span1of4, .span2of4, .span3of4, .span4of4 {
		width: 100%; 
	}
	.span3of3 {
		width: 100%; 
	}
	.span2of3 {
		width: 100%; 
	}
	.span1of3 {
		width: 100%;
	}
}


#mainContent{
    background: url('mainContent.png');
    background-size: 100% 100%;
    background-repeat: no-repeat;
    margin-top:123px;
    padding-bottom:20px;
    color:#ffffff;
}
#secondaryContent{
    background-color: #ffffff;
    color:#555555;
    box-shadow: 0px -3px 6px #091d42;
}

#footerContent{
    background-color:#eeeeee;
    box-shadow: 0px -6px 6px #555555;
    color:#555555;
    padding-bottom:20px;
    bottom:0;
    height:150px;
    width:100%;
    text-align: left;
}

/*FONTS*/
h1{
    font-weight:900;
    font-size:3em;
    text-shadow: 0px 1px 3px #174291;
}

h2{
    font-weight:300;
    font-size:2em;
}
h2.bold{
    font-weight:900;
    font-size:2em;
}
h3{
    font-weight: 300;
}
h3.bold{
    font-weight: 900;
}
p.large{
    font-size:1.5em;
}
a:link{
    color:#208dbb;
    text-decoration:none;
}
a:visited{
    color:#208dbb;
    text-decoration:none;
}
a:hover{
    color:#2e4360;
    text-decoration: none;
}
a.whiteLink{
    color:#f6f6f6;
}
a.whiteLink:visited{
    color:#f6f6f6;
}
a.whiteLink:hover{
    color:#208dbb;
}

/*STYLING*/
.borderTop{
    border-top:1px solid #eeeeee;
}
.centreText{
    text-align: center;
}
form{
    clear:both;
    overflow:hidden;
}
input[type=text],
input[type=email],
input[type=url],
input[type=password],
textarea,
select {
    width: 100%; 
}
.button{
    border-radius: 0px;
    background-color: #208dbb;
    color: #f6f6f6;
    border:0;
    font-size:1em;
    cursor:pointer;
    padding:10px;
}
.button:hover{
    background-color: rgb(0, 169, 157);
}

/*IMAGES*/
img.resize{
    width:100%;
    float:right;
}
img.icon {
    float:left; 
    bottom:0;
    width:45px;
    margin-right:10px;
}
.smallIcon {
    float:left;
    width:18px;
    margin-right: 5px;
}
