/*

Michel Thomas Apps Microsite
============================

- Guy Moorhouse, March 2010
- http://www.futurefabric.co.uk

*/


/* TAGS */
body {
	font-family: sans-serif, Helvetica, Verdana, Arial;
	background: #00232f url(../images/gradient.jpg) no-repeat fixed center top;
	color: #f9f9f9;
	font-size: 15px;
	text-shadow: #000 0 1px 1px;
	line-height: 20px;
}

#bio-container a, .totop a{
	text-decoration: none;
	color: #fff;	
}

#bio-container a:hover, .totop a:hover {
	text-decoration: none;
	color: #fff;	
}

#footer a,#footer a:hover,#footer p {
	font-size: 11px;
	color: #a4cad5;
}

.totop {
	position: relative;
	float:left;
}

a, a:visited, a:active {
	color:#fff;
}

a:hover {
	color:#fff;
}

a:focus {
	outline: none;
}

h1 {
	font: 20px Helvetica, Arial, sans-serif; 
	font-weight: normal; 
	line-height: 24px; 
	color: #fff; 
	margin-bottom: 20px; 
	letter-spacing: -1px;
	text-shadow: #000 0 1px 0;
}

h2 {
	font: 20px Helvetica, Arial, sans-serif; 
	font-weight: normal; 
	line-height: 24px; 
	color: #fff; 
	margin-bottom: 25px; 
	letter-spacing: -1px;
	text-shadow: #000 0 1px 0;
}

p{
	font: 15px Helvetica, Arial, sans-serif; 
	font-weight: normal; 
	line-height: 20px;
	color: #dff1ee;
}

q, .knockback {
	color: #a4cad5;
}

/* SELECTORS */

#pseudo_body{
	position:absolute; 
	top:0;
	width:100%;
}

#topbg{
	height:10px; 
	width:100%;
	/*filter: alpha(opacity = 3);
	background-color: #fff;  
	opacity: 0.03;*/
}

#footer{
	margin-top:50px;
	height:180px;
	background-position: left top; 
	background-image: url(../images/footer_bg.png); 
	background-repeat: repeat-x;
}

#logo { 
	background-position: left top; 
	background-image: url(../images/logo.png); 
	background-repeat: no-repeat; 
	margin-top: 40px;
	width:305px;
	height:47px;
}

#intro, #faq {
	margin-top: 25px;
}

#iphone-container { 
	margin-top: 10px;
	position: relative;
	float:left;
	left:140px;
}

#video-panel {
	margin-top: 36px;
	margin-left: 26px;
}

#notify-me {
	margin-top: 30px;
	margin-left: 28px;
}

#video-panel p {
	font-size:13px;
	line-height: 17px;
	color:#a4cad5;
}

#tabs-container {
	margin-top: -52px;
	background-color: none;
	height:272px;
}

#testimonials-container {
	margin-top: 64px;
	min-height: 280px;
}

#bio-container {
	margin-top: 50px;
}

#bio-container p {
	color: #a4cad5;
}

#footer-container {
	margin-top: 30px;
}

.in-brief {
	margin-bottom: 20px;
}
.in-brief ul {
	list-style: none;
	color:#dff1ee;
	color: #a4cad5;
	margin-left: -3px;
}

.in-brief ul li {
	font-size:15px;
	line-height: 17px;
	padding:0 0 0 15px;
	background-repeat: no-repeat;
	background-position: 0 1px;
	margin-bottom: 5px;
}

.in-brief ul li.bullet { 
	background: url(../images/bullet.png) no-repeat 4px 6px;
}

.features {
	width:100%;
	margin-top: 0px;
	float:left;
	position:relative;
}

.features ul {
	list-style: none;
	color:#a4cad5;
	margin-left: -3px;
}

.features ul li {
	font-size:13.5px;
	line-height: 18px;
	padding:0 0 0 25px;
	background-repeat: no-repeat;
	background-position: 0 -2px;
	margin-bottom: 10px;
}

.features ul li.icon { 
	background-repeat: no-repeat; 
	background-image: url(../images/li-icon.png);
}



.questions ul,.answers ul {
	list-style: none;
	margin-left: 0px;
}

.answers ul {
	color: #fff;
}

.answers ul li {
	margin-bottom: 48px;
}

ul .answers-sublist li {
	color: #a4cad5;
	list-style: none;
	margin-bottom: 16px;
}


.apps {
	/*position:absolute;
	left: 48px;
	top:30px;*/
}
.testimonials {
	width:270px;
}

.bio {
	width:590px;
}

.answers {
	margin-top: 80px;
}

.title {
	font-size: 14px;
	color: #dff1ee;
}
.knockback {
	color: #a4cad5;
}
.quoteby {
	font-size: 12px;
}

