/*
Theme Name: Turnpage
Theme URI: http://www.ocularharmony.com
Description: Turnpage Layout for Wordpress
Author: Robin Bastien
Author URI: http://www.ocularharmony.com
*/

/*Begin Fundamentals*/
/*---------------------------------------------------------------*/
body {font-size: 62.5%;font-family: helvetica, Verdana, Arial, Sans-Serif;}
#wrapper {width: 950px; margin: 0 auto; min-height: 700px; height: auto !important; height: 700px;}
#header {width: 100%; height: 74px; margin: 0; text-align: left; margin-bottom: 5px; position: relative;}
#header #logo {float: left}
#header #phone {position: absolute; color: #bbb; font-weight: bold; bottom: -4px; left: 7px; font-size: 1.5em;}
#content{text-align: center; min-height: 400px; height: auto !important; height: 500px; padding-bottom: 20px; font-size: 1em; width: 950px; float: left; position: relative;}
#footer {height: 15px; padding: 15px 5px 5px; float: left; width: 890px; color: #666; background: url('images/footer-bg.jpg') repeat-x;-moz-border-radius: 4px; 
-webkit-border-radius: 4px; 
border: 1px solid #aaa; 
margin-bottom: 5px;
}
#footer a {color: #999;}
#sidebar {height: 100px; width: 800px; display: block; float: left;}
#sidebar ul, #sidebar ul li {list-style-type: none;}
#navigation {width: 100%; height: 30px; display: block}
#nav {height: 30px; width: 458px; float: left; margin: 25px 5px 0 0; }
img {border: none;}
.entry a {color: #333; text-decoration: none; border-bottom: 1px dotted #333;}
.entry a:hover {border-bottom: 1px solid #333;}

.sidenav { position: absolute; left: 0; top: 0; width: 180px;}
.sidenav a img, .sidenav a {border: none !important;}
.sidenav ul {padding-left: 0; display: block;width: 200px; min-height: 100px; height: auto !important; height: 100px; overflow: visible; border: 1px solid  #dbdbdb; float: left; margin-left: 20px; margin-bottom: 5px; -moz-border-radius: 4px; -webkit-border-radius: 4px; background: url('images/sidenavbg.jpg') repeat-x top #f2f2f2; clear: both; padding-top: 5px;}
.sidenav ul li {display: block; }
.sidenav ul li.current_page_item, .sidenav ul li:hover {background-color: #ccc; color: #21859c;}
.sidenav ul li.current_page_item a {color: #21859c;}
.sidenav ul li:hover a, .sidenav il li:hover a:visited {color: #21859c;}
.sidenav ul li a {display: block;width: 100%; padding: 2px 0; height: 100%; text-decoration: none; color: black;}

/*Begin Body Elements*/
/*---------------------------------------------------------------*/

/*Typography*/
h1, h2, h3, h4, h5, h6 {color: #777;}
h1 {font-size: 2.2em}
h2 {font-size: 2.0em; text-align: left;}
h3 {font-size: 1.8em}
h4 {font-size: 1.6em}
h5 {font-size: 1.4em}
h5 {font-size: 1.2em}
p, li {font-size: 1.3em; text-align: left; font-family: helvetica, arial, sans-serif; line-height: 19px; padding: 0 12px; color: #222;}
#header h2 {font-size: 1.2em; font-style: italic; font-family: georgia; color: #ddd; margin: 0 3px; padding: 0; clear: none; font-weight: normal;}
#nav a {text-decoration: none; color: #6d6d6d;}
.alignleft {float: left;}
.alignright {float: right;}
.aligncenter {text-align: center;}
a#footertext, a#footertext:visited, a#footertext:hover, a#footertext:active {color: #aaa;}
a.hotlink {padding: 4px; background-color: #ddd; -moz-border-radius: 4px; -webkit-border-radius: 4px; text-decoration: none; font-family: Helvetica, verdana, arial, sans-serif; font-size: 0.85em; color: #444; border: 1px solid #aaa; text-align: right;}
a.hotlink:hover {background-color: #bbb}
img.bioimage {padding-bottom: 300px;}
#flashblock a {color: #eee; font-size: 1.7em; text-decoration: none; text-align: right;}
a.noul {text-decoration: none; border-bottom: none}
.twocol a.apic {width: 136px; height: 145px; position: absolute; left: 0px; display: block;}

/*Login*/
#login {
position: relative;
float: left; 
height: 31px; 
width: 218px;
background: url('images/login-bg.jpg') repeat-x;
border: 1px solid #aaa; -moz-border-radius: 4px; -webkit-border-radius: 4px;  
padding: 0 10px 8px 0; 
text-align: right; 
margin-top: 24px; }

#login #loginheader {
position: absolute;
top: -17px;
width: 117px;
height: 17px;
display: block;
background: url('images/customer-login.jpg');}

#login form input {width: 70px; height: 15px; display: block; float: left; margin: 6px 4px 0 7px;-moz-border-radius: 4px; -webkit-border-radius: 4px;}
#login form input[type="image"] {width: 23px !important; height: 23px;}
.loginpara {padding-left: 0; margin-top: -10px; position: relative;}
#login p {position: relative;}
#login p label#labeluser {left: 15px; top: 6px}
#login p label#labelpass {left: 100px; top: 6px}


/*Navigation*/
#nav ul {float: left; padding-top: 0; margin-top: 5px; padding-left: 5px;}
#nav li {
display: inline; 
float: left; 
margin-left: 3px; 
height: 16px; 
text-align: center; 
font-size: 1em; 
background: url('images/nav-bg.jpg') repeat-x top; 
-moz-border-radius: 4px; 
-webkit-border-radius: 4px; 
border: 1px solid #aaa; 
width: 47px; 
padding: 9px 5px; 
text-align: center;}
#nav li:hover {background-position: bottom;}
#nav li a {display: block; height: 100%; width: 100%;font-size: 1em; color: #6d6d6d; font-weight: bold;}
#nav li:hover a {color: white;}
#nav li ul {display: block; position: absolute; left: -999px; margin-top: -30px; width: 17em; height: auto; margin-left: 0px; padding: 2px 2px 15px; z-index: 999;}
#nav li:hover ul, #nav li.sfhover ul {z-index: 999;left: auto; top: 82px;background-color: #eee; -moz-border-radius: 5px; border-radius: 3px; border: 1px solid #ddd;}
#nav li li {border: none; float: none; margin: 0 0 0 4px; display: block; padding: 2px; height: 15px; background-image: none;color: black;z-index: 999; width: 100%; list-style-type: none;}
#nav li li a {font-weight: normal; color: #efe09c; font-size: 1.2em; text-align: left; display: block; background-image: none; width: 100%; height: 100%; color: black; cursor: pointer;z-index: 999;}
#nav li li:hover a {color: #222;}
#nav li:hover li a {color: #222;}
#nav ul li.page-item-7, #nav ul li.page-item-11 {width: 60px !important;}

/*Flash Block*/
#flashblock {width: 920px; height: 241px; margin: 5px 0px 5px 20px; background-color: #333; float: left;border: 2px solid #46b5cd; -moz-border-radius: 8px; -webkit-border-radius: 8px;}
#flashblock h1 {position: absolute; z-index: 1; top: -100px;}
#requestinfo {float: right; width: 288px; background: url(images/request-img.png) no-repeat center top; height: 241px; overflow: hidden; cursor: pointer; }
#requestinfo:hover {background-position: bottom;}
#requestinfo a {display: block; width: 100%; height: 100%;}
#requestinfo label {display: block; float: left; width: 60px; margin-right: -70px;}
#requestinfo input, #requestinfo textarea {margin-bottom: 3px; float: left; margin-left: 10px; border: 0;}
#requestinfo p {clear: both; position: relative; margin-top: 0}
#requestinfo label.error {width: 300px;display:none;}
#requestinfo h2 {padding-left: 50px; color: white; font-weight: normal; font-size: 1.6em; margin-top: 6px; margin-bottom: 0}
#requestinfo .requestsubmit {margin-left: 165px; margin-top: 4px;}
#flashblock object {float: left;}
label.overlabel {color: #999;position: absolute; left: 27px; z-index: 1;}
/*Contact Page*/
#content img {padding: 3px; border: 1px #eee solid; margin: 5px;}
#contentform {min-height: 400px; height: auto !important; height: 400px;}
#contentform h3 {color: #666; }
#contentform .formblock{width:400px;margin-bottom:50px;background-color:#f7f8f1;min-height:400px;height: auto !important; height: 400px; float:left;display:inline;padding:10px 25px;}
input[type="text"], input[type="password"], textarea {border: 1px solid #999; -moz-border-radius: 3px; -webkit-border-radius: 3px; padding: 2px;width: 250px;}
#contentForm input{float: left; display: inline; }
#contentForm p {padding-left: 40px; margin-top: 0;}
#contactForm p label {float: left; display: inline; width: 80px; }
#contactForm .messagelabel {width: 90px;}
#contentform #fb2 {background-color: #eed;}
textarea#skey {height:14px;}

/*Content*/
.entry, #content h1 {text-align: left;}
.post {float: left; }
.postother {float: left;width: 670px; padding-left: 15px; margin-left: 225px; display: inline;}
.postother h2 {text-decoration: none; color: #08617f; padding-left: 10px;}
.postother small {text-align: left; padding-left: 10px; float: left;}
.postother a {color: #08617f;}
.post small {text-align: left; float: left; padding: 0 12px; width: 924px;}
.clear {clear: both;}
#content .learn-more {border: 0;}
#adsense {width: 930px; padding: 5px 10px; float: left; min-height: 10px; height: auto !important; height: 10px;}
#content .post .twocol {width: 307px; height: 150px; padding-left: 150px; float: left; margin-left: 16px; position: relative; -moz-border-radius: 8px; -webkit-border-radius: 8px; margin-top: 20px;}
#content .post .twocol p{ padding-left: 0;}
#demobtn, #buybtn {background-image: url('images/demobtn.jpg')}
#demobtn a, #buybtn a {color: #b60700; font-size: 1.2em; text-transform: uppercase; font-weight: bold; text-align: center; text-decoration: none;}
#content .post .twocol .roll {width: 166px; height: 21px; padding-top: 13px; background-repeat: no-repeat; background-position: top; margin-left: 90px;}
#content .post .threecol .roll {width: 110px; height: 42px; margin-left: 79px; background: url('images/readmore.jpg') no-repeat top;}
#content .post .twocol .roll:hover, #content .post .threecol .roll:hover {cursor: pointer;}
#content .post .threecol {width: 297px; min-height: 250px; height: auto !important; height: 250px; float: left; -moz-border-radius: 8px; -webkit-border-radius: 8px; margin: 20px 0 0 19px;}
#content .post .twocol h2,  {text-align: left; color: #096181;}
#content .post .twocol img {position: absolute; left: 0; top: 0; border: 0;}
#content .post .threecol h2 {display: block; padding-top: 15px; font-weight: normal; text-align: left; font-size: 1.5em; color: #42444b}
#content .post .threecol p {margin: 0; clear: both;}
#content .post p {text-align: left;}
#content #free-demo {background: url('images/free-demo.jpg') no-repeat}
#content #generate-revenue {background: url('images/generate-revenue.jpg') no-repeat}
#content .post .threecol #enviroimg { border: 0;float: left; }
#content .post .threecol #statsimg { border: 0;float: left;}
#content .post .threecol #digitalizeimg {border: 0; float: left;}
.statblock {float: left; width: 280px; height: 315px; padding: 0; margin-right: 40px;}
.statblock h2 {display: block; height: 30px;}
.statblock img {width: 241px; height: 124px;}
iframe#chunker {margin-left: 225px; float: left; width: 650px; height: 750px;}
.code {
margin: 0 10px;
font-family: Courier, "times new roman", serif;
padding: 5px 15px; 
background-color: #ddd;
display: block;
}
#LiveActor {top: 300px !important; height: 357px;}
#mymovie {height: 364px !important; width: 170px !important;}
#bookmarkbar {
	float: left;
	display: block;
	background: url('images/bookmark-bar.jpg') no-repeat #fff;
	width: 690px;
	height: 57px;
	padding: 20px 10px 0 200px;
	margin: 10px 0;
	}
#bookmarkbar a {
	text-decoration: none;
	border: none;
	}
#bookmarkbar a img {
	border: inherit;
	padding: 0 10px;
	width: 40px;
	height: 40px;
	}
ul#ads0 {width: 100%;}
ul#ads0 li {display: block !important; float: left !important; padding-right: 5px !important;}

h1.blogpage {margin-left: 250px;}

.wpcf7-validates-as-email {width: 175px !important;}
body.page-template-home-php #sidebar {height: 0px;}

/*App Store*/
#appstore a, #appstore img {border:0;}
#appstore a {height: 237px; display: block; float: left; width: 200px; margin: 0 7px 0 0; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; text-align: center; padding: 3px 3px 10px 3px;}
#appstore a:hover {background-color: #f1f1f1;}
#appstore img {width: 50%; height: 50%;}
#appstore a span { position: absolute; bottom: 10px;background: url(images/red-button.png) repeat-x top #820f02; color: white;-moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; width: 170px;padding: 7px 5px; height: 20px; float: left; margin-left: 15px; height: auto; margin-top: 5px; display: block; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#appstore p {height: 250px; width: 195px; overflow: hidden; float: left; display: block; position: relative;}
#content .pageing a, #content .pageing img {border: 0; float: right; padding: 0 3px;}
#content .pageing {margin-right: 100px;}