/********** MAIN STYLES **********/

html {
height: 100%;
/* Required */
}

body {
	background-color: #FFF;
	line-height: 140%; 
	font-size: 12px;
	color: #333;
	font-family: Arial, Helvetica, Tahoma, Verdana, freesans;  /* freesans is for Linux */
	font-size: 12px;
	margin: 0;
}


div#containerDesktop1200 {
	background-color: #FFF;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1200px;
	height: 830px;
	margin-left: -600px;
	/*set to a negative number 1/2 of  width*/
	margin-top: -415px;
	/*set to a negative number 1/2 of  height*/
      
}

div#containerDesktop960 {
	background-color: #FFF;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 900px;
	height: 624px;
	margin-left: -450px;
	/*set to a negative number 1/2 of  width*/
	margin-top: -312px;
	/*set to a negative number 1/2 of  height*/
    display: none;    
}

div#containerTablet {
	background-color: #FFF;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 720px;
	height: 500px;
	margin-left: -360px;
	/*set to a negative number 1/2 of  width*/
	margin-top: -250px;
	/*set to a negative number 1/2 of  height*/
    display: none;    
}

div#containerMobile {
	background-color: #FFF;
	position: absolute;
	top: 0%;
	left: 50%;
	width: 320px;
	height: 500px;
	margin-left: -160px;
	/*set to a negative number 1/2 of  width*/
	margin-top: -0px;
	/*set to a negative number 1/2 of  height*/
    display: none;
}

/*  RESPONSIVE SNAPPING */
@media screen and (max-width:1400px) {  
	div#containerDesktop1200 { 
	   display: none; 
    }
    
	div#containerDesktop960 { 
	   display: block; 
    }    
}

@media screen and (max-width:1200px) {  
	div#containerDesktop960 { 
	   display: none; 
    }
    
	div#containerTablet { 
	   display: block; 
    }    
}


@media screen and (max-width:720px) {  
	div#containerTablet { 
	   display: none; 
    }
    
	div#containerMobile { 
	   display: block; 
    }    
}



div.clear {
 clear: both;
}


p, td {
	margin-top: 0;
	margin: 0 0 10px 0;
	text-align: justify;
}

img {
	border:0;
}


.normal11 {
	font-size: 11px;
}

.grey10 {
	font-size: 10px;
	color: #777;
}

.grey11 {
	font-size: 11px;
	color: #777;
}

.grey12 {
	font-size: 12px;
	color: #777;
}


.white10 {
	font-size: 10px;
	color: #FFF;
}

.white11 {
	font-size: 11px;
	color: #FFF;
}

.white12 {
	font-size: 12px;
	color: #FFF;
}

.red12 {
	color: #FF0000;
}

.nomargin {
	margin: 0;
}

a {
	color: #333;
}

a:hover {
	text-decoration: none;
}

h1 {
	margin-top: 0;  
	margin: 0 0 18px 0;  
	font-size: 24px;
	color: #333;
	line-height: 120%;
	font-weight: 400;
	}

h2 {
	margin-top: 0;
	font-size: 14px;
	margin: 0 0 10px 0;  
	color: #333;
	font-weight: 400;	
	line-height: 120%;	
}

h3,h4,h5,h6 {
	margin-top: 0;
	font-size: 12px;
	line-height: 120%;
	font-weight: 400;	
}

ol, ul {
	padding: 0;
	margin: 0 0 6px 25px;	
}


ol li, ul li {
	margin: 0 0 6px 0;	
	line-height: 120%;	
}

ul li li, ul li li li {
	margin: 6px 0 6px 0;	
	line-height: 140%;	
	list-style-type: disc;
}



/********** CONTENT STYLES **********/

div#content {
	margin: 0;
	padding: 20px;
}


div#contentLeft {
	float: left;
	width: 200px;    
}

div#contentRight {
	width: auto;
	float: right;
	padding: 0 50px 0 0;
}


/********** FOOTER STYLES **********/


div#footer {
	margin: 0px auto;
	width: 100%;
	text-align: center;
	color: #777;
	text-transform: uppercase;	
}


.footer {
	font-size: 11px;
	color: #777;
	padding: 50px 0 0 0;
	margin: 0;
	text-decoration: none;
	text-align: center;
}

a.footer {
	color: #777;
	text-decoration: none;
}

a:hover.footer {
	text-decoration: underline;
}