.imgcaption {
	font-size: 11px;
}

.hrule {
	height: 1px;
	line-height: 1px;
	background-color: #dbdbdb;
	filter: alpha(opacity = 15); 
	opacity: 0.15;
}
.sign-up {
	margin-top:-10px;
}

.email {
	font-size: 14px;
	width:230px;
	height:22px;
	background-color:#fff;
  	border:1px solid #fff;
}

/* ROW SPACERS */
.vspaced-12px { height: 12px; }
.vspaced-24px { height: 24px; }
.vspaced-36px { height: 36px; }
.vspaced-42px { height: 42px; }
.vspaced-48px { height: 48px; }
.vspaced-60px { height: 60px; }


/* IPHONE VIEWER */
#iphone-bg { position:relative; float:left; background-image: url(../images/iphone/iphone.png); background-repeat: no-repeat; height:600px; width:347px;}
#iphone-viewer { position:absolute; left:-91px; top:112px;}
#slideshow { position:absolute; width:245px; left: 138px;}
#iphone-nav { position:absolute; width:91px; }
#iphone-nav ul li { margin: 0px; padding:0px; } 
#iphone-nav li { width: 85px; margin-bottom: 15px; list-style: none;}
#iphone-nav a { width: 85px; padding: 5px; display: block; filter: alpha(opacity = 35); opacity: 0.35; background: url(../images/iphone/iphone-thumb-bg.png) no-repeat; }
#iphone-nav a.activeSlide { filter: alpha(opacity = 100); opacity: 1.0; background: url(../images/iphone/iphone-thumb-bg-point.png) no-repeat; }
#iphone-nav a:focus { outline: none; }
#iphone-nav img { border: none; display: block }


/* LANGUAGE TABS VIEWER */
#tabs-content { background-repeat: no-repeat; background-position: left top; background-image: url(../images/languages_bg.gif); position: relative; float: left; height:272px; }
#tabs-nav { position: relative; float: left; }
#tabs-nav ul li { margin: 0px; padding:0px; } 
#tabs-nav li { float:left; width: 153px; height:46px; margin-right: 4px; list-style: none }
#tabs-nav a { width: 153px; height:46px; display: block; filter: alpha(opacity = 60); opacity: 0.6; }
#tabs-nav a.activeSlide { filter: alpha(opacity = 100); opacity: 1.0; }
#tabs-nav a:focus { outline: none; }
#tabs-nav img { border: none; display: block }




/* PRETTY PHOTO FOR VIDEO OVERLAY */
/* ------------------------------------------------------------------------
	This you can edit.
------------------------------------------------------------------------- */
	
