@import url("reset.css");

body {

	background:#2c2c2c;
	font-family:Helvetica, Arial, sans-serif;
	background-attachment:scroll;
	color:#000;
	font-size:1em;
	min-width:330px;
}

	@media screen and (-webkit-min-device-pixel-ratio:0){
		body {
			background:#2c2c2c;	
			background-attachment:scroll;
			
		}
	}


	.buy-button{cursor:pointer; padding: 5px 15px; margin:10px 10px 0px 10px; outline: 0px; width:70px; background-color:#ddd; border:3px solid #fff; color:#777; height:1em;}
		.buy-button a:link, .buy-button a:visited{color:#444; text-decoration:none;}
	#buy-options{z-index:2; width:130px; background:#448fc9; display:none; color:#222; margin-left:10px !important;}
		#buy-options li{background:#448fc9; opacity:0.9; border:1px solid #3782bc; text-align:center !important; transition:all .2s ease;}
		#buy-options li a{display:block; padding:10px 20px;}
		#buy-options a:link, #buy-options a:visited, #buy-options a:hover{text-decoration:none; color:#444;}
		#buy-options li:hover{background:#3782bc;}
		
#mobile-menu{display:none;}
	.mobile-menu, .mobile-menu:focus{box-shadow:none; border:none; background:none; padding:0; margin:30px 30px 0 0; float:right;}
	header.sticky .mobile-menu, header.sticky .mobile-menu:focus{box-shadow:none; border:none; background:none; margin:10px 10px 0 0 !important; transition:all .2s;}
	img.mobile-menu{width:50px;}
	header.sticky img.mobile-menu{width:40px;}
	header.sticky img.logo{width:80px; height:25px}
.mobile-menu {
  cursor:pointer;
  transition:.4s all;
  display:none;
}
	
	
img, embed, iframe{max-width:100%;}
.vWrap {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	height: 0;
}
.vWrap iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.clear{clear:both;}

	strong { font-weight:bold; }
	em { font-style:italic; }
	object { float:left; margin:0 0 20px 0; }
	fieldset { width:100%; float:left; margin:15px 0 50px 0; color:#000; font-size:.75em; }
	fieldset label { display:block; margin:0 0 1px 0; line-height:15px; }
	fieldset input[type=text] { margin:0 0 8px 0; }
	iframe { margin: 0 0 25px 0; }

	.left-img{float:left; margin: 2px 10px 10px 0;}
	.right-img{float:right; margin: 2px 0 10px 10px;}
	
	/*Responsive*/
		

	div#main-container {/*Responsive*/
		width:90%;
		margin:0 5%;
		overflow:hidden;
		padding:0;
	}
	
	
	
	
	div#navigation {/*Responsive*/
		margin-top:145px;
		float:left;
		width:21.0526%; 
	
	}
	
		div#navigation ul.nav { float:right; margin:0 15px 20px 0; width:175px;}
		div#navigation ul li { display:block; text-align:right;}
		div#navigation ul li a { color:#0081c6; font-size:.875em; line-height:20px; font-variant:small-caps; text-decoration:none; letter-spacing:1px;}
		div#navigation ul li a:hover { color:#fff; }
	
		div#navigation a.button { display: block; border:1px #cdcdcd solid; float:right; margin:0px 50px 0 0; background:#434343; font-size:.875em; color:#cdcdcd; height:25px; text-decoration:none; line-height: 25px; padding: 1px 5px 0 5px; }
		div#navigation a.button:hover { background:#0081c6; color:#fff; pointer:cursor; }
		div#navigation ul.dropdown { display:none; width:175px; padding:10px 0; margin:-4px 0 0 0px;}
	
		div#navigation ul.dropdown li a { color:#b8dbf9; font-size:.75em; font-variant:normal; letter-spacing:0px;}

		div#navigation ul li ul.dropdown li a:hover { color:#fff; }
		
		#navigation img{margin-bottom:15px;}

	
	
	/*Responsive*/
	div#text-content {
	
		float:left;
		width:78.6842%; 
		max-width:694px;
		min-height:800px;
		background:url("../images/bg.jpg") no-repeat left top #448fc9;
			background-size:100%; 
		margin-top:100px;
	
	}
	
		body.inside div#text-content {
		
			background:url("../images/inside-text-bg.jpg") no-repeat right top #448fc9; 
			background-size:100%; 
			padding-top: 25px;
		
		}
	
		div#text-content a:hover { color:#444; }
	

	

	div#feature {
	
		background:#6d6d6d;
		max-width:383px;
		float:right;
		position:relative;
		padding:0 0 10px 0;
		margin:30px 0 0 0;
		color: #aed1e3;
	
	}
	
		div#feature h2 { color:#fff; font-size:.75em; font-weight:bold; line-height:18px; margin:15px 15px 10px 15px; }
		div#feature h3 { margin:0 15px 5px 15px; font-size:.75em; color:#c6bcdd; font-weight:bold; }
		div#feature h3 span { font-weight:normal; color:#fff; font-size:10px; padding:0 0 0 10px; }
		div#feature p { margin:0 15px 15px 15px; color:#aed1e3; font-size:.75em; line-height:18px; }
		div#feature a { color:#c6bcdd; text-decoration:none; }
		div#feature a#archive-link { position:absolute; bottom:10px; right:15px; font-size:.75em; color:#fede5d; }
	
	
	

		div#main-content {
				
			clear:both;
			float:right;
			padding:20px;
			position:relative;
			min-height:250px;
		
		}
		
		/*Responsive*/
		body.inside div#main-content {
			width:80%;
  			max-width:600px;
			float:right;
			margin:45px 0 0 0;
			padding:80px 10% 50px;
			min-height: 460px;
		
		}
		
			div#main-content h2 { font-size:.875em; font-weight:bold; color:#fff; line-height:20px; margin:0 0 20px 0; }
			div#main-content h3 { font-size:.875em; font-weight:bold; color:#fff; line-height:20px; margin:0 0 5px 0; }
			
			div#main-content p { font-size:.75em; color:#000; line-height:18px; margin:0 0 .75em 0; }
			div#main-content a { color:#fff; text-decoration:none; }
			div#main-content a#illustra-logo { float:right; margin-right:15px; }
			div#main-content p#illustra { color:#d1dae2; font-weight:bold; font-size:16px; letter-spacing:2px; text-transform:uppercase; margin-top:25px;}
			body.inside div#main-content p#illustra { left:35px; }
	
			body.inside div#main-content h2 { color:#fff; font-size:16px; text-transform:uppercase; letter-spacing:1px; }
			body.inside div#main-content p { color:#000; font-size:.75em; width:auto; }
			div#main-content a:hover { color:#ddd; }
			div#main-content strong {
				color: #000;
			}
	
	

	
	
	div#footer {
	
		clear:both;
		margin:0;
	
	}
	
		div#footer ul { list-style-type:none; float:left; }
		div#footer ul li { float:left; font-size:9px; color:#d1dae2; margin:0 5px 0 0;}
		div#footer ul li a { color:#d1dae2; text-decoration:none; }
		div#footer ul li a:hover { color:#fff !important; }
		
