﻿/* navigation
-------------------------------------------------------------- */

/* main nav */
#menu { margin:auto; padding:0; }
#menu li { background:none; border:1px solid transparent; display:block; float:left; margin:0; padding:0; position:relative; text-align:center; text-transform:capitalize; }
#menu li:hover { border:1px solid #286dc1; -webkit-border-radius:5px 5px 0 0; border-radius:5px 5px 0 0; -webkit-box-shadow:0 -1px 4px #999; box-shadow:0 -1px 4px #999; }
#menu li a { color:#0059a9; display:block; font-size:1.2857em; font-weight:bold; line-height:32px; padding:5px 10px 5px 40px; text-decoration:none; text-indent:10px; }
#menu li:hover a { color:#fff; text-shadow:0 1px 1px #286dc1; }
#menu .mega-dropdown { background:#5dacec; background:-moz-linear-gradient(center top, #5dacec 0%, #286dc1 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0, #5dacec), color-stop(1, #286dc1)); border:1px solid #286dc1; border-bottom:1px solid #5dacec; border-top:none; left:-999em; padding:10px 0; position:absolute; -webkit-border-radius:0 5px 5px 5px; border-radius:0 5px 5px 5px; width:480px; z-index:999; }
#menu li:hover .mega-dropdown, #menu li:active .mega-dropdown { left:-1px; }
#menu li .menu-right { -webkit-border-radius:5px 0 5px 5px; border-radius:5px 0 5px 5px; }
#menu li:hover .menu-right, #menu li:active .menu-right { left:auto; right: -1px; }
#menu .active { color:#ff0!important; cursor:default; }
/* nav home */
#menu li.menu-home { background:url(menu-home-trans.png) no-repeat 10px 5px; }
#menu li.menu-home:hover { background:#5dacec url(menu-home-hover-trans.png) no-repeat 10px 5px; -webkit-border-radius:5px; border-radius:5px; }
/* nav roofing */
#menu li.menu-roofing { background:url(menu-roofing-trans.png) no-repeat 10px 5px; }
#menu li.menu-roofing:hover { background:#5dacec url(menu-roofing-hover-trans.png) no-repeat 10px 5px; }
/* nav shutters */
#menu li.menu-shutters { background:url(menu-shutters-trans.png) no-repeat 10px 5px; }
#menu li.menu-shutters:hover { background:#5dacec url(menu-shutters-hover-trans.png) no-repeat 10px 5px; }
/* nav solar */
#menu li.menu-solar { background:url(menu-solar-trans.png) no-repeat 10px 5px; }
#menu li.menu-solar:hover { background:#5dacec url(menu-solar-hover-trans.png) no-repeat 10px 5px; }
/* nav other */
#menu li.menu-other { background:url(menu-other-trans.png) no-repeat 10px 5px; }
#menu li.menu-other:hover { background:#5dacec url(menu-other-hover-trans.png) no-repeat 10px 5px; }
/* nav Raim */
#menu li.menu-Raim { background:url(menu-Raim-trans.png) no-repeat 10px 5px; }
#menu li.menu-Raim:hover { background:#5dacec url(menu-Raim-hover-trans.png) no-repeat 10px 5px; }
/* nav contact */
#menu li.menu-contact { background:url(menu-contact-trans.png) no-repeat 10px 5px; }
#menu li.menu-contact:hover { background:#5dacec url(menu-contact-hover-trans.png) no-repeat 10px 5px; }
#menu li.menu-contact .mega-dropdown { width:600px; }
/* nav content */
body #menu { color:#000; }
#menu .menu-list li { background:#5dacec; border:none; float:none; font-size:0.7777em; line-height:1.4286em; margin:1px 0 0 0; padding:0; text-align:left; }
#menu .menu-list li a { color:#fff; font-weight:normal; line-height:20px; padding:0 0 0 0; text-decoration:none; text-indent:0; text-shadow:none; }
#menu .menu-list li a span { color:#fff; float:left; font-size:1.5em; font-weight:bold; margin:-1px 3px 0 -1px; }
#menu .menu-list li:hover { border:none; -webkit-box-shadow:none; box-shadow:none; }
#menu .menu-list li:hover a { background:#5dacec; color:#ff0; }
#menu .menu-list li.lh { background:none; font-size:1em; }
#menu div.grid-colborder-right { border-right:1px solid #286dc1; }
#menu div.grid-colborder-left { border-left:1px solid #286dc1; }
#menu .img-border { border:1px solid #286dc1; }
#menu h3 { color:#ff0; }
#menu h4 { color:#ff0; text-transform:none; }
#menu p { text-transform:none; }
#menu p a { display:inline; font-size:1em; line-height:1em; padding:0; text-shadow:none; }
#menu p a:hover { color:#ff0; }
#menu .button .button-yellow { -webkit-box-shadow:0 0 5px #333; box-shadow:0 0 5px #333; text-shadow:none; }
#menu .button .button-yellow:hover { -webkit-box-shadow:none; box-shadow:none; }


