﻿/* == Base Layout Styles
------------------------------------------------- */

body{background: #fff; font-family: Arial, Verdana, 'MS Sans-Serif'; font-size: 80%; color: #333;}

#wrap{width: 1000px; margin: 0 auto; border: 1px #E4EBEE solid;}

#wrap #hdr{position: relative; height: 182px; _height: 207px; background: url(/ewi/img/bg-hdr.gif) repeat-x top left;}
#wrap #hdr #nav{position: absolute; width: 100%; height: 32px; bottom: 0;}

#wrap #content{padding: 40px 40px 10px 40px; line-height: 1.6em;}

#wrap #ftr{height: 26px; line-height: 26px; text-align: right; margin: 20px 0 0 0; padding: 0 30px; background: url(/ewi/img/bg-ftr.gif) repeat-x top left;}


/* == Navigation Styles
------------------------------------------------- */

#wrap #hdr #nav ul.main{margin: 0 0 0 10px;}

#wrap #hdr #nav ul.main li{float: left; position: relative; height: 32px; margin: 0; padding: 0; font-size: 80%; z-index: 100;}
#wrap #hdr #nav ul li a{display: block; color: #333; text-decoration: none; border-left: 1px #58ddbd solid; border-right: 1px #44caaa solid; margin: 7px 0 0 0; padding: 2px 9px; font-weight: bold;}
#wrap #hdr #nav ul li a:hover, #wrap #hdr #nav ul.main li a.on{color: #000; text-decoration: underline;}
#wrap #hdr #nav ul li a.home{border-left: 0;}
#wrap #hdr #nav ul li a.contact{border-right: 0;}

#wrap #hdr #nav table{position: absolute; border-collapse: collapse; z-index: 80; left: -1px; top: 32px;}

#wrap #hdr #nav ul.main ul{visibility: hidden; position: absolute; width: 125px; height: 0; margin: 0; top: 32px;}

#wrap #hdr #nav ul.main ul li{width: 125px; height: auto; padding: 3px 10px 8px 10px; background: url(/ewi/img/bg-subnav.gif) #fff repeat-x top left; border: 1px #e3e4e6 solid; border-width: 0 1px 1px 1px;}
#wrap #hdr #nav ul.main ul li a{border: 0; padding: 0; background: url(/ewi/img/bullet-subnav.gif) no-repeat center left; padding: 0 8px; font-weight: normal; font-size: 110%;}
#wrap #hdr #nav ul.main li:hover ul, #wrap #hdr #nav ul a:hover ul{visibility:visible;}

#wrap #hdr #nav ul.subnav{float: left; width: 975px; margin: 0; padding: 0 0 0 25px; border-bottom: 1px #ccc solid; border-top: 1px #ccc solid; font-size: 85%; background: #f4f4f4;}
#wrap #hdr #nav ul.subnav li{float: left; height: auto; padding: 5px; margin: 0 5px;}
#wrap #hdr #nav ul.subnav li a{border: 0; background: none; padding: 0; margin: 0;font-size: 95%; font-weight: normal; background: url(/ewi/img/bullet-subnav.gif) no-repeat center left; padding: 0 8px;}


/* == Text, Images, Links Etc.
------------------------------------------------- */

h1, h2, h3, h4, h5, h6{font-size: 160%; color: #accb6c;}
h2{font-size: 120%; margin-top: 20px; font-weight: bold;}

#wrap #content a{color: #04A07A; border-bottom: 1px #04A07A dashed; text-decoration: none;}
#wrap #content a:hover{border-bottom: 1px #04A07A solid;}
#wrap #content a.ext{color: #000; text-decoration: none; border-bottom: 1px #000 dashed;}
#wrap #content a.ext:hover{border-bottom: 1px #000 solid;}

#wrap #hdr .logo, #wrap #hdr .tagline{position: absolute; top: 20px; left: 20px;}
#wrap #hdr .tagline{top: 100px; left: 75px;}

#wrap #content ul{float: left; *float: none;}
#wrap #content ul li{margin: 5px 0; padding: 0 0 0 18px; list-style: none; background: url(/ewi/img/bullet.gif) no-repeat left 2px;}
#wrap #content ol li{list-style: decimal; margin: 5px 0 5px 25px; list-style-position: outside;}

#wrap #content .ul{text-decoration: underline;}

#wrap #content .inset{float: left; width: 280px; margin: 0 15px 10px 0; padding: 1px; border: 1px #ccc solid;}
#wrap #content .intro{font-size: 110%; line-height: 1.7em;}

#wrap #content hr, #wrap #content div.hr{height: 1px; border-top: 1px #ccc dashed; color: #ccc; margin: 10px 0; clear: both;}
#wrap #content div.hr hr{display: none;}

#wrap #ftr a{color: #666; font-size: 85%; margin: 0 3px;}
#wrap #ftr a:hover{text-decoration: none;}


/* == Table Styles
------------------------------------------------- */

#wrap #content table{font-size: 85%; margin: 10px 0;}
#wrap #content table td, #wrap #content table th{padding: 3px; border: 1px #ccc solid; border-width: 1px;}
#wrap #content table th{font-weight: bold; background: url(/ewi/img/bg-subnav.gif) repeat-x top left;}


/* == Flowchart Styles
------------------------------------------------- */

#wrap #content .flowchart{width: 780px;}
#wrap #content .flowchart .row{position: relative; height: 100px;}
#wrap #content .flowchart .row .question, #wrap #content .flowchart .row .answer, #wrap #content .flowchart .row .no, #wrap #content .flowchart .row .yes{position: absolute; width: 302px; height: 42px; background: url(/ewi/img/flowchart/question.gif) no-repeat top left; left: 0; padding: 10px 25px; text-align: center; font-weight: bold; font-size: 85%;}
#wrap #content .flowchart .row .answer{background: url(/ewi/img/flowchart/answer.gif) no-repeat top left; left: auto; right: 0; color: #fff; font-style: italic;}
#wrap #content .flowchart .row .no, #wrap #content .flowchart .row .yes{width: 55px; height: 62px; line-height: 60px; left: 47%; background: url(/ewi/img/flowchart/no.gif) no-repeat center right; font-size: 90%; font-weight: bold; text-align: left; padding: 0;}
#wrap #content .flowchart .row .yes{width: 50px; height: 32px; line-height: 32px; background: url(/ewi/img/flowchart/yes.gif) no-repeat top left; top: 65px; left: 150px; text-align: right; padding: 0;}
#wrap #content .flowchart .row a{color: #fff; border: 0;}
#wrap #content .flowchart .row a:hover{text-decoration: underline;}

#wrap #content .automotive-key{float: left; display: inline; margin: 0 0 0 35px; font-size: 90%; line-height: 1.2em; font-style: italic;}
#wrap #content .automotive-key ul{margin: 0 0 40px 0;}

#wrap #content table.stages-of-dev{width: 818px; line-height: 1.5em;}
#wrap #content table.stages-of-dev td{padding: 3px; text-align: center; border: 1px #ddd solid;}
#wrap #content table.stages-of-dev td.heading{font-size: 110%; font-weight: bold; color: #B90042; text-align: left; vertical-align: middle; padding: 0 5px;}
#wrap #content table.stages-of-dev td.highlight{background: #f5f375; font-weight: bold;}
#wrap #content table.stages-of-dev td.nobord{border: 0;}
#wrap #content table.stages-of-dev td ul, #wrap #content table.stages-of-dev td ol{padding: 0; margin: 0 5px;}
#wrap #content table.stages-of-dev td ul li{list-style-image: none; list-style: none; list-style-position: outside;}
#wrap #content table.stages-of-dev td ol li{list-style-image: none; list-style: numeric; list-style-position: inside;}
#wrap #content table.stages-of-dev .arrow{width: 118px; height: 62px; line-height: 62px; padding: 0 0 0 10px; background: url(/ewi/img/flowchart/stages-arrow.gif) no-repeat top left; color: #fff; font-weight: bold; font-size: 110%;}
