@charset "UTF-8";

/*

Kleana Bins

*/

html	{
}

body	{
background:#ff6c32;
}



/* */


.button	{
display: inline-block;
color:#fff;
font-family: 'Lato', sans-serif;
font-size: 17px;
font-weight:bold;
text-transform:uppercase;
text-decoration:none;
background-color:#ff6c32;
border:2px solid #d0d1d3;
border-radius:10px;
padding:5px 13px;
margin:0;
-webkit-transition:0.15s;
transition:0.15s;
}

input.button	{
font-weight:normal;
}

.button.white	{
color:#231f20;
background:#fff;
border-color:#231f20;
}

.button.arrow	{
padding-right:26px;
}
.button.arrow::after	{
content:'';
width:0;
height:0;
position:absolute;
border-top:6px solid transparent;
border-bottom:6px solid transparent;
border-left:6px solid #fff;
margin:5px 0 0 7px;
}

.button.arrowLeft	{
padding-left:26px;
}
.button.arrowLeft::before	{
content:'';
width:0;
height:0;
position:absolute;
border-top:6px solid transparent;
border-bottom:6px solid transparent;
border-right:6px solid #fff;
margin:5px 0 0 -13px;
}

.button.white.arrow::after	{
border-left:6px solid #231f20;
}
.button.white.arrowLeft::before	{
border-right:6px solid #231f20;
}		

.button:hover	{
color:#fff;
text-decoration:none;
background-color:#ff4d08;
border-color:#ff4d08;
-webkit-box-shadow:1px 1px 4px 0px rgba(0,0,0,0.6);
box-shadow:1px 1px 4px 0px rgba(0,0,0,0.6);
cursor:pointer;
}

.button.white:hover	{
color:#231f20;
background-color:#ffb87d;
border-color:#fff;
}


.button:active	{
border-color:transparent;
-webkit-box-shadow:
0 0 0 2px #fff,
0 0 10px 3px #1ba6a3;
box-shadow:
0 0 0 2px #fff,
0 0 10px 3px #1ba6a3;
}

.button.white:active	{
background-color:#fff;
}



form  {
margin:0;
padding:0;
}
textarea, select   {
font-family:Arial, Helvetica, sans-serif;
}

.inputText::-webkit-input-placeholder {
color: #000;
font-family:Arial, sans-serif;
font-size:15px;
font-size: 1.5rem;
font-style:italic;
opacity:0.6;
}
.inputText:-moz-placeholder {
color: #000;
font-family:Arial, sans-serif;
font-size:15px;
font-size: 1.5rem;
font-style:italic;
opacity:0.6;
}
.inputText::-moz-placeholder {
color: #000;
font-family:Arial, sans-serif;
font-size:15px;
font-size: 1.5rem;
font-style:italic;
opacity:0.6;
}
.inputText:-ms-input-placeholder {  
color: #000;
font-family:Arial, sans-serif;
font-size:15px;
font-size: 1.5rem;
font-style:italic;
opacity:0.6;
}
.inputText	{
color:#000;
font-family:Arial, sans-serif;
font-size:15px;
font-size: 1.5rem;
background:rgba(255,255,255,0.95);
border:1px solid rgba(72,72,72,0.6);
border-radius:4px;
outline:none;
padding:6px;
margin:0 0 3px 0;
opacity:1;
-webkit-transition:0.1s;
transition:0.1s;
}
.inputText:focus	{
background:rgba(255,255,255,1);
border:1px solid #fff;
-webkit-box-shadow:
0 0 8px 0 #fff600, inset 1px 1px 3px 0 rgba(0,0,0,0.5);
box-shadow: 
0 0 8px 0 #fff600, inset 1px 1px 3px 0 rgba(0,0,0,0.5);
opacity:1;
}



.pageWrap	{
position:relative;
max-width:970px;
margin:0 auto;
}
body.home .pageWrap	{
}
.pageWrap.nonRelative	{
position:inherit;
}


section.content	{
background:#fff;
padding:40px 4%;
}
body.home section.content	{
float:right;
width:400px;
min-height:455px;
background:rgba(255,246,0,1);
padding:195px 42px 115px 42px;
opacity:0.8;
}
section.content img	{
max-width:100%;
}
section.content img[style]	{
max-width:100% !important;
height:auto !important;
}