.home #footer, .home #illustra{max-width:640px;}
		
div#output { display:none; width:90%; padding:10px; float:left; font-size:.875em; color:#fff; background:rgba(255,255,255,0.2); line-height:21px; }

label.wrapable{font-size:.75em;}

.date{font-size:.9em; color:#2c2c2c;}
.title{color:#2c2c2c;}
		

.headline{font-size:16px;}

#companion-button {
	position:absolute;
	top:60px;
	left:-275px;
	clear:both;
}
#companion-button a{background:url('../images/companion-book-button.jpg') top left no-repeat; height:246px; width:271px; float:left; margin-right:10px;}
#companion-button a:hover{background:url('../images/companion-book-button.jpg') bottom left no-repeat; float:left;}

	



html, body, p, ul, li {	margin: 0;	padding: 0;}
.clear{clear:both;}

header{
	position: fixed;
	width: 100%;
	height: 100px;
	background: #0081c6;
	color: #fff;	
	-webkit-transition: all 0.4s ease;
	transition: all 0.4s;
	box-shadow: 0 0 10px 3px rgba(0, 0, 0, 0.5);
	z-index:100;
}
header img{padding:20px 10px 20px 0; height:60px; transition:.4s all;}
.header-graphic{margin-bottom:30px; padding-top:75px;}
header .content{width:90%; padding:0 5%; max-width:1200px; margin:0 auto;}

header.sticky {
	height: 50px; 
	background: #fff;
	transform:all 0.4s;
}
header.sticky img{height:30px; max-width:50%; padding:10px 0; transition:.4s all;}
header.sticky #header-nav{margin:1px 20px 0 0; transition:.4s all;}
header.sticky .mobile-menu{margin-top:1px; transition:.4s all;}
header.downscroll, #mobile-nav.downscroll{background:#0081c6; opacity:.94; transition:.4s all;}
header.upscroll, #mobile-nav.upscroll{background:#0081c6; opacity:1; transition:.4s all;}


/*Mobile Nav*/
.mobile-menu {
  position: relative;
  padding: 1.25em;
  margin-top:30px;
  float:right;
  cursor:pointer;
  transition:.4s all;
  display:none;
}
.mobile-menu:before {
  content: "";
  position: absolute;
  top: 0.25em;
  left: 0;
  width: 1em;
  height: 0.125em;
  border-top: 0.375em double #fff;
  border-bottom: 0.125em solid #fff;
  font-size:2.25em;
}
#mobile-nav{
	display:none;
	text-align:center;
	font-size:1.5em;
	padding:0 0 15px;
	background:#0081c6;
	box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.25), -2px 2px 3px rgba(0, 0, 0, 0.25);
}
#mobile-nav a:link, #mobile-nav a:visited{color:#fff; text-decoration:none;}
	ul#mobile-nav a:link{width:90%; padding:3px 5%; display:block;}
	ul#mobile-nav > li > a:hover{color:#fff !important; background:#2a9ad6;}
	ul#mobile-nav > li:hover{background:#0081c6;}
	ul#mobile-nav > li > ul > li > a:link{font-size:.8em;}
	ul#mobile-nav > li > ul > li > a:hover{color:#fff !important; background:#2a9ad6;}
	ul#mobile-nav > li > ul li a:link, ul#mobile-nav > li > ul li a:visited{color:#ccc;}
	ul#mobile-nav > li > ul li a:hover, ul#mobile-nav > li > ul li a:active{color:#eee;}
	
