﻿@charset "utf-8";

html, body {margin:0; padding:0; height:100%;}
body  {text-align:center; font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:15px; color:#000000; height:100%; background:url(images/colwilkie_page_bg.jpg);}
a img {border:none;}

h1 {font:33px Arial, Helvetica, sans-serif; color:#f18e00; margin:16px 0;}
h2 {font:24px Arial, Helvetica, sans-serif; color:#444444; margin:16px 0; border-bottom:1px solid #eeeeee; width:100%;}
h3 {font:20px Arial, Helvetica, sans-serif; color:#f18e00; margin:16px 0;}
h4 {font:bold 18px Arial, Helvetica, sans-serif; color:#797979; margin:16px 0;}
h5 {font:14px Arial, Helvetica, sans-serif; color:#444444; margin:15px 0px 0px 0px;}
p {font:12px Arial, Helvetica, sans-serif; color:#444444; text-align:justify;}
.content-one ul {margin:0px 0px 0px 10px; padding:0px 0px 0px 0px;}
.content-one li {margin:0px; padding:0px 0px 20px 27px; list-style-type: none; background:url(images/colwilkie_dotpoint_icon.png) no-repeat left top; min-height:20px; display:block; font:12px/15px Arial, Helvetica, sans-serif; color:#444444;}
.content-one h1:first-child {margin-top:0;}
p a:link, p a:active, p a:visited {font:12px Arial, Helvetica, sans-serif; color: #df6400; text-decoration: underline;}
p a:hover  {color: #df6400; text-decoration: none;}
.csc-caption {font:10px Arial, Helvetica, sans-serif; color:#9c9c9c; margin-top:5px; text-align:center;}


#body{max-width:960px; min-width:320px; margin:0 auto; position:relative; text-align:left; background-color:#ffffff; box-shadow:0 0 8px #000000;}
#top-shadow {position:absolute; top:0; left:0; right:0; background:url(images/colwilkie_page_top_gradient.png) repeat-x center top; height:35px; z-index:80;}

#header {position:relative; height:166px; background-color:#3f4349; background-image:url(images/header.jpg); box-shadow:0 -7px 21px rgba(0,0,0,0.6) inset; text-align:center;}
  #logo {display:block; float:left; margin:20px 0 0 20px;}
  #car {float:right;}
  #trusted {position:absolute; bottom:0; left:0; right:0; padding:5px 20px;}
    #trusted img {width:100%; height:auto; max-width:479px; vertical-align:middle;}
  #phone {display:block; width:119px; height:118px; background:url(images/colwilkie_CTA_ring_24hours.png) no-repeat center center; position:absolute; right:-20px; bottom:-20px;}
  #phone2 {display:none; border-top:1px solid #ffffff; text-decoration:none; margin:-20px -10px 40px -10px; background-color:#002c5a; height:40px; text-align:center; color:#ffffff; line-height:40px; font-size:16px; font-weight:700;}
    #phone2 span {font-weight:400;}
    #phone2 img {margin-right:10px; vertical-align:middle;}
    
#content {background-color:#ffffff; padding:20px 10px; overflow:hidden;}
.content-one {margin:0 220px 0 210px;}
.clear {clear:both;}
  
/* -------- Nav First Level ------------*/
#nav {position:relative; width:200px; float:left; margin-left:-10px; text-align:left; z-index:100; }
#nav ul {position:relative; display:block; list-style:none; white-space: nowrap; font-size:0; padding:0; background-image: linear-gradient(#8b8f91, #ffffff); padding-top:20px;}
#nav ul li {position:relative; display:block; padding:0 4px 0 6px;}
#nav ul li a {display:block; padding:0 20px; color:#002c5a; background:url(images/nav-button.png) no-repeat left center; opacity:0.8; text-decoration:none; font-size:14px; font-weight:normal; height:30px; line-height:30px; white-space:no-wrap;}
#nav > ul > li > a:hover {opacity:1; color:#000000;}
/* Sub Buttons */
.sub-button { display:none; position:absolute; width:50px; height:50px; top:0; right:0; background-color:#33353B; cursor:pointer;}
.sub-button:after {content:""; display:block; position:absolute; top:22px; left:17px; width:0; height:0; border:8px solid transparent; border-top:8px solid #ffffff;}
.sub-open .sub-button:after {top:13px; border:8px solid transparent; border-bottom:8px solid #ffffff;}
.sub-button:hover {background-color:#52565B;}
  /* -------- Nav Menu Button and Icon------------*/
#nav ul li.menu {display:none; background:linear-gradient(#f4aa2d, #e96d0a); background-color:#f18e00;}
#nav ul li.menu a {padding-left:50px;}
#nav ul li.menu a:hover {background:linear-gradient(#F5B342, #EB7C23); background-color:#F2991A;}
#menu-icon {position:absolute; bottom:17px; left:13px; width:24px; height:17px;}
  #menu-icon div { position:relative; background-color:#ffffff; height:3px; margin-bottom:3px; border-radius:2px;}
/* -------- Nav Second Level ------------*/
#nav > ul > li > ul {display:none; position:relative; background:none; padding:0;}
#nav ul li:hover ul {}
#nav ul li#active ul {display:block;}
#nav ul li ul li {display:relative; display:block; padding:3px 3px 3px 16px;}
#nav ul li ul li a {color:#ffffff; background:#3f4349; border-radius:12px; font-size:14px; line-height:24px; height:24px;}
#nav ul li ul li a:hover {opacity:1;}
/* Sub Buttons */
#nav ul li ul li .sub-button {background-color:#27272D;}
#nav ul li ul li.sub .sub-button:hover {background-color:#52565B;}
#nav ul li ul li.sub .sub-button:after {content:""; display:block; position:absolute; top:22px; left:17px; width:0; height:0; border:8px solid transparent; border-top:8px solid #ffffff;}
#nav ul li ul li.sub-open .sub-button:after {top:13px; border:8px solid transparent; border-bottom:8px solid #ffffff;}
#nav ul li ul li.sub-open .sub-button:hover {background-color:#52565B;}

/* -------- Nav Third Level------------*/
#nav ul li ul li ul {position:relative; display:block; background:none; min-width:auto; padding:3px 0 0 0;}
#nav ul li:hover ul li ul{display:block;}
#nav ul li ul li ul li { padding:3px 0px 3px 16px;}
#nav ul li ul li ul li:last-child {border-bottom:none;}
#nav ul li ul li ul li a{background-color:#27272D;}


#quote {width:195px; background-color:#f18e00; border-radius:12px; padding:9px; box-sizing:border-box; float:right; overflow:hidden;}
  #quote div#quote-title {position:relative; color:#000000;  border:none; margin:-9px -9px 10px -9px; font-size:18px; line-height:34px; padding:0 9px; background:url(images/quote-title.png) no-repeat top left;}
  #quote input, #quote textarea {box-sizing:border-box; width:100%; border:1px solid #D17B00; font-size:11px; line-height:20px; color:#838789; padding:0 5px; margin-bottom:5px;}
  #quote div {font-size:14px; color:#33363B; border-bottom:1px solid #33363B; margin:10px 0 10px 0;}
  #quote input.request_quote_button {display:block; cursor:pointer; border:none; margin:10px 0; background:url(images/quote-button.png) no-repeat center center; line-height:25px; height:25px; color:#ffffff; text-align:center; font-size:12px;}
  #quote input.request_quote_button:hover {opacity:0.9;}
  #quote-title a {display:none; position:absolute; top:0; left:0; bottom:0; right:0;}
  
#footer-logos {border-width:5px 0 5px 0; border-color:#465047; border-style:solid; overflow:hidden; font-size:0; text-align:center;}
  #footer-logos div {background:url(images/footer-logos.png) no-repeat left top; height:38px; width:38px; display:inline-block; margin:3px 10px;}
  div#logo01 {background-position:0 top; width:31px;}
  div#logo02 {background-position:-100px top; width:75px;}
  div#logo03 {background-position:-200px top; width:45px;}
  div#logo04 {background-position:-300px top; width:52px;}
  div#logo05 {background-position:-400px top; width:68px;}
  div#logo06 {background-position:-500px top; width:99px;}
  div#logo07 {background-position:-600px top; width:99px;}
  div#logo08 {background-position:-700px top; width:46px;}
  div#logo09 {background-position:-800px top; width:80px;}
  div#logo10 {background-position:-900px top; width:77px;}
  div#logo11 {background-position:0 bottom; width:55px;}
  div#logo12 {background-position:-100px bottom; width:59px;}
  div#logo13 {background-position:-200px bottom; width:62px;}
  div#logo14 {background-position:-300px bottom; width:30px;}
  div#logo15 {background-position:-400px bottom; width:61px;}
  div#logo16 {background-position:-500px bottom; width:59px;}
  div#logo17 {background-position:-600px bottom; width:73px;}
  div#logo18 {background-position:-700px bottom; width:41px;}
  div#logo19 {background-position:-800px bottom; width:55px;}
  div#logo20 {background-position:-900px bottom; width:42px;}

#footer {position:relative; font-size:11px; color:#ffffff; text-align:center; height:36px; line-height:36px;}

#website {text-decoration:none; color:#ffffff;}
  #website:hover {text-decoration:underline;}
  
.imgtext-table {width:100%; max-width:600px;}
.imgtext-table br {display:none;}
.imgtext-table table {width:100%;}
.imgtext-table a {display:block; width:100%; height:100%;}
.imgtext-table img {display:block; width:100%; height:auto; margin:0 auto;}
.csc-mailform textarea {width:100%; resize: vertical; box-sizing: border-box;}
.csc-mailform input {width:100%; box-sizing: border-box;}
.csc-mailform select {width:100%; box-sizing: border-box;}
.csc-form-label {text-align:left;}
iframe {width:100%;}
  

@media screen and (max-width:1000px) {
 #phone {right:0;}
}
@media screen and (max-width:960px) {
 .nowrap-large {min-width:290px !important;}
 #header {box-shadow:none;}
 #logo {margin:0 0 0 20px;}
 #trusted {background:rgba(56,60,65,0.8);}
}

@media screen and (max-width:800px) {
  #header {padding-top:50px;}
  #quote {position:absolute; top:257px; right:10px; border-top-left-radius:0; border-top-right-radius:0;}
    #quote-title a {display:block;}
    #quote.quote-open {height:auto;}
    #quote.quote-closed {height:36px;}

  #phone {display:none;}
  #phone2 {display:block;}

  
  
  .content-one {margin:0;}

  #nav {position:absolute; top:0; width:100%; height:50px;}
  #nav ul.menu-closed {height:50px; overflow:hidden; padding:0;}
  #nav ul.menu-open {height:auto; padding:0; background:#3f4349;}  
  #nav ul li{display:block; padding:0; border-bottom:1px solid #52565B;}
  #nav ul li a{height:50px; line-height:50px; background:none; color:#ffffff; opacity:1;}
  #nav ul li a:hover{color:#ffffff; background-color:#52565B;}
  #nav ul li:hover ul {display:none;}
  #nav ul li.menu {display:block;}
  #nav ul li.sub ul{display:none;}
  #nav ul li#active.sub ul{display:none;}
  #nav ul li.sub-open ul{display:block;}
  #nav ul li ul {position:relative; top:auto; left:auto; width:auto; border-left:10px solid #3f4349;}
  #nav ul li ul li {padding:0;}
  #nav ul li ul li ul li {padding:0;}
  #nav ul li ul li a{height:50px; line-height:50px; background-color:#33353B; border-radius:0;}
  #nav ul li ul li.sub ul {display:none;}
  #nav ul li#active ul li.sub ul {display:none;}
  #nav ul li ul li.sub-open ul {display:block; padding:0; border-left:10px solid #33353B;}
  .sub-button { display:block;}
}

@media screen and (max-width:600px) {
  .imgtext-table {float:none;}
}
@media screen and (max-width:500px) {
  #car {display:none;}
  #logo {margin:0 auto; float:none;}
  #quote {left:50%; margin-left:-97px;}
  #phone2 {font-size:12px;}
}