.heroPic	{
background:#f8f8f8;
}
body.home .heroPic	{
background:#fff url(../images/home_hero.jpg) center top no-repeat;
}
body.home .heroPic .whiteYellow	{
}


nav.social	{
}
nav.social a	{
float:left;
display:block;
width:29px;
height:29px;
background:url(../images/social.png);
background-size:auto 100%;
border-radius:0 0 8px 8px;
margin-left:6px;
}
nav.social a.facebook	{
}
nav.social a.googleplus	{
background-position:-29px 0;
}

nav.social a.youtube	{
background-position:-88px 0;
}
nav.social a:hover	{
-webkit-box-shadow:
1px 1px 3px 0 rgba(0,0,0,0.5);
box-shadow: 
1px 1px 3px 0 rgba(0,0,0,0.5);
}

.navContact a.contact	{
float:left;
display:inline-block;
height:29px;
color:#fff;
font-size:16px;
line-height:27px;
font-weight:bold;
text-transform:uppercase;
text-decoration:none;
background:#ff6c32;
border-radius:0 0 8px 8px;
padding:0 16px;
margin-right:6px;
}
.navContact a.contact:hover	{
-webkit-box-shadow:
1px 1px 3px 0 rgba(0,0,0,0.5);
box-shadow: 
1px 1px 3px 0 rgba(0,0,0,0.5);
}


header	{
position:relative;
background:#fff;
-webkit-box-shadow:
0 1px 30px 0 rgba(0,0,0,0.32);
box-shadow: 
0 1px 30px 0 rgba(0,0,0,0.32);
z-index:300;
}
header > .pageWrap	{
height:203px;
}
header .logo	{
position:absolute;
top:15px;
left:128px;
display:block;
width:100%;
max-width:551px;
z-index:4000;
}

header .navContact	{
position:absolute;
right:0;
z-index:5000;
}
header .navContact nav.social	{
float:right;
}

header .phone	{
position:absolute;
top:73px;
right:0;
color:#dcddde;
font-size:30px;
font-weight:900;
text-decoration:none;
z-index:310;
}
header .phone:hover	{
text-decoration:underline;
}


/* Main nav */

.navWrap	{
position:absolute;
bottom:0;
width:100%;
background:#ff6c32;
}


.navTop	{
position:relative;
z-index:400;
}
.navTop .mobileNav	{
}
.navTop ul	{
list-style:none;
padding:0;
margin:0;
}
.navTop ul li {
float:left;
position:relative;
padding:0;
margin:0;
}

.navTop ul li.current {
}

.navTop ul li:hover {
position:relative;
}

.navTop ul li.current > a {
color:#dcddde;
}

.navTop ul li a {
position:relative;
display:block;
color:#fff;
font-weight:900;
font-size:16px;
text-transform:uppercase;
text-shadow:0 0 20px rgba(0,0,0,0.5);
text-decoration:none;
padding:32px 10px 21px 10px;
margin:0;
}
.navTop ul li:first-child a {
padding-left:0;
}
.navTop ul li:last-child a {
padding-right:0;
}

.navTop ul li:hover a,
.navTop ul li:hover.current > a {
color:#fff;
background:#ff4d08;
z-index:9;
}
.navTop ul li:first-child:hover a {
-webkit-box-shadow:-10px 0 0 0 #ff4d08;
box-shadow:-10px 0 0 0 #ff4d08; 
}
.navTop ul li:last-child:hover a {
-webkit-box-shadow:10px 0 0 0 #ff4d08;
box-shadow:10px 0 0 0 #ff4d08;
}


