@charset "utf-8";
 body { color:#3a3333; font-family: 'Titillium Web', sans-serif; margin:0; padding:0;}
img { border:none; display:block; height:auto; width:100%;}
h1 { font-size:30px; font-weight:600; line-height:34px; margin:0 0 20px 0; padding:0;}
h2 {font-size:22px; font-weight:400; line-height:24px; margin:0 0 10px 0; padding:0;}
h3 { }
h4 { font-size:18px; font-weight:600; line-height:22px; margin:0 0 10px 0; padding:0;}
h5 { }
h6 {}
p { font-size:18px; line-height:22px; margin:0 0 16px 0; padding:0;}
a { color:#33c5ca; text-decoration:none; }
a:hover, a:active { color:#fc6143; -webkit-transition:0.3s; transition:0.3s;}
hr {border-top:1px solid #ddeef4; border-bottom:none; border-left:none; border-right:none; clear:both; margin:40px 0; }
.clearfix { clear:both;}
#header { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-01.jpg) 95% 0 no-repeat #000; height:293px; position:relative; }
#banner { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-03.jpg) 85% 0 repeat-x; border-bottom:1px solid #fff; border-top:1px solid #fff; height:441px;}
#content { border-bottom:2px solid #f0c637; border-top:2px solid #f0c637;clear:both; padding:60px 0;}
#footer {border-bottom:6px solid #d2d2d2; }
.contentwidth { ; margin:auto; position:relative; width:1171px}
.row { clear:both; position:relative;} #headerlogo { float:left; min-width:300px; width:28%;}
#headerlogo img {padding:80px 0 0 0; }
#sitesearch { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/search-hex.png) no-repeat; height:51px; padding:4px 0 0 16px; position:absolute; right:0; top:145px; width:332px;}
#sitesearch input[type="text"] { border:none; color:#bdc3c7; font-family:'Titillium Web', sans-serif; font-size:18px; float:left; line-height:38px; padding:0 0 0 5px; width:75%;}
#sitesearch input[type="submit"] { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/mag-glass.png) no-repeat #fff; float:left; border:0; height:32px; margin:2px 0 0 2px; padding:0; width:32px;}
.nav { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-02.jpg) 95% 0 no-repeat #f4c93f; border-top:1px solid #000; position:absolute; bottom:0; width:100%; }
.nav ul { margin:0; padding:0;}
.nav li { display:inline-block; list-style:none; margin:0; padding:0 40px 0 0; }
.nav li:last-child {padding-right:0}
.nav li a { color:#000; display:block; font-size:18px; font-weight:600; line-height:25px; padding:12px 0; position:relative; text-align:center; text-transform:uppercase;}
.nav li a:hover, .nav li a:active { color:#fff;}
.nav li.current_page_item a:after { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/small-hex.png) no-repeat; content:""; bottom:-12px; display:block; height:20px; margin-left:-10px; position:absolute; left:50%; width:22px; } .bannerwrap { padding:30px 0;}
.bannercontent { float:left; width:55% }
.bannercontent h1 { border-bottom:1px dashed #b6d0dc; color:#000; font-size:60px; font-weight:700; line-height:62px; padding:40px 0 16px 0; text-transform:uppercase;}
.bannercontent h2 { color:#000; font-size:34px;}
.bannerimg {float:left; width:45% }
.big-hex-magglass img { max-width:274px; margin:0 0 0 10%; }
.big-hex-lock img { max-width:250px; margin:0 0 0 10%; }
.big-hex-bug img { max-width:400px; margin:50px 0 0 0; }
.bannerwrap .hexbtn { margin:20px 0 0 20px;}
.rsDefaultInv, .rsDefaultInv .rsOverflow, .rsDefaultInv .rsSlide, .rsDefaultInv .rsVideoFrameHolder, .rsDefaultInv .rsThumbs { background:none!important;}
.rsDefaultInv.rsHor .rsArrowRight .rsArrowIcn, .rsDefaultInv.rsHor .rsArrowLeft .rsArrowIcn { display:none!important; }
.rsDefaultInv .rsBullet.rsNavSelected span {background:#f0c637!important;}
.rsDefaultInv .rsBullet { margin:0 5px!important;}
.rsDefaultInv .rsBullet span {background:#fff!important; width:11px!important; height:11px!important;}
.rsDefaultInv .rsBullets { margin-top:-20px!important;}
ul.linklist { margin:0; padding:0 0 0 20px;}
ul.linklist li { list-style-image:url(//www.cautio.co.nz/wp-content/themes/cautio/images/linkarrow.png); color:#919191; font-size:14px; line-height:18px; margin:0 0 10px 0;}
ul.linklist li a { font-size:18px; font-weight:400;}
.stace {padding:30px 0 0 0;}
.stace img { margin:auto; max-width:219px;}
#contactwrap { background:#fefaed; border-bottom:1px solid #f0c637; border-top:1px solid #d6e5e6; font-size:16px; font-weight:700; padding:40px 60px 45px 60px; text-transform:uppercase;}
#contactwrap input[type="text"], #contactwrap input[type="email"],  #contactwrap textarea { border:1px solid #94c8d7; color:#6f6b6b; font-family: 'Titillium Web', sans-serif; font-size:18px; font-weight:400; padding:7px; width:100%;}
#contactwrap textarea { height:120px;}
#contactwrap input[type="submit"] {background:none; border:none; font-size:18px; height:52px; text-align:center; text-transform:uppercase; width:220px }
#contactwrap input[type="submit"]:hover, #contactwrap input[type="submit"]:active { color:#fff; cursor:pointer; -webkit-transition:0.3s; transition:0.3s; }
.hexbtn { background:#f0c637; float:left; margin:19px 0 0 0; position:relative;  }
.hexbtn:hover, .hexbtn:active {background:#b89628; color:#fff; -webkit-transition:0.3s; transition:0.3s;}
a.hexbtn { color:#000; display:block; font-size:18px; font-weight:600; height:52px; line-height:52px; padding:0 20px; text-align:center; text-transform:uppercase; }
.hexbtn:before { content:""; width:0; height:0; border-style:solid; border-width:26px 18px 26px 0; border-color:transparent #f0c637 transparent transparent; position:absolute; left:-18px;}
.hexbtn:after { content:""; width:0; height:0; border-style:solid; border-width:26px 0 26px 18px; border-color:transparent transparent transparent #f0c637; position:absolute; right:-18px; top:0;}
.hexbtn:hover:before { border-color:transparent #b89628 transparent transparent;  -webkit-transition:0.3s; transition:0.3s;}
.hexbtn:hover:after { border-color:transparent transparent transparent #b89628;  -webkit-transition:0.3s; transition:0.3s;}
.feature-btn { background:#f0c637; float:right; margin:-35px 0 20px 20px; position:relative; }
.feature-btn:hover, .feature-btn:active {background:#b89628; color:#fff; -webkit-transition:0.3s; transition:0.3s;}
.feature-btn:before, .feature-btn:after { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-btn-caps.png); content:""; width:56px; height:56px; position:absolute; top:0; z-index:4; }
.feature-btn:before { background-position:0 0; left:-2px; }
.feature-btn:after { background-position:right 0; right:-2px; }
.feature-btn a:link, .feature-btn a:visited { color:#000; display:block; font-size:18px; height:56px; line-height:56px; padding:0 46px; position:relative; text-transform:uppercase; z-index:5;}
.feature-btn:active a:link, .feature-btn:active a:visited, .feature-btn:hover a:link, .feature-btn:hover a:visited { color:#fff;}
.btn-block { margin:0 0 20px 0;}
.btn-block a.hexbtn { margin:0 45px 5px 0; }
.ajax-loader { max-width:20px; position:absolute;}
.qonewrap { float:left; width:47%;}
.qtwowrap { float:left; margin-left:6%; width:47%; }
.qthreewrap { margin:22px 0 0 0; }
h2.downloads-heading { font-size:30px; padding:55px 0 0 130px; position:relative; min-height:100px;}
h2.downloads-heading:before {background:url(http://www.cautio.co.nz/wp-content/uploads/2016/11/download-icon.png); content:"";  height:135px; position:absolute; top:3px; left:0; width:116px; }
ul.downloads { border-top:1px solid #33c5ca; margin:0 0 0 55px; padding:0;}
ul.downloads li { border-bottom:1px solid #33c5ca; list-style:none; line-height:22px; padding:14px 0; position:relative;}
ul.downloads li a { display:block; font-size:22px; font-weight:600; padding:0; }
ul.downloads li a small { display:block; font-size:16px; font-weight:300;}
ul.servicehub { margin:0; padding:0;}
ul.servicehub li { background:#f0c637; float:left; height:230px; list-style:none; margin:0 1% 10px 0; position:relative; text-align:center; width:24%;}
ul.servicehub li:hover { background:#b89628; -webkit-transition:0.3s; transition:0.3s;}
ul.servicehub li:hover a { color:#fff; }
ul.servicehub li a { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/service-icons.png) no-repeat; color:#3a3333; font-size:24px; font-weight:600; display:block; height:80px; line-height:24px; padding:150px 7% 0 7%; text-transform:uppercase; z-index:999; } ul.servicehub li#service01 a { background-position:center -1150px ;}
ul.servicehub li#service02 a { background-position:center -760px ;}
ul.servicehub li#service03 a { background-position:center -370px;}
ul.servicehub li#service04 a { background-position:center 20px;}
ul.servicehub li#service05 a { background-position:center -1540px;}
ul.servicehub li#service06 a { background-position:center -1930px;}
ul.servicehub li#service07 a { background-position:center -2320px;}
ul.servicehub li#service08 a { background-position:center -2710px;}
.clients p { background:#f2f3f6; float:left; margin:0 1% 9px 0; padding:15px 2%; width:15%;}
.sidenav ul { margin:0; padding:0; }
.sidenav ul li { background:#f0c637; list-style:none; margin:0 0 3px 0; position:relative;}
.sidenav ul li:hover { background:#b89628;}
.sidenav ul li:hover a { color:#fff;}
.sidenav ul li a { color:#3a3333; display:block; font-size:18px; line-height:26px; font-weight:600; padding:6px 14px;}
.sidenav ul li.current_page_item  a { color:#fff;}
.sidenav ul li:before { content:""; width:0; height:0; border-style:solid; border-width:19.5px 12px 19.5px 0; border-color:transparent #f0c637 transparent transparent; position:absolute; left:-12px;}
.sidenav ul li:after { content:""; width:0; height:0; border-style:solid; border-width:19.5px 0 19.5px 12px; border-color:transparent transparent transparent #f0c637; position:absolute; right:-12px; top:0;}
.sidenav ul li:hover:before { border-color:transparent #b89628 transparent transparent; }
.sidenav ul li:hover:after { border-color:transparent transparent transparent #b89628; }
.sidenav h4 a {color:#3a3333; }
ul.children { display:none;} .maincol { float:left; width:60%}
.secondarycol { float:left; margin-left:5%; width:35%}
.sidenav { position:absolute; width:260px;}
.sidenavcontent {  margin-left:300px; position:inherit; } #quickcontacts { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-04.jpg) repeat-x center; height:237px; margin:1px 0; padding:65px 0 0 0; text-align:center;}
#contact-phone-icon, #contact-email-icon, #contact-phone, #contact-email { display:table-cell; vertical-align: middle;}
#contact-phone-icon, #contact-email-icon { background:url(//www.cautio.co.nz/wp-content/themes/cautio/images/contact-icons.png) no-repeat; height:146px; width:130px;}
#contact-email-icon { background-position:-140px 0;}
#contact-phone, #contact-email { color:#3a3333; font-size:18px; font-weight:700; line-height:20px; width:38%;}
#contact-phone span, #contact-email span { font-size:30px; font-weight:400; line-height:30px; margin-top:-40px;}
#contact-phone { padding-right:1%; text-align:right;}
#contact-email { padding-left:1%; text-align:left;}
#quickcontacts a { color:#fc6143;}
#quickcontacts a:hover { color:#33c5ca;}
#footerbranding { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-01.jpg) 95% 0 no-repeat #000; height:245px; border-bottom:1px solid #fff; border-top:4px solid #f0c637; padding:0; }
#footerlogo { float:left; max-width:230px; padding:80px 0 0 0;}
#footercontent { color:#a4a4a4; float:left; font-size:14px; margin:75px 0 0 130px; line-height:18px; text-align:center; text-shadow:1px 1px 1px #000; width:370px; }
#footercontent p { font-size:18px; font-weight:600; color:#fff; line-height:24px; margin:0 0 10px 0; padding:0 }
#footercontent a { color:#a4a4a4; font-size:12px; }
#mobilemenu { display:none;}
@media only screen and (max-width: 1200px) {
.contentwidth { margin:auto; padding:0 5%; width:90%;}
.bannercontent h1 { font-size:50px; line-height:52px; padding:30px 0 16px 0;}
.bannercontent h2 { font-size:30px; line-height:32px;}
#contact-phone-icon, #contact-email-icon, #contact-phone, #contact-email { display:block; float:left; padding:0; position:absolute; }
#contact-phone-icon { left:50px; top:-40px;}
#contact-email-icon { left:115px; top:75px}
#contact-phone { left:190px; text-align:left; top:10px; width:300px }
#contact-email { left:255px; top:120px; width:300px}
}
@media only screen and (max-width: 990px) {
h2.downloads-heading { font-size:26px; min-height:55px; padding:25px 0 0 70px; }
h2.downloads-heading:before { background-size: cover; height:70px; width:58px; }
ul.downloads {margin:0 0 0 30px;}
#footerlogo, ul.downloads li a:before { display:none;}
#footercontent { margin:75px 0 0 30px; text-align:left; width:50%; }
.feature-btn { display:inline-block; float:none; margin:0 0 20px 0px; }
}
@media only screen and (max-width: 760px) {
#header { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-01.jpg) 200px 0 no-repeat #000; height:240px; }
#headerlogo { float:none; width:45%;}
#headerlogo img {padding:30px 0 0 0; }
#banner { display:none;}
#sitesearch { left:3%; top:163px; }
.nav {display:none; background:#f0c637; float:left; margin:0; padding:10px 0 10px 5%; width:95%; }
#mobilemenu { color:#3a3333; font-size:20px; font-weight:600; display:inline-block; width:100px;}
.nav .menu { display:none; }
.nav .menu li { background:#f0c637; border-bottom:1px solid #b89628; display:block; padding:0;}
.nav li a {font-size:16px; padding:8px 22px; text-align:left;}
.nav:hover .menu, .nav:active .menu {display:block; margin:9px 0 0 0; position:absolute; width:85%; z-index:1;}
.nav li.current_page_item a:after  { display:none;}
.nav li.current_page_item { background:#b89628; }
.nav li.current_page_item a {color:#fff;}
#menuicon { float:left; margin:9px 6px 0 0; width:16px;}
.menubar { background:#3a3333; height:3px; margin:0 0 2px 0;}
.qonewrap, .qtwowrap  { float:none; margin:0 0 10px 0; width:100%;}
#footerbranding { background: url(//www.cautio.co.nz/wp-content/themes/cautio/images/hex-01.jpg) 0 0 no-repeat #000; }
#footercontent { margin:55px 0 0 20px; text-align:left; width:90%; }
#quickcontacts { height:150px; }	
#contact-phone-icon { left:40px; top:-40px; background-size:215%; height:85px; width:80px;}
#contact-email-icon { left:80px; top:35px; background-size:215%; background-position:80% 0; height:85px; width:80px;}
#contact-phone { left:120px; text-align:left; top:-20px; width:200px }
#contact-email { left:165px; top:55px; width:200px}
#contact-phone span, #contact-email span { font-size:24px; line-height:24px;}
.sidenav { position:inherit; width:100%;}
.sidenavcontent { clear:both; margin:0; padding:30px 0 0 0; position:inherit; }
.sidenav ul li { background:none; float:left; margin:0 15px 0 0; }
.sidenav ul li:hover { background:none;}
.sidenav ul li:hover a { color:#fc6143;}
.sidenav ul li a { color:#33c5ca; display:block; font-size:14px; font-weight:400; padding:0;}
.sidenav ul li:before { display:none;}
.sidenav ul li:after { display:none;}
.sidenav ul li:hover:before { display:none;}
.sidenav ul li:hover:after { display:none; }
ul.servicehub li { margin:0 1% 10px 0; width:48%;}
.clients p {  margin:0 1% 5px 0; padding:0; width:32.3%;}
#responsive-menu #responsive-menu-title, #responsive-menu #responsive-menu-title a { display:none!important;}
}
@media only screen and (max-width: 600px) {
#headerlogo {width:44%;}
.maincol, .secondarycol { float:none; width:100%}
.secondarycol { margin-left:0;}
#contactwrap { padding:40px 40px 45px 40px; }
#footerbranding { background:#000; height:auto; padding-bottom:40px }
#contact-phone-icon { left:20px; top:-40px; background-size:215%; height:85px; width:80px;}
#contact-email-icon { left:14px; top:45px; background-size:215%; background-position:80% 0; height:85px; width:80px;}
#contact-phone { left:100px; text-align:left; top:-20px; width:auto }
#contact-email { left:100px; top:70px; width:auto}
#contact-phone span, #contact-email span { font-size:18px; line-height:18px;}
}
@media only screen and (max-width: 400px) {
#header { height:260px;}
#headerlogo { min-width:200px; width:80%;}
#sitesearch { background-size:100%; height:30px; padding:2px 0 0 10px; top:150px; width:230px;}
#sitesearch input[type="text"] { font-size:14px; line-height:28px; padding:0 0 0 5px; width:80%;}
#sitesearch input[type="submit"] { background-size:100%; height:24px; margin:2px 0 0 2px; padding:0; width:24px;}
.clients p {  margin:0 1% 5px 0; padding:0; width:48%;}
ul.servicehub li { margin:0 0 10px 0; width:100%;}
.feature-btn a:link, .feature-btn a:visited { font-size:16px;}
}