@import url("stylesCommon.css");

* html .visualIEFloatFix {
height: 0.01%;
}

html, body{
height: 100%;
}

body{
background: #e6e6e6 url(imgs/bg.gif) repeat-x;
background-position: 0px 60px;
font-family: Arial, sans-serif;
font-size: 100%;
margin: 0;
}

a:link{
text-decoration: underline;
color: #013162;
}

a:visited{
color: #013162;
text-decoration:underline;;
}

h1 {
font-size: 2em;
color: #013162;
text-align: left;
}

h2{
font-size: 1.25em;
color: #013162;
}

h3{
font-size: 1em;
color: #013162;
}

#wrapper{
background: url(imgs/wrapperbg.gif) repeat-y;
background-position: top center;
font-size: 0.75em;
min-height: 100%;
position: relative;
}

* html #wrapper {
height: 100%;
}

#navWrapper{
background: #122c4e url(imgs/navbg.jpg) repeat-x;
height: 60px;
text-align: center;
}

#qclogo{
float: left;
margin: 0 300px 0 0;
}

#nav{
margin-left: auto;
margin-right: auto;
width: 900px;
height: 60px;
color: white;
text-align: left;
}

.navButton{
margin: 25px 25px 10px 5px;
height: 22px;
text-indent: 1000px;
white-space: nowrap;
overflow: hidden;
display: block;
float: left;

}

#homeNav{
background-image: url(imgs/home.png);
width: 44px;
}
#homeNav:hover{
background-image: url(imgs/homeHover.png);
}
#servicesNav{
background-image: url(imgs/servicesTop.png);
width: 60px;
}
#servicesNav:hover{
background-image: url(imgs/servicesTopHover.png);
}
#portfolioNav{
background-image: url(imgs/portfolio.png);
width: 63px;
}
#portfolioNav:hover{
background-image: url(imgs/portfolioHover.png);
}
#contactNav{
background-image: url(imgs/contact.png);
width: 62px;
}
#contactNav:hover{
background-image: url(imgs/contactHover.png);
}

#wrapper2{
background: url(imgs/bgwrapper.gif) repeat-x;
margin: 0 auto;
text-align: left;
width: 900px;
padding: 0;
}

#header{
background: url(imgs/headerbg.jpg) no-repeat;
height: 271px;
margin: 0 0 0 -1px;
overflow: hidden;
/*text-indent: 1000px;
white-space: nowrap;*/
width: 900px;
}

#indexHeaderButtons{
width: 	259px;
margin: 180px 0 0 30px ; 
}

#screenshotRotator{
float: right;
margin: 0px 0px 0 0 ;
}

.headerLink{
width:259px;
height:27px;
text-indent: 1000px;
white-space: nowrap;
overflow:hidden;
display:block;
}

#whyWebsiteHeader{
background-image: url(imgs/why-do-i-need-a-website.png);
}
#whatCanAWebsiteHeader{
background-image: url(imgs/what-can-a-website-do-for-me.png);
}
#whatMakesAGoodWebsiteHeader{
background-image: url(imgs/what-makes-a-good-website.png);
}

#content{
padding: 0 0 249px 0;
width: 900px;
line-height: 150%;
}

.leftCol{
float: left;
margin: 15px 5px 10px 15px;
width: 587px;
}

.mainHeaders {
background-repeat: no-repeat;
text-indent: 1000px;
white-space: nowrap;
overflow:hidden;
height: 30px;
}

#needWebsite{
background-image: url(imgs/why-do-i-need-a-website.jpg);
width: 324px;
}

#websiteDoForMe{
background-image: url(imgs/websiteDoForMe.jpg);
width: 380px;
}

#whatMakesAGoodWebsite{
background-image: url(imgs/whatMakesAGoodWebsite.jpg);
width: 369px;
}

.rightCol{
float:right;
width: 228px;
margin: 15px 10px 10px 55px;

}

#services{
background-image: url(imgs/services.jpg);
width: 82px;
}

#whatOurCustomersSay{
background-image: url(imgs/whatOurCustomersSay.jpg);
width: 217px;
}

.quotes{
font-family: Arial;
font-style:italic;
margin: 0 15px 5px 15px;
}

.quotePerson{
float:right;
color: #002F63;

}

.arrowBullets{
padding-left: 30px;
margin-top: 0px;

}

.arrowBullets li{
list-style: none;
list-style-image: url(imgs/smallArrows.jpg);
}