/* forms
-------------------------------------------------------------- */

.form { background:#286dc1; -webkit-border-radius:5px; border-radius:5px; float:right; font-size:1em; margin:20px auto; padding:5px 10px; position:relative; width:280px; z-index:2; }
.form-question { background:#5dacec; background:-moz-linear-gradient(center left, #286dc1 0%, #5dacec 60%); background:-webkit-gradient(linear, left top, right top, color-stop(0, #286dc1), color-stop(1, #5dacec)); clear:both; height:24px; margin:5px auto 0; }
label { color:#fff; float:left; font-family:Georgia, "Times New Roman", serif; font-size:1.1429em; font-style:italic; height:24px; line-height:24px; text-align:right; text-shadow:0 0 1px #0059a9; width:120px; }
label sup { color:#ff0; }
.form-field { border:1px solid #286dc1; -webkit-box-shadow:inset 0 0 5px #5dacec; box-shadow:inset 0 0 5px #5dacec; color:#000; float:right; font-family:Arial, Helvetica, sans-serif; font-size:0.8571em; height:16px; line-height:1em; margin:1px 1px 0 0; padding:2px; width:143px; }
.form-field:hover { border:1px solid #5dacec; -webkit-box-shadow:none; box-shadow:none; }
.form-field:focus { border:1px solid #000; -webkit-box-shadow:none; box-shadow:none; }
.form select { height:22px; width:148px; }
input[type=file] { color:#000; float:left; font-family:Arial, Helvetica, sans-serif; font-size:0.8571em; height:26px; line-height:1em; margin:1px; padding:2px; }
.form-question-textarea { height:92px; }
.form-question-scroll { height:60px; overflow-x:hidden; overflow-y:scroll; }
.label-full { text-align:left; width:100%; }
.form textarea { height:60px; overflow-x:hidden; overflow-y:scroll; width:274px; }
.form-question-button { background:none; height:40px; margin-top:10px; }
.form-button { background:#ff0; background:-moz-linear-gradient(center top, #ff0 25%, #fb0 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0.25, #ff0), color-stop(1, #fb0)); border:1px solid #fb0; -webkit-border-radius:5px; border-radius:5px; -webkit-box-shadow:0 0 5px #333; box-shadow:0 0 5px #333; color:#000; float:right; font-family:Arial, Helvetica, sans-serif; font-size:1em; font-weight:bold; height:33px; line-height:1em; width:148px; }
.form-button:hover { background:#ff0; -webkit-box-shadow:none; box-shadow:none; cursor:pointer; }
#form-contact { margin:5px 0; position:relative; }
#form-contact-left { background:#ff0; background:-moz-linear-gradient(center top, #ff0 25%, #fb0 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0.25, #ff0), color-stop(1, #fb0)); border:1px solid #ff0; border-right:none; bottom:0; height:33px; left:-20px; position:absolute; width:20px; z-index:2; }
#form-contact-triangle { border-color:transparent #f80 transparent transparent; border-style:solid; border-width:10px; bottom:-10px; height:0; left:-30px; position:absolute; width:0; z-index:1; }
#form-contact-icon { background:url(mail-trans.png) no-repeat; height:24px; position:absolute; right:20px; top:5px; width:24px; }
#form-contact h3 { background:#ff0; background:-moz-linear-gradient(center top, #ff0 25%, #fb0 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0.25, #ff0), color-stop(1, #fb0)); border:1px solid #ff0; border-left:none; -webkit-border-radius:0 5px 5px 0; border-radius:0 5px 5px 0; -webkit-box-shadow:-5px 0 5px #333; box-shadow:-5px 0 5px #333; color:#0059a9; margin:0; text-transform:uppercase; }
input[disabled='disabled'], textarea[disabled='disabled'], select[disabled='disabled'] { background:#d4eafa; cursor:default; }
select > option:first-child { border-bottom:1px dashed #000; }
select > option:nth-child(even) { background:#eee; }
select option { padding:2px; }

/* search */
.form-field-search { border:1px solid #1d1105; -webkit-box-shadow:inset 0 0 5px #1d1105; box-shadow:inset 0 0 5px #1d1105; float:left; height:28px; margin:0; width:210px; }
.form-field-search:hover { border:1px solid #1d1105; -webkit-box-shadow:none; box-shadow:none; }
.form-button-search { -webkit-box-shadow:0 0 5px #000; box-shadow:0 0 5px #000; float:right; height:34px; margin-bottom:8px; width:74px; }
.form-button-search:hover { background:#ff0; border:1px solid #fb0; }

/* form footer */
.form-footer input[type=button] { -webkit-appearance:none; }
.form-footer { background:none; -webkit-border-radius:0; border-radius:0; float:none; height:130px; margin:0; padding:0; position:relative; width:220px; z-index:2; }
.form-footer .form-question { background:none; clear:both; height:27px; margin:0 0 5px 1px; }
.form-footer .form-field { border:2px solid #286dc1; float:left; height:19px; line-height:1em; width:95%; }
.form-footer .form-field-half { width:98px; }
.form-footer select { height:27px!important; width:99%!important; }
.form-footer .form-button { background:#ff0; background:-moz-linear-gradient(center top, #ff0 25%, #fb0 100%); background:-webkit-gradient(linear, left top, left bottom, color-stop(0.25, #ff0), color-stop(1, #fb0)); font-size:0.8571em; height:30px; margin:2px 2px 0 0; width:107px; }
.form-footer input[disabled='disabled'], .form-footer select[disabled='disabled'] { border:2px solid #286dc1; color:#000; cursor:default; }

/* validate & autocomplete */
.ac_results { background-color:#eee; border:1px solid #000; -webkit-box-shadow:0 0 5px #333; box-shadow:0 0 5px #333; color:#000; margin-left:0; overflow:hidden; padding:0; z-index:1111; }
.ac_results ul { list-style:none; list-style-position:outside; margin:0; padding:0; width:100%; }
.ac_results li { background-image:none; cursor:default; display:block; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:20px; margin:0; overflow:hidden; padding:2px 5px; text-align:left; }
.ac_loading { background:#fff url(loading.gif) right center no-repeat; }
.ac_odd { background-color:#fff; }
.ac_over { background-color:#0059A9; color:#fff; }
label.error { background:#286dc1 url(error-trans.png) no-repeat 10px 5px; -webkit-border-radius:5px; border-radius:5px; bottom:1px; color:#000; cursor:pointer; font-family:Arial, Helvetica, sans-serif; font-size:14px; font-style:normal; font-variant:small-caps; height:48px; left:1px; line-height:41px; position:absolute; text-align:left; text-decoration:underline; text-indent:48px; width:135px; }
input.error, textarea.error, select.error { background-color:#ffefef; border:1px solid #f00; -webkit-box-shadow:none; box-shadow:none; }