@charset "utf-8";
/* CSS Document */

/* ------- TABLE OF CONTENTS ---------------

Project:       Conrad Technologies
Version:       1.0
Last change:   9/12 worked on content, content complete 
Assigned to:   Jonathan Hoppes
Primary use:   Custom Website
 
1. Import Reset and Global Styles
2. Structure Style Declarations 
3. Typography Style Declarations

---------- END TABLE OF CONTENTS ----------*/

/* ---------->>> 1. Import <<<-----------*/

@import url("/css/reset.css"); /* import the forbin reset style sheet - browser default styles */
@import url("/css/global.css"); /* import the forbin global style sheet - contains common styles */

/* ---------->>> END Import <<<----------*/

/* ---------->>> 2. Structure <<<-----------*/
/* BODY */
body {background:#243035; font-family:'Tahoma'; font-size:11px; color:#3c4c5b; line-height:21px;}
#background {background:url(/images/bg_body.jpg) repeat-x white;}
#container {width:935px; margin:0 auto; position:relative;}
#mainFocus {width:475px; height:525px; position:absolute; top:94px; left:480px;}
/* HEADER */
#date {width:935px; height:57px; background:url(/images/bg_date.jpg); position:relative; letter-spacing:-.1em;}
#date .time {position:absolute; right:75px; top:10px; font-weight:bold; text-transform:uppercase;}
#date .day_year {font-size:24px; color:#33a7ff; font-weight:100;}
ul#navigation {}
ul#navigation li {width:155px; height:38px; margin-right:1px; float:left;}
ul#navigation a {width:155px; height:38px; display:block; text-indent:-9999px;}
ul#navigation li.main {background:url(/images/nav_01.jpg);}
ul#navigation li.specs {background:url(/images/nav_02.jpg);}
ul#navigation li.custom {background:url(/images/nav_03.jpg);}
ul#navigation li.product {background:url(/images/nav_04.jpg);}
ul#navigation li.quote {background:url(/images/nav_05.jpg);}
ul#navigation li.contact {background:url(/images/nav_06.jpg);}
ul#navigation li.last {margin-right:0px;}
ul#navigation li.main:hover, ul#navigation li.product:hover, ul#navigation li.custom:hover,
ul#navigation li.specs:hover, ul#navigation li.quote:hover, ul#navigation li.contact:hover {background-position:0 -38px;}
ul#navigation li.main_focus {background:url(/images/nav_01.jpg) 0 -76px;}
ul#navigation li.specs_focus {background:url(/images/nav_02.jpg) 0 -76px;}
ul#navigation li.custom_focus {background:url(/images/nav_03.jpg) 0 -76px;}
ul#navigation li.product_focus {background:url(/images/nav_04.jpg) 0 -76px;}
ul#navigation li.quote_focus {background:url(/images/nav_05.jpg) 0 -76px;}
ul#navigation li.contact_focus {background:url(/images/nav_06.jpg) 0 -76px;}
/* CONTENT */
#mainContent {background:url(/images/bg_contentbody.jpg) no-repeat; min-height:475px; clear:left;}
a.technicalSpecs {background:url(../images/btn_technicalspecs.jpg); width:240px; height:137px; top:320px; left:20px;}
a.technicalSpecs:hover {background-position: 0 -137px;}
a.customHandles {background:url(../images/btn_customized.jpg); width:241px; height:137px; top:320px; left:20px;}
a.customHandles:hover {background-position: 0 -137px;}
#subContent {background:url(/images/bg_contentbody.jpg) top no-repeat; min-height:475px; clear:left; padding:67px 0 0 57px; width:500px;}
#subrightColumn {float:right; width:300px; margin-right:50px; margin-top:60px; background:url(../images/bg_rightColumn.jpg) repeat-y; border-bottom:1px solid #bebebe;}
#subrightColumn ul {padding:10px; color:#161d2a;}
#subrightColumn li { border-bottom:1px dashed #989898; padding:3px 0; background:url(../images/arrow.jpg) .5em 1.1em no-repeat; padding-left:20px; }
#subrightColumn li.last { border-bottom:none;}
#subrightColumn #bluePrint {background:url(../images/tinyBlueprint.jpg); width:281px; height:211px; margin-left:10px;}
#subrightColumn #bluePrint a {background:url(../images/a_enlargeBlueprint.jpg) 160px 120px no-repeat; width:281px; height:211px;}
#subrightColumn #bluePrintattachedGasket {width:281px; height:212px; margin-left:10px; background:url(../images/bp_gasket.jpg) bottom no-repeat;}
#subrightColumn #bluePrintattachedGasket a {background:url(../images/a_enlargeBlueprint.jpg) 20px 30px no-repeat; width:281px; height:1112px;}
#subrightColumn #bluePrintshallowDepth {width:281px; height:97px; margin-left:10px; background:url(../images/bp_shallowdepth.jpg);}
#subrightColumn #bluePrintshallowDepth a {background:url(../images/a_enlargeBlueprint.jpg) 20px 30px no-repeat; width:281px; height:97px;}
#subContent p { width:495px;}
#primary {position:absolute; top:254px; left:55px; width:460px;}
h2 {margin-bottom:-10px;}
h2 {font-size:30px; font-family:'Arial Narrow'; font-weight:100; color:#2a353f; line-height:36px;}
h3 {font-size:45px; font-family:'Arial Black'; font-weight:Bold; color:#fb5f00; margin-bottom:20px; float:left; line-height:60px;}
h4 {font-size:34px; font-family:'Arial Narrow'; font-weight:100; color:#0095da; margin-bottom:20px; float:left; line-height:44px; margin-top:11px;}
h5 {font-family:'Tahoma'; color:white; font-size:11px; background:url(../images/bg_h5.jpg) no-repeat; margin:0; padding:1px 0 0 20px; height:23px;}
#primary p {clear:left; width:395px;}
a.freeQuote {margin-left:-55px; background:url(/images/btn_freeQuote.jpg); width:450px; height:77px; display:block; 
			 text-indent:-9999px;}
a.btn_learnmore {background:url(/images/btn_learnmore.jpg);}
a.btn_ordernow {margin:0 70px 0 5px; background:url(/images/btn_ordernow.jpg);}
a.btn_ordernow, a.btn_learnmore {float:right; margin-top:5px; width:103px; height:20px; text-indent:-9999px;}
a.btn_ordernow:hover, a.btn_learnmore:hover {background-position:0 -20px;}
p { text-align:justify;}
ul#installation { background:url(../images/bg_instructions.jpg) 5px 10px no-repeat;  }
ul#installation li {height:100px; background-position: 110px 22px; padding-left:80px;}
ul#installation li p { margin:17px 10px 0 40px; font: bold 9px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:10px;}
table h2 { margin-top:20px;}
th { height:50px;}
a.iconGraphic_03 {background:url(/images/icon_graphics_03.jpg); width:301px; height:99px; margin-top:25px;}
a.iconGraphic_03:hover {background-position: 0 -99px;}
a.iconGraphic_05 {width:301px; background:url(../images/icon_graphics_05.jpg); height:98px;}
a.iconGraphic_05:hover {background-position: 0 -98px;}
a.iconGraphic_06 {width:301px; background:url(../images/icon_graphics_06.jpg); height:98px;}
a.iconGraphic_06:hover {background-position: 0 -98px;}
a.iconGraphic_07 {width:301px; background:url(../images/icon_graphics_07.jpg); height:97px; }
a.iconGraphic_07:hover {background-position: 0 -97px;}
a.iconGraphic_03, a.iconGraphic_05, a.iconGraphic_06, a.iconGraphic_07 { display:block; text-indent:-9999px;}
/* FOOTER */
#footer {height:138px; background:url(/images/bg_footer.jpg); font-size:10px; color:#8f8f8f;}
#footer .ftcontent {width:935px; height:105px; background:url(/images/bg_footerContentRpt.jpg); margin:0 auto;}
.ftcontent p {padding-top:30px;}
.ftcontent a {border-right:1px dashed #cfcfce; text-indent:-9999px; width:25px;
				height:14px; float:left; margin-right:9px;}
.ftcontent a.ftContact {background:url(/images/btn_ftcontact.jpg) no-repeat; margin-left:16px;}
.ftcontent a.ftMain {background:url(/images/btn_ftmain.jpg) no-repeat;}
.ftcontent a.ftQuote {background:url(/images/btn_ftquote.jpg) no-repeat; border-right:none;}
.ftcontent a.ftContact:hover, .ftcontent a.ftMain:hover, .ftcontent a.ftQuote:hover {background-position:0 -14px;}
.ftcontent a.forbin {border:none; float:none; display:inline; margin:0; color:#33a7ff; text-decoration:underline;}
/* ---------->>> END Structure <<<----------*/

/* ---------->>> 3. Typography <<<----------*/
/* COLORS */
.orange {color:#fc7f33;}
.brightblue {color:#33a7ff;}
.darkblue {color:#2a3d49;}
.red {color:red;}
/* FONTS */
p { padding-bottom:25px;}
/* HEADERS */
H1 {width:495px; height:92px; background:url(/images/h1_logo.jpg); clear:left; text-indent:-9999px;}
/* TABLES */
#infotable {width:300px;padding: 0;margin-top: 0px;}
#infotable caption {padding: 0 0 5px 0; width: 100%; font: italic 11px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;text-align: center;}
#infotable th {font: bold 9px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color: #4f6b72;border-right: 1px solid #bebebe; border-bottom: 1px solid #bebebe;border-top: 1px solid #bebebe;letter-spacing: 1px;text-transform: uppercase;text-align: left;padding: 6px 6px 6px 12px;background:url(/images/bg_header.jpg) no-repeat; height:20px;}
#infotable th.nobg {border-top: 0;border-left: 0;border-right: 1px solid #bebebe;background: none;}
#infotable td {border-right: 1px solid #bebebe;border-bottom: 1px solid #bebebe;background: #fff;padding: 6px 6px 6px 12px;color: #161d2a;}
#infotable td.alt {background: #f1f1f1;color: #797268;}
#infotable th.spec {border-left: 1px solid #bebebe;border-top: 0;background: #fff url(/images/bullet1.gif) no-repeat;font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color: #161d2a;}
#infotable th.specalt {border-left: 1px solid #bebebe;border-top: 0;background: #f1f1f1 url(/images/bullet2.gif) no-repeat;font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;color: #797268;}
#handleViews { width:100%; margin-bottom:15px;}
#handleViews caption { height:50px;}
#handleViews th { width:33%; font: bold 9px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:10px; color:#33a7ff; text-align:center;}
#handleViews img { float:none;}
/* FORMS */
.checkbox { margin-top:5px;}
/* Contact/Quote Form */
#formWrapper {padding-top:20px; margin-left:20px;}
#linkContainer a {background:url(/images/btn_removeFields.jpg); width:157px; height:20px; text-indent:-9999px; display:block;}
#linkContainer a:hover {background-position:0 -20px;}
fieldset {margin:0;border:1px solid #ccc; width:242px; float:left; height:340px; padding:20px; margin-right:20px;}
fieldset.last { margin-right:none;}
/* LightBox */
#lightbox{position: absolute;left: 0;width: 100%;z-index: 100;text-align: center;line-height: 0;}
#lightbox a img{ border: none;  }
#outerImageContainer{position: relative;background-color: #fff;width: 250px;height: 250px;margin: 0 auto;border:1px solid #bebebe; border-bottom:none;}
#imageContainer{padding: 10px;}
#loading{position: absolute;top: 40%;left: 0%;height: 25%;width: 100%;text-align: center;line-height: 0;}
#hoverNav{position: absolute;top: 0;left: 0;height: 100%;width: 100%;z-index: 10;}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}
#prevLink, #nextLink{width: 49%;height: 100%;background: transparent url(/images/blank.gif) no-repeat;display: block;}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/nextlabel.gif) right 15% no-repeat; }
#imageDataContainer{font-size: 10px;background-color: #fff;margin: 0 auto;line-height: 1.4em;overflow: auto;width: 100%; border:1px solid #bebebe; border-bottom:none;border-top:none;}
#imageData{	padding:10px; color: #fb5f00;   }
#imageData #imageDetails{ width: 100%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
#overlay{position: absolute;top: 0;left: 0;z-index: 90;width: 100%;height: 500px;background-color: #396274;}
/* Style the legend, labels and the div containing the submit button. */
legend {font-size:20px; padding:8px;}
label {display:block;}
#fm-submit {clear:both; padding-top:1em; text-align:center;}
#fm-submit input {border:1px solid #fc7f33; padding:2px 4px; background:#fff; color:#333; font-size:100%;}
fieldset div.fm-optional {display:block;}
fieldset div input {width:200px; /* Width for modern browsers */border:1px solid #2a3d49; padding:1px;}
fieldset div select {font-family : "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif; font-size:100%; width:204px; /* Width for modern browsers */border:1px solid #ccc; padding:1px;}
fieldset div label:before {content: "* "; color:red;}
fieldset div.fm-optional label:before {content: "";}
/* Optional fields. */
.fm-optional input {border:1px solid #ccc;}
.contactSubmit {background:url(../images/btn_sendContactInfo.jpg);}
.quoteSubmit {background:url(../images/btn_sendQuote.jpg);}
.quoteSubmit, .contactSubmit {width:118px; height:20px; border:0; text-indent:-9999px; float:right; cursor:pointer;}
.contactSubmit:hover, .quoteSubmit:hover {background-position: 0 -20px;}
/* sIFR... Do Not Modify! */
.sIFR-flash {visibility: visible !important; margin: 0;}
.sIFR-replaced {visibility: visible !important;}
span.sIFR-alternate {position: absolute;left: 0;top: 0;width: 0;height: 0;display: block;overflow: hidden;}
/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {display: none !important;}
/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */
.sIFR-hasFlash h2 {visibility: hidden;}
.sIFR-hasFlash legend {visibility: hidden;}
.sIFR-hasFlash h3 {visibility: hidden;}
.sIFR-hasFlash h4 {visibility: hidden;}
/* icon Slider */
.news_slider {position: relative; width:500px; text-align:left; top:350px; left:-10px;}
.news_slider .prev, .news_slider .next {position: absolute; top: 45%; display: none; z-index:100;}
.news_slider .next {right: -26px;}
.news_slider .prev { left:0px;}
.news_slider .container {position: relative; top: 0; left: 0; width: 100%;}
.news_slider .news_items {position: relative; width: 481px; height:139px; top: 0; left: 25px; overflow: hidden;}
.first {background:url(../images/01.jpg); height:139px; width:239px; text-indent:-9999px; display:block;}
.first:hover { background-position: 0 -139px;}
.second {background:url(../images/02.jpg); height:139px; width:239px; text-indent:-9999px; display:block;}
.second:hover { background-position: 0 -139px;}
.third {background:url(../images/03.jpg); height:139px; width:239px; text-indent:-9999px; display:block;}
.third:hover { background-position: 0 -139px;}
.fourth {background:url(../images/04.jpg); height:139px; width:239px; text-indent:-9999px; display:block;}
.fourth:hover { background-position: 0 -139px;}
.fifth {background:url(../images/05.jpg); height:139px; width:239px; text-indent:-9999px; display:block;}
.fifth:hover { background-position: 0 -139px;}
.news_slider .item {width:239px; height:139px; margin-right:3px;}
.news_slider .item div {width: 239px;}
/* LINKS */
a:link {color:#fc7f33;}
a:visited {color:#fc7f33;}
a:hover {color:#33a7ff;}
a:active {color:#fc7f33;}
/* ---------->>> END Typography <<<---------*/

.formoutput {
  font-size        : 11px;
  font-family      : Arial, Helvetica, sans-serif;
  color            : #444444;
  border           : 1px #666666 solid;
  background-color : #f5fafe;
  font-weight			 :  bold;
  padding-left		 : 5px;
	padding-right		 : 5px;
}