#footerWrapper{
background: #122c4e url(imgs/footerbg.jpg) repeat-x;
font-size: 0.875em;
height: 249px;
margin-top: -249px;
position: relative;
z-index: 10;
}

#footerWrapper a{
color: #FAB613;
text-decoration:underline;
}

#footer{
margin-left: auto;
margin-right: auto;
width: 900px;
height: 249px;
color: white;
text-align: left;
}

#readyToGetStarted{
background-image: url(imgs/readyToGetStarted.png);
}
#needMoreInfo{
background-image: url(imgs/needMoreInfo.png);
}

.servicesHeader {
background: url(imgs/header-servicesbg.jpg) no-repeat !important;
height: 101px !important;
}

.portfolioHeader {
background: url(imgs/header-portfoliobg.jpg) no-repeat !important;
height: 101px !important;
}

#headerQuoteSmall{
margin: 73px 40px 5px 50px;
color : #fff;
font-weight: bold;
font-size: 1.2em;
}
.featured, .portfolio{
margin-bottom: 10px;
padding: 5px;
}

.featured{
background: #002F63;
color: #fff;
}

.featured .portfolio_header, .portfolio .portfolio_header{
border-bottom: 1px solid #FAB710;
margin: 0 0 3px 0;
}

.featured a.featured_link, .featured a.featured_link:visited{
color: #FAB710;
text-decoration: none;
}

.featured a.featured_link:hover, .featured a.featured_link:active{
color: #fff;
text-decoration: underline;
}

.portfolio{
}

.portfolio a.featured_link, .portfolio a.featured_link:visited{
color: #002F63;
text-decoration: none;
}

.portfolio a.featured_link:hover, .portfolio a.featured_link:active{
color: #8FC5FF;
text-decoration: underline;
}

.portfolio_header {
text-align: right;
}

.portfolio_header strong{
float: left;
}

.featured img, .portfolio img{
float: right;
margin: 0 3px 0 10px;
}

.progressbar{
    border:1px solid #000000; 
    width: 200px; 
    height: 20px; 
    line-height: 20px; 
    text-align: center; 
}

#cursorMessageDiv {
	position: absolute;
	z-index: 99999;
	border: solid 1px #CCC;
	background: #EEE;
	padding: 2px;
	margin: 0px;
	display: none;
}

.highlight{
	background-color: #FDEABF;
	color: #002F63;
	font-weight:bold;

}

/* style for flyout images */
#flyoutStyle { 
background-color:#FAB613; 
border:3px solid #013162;
padding: 2px;
}

.border2{
border:2px solid #013162;
}


/* style for promo page */
#loader2 { 
border-style: solid; 
border-color: #FFFFFF; 
border-width: 7px;  
background-color:#FFFFFF; 
} 
hr { 
background-color:#F5C562; 
border:medium none; color:#F5C562; 
display:block !important; 
height:1px; 
margin-left:10px; 
width:425px; 
} 
.pli { 
font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; 
font-size: 14px; 
margin-top: .5em; 
color: #666; 
} 
.promo { 
font-family: "Helvetica Neue", "Lucida Grande", Helvetica, Arial, Verdana, sans-serif; 
font-size: 14px; 
margin-top: .5em; 
color: #666; 
} 
.pstart { 
font-family:Georgia,serif; 
font-size: .8em; 
font-weight: bold; 
text-transform:uppercase; 
letter-spacing:2px; 
} 
.pmain { 
background-image:url(../../../imgs/webdev_01.png);
background-repeat:no-repeat;
height:250px;
margin-left:-121px;
margin-top:-50px;
width:706px;
} 
.ptext{ 
margin-left:5px; 
margin-top:40px; 
} 
.promoleftCol {
float:left;
margin:15px 5px 10px 15px;
width:587px;
}

#sideDock { 
float: left; 
left: 0%;
position:fixed; 
z-index:100; 
height:400px; 
width: 350px;
top: 35%; 
margin-top: -80px; 
margin-left:-320px;
background-image:url(/gfx/sidebarQuickContact.png); 
background-repeat: no-repeat; 
color: #fff;
}

#quickContactDiv {
color: #fff;
margin-left: 5px;
margin-top: 5px;
width: 308px;
height: 100%;
margin-right: 7px;
}

#quickContactDiv  label{
color: #fff;
font-weight: bold;
}
.alertSmall{
background: #FFEFBF; 
border: 1px solid #F4BA0E; 
color: #CF0000; 
text-align: center; 
font-weight: bold; 
padding: 5px; 
margin-bottom: 10px; 
font-size: .85em;
}