div.light_rounded p { text-shadow: none; color:#07262E; }
div.light_rounded .pp_top .pp_left { background: url(../images/prettyPhoto/light_rounded/sprite.png) -88px -53px no-repeat; } /* Top left corner */
div.light_rounded .pp_top .pp_middle { background: #fff; } /* Top pattern/color */
div.light_rounded .pp_top .pp_right { background: url(../images/prettyPhoto/light_rounded/sprite.png) -110px -53px no-repeat; } /* Top right corner */

div.light_rounded .pp_content .ppt { color: #000; }
div.light_rounded .pp_content_container .pp_left,
div.light_rounded .pp_content_container .pp_right { background: #fff; }
div.light_rounded .pp_content { background-color: #fff; } /* Content background */
div.light_rounded .pp_next:hover { background: url(../images/prettyPhoto/light_rounded/btnNext.png) center right  no-repeat; cursor: pointer; } /* Next button */
div.light_rounded .pp_previous:hover { background: url(../images/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */
div.light_rounded .pp_expand { background: url(../images/prettyPhoto/light_rounded/sprite.png) -31px -26px no-repeat; cursor: pointer; } /* Expand button */
div.light_rounded .pp_expand:hover { background: url(../images/prettyPhoto/light_rounded/sprite.png) -31px -47px no-repeat; cursor: pointer; } /* Expand button hover */
div.light_rounded .pp_contract { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -26px no-repeat; cursor: pointer; } /* Contract button */
div.light_rounded .pp_contract:hover { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -47px no-repeat; cursor: pointer; } /* Contract button hover */
div.light_rounded .pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/light_rounded/sprite.png) -1px -1px no-repeat; cursor: pointer; } /* Close button */
div.light_rounded #pp_full_res .pp_inline { color: #000; } 

div.light_rounded .pp_arrow_previous { background: url(../images/prettyPhoto/light_rounded/sprite.png) 0 -71px no-repeat; } /* The previous arrow in the bottom nav */
div.light_rounded .pp_arrow_previous.disabled { background-position: 0 -87px; cursor: default; }
div.light_rounded .pp_arrow_next { background: url(../images/prettyPhoto/light_rounded/sprite.png) -22px -71px no-repeat; } /* The next arrow in the bottom nav */
div.light_rounded .pp_arrow_next.disabled { background-position: -22px -87px; cursor: default; }

div.light_rounded .pp_bottom .pp_left { background: url(../images/prettyPhoto/light_rounded/sprite.png) -88px -80px no-repeat; } /* Bottom left corner */
div.light_rounded .pp_bottom .pp_middle { background: #fff; } /* Bottom pattern/color */
div.light_rounded .pp_bottom .pp_right { background: url(../images/prettyPhoto/light_rounded/sprite.png) -110px -80px no-repeat; } /* Bottom right corner */

div.light_rounded .pp_loaderIcon { background: url(../images/prettyPhoto/light_rounded/loader.gif) center center no-repeat; } /* Loader icon */


/* ------------------------------------------------------------------------
	DO NOT CHANGE
------------------------------------------------------------------------- */

div.pp_pic_holder a:focus { outline:none; }

div.pp_overlay {
background: #01252e;
display: none;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: 9500;
}

div.pp_pic_holder {
display: none;
position: absolute;
width: 100px;
z-index: 10000;
}

.pp_top {
	height: 20px;
	position: relative;
}
* html .pp_top { padding: 0 20px; }

.pp_top .pp_left {
	height: 20px;
	left: 0;
	position: absolute;
	width: 20px;
}
.pp_top .pp_middle {
	height: 20px;
	left: 20px;
	position: absolute;
	right: 20px;
}
	* html .pp_top .pp_middle {
		left: 0;
		position: static;
	}

.pp_top .pp_right {
	height: 20px;
	left: auto;
	position: absolute;
	right: 0;
	top: 0;
	width: 20px;
}

.pp_content { height: 40px; }

.pp_content .ppt {
	left: auto;
	margin-bottom: 5px;
	position: relative;
	top: auto;
}

.pp_fade { display: none; }

.pp_content_container {
	position: relative;
	text-align: left;
	width: 100%;
}

.pp_content_container .pp_left { padding-left: 20px; }
.pp_content_container .pp_right { padding-right: 20px; }

.pp_content_container .pp_details {
	margin: 10px 0 2px 0;
}
.pp_description {
	display: none;
	margin: 0 0 5px 0;
}

.pp_nav {
	clear: left;
	float: left;
	margin: 3px 0 0 0;
}
		
.pp_nav p {
	float: left;
	margin: 2px 4px;
}

.pp_nav a.pp_arrow_previous,
.pp_nav a.pp_arrow_next {
	display: block;
	float: left;
	height: 15px;
	margin-top: 3px;
	overflow: hidden;
	text-indent: -10000px;
	width: 14px;
}

.pp_hoverContainer {
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 2000;
}

a.pp_next {
	background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
	display: block;
	float: right;
	height: 100%;
	text-indent: -10000px;
	width: 49%;
}
	
a.pp_previous {
	background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
	display: block;
	float: left;
	height: 100%;
	text-indent: -10000px;
	width: 49%;
}

a.pp_expand,
a.pp_contract {
	cursor: pointer;
	display: none;
	height: 20px;	
	position: absolute;
	right: 30px;
	text-indent: -10000px;
	top: 10px;
	width: 20px;
	z-index: 20000;
}
	
a.pp_close {
	display: block;
	float: right;
	text-indent: -10000px;
}
.pp_bottom {
	height: 20px;
	position: relative;
}
* html .pp_bottom { padding: 0 20px; }

.pp_bottom .pp_left {
	height: 20px;
	left: 0;
	position: absolute;
	width: 20px;
}
.pp_bottom .pp_middle {
	height: 20px;
	left: 20px;
	position: absolute;
	right: 20px;
}
* html .pp_bottom .pp_middle {
	left: 0;
	position: static;
}
		
.pp_bottom .pp_right {
	height: 20px;
	left: auto;
	position: absolute;
	right: 0;
	top: 0;
	width: 20px;
}

.pp_loaderIcon {
	display: block;
	height: 24px;
	left: 50%;
	margin: -12px 0 0 -12px;
	position: absolute;
	top: 50%;
	width: 24px;
}

#pp_full_res {
	line-height: 1 !important;
}

#pp_full_res .pp_inline {
	text-align: left;
}
	
#pp_full_res .pp_inline p { margin: 0 0 15px 0; }

div.ppt {
	color: #fff;
	display: none;
	font-size: 17px;
	left: 0;
	position: absolute;
	top: 0;
	z-index: 9999;
}

/* ------------------------------------------------------------------------
	Miscellaneous
------------------------------------------------------------------------- */

.clearfix:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */