@charset "UTF-8";

/* 	
----------------------------------------------------
		
			Libralato Engines 
			Stylesheet: main.css
	
----------------------------------------------------*/
/* div {
	outline: 1px solid red;
	}
*/

body{	
	margin: 0 auto;
	padding: 0;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	text-align: center;
	font-size: 14px;
	line-height: 18px;
	color: #000;		
	background-color: #FFF;		/*	White	*/
	}
	
	
/* =TYPOGRAPHY 	
----------------------------------------------------*/

 @font-face { font-family: Opificio; src: url('Opificio.ttf'); } 
 @font-face { font-family: Opificio; font-weight: bold; src: url('Opificio-Bold.ttf');}
 
 p	{
	margin-bottom: 9px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;	
	}
	
h1, h2, h3, h4, h5, h6	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: normal;
	line-height: 18px;
	margin-bottom: 12px;
	}

h1	{
	padding: 10px 0px 0px 20px;
	font-size: 18px;
	line-height: 32px;
	color: #89a;
	}

h2	{
	padding: 5px 0px 0px 20px;
	font-size: 16px;
	line-height: 5px;
	color: #89a;
	}
	 
h2 a:link, 
h2 a:visited {
	font-size: 18px;
	margin-bottom: 12px;
	line-height: 24px;
	color: #456;
	text-transform: uppercase;	
	font-family: Verdana, Arial, Helvetica, sans-serif;
	}
		
h3	{
	padding: 10px 0px 0px 20px;
	font-size: 14px;
	line-height: 1px;
	color: #89a;
	}
	
h4	{
	font-size: 13px;
	letter-spacing: 0.045em;
	margin-bottom: 4px;
	}
	
strong	{
	font-weight: bold;
	}

ul  {
	margin: 0px 0px 0px 0px;
	padding-left: 15px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	
ul li {
	padding: 18px 10px 0px 15px;
	margin: 0px 10px 0px 5px;
	line-height: 1.25;
	color: #89a;
	list-style-type: none;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	}

table {
	width:90%;
	border-collapse:collapse;
	}
	table,th, td
	{
	border: 1px solid #89a;
	}

td  {
	padding: 10px 10px 0px 15px;
	font-family: Opificio, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #89a;
	}	
	
/* =LINKS 	
----------------------------------------------------*/
html a:link	{
	color: #996666;
	text-decoration: none;			
	}
	
html a:visited 	{
	color: #996666; 			
	}

html a:hover,
html a:active 	{
	color: #666;				/*	Violet			*/
	text-decoration: none;			
	}

/* =LAYOUT 	
----------------------------------------------------*/
#container{
	width: 1000px;
	margin: 0px auto 10px auto;
	padding: 0px;
	overflow: hidden;
	}
	
#content	{
	width: 1000px;
	min-height: 500px;
	margin: 0 auto;
	/*padding: 0 70px;*/
	text-align: left;
	background-image: url(../images/bg_container.gif);
	background-repeat: repeat-y;
	background-position: center center;
	}	

#header	{
	width: 1000px;
	height: 200px;
	margin: 0 auto;
	/*padding: 0 70px;*/
	position: relative;
	text-align: left;
	}

#header.home{
	position: relative;
	height: 242px;
	}
	
#header.home div#navigation {
	top: 201px;
	z-index: 500;
	}

#header	div.headerLogo {
	position: absolute;
	top: 30px;
	right: 658px;
	width: 300px;
	height: 150px;
	
	filter:alpha(opacity=90);
	-moz-opacity:.90;
	opacity:.90;
	z-index: 600;
	}	

#header	div.headerBanner {
	position: absolute;
	top: 30px;
	left: 344px;
	float: right;
	width: 615px;
	height: 150px;
	
	z-index: 150;
	filter:alpha(opacity=90);
	-moz-opacity:.90;
	opacity:.90;
	z-index: 600;
	}

#header div.topNav	{
	position: absolute;
	top: 2px;
	right: 42px;
	text-align: right;
	width: 200px;
	}
	
#YouTube	{
	width: 600px;
	height: 150px;
	margin: 0 auto;
	/*padding: 0 70px;*/
	position: relative;
	text-align: left;
	}	
	
#YouTube	div.youTubeImage {
	position: absolute;
	top: 5px;
	left: 10px;	
	width: 175px;
	height: 100px;
	}
	
#YouTube	div.youTubeLink {
	position: absolute;
	top: 110px;
	left: 0px;	
	width: 190px;
	height: 20px;
	}	
	
#YouTube	div.youTubeImage2 {
	position: absolute;
	top: 5px;
	left: 215px;	
	width: 175px;
	height: 100px;
	}
	