.navTop ul li ul li,
.navTop ul li:hover ul li {
float:none;
display:block;
height:auto;
width:auto;
text-decoration:none;
border:0;
padding:3px 0 0 0;
margin:0;
}
.navTop ul li ul li:hover {
background:none;
}
.navTop ul li ul li a,
.navTop ul li:hover ul li a {
display:block;
height:auto;
color:#fff;
font-size:15px;
font-weight:bold;
text-decoration:none;
text-transform:uppercase;
text-align:center;
background:#ff6c32;
border-radius:0;
padding:9px 5px 9px 5px;
margin: 0;
-webkit-box-shadow:
0 0 5px 0 rgba(0,0,0,0.3);
box-shadow: 
0 0 5px 0 rgba(0,0,0,0.3);
}
.navTop ul li ul li:last-child a,
.navTop ul li:hover ul li:last-child a {
border-radius:0 0 8px 8px;
}
.navTop ul li ul li:first-child:hover a {
-webkit-box-shadow:none;
box-shadow:none; 
}
.navTop ul li ul li:last-child:hover a {
-webkit-box-shadow:none;
box-shadow:none;
}

.navTop ul li:hover ul li:hover {
}
.navTop ul li ul li.current {
}
.navTop ul li ul li.current a {
}
.navTop ul li ul li a:hover	{
text-decoration:none;
background:#ff4d08;
}

.navTop ul li nav.centre {
background:#ff00ff;
position:absolute;
left:50%;
display:block;
width:0;
height:0;
z-index:98;
}
.navTop ul li div {
display:none;
position:absolute;
left:0;
width:100%;
min-width:120px;
z-index:98;
}

.navTop ul li:hover div,
.navTop ul li:focus div {
display:block;
}

.navTop ul li div ul {
height:auto;
padding:0 0 0 0;
margin:0;
z-index:99;
}

.navTop ul li:hover ul li ul li {
background:none;
background:#CCCCCC no-repeat;
}
.navTop ul li:hover ul li ul li:hover {
background-position:0 -40px;
}

.navTop ul li:hover ul li ul {
display:none;
left:165px;
top:0;
padding-left:2px;
}
.navTop ul li ul li:hover ul {
display:block;
}

/* // Main nav */


.pageGrey	{
background:#f8f8f8;
}



.callouts	{
padding:90px 0 75px 0;
}
.callouts .box	{
float:left;
width:31%;
margin:0 3.5% 34px 0;
}
.callouts .box:nth-child(3n)	{
margin-right:0;
}
.callouts .box:nth-child(4)	{
clear:both;
}
.callouts .item	{
position:relative;
min-height:260px;
text-decoration:none;
text-align:center;
background:#fff;
border-radius:14px;
-webkit-box-shadow:0 0 0 2px #d0d1d3;
box-shadow:0 0 0 2px #d0d1d3;
padding-bottom:65px;
-webkit-transition:0.15s;
transition:0.15s;
}
.callouts .item h1	{
color:#231f20;
font-weight:900;
font-size: 23px;
font-size: 2.3rem;
font-weight:900;
text-transform:uppercase;
text-shadow:0 0 1px #fff;
border-bottom:2px solid #c2c1c1;
padding:28px 0 15px 0; 
margin:0 6.8% 16px 6.8%;
}
.callouts .item h1 a	{
color:#231f20;
font-weight:900;
text-decoration:none;
}
.callouts .item h1 a:hover	{
color:#ff6c32;
}
.callouts .item p	{
font-size:15px;
padding:0 20px;
margin:0 0 10px 0;
}


.callouts .pic	{
display:block;
max-width:347px;
height:325px;
border-radius:14px;
background-position:center;
}
.callouts .pic.bins	{
background-image:url(../images/callout-01.jpg);
}
.callouts .pic.truck	{
background-image:url(../images/callout-02.jpg);
}
.callouts .pic.bigTruck	{
background-image:url(../images/callout-03.jpg);
}


.callouts .buttonMore	{
position:absolute;
display:block;
bottom:0;
width:95%;
color:#fff;
font-family: 'Lato', sans-serif;
font-size: 22px;
font-weight:normal;
text-transform:uppercase;
text-decoration:none;
text-align:center;
background-color:#ff6c32;
border-radius:0 0 14px 14px;
padding:17px 5% 17px 0;
margin:0;
-webkit-transition:0.15s;
transition:0.15s;
}
.callouts .buttonMore::after	{
content:'';
width:0;
height:0;
position:absolute;
border-top:8px solid transparent;
border-bottom:8px solid transparent;
border-left:8px solid #fff;
margin:5px 0 0 7px;
}
.callouts .buttonMore:hover	{
background-color:#ff4d08;
-webkit-box-shadow:
inset 0 0 0 2px #fff,
1px 1px 5px 0px rgba(0,0,0,0.8);
box-shadow:
inset 0 0 0 2px #fff,
1px 1px 5px 0px rgba(0,0,0,0.8);
cursor:pointer;
}