#mobile-nav li{display:block; width:100%;}

/*Navigation*/
/*Programs Menu*/
header #header-nav{float:right; margin:25px 20px 0 0; transition:.4s all; line-height:1em;}
#header-nav li{list-style-type:none; z-index:9; min-width:110px;}
#header-nav a:link, #header-nav a:visited{text-decoration:none; color:#fff;}
#header-nav a:hover, #header-nav a:active{text-decoration:none; color:#eee;}
	#header-nav li:hover a:link, #header-nav li:hover a:visited, #header-nav li:active a:active, #header-nav li:hover span{color:#eee !important;}

ul#header-nav li ul a{color:#fff !important;}
ul#header-nav > li:hover{background:#444; color:#fff !important; transition:.2s all;}
	ul#header-nav > li.has-sub{ border-top-left-radius:5px; border-top-right-radius:5px;}
	ul#header-nav > li > ul.sub-menu{border-bottom-left-radius:5px; border-bottom-right-radius:5px;}
	ul#header-nav > li > ul > li{background:#777 !important;}
	
ul#header-nav ul{color:#fff !important; min-width:200px; transition:.2s all;}
.menu-title > a{border-bottom:1px solid #ccc;}
.menu-title > a:hover{color:#fff !important; cursor:default;}
	ul.sub-menu li a:link{background:#444;}
	ul.sub-menu li a:visited{background:#444;}
	ul.sub-menu li a:hover{background:#555; transition:.2s all;}

ul#header-nav{
	text-align: left;
	padding: 15px auto 17px auto;
	list-style:none;
	position:relative;
	display:inline-block;
	}
ul#header-nav li ul{}
ul#header-nav li{position:relative;}
ul#header-nav > li > ul{position:absolute; top:100%; left:0; font-size:.875em; text-align:left; margin-left:0; }
ul#header-nav li ul li{position:relative;}
ul#header-nav ul ul{margin:0; padding:0;}
ul#header-nav ul > li.menu-title{padding-left:0px;}
ul#header-nav > li{float:left;}
ul#header-nav li a, ul#header-nav li span{padding:15px 5%; display:block; color:#fff;}
ul#header-nav > li{display:inline; padding:0;}
ul#header-nav li:hover ul{display:block; opacity:1; height:auto; transition:all 0.2s;}
ul#header-nav li ul a:hover{transition:all .2s;}
ul#header-nav li ul li:hover{}
ul#header-nav li ul{height:0; overflow:hidden; opacity:0; transition:opacity .2s;}

ul#header-nav > li{text-align:center;}



@media only screen and (max-width : 950px){
	ul#header-nav{display:none !important;}
	.mobile-menu{display:block !important;}
}

@media only screen and (max-width : 768px){
	
	.mobile-menu{display:block;}
	
	#navigation{width:100% !important; margin:115px 0 0 0 !important; align:left !important;}
		div#navigation ul.nav { float:left; margin:0 15px 10px 0; display:inline-block; width:130px;}
		div#navigation ul.nav li{text-align:left;}
		#navigation img{float:right;}
		
	#feature{margin-top:0 !important;}
	#text-content{width:100% !important; margin-top:0 !important;}
	.button{display:none !important;}

#text-content {background:#448fc9 !important;
		width:100% !important; max-width:100% !important; padding-top:0 !important;}
#feature, #main-content{max-width:100% !important;}

#main-content{margin:0 !important; padding:10% !important;}
h2{font-size:1.4em !important;}
}

@media only screen and (max-width : 400px){
	#top ul {width:90%; margin:0 auto; padding:0px !important;}
	
	#navigation img{width:50%;}
	
	
}