#YouTube	div.youTubeLink2 {
	position: absolute;
	top: 110px;
	left: 202px;	
	width: 190px;
	height: 20px;
	}
	
#YouTube	div.youTubeImage3 {
	position: absolute;
	top: 5px;
	left: 420px;	
	width: 175px;
	height: 100px;
	}
	
#YouTube	div.youTubeLink3 {
	position: absolute;
	top: 110px;
	left: 407px;	
	width: 190px;
	height: 20px;
	}
	
	
/* =FOOTER 	
----------------------------------------------------*/
#footer	{
	width: 919px;
	margin: 0 auto;
	/*padding: 0 70px;*/
	min-height: 30px;
	}
	
#footer p {
	float: right;
	display: inline;
	font-size: 75%;
	letter-spacing: 0.06em;
	padding: 0px 0 0px 0px;
	/*margin: 0 auto;*/
	color: #89a;			
	}

#footer p a	{
	color: #89a;			
	background: none;
	}

/* =COLUMNS 	
----------------------------------------------------*/

div#homeCol	{
	width: 916px; 
	float: left;
	text-align: left;
	margin-left: 42px;
	/*padding: 0 0px 40px 70px;*/
	background-image: url(../images/rightcol_fade.jpg);
	background-repeat: repeat-y;
	background-position: 800 0px;	
	}
	
div#homeCol p {
	color: #89a;
	/*font-size: 16px;*/
	line-height: 20px;
	padding-left: 20px;
	margin-bottom: 20px;
	}
	
div#leftCol	{
	width: 300px; 
	float: left;
	text-align: left;
	padding-top: 10px;	
	margin-left: 46px;
	/*padding: 0 0px 40px 70px;*/
	}	

div#leftCol p {
	color: #CCC;
	font-size: 16px;
	position: relative;
	background-color: #FFF;	
	top: 17px;	
	line-height: 20px;
	padding-left: 24px;
	margin-bottom: 20px;
	}


div#rightCol {
	width: 616px;
	float: left;
	background-image: url(../images/rightcol_fade.jpg);
	background-repeat: repeat-y;
	background-position: 800 0px;	
	padding-top: 10px;	
	margin-left: 1px;
	}	

div#rightCol p {
	color: #89a;
	/*font-size: 16px;*/
	line-height: 20px;
	padding-left: 20px;
	margin-bottom: 20px;
	}


#rightCol div.listImage {
	width: 175px;
	padding-top: 0px;
	float: left;
	margin-left: 15px;
	}
	
#rightCol div.list {
	width: 420px;
	float: left;
	margin-left: 5px;
	}
	
div#list p {
	color: #89a;
	/*font-size: 16px;*/
	line-height: 20px;
	padding-left: 20px;
	margin-bottom: 20px;
	}	

div.youTubeCol	{
	width: 520px;	
	margin: 0 auto;					
	padding: 0px 0;						
	float: left;
	}

#youTubeCol	div.youTubeImage {
	position: relative;
	}
	
#youTubeCol	div.youTubeLink {
	color: #89a;
	/*font-size: 16px;*/
	line-height: 20px;
	padding-left: 20px;
	margin-bottom: 20px;
	}		
	
div.column	{
	width: 280px;	
	margin: 0 auto;					
	padding: 0px 0;						
	float: left;
	}
	
div.firstPanel	{
	}
	
div.secondPanel	{
	float: right;
	margin-right: 5px;
	}
	
	
/* =NAVIGATION 	
----------------------------------------------------*/
div#topNav	{
	position: absolute;
	top: 52px;
	left: 42px;
	width: 916px;
	height: 28px;
	line-height: 68px;
	margin: 0 auto;
	padding: 0px 0px 0px 0px;
	}

div#navigation {
	position: relative;
	width: 916px;
	height: 41px;
	line-height: 41px;
	color: #FFF;
	margin: 0 auto;
	padding: 0px 0 0px 0;
	font-size: 18px;
	}
	
div#navigation ul {
	background-color: #99CCFF;
	height: 41px;	
	}
	
div#navigation ul li{
	margin: 0;
	padding: 0px 0px 0px 10px;
	display: inline;
	}

div#navigation ul li.spacer{ 
	background-color: #FFF;
	margin: 0;
	padding: 14px 2px 10px 1px;
	}
	
div#navigation ul li.pos1{ 
	margin-left: 5px;
	margin-right: 218px;
	}

div#navigation ul li.pos2{ 
	margin-left: 20px;
	margin-right: 20px;
	}

div#navigation ul li.pos2current{ 
	margin-left: 20px;
	margin-right: 20px;
	}


div#navigation ul li.pos2{ 
	margin-left: 20px;
	margin-right: 20px;
	}
	
