/* ---------------------------- 
[Master Stylesheet]

Project:	Megram Consulting Services Ltd.
Version:	Beta 0.5
Last change:	May 7, 2010
Created by:	Devon Lesk
Primary use:	Web

------------------------------- */

/*
Possible colours

Dark Orange: #ff7e00
Light Orange (used on brochure): #e9b421

*/

/* ---------------------------- */
/* Generic Styles
/* ---------------------------- */
*{padding:0; margin:0; margin:0 auto;}
html {margin: 0 auto; text-align:center;}

/*Clearfix*/
.clearfix:after {content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
.clearfix {display: inline-block;}
html[xmlns] .clearfix {display: block;}
* html .clearfix {height: 1%;}

/* ---------------------------- */
/* Basic Elements
/* ---------------------------- */
body{background:#042e56; height:100%;}
h1{font-family:Verdana, Geneva, sans-serif; font-size:24px; color:#FFF; padding:16px 0 0 0;}
h4{font-size:18px; text-shadow:#333 0px 0px 5px;}

#wrapper{width:1000px; margin:0 auto;}
#back{width:100%; height:100%; background:url(../images/backGradient.png) repeat-x #042e56;}
p{font-size:12px;}

.right{float:right; display:inline;}
.rightImage{float:right; display:inline; margin:8px 8px 8px 8px;}
.left{float:left; display:inline;}

/* ---------------------------- */
/* Navigation
/* ---------------------------- */
#navigation{width:960px; height:48px; background:url(../images/navigation.png) no-repeat bottom; margin:0 auto; padding:20px 0 0 0; text-align:center;}
#navContent{margin:0 0 0 50px;}

/*Nav text can be reduced  to 11px while still retaining readability*/
#navigation a{color:#626262; text-decoration:none; font-family:Verdana, Geneva, sans-serif; font-size:12px; text-shadow:#FFF 0px 1px 0px; margin:16px 20px 0 20px; float:left; display:inline; font-weight:bold;}
#navigation a:hover{color:#ff7e00;}
#navigation a:active{margin-top:17px;}

/* ---------------------------- */
/* Top Bar
/* ---------------------------- */
#topBar{height:60px; background:#333; width:100%;}
#topContent{width:900px; margin:0 auto;}
#socialLinks{float:left; display:inline; margin:20px 0 0 340px;}
#topContent span{float:left; display:inline; font-family:Verdana, Geneva, sans-serif; font-size:14px; color:#FFF; margin:0 20px 0 0; line-height:1.7;}
#logo{background:url(../images/logoSmall.png) no-repeat; width:233px; height:60px; float:left; display:inline;}
#twitterButton{background:url(../images/twitter.png); width:61px; height:23px; float:left; display:inline; margin-left:10px;}

.blogButton{font-size:16px!important; padding:0 0 0 40px;}

/* ---------------------------- */
/* Content
/* ---------------------------- */
#masthead{width:100%; height:250px;}
#mastheadContent{width:980px; height:290px; margin:0 auto; background:url(../images/masthead.jpg) no-repeat;}

#mastheadSubpage{width:100%; height:100px;}
#mastheadContentSubpage{width:980px; height:100px; margin:0 auto; padding-top:30px;}

#mastheadImage{position:absolute; left:50%; margin:50px 0 0 -420px;}

#subtitle{font-family:Verdana, Geneva, sans-serif; font-size:22px; color:#FFF; font-style:italic; text-shadow:#000 0px 0px 5px; margin:10px 0 0 0; position:absolute; left:50%; top:60px; text-align:center; width:380px; margin-left:-180px;}

#testimonials{width:500px; height:200px; font-family:Verdana, Geneva, sans-serif; color:#fff; overflow:hidden; margin:0 0 0 0px;}
#testimonials p{ text-align:left; padding:60px 0 0 40px; font-style:italic;}
.personInfo{font-size:10px; text-align:right; padding:0px 0 0 40px;}
.personInfoShort{font-size:10px; text-align:right; padding:0px 0 0 20px; margin:-20px 0 0 0;}

.hoverBox{position:absolute; z-index:100; width:250px;}
.hoverBox p{font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#000; width:250px; background:#FFF;}

/*#aboutBox{top:220px; left:50%; margin-left:-500px;}*/
#aboutBox{top:220px; left:50%; margin-left:-450px;}
#asManBox{top:220px; left:50%; margin-left:-380px;}
#writingBox{top:230px; left:50%; margin-left:-180px;}
#websiteBox{top:220px; left:50%;}
#contactBox{top:230px; left:50%; margin-left:100px;}
#blogBox{top:230px; left:50%; margin-left:180px;}

#assoSection{width:270px; float:left; display:inline;}
#writingSection{width:270px; float:left; display:inline; margin:0 40px 0 40px;}
#websiteSection{width:270px; float:left; display:inline;}
#assoTitle{background:url(../images/assoTitle.png) no-repeat; width:270px; height:30px; display:block;}
#writingTitle{background:url(../images/writingTitle.png) no-repeat; width:259px; height:30px; display:block;}
#websiteTitle{background:url(../images/websiteTitle.png) no-repeat; width:270px; height:30px; display:block;}

.cloudTop{width:250px; height:14px; background:url(../images/cloudTop.png) no-repeat;}
.cloudBottom{width:250px; height:26px; background:url(../images/cloudBottom.png) no-repeat;}


#content{width:900px; margin:0 auto; min-height:400px; text-align:left; font-family:Verdana, Geneva, sans-serif; color:#FFF; font-size:13px; padding-top:50px; line-height:1.5;}
.divider{background:#f69537; width:900px; height:1px; margin:30px 0 20px 0; position:relative; left:50%; margin-left:-450px; clear:both;}

a{font-family:Verdana, Geneva, sans-serif; font-size:12px; text-align:left; text-shadow:#000 0px 0px 3px; text-decoration:none; color:#ff7e00;}
a:hover{color:#FFF; text-decoration:underline;}

/*.employee{background-color:#18345d; -moz-border-radius: 10px; -webkit-border-radius: 10px; padding: 10px; width:880px; font-size:12px; float:left; display:inline; border:#e9b421 2px solid; margin:10px 0 10px 0;}*/
.employee{margin:0 0 30px 0;}
.employee img {margin:3px 7px 3px 3px;}
.employee hr{border:none; height:1px; width:100%; background:#FFF; margin:4px 0 4px 0;}

.testimonialGroup{float:left; display:inline; margin:20px 0 0 0;}
.testimonial{width:850px; font-size:14px; float:left; display:inline; padding:10px; margin:0 15px 0 15px;}
.testimonialDivider{width:860px; float:left; display:inline; margin:10px 0 10px 20px; color:#F90; background-color:#F90; height:1px; border:none;} 
.quote{font-size:14px; font-style:italic;}


.testInfo{font-size:10px; margin-top:20px; float:right; display:inline; font-style:italic; line-height:1.2; font-weight:bold; text-align:right;}
.title{font-size:14px; text-shadow:#333 0px 0px 5px; font-weight:bold;}
.largeTitle{font-size:18px; text-shadow:#333 0px 0px 5px; font-weight:bold;}

/* ---------------------------- */
/* Contact
/* ---------------------------- */
#contactInfo{float:left; display:inline; width:240px;}
#contactInfo hr{border:none; height:1px; background-color:#FFF;}
#contactForm{float:left; display:inline; width:520px; margin-left:140px;}

#contactForm p{float:left; display:inline; margin:0 4px 0 0;}
#clientUpload{font-size:20px;}

#contactForm img{float:left; display:inline; width:100px; height:36px; border:2px solid #CCC; margin:2px 0 2px 0px;}

label {float:left; display:inline; font-size:12px;}

.field {float:right; display:inline; width:380px; padding:10px; border:2px solid #CCC; margin:2px 0 2px 0; color:#666;}
.field:hover, .field:focus {border:2px solid #ff7e00;}

.captchaField {float:right; display:inline; width:100px; padding:10px; border:2px solid #CCC; margin:2px 0 2px 14px; color:#666;}
.captchaField:hover, .field:focus {border:2px solid #ff7e00;}

#contact textarea {height:100px;}
#submit {float:right; display:inline; margin:10px 0 0 100px; background:#ff7e00; border:none;height:30px;line-height:30px;color:#fff;padding-left:10px;padding-right:10px;}
#submit:hover {cursor:pointer; background:#C93;}

.error{width:480px; padding:10px; background:#900;  margin:2px 0 10px 0; color:#FFF;}
.accept{width:480px; padding:10px; background:#093;  margin:2px 0 10px 0; color:#FFF;}

/* ---------------------------- */
/* Footer
/* ---------------------------- */
#footer{width:100%; height:100px; margin-top:20px;}
.footerBar{width:100%; height:3px; background:#CCC; float:left; display:inline;}

#footerMenu{width:900px; height:40px; margin:0 auto; padding-top:20px; color:#FFF; clear:both;}
#footerMenu a{font-family:Verdana, Geneva, sans-serif; font-size:11px; color:#FFF; text-decoration:none;}
#footerMenu a:hover{color:#ff7e00; text-decoration:underline;}

#footerContent{margin:0 auto; width:900px; padding-top:20px; height:0px;}

h2{font-family:Verdana, Geneva, sans-serif; font-size:18px; text-decoration:underline;}
h3{font-family:Verdana, Geneva, sans-serif; font-size:17px; color:#FFF; text-shadow:#000 0px 0px 4px;}

#contactUs{width:250px; height:140px; float:left; display:inline; text-align:left; font-family:Verdana, Geneva, sans-serif; color:#FFF;}
#contactUs p{margin:20px 0 0 0; text-shadow:#000 0px 0px 4px;}

#twitter{width:400px; height:140px; float:left; display:inline; text-align:left;}
#twitter{font-family:Verdana, Geneva, sans-serif; font-size:12px; color:#FFF; text-shadow:#000 0px 0px 4px;}
#twitter b{color:#f69537;}

#otherStuff{width:250px; float:left; display:inline; text-align:right;}
#otherStuff a{font-family:Verdana, Geneva, sans-serif; color:#FFF; font-size:14px;}

.publications{float:left; display:inline; width:700px; margin:0 0 0 100px;}
.pubHR{border:none; height:1px; width:700px; background:#FFF; margin:20px 0 20px 100px; float:left; display:inline;}

#webPortfolio{}
.webItem{}
.webInfo{position:relative; z-index:20; background:#000; opacity:.8; width:320px; float:left; display:inline;}
.webItem img{position:relative; z-index:10; float:left; display:inline;}
#webLinks{text-align:center;}

.list li div.txt{z-index:1;width:200px;height:125px; padding:5px 5px 5px 5px;}
.abb{font-size:20px;}
.webTitle{color:#FFF; font-size:12px;}

.list1 li{position:relative;margin:0;padding:0;float:left; display:inline;margin:0 20px 20px 0;width:200px;height:125px;}
.list1 li.webItem{ background:#F90; color:#333; }
.list1 li a{z-index:3;position:absolute;margin:0;padding:0;top:0;left:0;width:200px;height:125px;}
.list1 li img{position:absolute;margin:0;padding:0;top:0;left:0;z-index:2;}
.list1 li div.txt{z-index:1;width:200px;height:125px;padding:5px 5px 5px 5px;}

#banner{position:absolute; z-index:2000; top:0px; right:0px; width:100px; height:100px;}
.summer{background:url(../images/SummerSpecial.png) no-repeat;}
.summer:hover{background:url(../images/SummerSpecial_over.png) no-repeat;}