.tableForm	{
background: #ff6c32;
border:1px solid #fff;
border-spacing:0;
-webkit-box-shadow:2px 2px 10px 0 rgba(0,0,0,0.5);
box-shadow:2px 2px 10px 0 rgba(0,0,0,0.5);
}
.tableForm label.error {
display:block;
color:#ff0000;
font-size:16px;
font-weight:normal;
padding:3px 0 0 7px;
}
.tableForm th	{
color:#fff;
font-size:17px;
font-weight:normal;
text-align:left;
vertical-align:top;
background:rgba(0,0,0,0.0);
border-top:1px solid rgba(255,255,255,0.4);
border-bottom:1px solid rgba(0,0,0,0.2);
padding:10px 7px 7px 11px;
}
.tableForm td	{
font-size:14px;
vertical-align:top;
background:#f8f8f8;
border-top:1px solid rgba(255,255,255,0.4);
border-bottom:1px solid rgba(0,0,0,0.2);
padding:10px 15px 7px 11px;
}
.tableForm td.white	{
background:#fff;
}
.tableForm tr:last-child th,
.tableForm tr:last-child td	{
border-bottom:0;
}
.tableForm .inputText	{
width:97%;
}

.textCentre,
.tableForm th.textCentre	{
text-align:center;
}
.textLeft,
.tableForm th.textLeft	{
text-align:left;
}
.textRight,
.tableForm th.textRight	{
text-align:right;
}
.tableForm th img,
.tableForm td img	{
max-width:none;
}




footer	{
padding:25px 0;
}
footer .logo	{
float:left;
width:100%;
max-width:380px;
}
footer .navContact	{
float:right;
margin-top:36px;
}
footer .navContact .social	{
float:left;
}
footer nav.social a	{
background-image:url(../images/social-footer.png);
border-radius:8px;
-webkit-box-shadow:0 0 18px 0 rgba(0,0,0,0.3);
box-shadow:0 0 18px 0 rgba(0,0,0,0.3);
}
footer .navContact a.contact	{
float:left;
color:#ff6c32;
background:#fff;
border-radius:8px;
-webkit-box-shadow:0 0 18px 0 rgba(0,0,0,0.3);
box-shadow:0 0 18px 0 rgba(0,0,0,0.3);
}

footer .navBottom	{
display:table;
margin:20px 0;
}
footer .navBottom .item {
display:table-cell;
padding:0 10px;
}
footer .navBottom .item:first-child {
padding-left:0;
}
footer .navBottom .item:last-child {
padding-right:0;
}
footer .navBottom .item a {
display:block;
color:#fff;
font-weight:900;
font-size:16px;
text-transform:uppercase;
text-shadow:0 0 20px rgba(0,0,0,0.5);
text-decoration:none;
padding:2px 0;
}
footer .navBottom .item > a {
margin-bottom:6px;
}
footer .navBottom .item a:hover	{
text-decoration:underline;
}
footer .navBottom .item a:active	{
color:#231f20;
text-decoration:none;
text-shadow:0 0 20px #fff, 0 0 20px #fff, 0 0 20px #fff;
}
footer .navBottom .item .sub a {
font-weight:normal;
font-style:italic;
}

footer .credits	{
color:#fff;
font-size:13px;
opacity:0.7;
padding-top:15px;
}
footer .credits a	{
color:#fff;
font-weight:normal;
}


.printYes	{
display:none;
}



.displayNone	{
display:none;
}
.floatLeft	{
float:left;
}
.floatRight	{
float:right;
}
.clearBoth	{
clear:both;
}
.clearLeft	{
clear:left;
}
.clearRight	{
clear:right;
}