div#navigation ul li.pos3{ 
	margin-left: 20px;
	margin-right: 20px;
	}
	
div#navigation ul li.pos4{ 
	margin-left: 20px;
	margin-right: 20px;
	}
	
div#navigation ul li.pos5{ 
	margin-left: 20px;
	margin-right: 10px;
	}
	
div#navigation ul li a,
div#navigation ul li a:visited {
	width: 100%;
	padding: 0 ;
	color: #FFF;
	margin: 0;
	text-decoration: none;
	}

div#navigation ul li a:hover {
	color: #996666;
	}
	

div#navigation2 ul li.last{ background: ;}


/* =MISC 
----------------------------------------------------*/

br.clear 		{	clear:both		}

.floatright 		{	float:right;		}
.floatleft 		{	float:left;		}
.alignright		{	text-align:right;	}
.alignleft 		{	text-align:left;	}

.nopad 			{	padding:0 !important;}
.nomargin 		{	margin:0 !important; }



hr {
	margin: 0px 0 10px 0;
	border: 0;
	border-bottom: 1px solid #fff;
	height: 1px;
	background-color: #99CCFF;				/*	Libralato blue		    */
	}
	

/* =IMAGES 
----------------------------------------------------*/

img.thumbpic {
	padding: 10px;
	background-color: #abc;
	border: 1px solid #89a;
	margin: 0 0 20px 0;
	}
	

img.footerLogos {
	padding-right: 20px;
	margin: 0;
	}

/* =SAFARI3 HACKS
----------------------------------------------------*/

@media screen and (-webkit-min-device-pixel-ratio:0){
	

}

/* =SLIDER
----------------------------------------------------*/
.rs-slideshow {
	position: absolute;
	width: 615px;
	height: 150px;
}

.rs-slideshow .slide-container {
	position: absolute;
	overflow: hidden;
	height: 100%;
	left: 0;
	top: 0;
	width: 100%;
}

.rs-slideshow .slide-container img {
	position: relative;
}

.rs-slideshow .slide-container .slide-caption {
	background-color: #000;
	bottom: 0;
	color: #fff;
	display: block;
	left: 0;
	padding: 6px 12px;
	position: absolute;
	text-align: center;
	right: 0;
	filter: alpha(opacity=70); /* internet explorer */
	-khtml-opacity: 0.7;      /* khtml, old safari */
	-moz-opacity: 0.7;       /* mozilla, netscape */
	opacity: 0.7;           /* fx, safari, opera */
}

.rs-slideshow .slides {
	display: none;
}


.rs-slideshow .slide-container img,
.rs-slideshow .slide-container .slide-caption,
.rs-slideshow .slide-container a {
	filter: inherit;
}


/**
*	These styles make the list of links to slide images visible to users
*	who don't have JavaScript enabled. By adding the 'no-js' class to 
*	the HTML element, and using Modernizr to remove this class for JS
*	users, we can style for both scenarios.
*	http://www.modernizr.com/
*/

.no-js .rs-slideshow {
	height: auto;
}
.no-js .rs-slideshow .slide-container, 
.no-js .rs-slideshow .slide-container img {
	position: relative;
}
.no-js .rs-slideshow .slides {
	display: block;
	margin: 24px 48px;
}
.no-js .rs-slideshow .slides li {
	margin: 0;
}



/**
*	The following styles are used in the demos with slideshow controls, 
*	such as play/pause and prev/next buttons.
*/

.rs-controls {
	clear: both;
	margin: 12px auto;
	width: 620px;
}
.rs-play-pause, .rs-prev, .rs-next {
	float: left;
	margin-right: 12px;
}
.rs-controls ul {
	float: left;
	list-style: none;
	margin: 0 0px 0 0;
	padding: 0;
}
.rs-index-list li {
	float: left;
	margin-right: 0px;
}
.rs-controls a {
	background-color: #eee;
	border: 1px solid #ddd;
	/*border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;*/
	color: #444;
	display: block;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	padding: 3px 5px;
	text-decoration: none;
}
.rs-controls a:hover {
	background-color: #ddd;
	color: #444;
}
.rs-controls .rs-active {
	background-color: #444;
	border: 1px solid #444;
	color: #eee;
}


#callback-messages,
#slide-class-message {
	margin: 48px auto;
	width: 620px;
}
.slide-container.some-custom-class .slide-caption {
	background-color: #890;
	font-size: 3em;
	font-style: italic;
	font-weight: bold;
	text-align: right;
	top: 0;
	width: 28%;
}



/*	Clearfix	*/
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; } /* Hides from IE-mac \*/
.clearfix { display: block; }