/** GLOBAL RESETS **/
:link,:visited {text-decoration:none;}
h1,h2,h3,h4,h5,h6,pre,code {font-size:1em;font-weight:200;}
ul,dl,dt,dd,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input {margin:0; padding:0}
a img,:link img,:visited img {border:none}

/** GLOBAL SETS **/
.clear {display: block;  clear: both; }
.hidden {display:none;}
body {margin:0 0 50px 0;font-size:12px;line-height:22px;color:#333;font-family:arial,lucida,tahoma,helvetica,verdana;text-align:center;}
a:link, a:visited {color:#F15A24;text-decoration:underline;font-weight:bold;}
a:hover, a:focus {color:#000000;text-decoration:underline;font-weight:bold;}

h1 {font-family:arial;font-size:26px;color:#000;line-height:36px;margin:10px 0 15px 0;padding:0 0 15px 0;border-bottom:#ccc 1px dotted;}
h2 {font-family:arial;font-size:25px;line-height:37px;letter-spacing:-1px;margin:25px 0 10px 0;}
h3 {font-family:arial;font-size:18px;color:#333;margin:10px 0 10px 0;}
h4 {font-family:arial;font-size:16px;color:#333;margin:25px 0 10px 0;}
h5 {font-family:arial;font-size:14px;color:#333;margin:5px 0 10px 0;}
h6 {font-family:arial;font-size:10px;color:#333;margin:25px 0 10px 0;}

#wrapper {width:960px;margin-right:auto;margin-left:auto;}

#eazifleet-register .wrapper, #thank-you .wrapper {width:650px;margin-right:auto;margin-left:auto;}

#index{background:#FFF url(images/bg.png) top repeat-x;}
#milestones-accolades, #about, #solutions,#benefits, #contact, #news {background:#FFF url(images/bg-2.png) top repeat-x;}

/* IMAGES */
#about .image, #eazifleet .image, #news .image{background: url(images/about-image.jpg) no-repeat top;height:194px;margin-top:20px;}
#benefits .image{background: url(images/benefits-image.jpg) no-repeat top;height:194px;margin-top:20px;}
#solutions .image{background: url(images/solutions-image.jpg) no-repeat top;height:194px;margin-top:20px;}
#contact .image{background: url(images/contact-image.jpg) no-repeat top;height:194px;margin-top:20px;}
#eazifleet-register .image, #thank-you .image{background: url(images/eazifleet.jpg) no-repeat left;height:72px;margin-top:10px;}
#homepage #header {height:450px;}
#homepage #banner{margin-top: 100px;height:373px;}

/* HEADER */
#header {position:relative;height:84px;background: url(images/header.jpg) no-repeat top;width: 100%;top:10px;}
#header #nav {position:absolute;top:20px;right:35px;list-style:none;}
#header #nav li {float:left;margin:0 0 0 2px;font-size:14px;text-transform:uppercase;font-weight:normal;}
#header #nav li a {display:block;line-height:45px;padding:0 20px;background: url(images/navbar.png) no-repeat left center;font-weight: normal;}
#header #nav li a:link, #header #nav li a:visited {color:#000;text-decoration:none;font-weight: normal;}
#header #nav li a:hover, #header #nav li a:focus {color:#DC9E2D;text-decoration:none;font-weight: normal;}
#header #nav li.current a  {color:#DC9E2D;text-decoration:none;font-weight: normal; }
#header a.logo:link, #header a.logo:visited, #header a.logo:hover{position:absolute;top:20px;left:0;color:#fff;font-size:52px;text-transform:uppercase;font-family:Arial;letter-spacing:-2px;text-decoration:none;text-indent: -9999px;}

/* CONTENT */
#index #content{float:left;text-align:left;width:420px; padding: 20px 10px 0 100px;}
#news #content{text-align:left;width:650px; padding: 20px 0 0 120px;}
#contact #content{text-align:left;width:700px; padding: 20px 0 0 120px;}
#news #content,#benefits #content{text-align:left;width:700px; padding: 20px 0 0 120px;}
#solutions #content{text-align:left;width:600px; padding: 20px 0 0 120px;}
#about #content {text-align:left;width:520px; float: right;margin: 10px 100px 0 0;}
#eazifleet-register #content, #thank-you #content{text-align:left;width:650px; padding: 20px 0;}

#about #content h4 {color:#DC9E2D;font-family:arial;font-size:16px;line-height: 32px;margin:10px 0 0px 0;}

#solutions #content h4 {color:#DC9E2D;font-family:arial;font-size:16px;line-height: 32px;margin:10px 0 0 0; background: url(images/list-icon.gif) no-repeat left;padding-left:20px;}
#content .page-text p {padding:0 0 10px 20px;}

#content #page-content {float:left;}
.page-meta {line-height:40px;text-transform:uppercase;color:#999;font-size:11px;border-top:1px dotted #ccc;padding-top:15px;margin-top:15px;}
.page-meta span {text-transform:none;color:#BA0000;font-size:15px;font-family:georgia;}
#content .page-text {font-size:12.5px;line-height:22px;margin-bottom:5px;}
#content .page-text a {color:#F15A24;font-weight: bold;text-decoration: underline; }
#content .page-text a:hover {color:#000000;}
#content .page-text h2 {font-family:arial;font-size:25px;line-height:37px;letter-spacing:-1px;margin:25px 0 10px 0;}
#content .page-text ul, #content .page-text ol {margin:0 0 10px 0;}
#content .page-text ul, #content .page-text ol {margin-left:30px;list-style:none url(images/list-icon.gif) outside}
#content .page-text li{}
#content .page-text ul ul, #content .page-text ol ul, #content .page-text ul ol, #content .page-text ol ol {margin:0 0 0 25px;}
#content .page-text blockquote {margin:0 0 22px 20px;line-height: 19px;font-size:13px;color:#666;font-style:italic;border-left:2px solid #ccc;padding:0 0 0 15px;}
#content code {border:1px dotted #ececec;padding:2px;font-family: Consolas, Monaco, "Courier New", Courier, monospace;font-size: 12px;background:#f9f9f9;color:#000;}
#content pre code {line-height:17px;padding:15px;border:1px dotted #ececec;font-family: Consolas, Monaco, "Courier New", Courier, monospace;font-size: 12px;background:#f9f9f9;color:#000;margin-bottom:22px;display:block;}
#content .page-text img {margin:10px;border:1px solid #ccc;padding:5px;}

/* SIDEBARS */
#index #sidebar {width:320px;float:left;border:1px solid #ccc;background:#f6f6f6;margin:60px 0px 20px 10px;}

.section .register {font-size:0.9em;font-style:italic;color:#F15A24;padding-left:5px;}
.section .login a{background: url(images/login-up.png) no-repeat left;display:block;width:124px;height:45px;}
.section .login a:hover, .section .login a:focus {background: url(images/login-down.png) no-repeat left;width:124px;height:45px;}
.section .login a:hover span{display:block;}


.section .nav-sidebar {margin-left:0px;}
.section .nav-sidebar li{float:left;list-style: none;padding-bottom:10px;}
.section .nav-sidebar a{display: block;text-indent: -900%;position: absolute;outline: none;width:132px;height:39px;}
.section .nav-sidebar a:hover {color: #000000;background-position: left bottom;}
.section .nav-sidebar a:hover span {display: block;}
.section .nav-sidebar .view{background: url(images/view-benefits.gif) no-repeat;height:39px;width:141px;}
.section .nav-sidebar .view span{background: url(images/view-benefits-over.gif) no-repeat;height:39px;width:141px;top:-20px;position:relative;}
.section .nav-sidebar .request{background: url(images/request-demo.gif) no-repeat;height:39px;width:141px;}
.section .nav-sidebar .request span{background: url(images/request-demo-over.gif) no-repeat;height:39px;width:141px;top:-20px;position:relative;}
.section .nav-sidebar li a {color:#666;display:block;line-height:20px;padding-bottom:0;}

#about .nav-sidebar{width:200px;float:left;margin:30px 0 10px 80px;padding:5px;}
#about .nav-sidebar li{background: url(images/link-up.png) no-repeat right;border-top:thin solid #ccc;float:left;list-style:none;line-height:2;padding:5px;text-align: left;width:200px;}
#about .nav-sidebar .last{border-bottom:thin solid #ccc;}
#about .nav-sidebar .active a:link{color:#DC9E2D;}
#about .nav-sidebar li a{color:#999;text-decoration:none;width:200px;}
#about .nav-sidebar li a:hover{background: url(images/link-over.png) no-repeat right;color:#DC9E2D;text-decoration:none;}

.contact-sidebar {float:right;margin-top: 0px;}
.contact-sidebar p{line-height: 1.6; padding:0 0 10px 0}
.contact-sidebar h3{color:#DC9E2D;font-weight: bold; }
.contact-sidebar img {border:1px solid #ccc;padding:5px;}

/* SECTIONS */
.section {padding:15px 10px 5px 22px;text-align:left;}
.section p, .section ul, .section ol {line-height:20px;margin:0 0 5px 0;}
.section ul, .section ol {margin-left:20px;}
.section ul ul, .section ol ul, .section ul ol, .section ol ol {margin:0 0 0px 20px;}
.section img {padding-right:2px;}

.section h2 {color:#333;font-size:22px;font-family:arial;line-height:22px;letter-spacing:-1px;margin:0 0 15px 0;padding:0;}
.section h3 {color:#333;font-family:arial;font-size:19px;margin:0 0 10px 0;}
.section h4 {color:#F15A24;;font-family:arial;font-size:14px;margin:0 0 10px 0;}
.section h5 {color:#333;font-family:arial;font-size:13px;margin:0 0 10px 0;}
.section h6 {color:#333;font-family:arial;font-size:10px;margin:0 0 10px 0;}

.latest-news {float: left;width:400px;padding-top:10px;}
.latest-news p{padding-bottom:10px;}


/* CONTACT FORM */
.contactform {float: left;margin:0px 0 20px 10px;width:420px;}
.contactform b {display:block;}
.contactform input.text, .contactform textarea, .contactform select {width:250px;padding:4px;font-family:arial;font-size:13px;margin:2px 0 7px 0;}
.contactform textarea {height:150px;width:350px;}
.contactform input#contact-submit {padding:4px;width:150px;font-weight:bold;}
.contactform p {width:400px;padding-bottom:10px;}
.contactform p.contactmsg {padding:4px;border:1px solid #ccc;background:#f9f9f9;font-weight:bold;}
.contactform p.success {color:#00CC33;}
.contactform p.error {color:#CC0000;}
.pot {display:none;}

#map_canvas{border:1px solid #ccc;float:left;}

/*.contact {padding-top:25px;border-top:1px dotted #ccc;}*/
#sidebar .section form p {margin: 0 0 0 0;}
#sidebar .section label {font-size:11px;color:#666;display:block;}
#sidebar .section input.text, #sidebar .section textarea.text {font-size:13px;font-family:arial;border:1px solid #999;padding:4px;background:#fff;width:250px;margin:0 0 7px 0;}
#sidebar .section input.text:focus, #sidebar .section textarea.text:focus {background:#ffffcc}
#sidebar .section textarea.text {height:100px}
#sidebar .section input.submit {padding:5px 10px;font-weight:bold;float:right;background:#111;border:1px solid #000;color:#eee;}
#sidebar .section input.submit:focus, #sidebar .section input.submit:hover {color:#7C1B1B;background:#BA0000;}

#myForm {float:left;margin:0;padding:14px 10px 10px 0px;width:650px;}
#myForm h1 {font-size:14px;font-weight:bold;color: #FF8E0D;margin-bottom:8px;}
#myForm h2{padding-bottom:10px;color: #FF8E0D;font: 14px Verdana,Arial,Tahoma,Helvetica,Sans-Serif;text-decoration: none;font-weight:bold;}
#myForm p {font-size:12px;color:#333333;line-height: 120%;margin-bottom:20px;padding-bottom:10px;}
#myForm label{display:block;font-weight:bold;float:left;text-align:right;width:140px;padding:4px 0;}
#myForm .small{color:#666666;display:block;font-size:11px;font-weight:normal;text-align:right;width:140px;}
#myForm input{font-size:12px;padding:2px;width:240px;margin:2px 0 0px 10px;}
#myForm select{margin:6px 0 0 10px;}
#myForm textarea{float:left;font-size:12px;padding:4px 2px;border:solid 1px #999;width:240px;margin:2px 0 20px 10px;}
#myForm .red {border: 1px solid red;}
#myForm label.red {border: none;color: red;}
#myForm .customRed {border: none;color: red;}
#myForm .field{clear: both; margin: 0 0 1.0em;}
#myForm .submit {color: #000;float:left;margin:10px 0px 0 225px;width:110px;}
#myForm .cancel {color: #000;float:right;margin:10px 0 0 15px;width:110px;}
#myForm .terms {padding-top:20px;}
#myForm .terms p{color:#666666;font-size:10px;}
#validationMessage {padding-top: 5px;/*background-color: #eee;*/border: 1px solid red;margin-bottom: 2px;color: red;font-weight: bold;display: none;}
#myForm .errorMessage {color:red;margin-left:10px;font-size:0.8em;}
#error {height:200px;margin-top:40px;text-align:center;}
#noerror {height:200px;	margin-top:40px;text-align:center;}
#noerror h2{font-size:14px;font-weight:bold;color: #FF8E0D;margin-bottom:8px;}
#myForm .specialfield {display: none}

/* FOOTER */

#footer {float:left;text-align:left;line-height:18px;font-size:10px;color:#666;border-top:1px solid #ccc;padding:10px 0 20px 0;margin: 10px 60px 0;}
#footer p.left-footer {text-align:left;float:left;width:200px;padding-top:5px;}
#footer p.center-footer {text-align:center;float:left;width:440px;padding-top:5px;}
#footer p.right-footer {text-align:right;float:right;width:200px;padding-top:0px;}
#footer a:link, #footer a:visited {color:#666;text-decoration:underline;}
#footer a:hover {color:#000;text-decoration:underline;}
/*
    ColorBox Core Style
    The following rules are the styles that are consistant between themes.
    Avoid changing this area to maintain compatability with future versions of ColorBox.
*/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative; overflow:hidden;}
#cboxLoadedContent{overflow:auto;}
#cboxLoadedContent iframe{display:block; width:100%; height:100%; border:0;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}

/* 
    Example user style
    The following rules are ordered and tabbed in a way that represents the
    order/nesting of the generated HTML, so that the structure easier to understand.
*/
#cboxOverlay{background:url(images/overlay.png) 0 0 repeat;}
#colorbox{}
    #cboxTopLeft{width:21px; height:21px; background:url(images/controls.png) -100px 0 no-repeat;}
    #cboxTopRight{width:21px; height:21px; background:url(images/controls.png) -129px 0 no-repeat;}
    #cboxBottomLeft{width:21px; height:21px; background:url(images/controls.png) -100px -29px no-repeat;}
    #cboxBottomRight{width:21px; height:21px; background:url(images/controls.png) -129px -29px no-repeat;}
    #cboxMiddleLeft{width:21px; background:url(images/controls.png) left top repeat-y;}
    #cboxMiddleRight{width:21px; background:url(images/controls.png) right top repeat-y;}
    #cboxTopCenter{height:21px; background:url(images/border.png) 0 0 repeat-x;}
    #cboxBottomCenter{height:21px; background:url(images/border.png) 0 -29px repeat-x;}
    #cboxContent{background:#fff;}
        #cboxLoadedContent{margin-bottom:28px;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
        #cboxPrevious{position:absolute; bottom:0; left:0px; background:url(images/controls.png) -75px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxPrevious.hover{background-position:-75px -25px;}
        #cboxNext{position:absolute; bottom:0; left:27px; background:url(images/controls.png) -50px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxNext.hover{background-position:-50px -25px;}
        #cboxLoadingOverlay{background:url(images/loading_background.png) center center no-repeat;}
        #cboxLoadingGraphic{background:url(images/loading.gif) center center no-repeat;}
        #cboxClose{position:absolute; bottom:0; right:0; background:url(images/controls.png) -25px 0px no-repeat; width:25px; height:25px; text-indent:-9999px;}
        #cboxClose.hover{background-position:-25px -25px;}

/*
    The following fixes png-transparency for IE6.  
    It is also necessary for png-transparency in IE7 & IE8 to avoid 'black halos' with the fade transition
    
    Since this method does not support CSS background-positioning, it is incompatible with CSS sprites.
    Colorbox preloads navigation hover classes to account for this.
    
    !! Important Note: AlphaImageLoader src paths are relative to the HTML document,
    while regular CSS background images are relative to the CSS document.
*/
.cboxIE #cboxTopLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopLeft.png, sizingMethod='scale');}
.cboxIE #cboxTopCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopCenter.png, sizingMethod='scale');}
.cboxIE #cboxTopRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderTopRight.png, sizingMethod='scale');}
.cboxIE #cboxBottomLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomLeft.png, sizingMethod='scale');}
.cboxIE #cboxBottomCenter{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomCenter.png, sizingMethod='scale');}
.cboxIE #cboxBottomRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderBottomRight.png, sizingMethod='scale');}
.cboxIE #cboxMiddleLeft{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleLeft.png, sizingMethod='scale');}
.cboxIE #cboxMiddleRight{background:transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=images/internet_explorer/borderMiddleRight.png, sizingMethod='scale');}
