body  {	background-color:#eeeeee; font-family: 'Lato', sans-serif; font-size:12px;	color:#333333; width:auto; padding:0px; margin:0px; }

h1 {font-weight:normal; font-size:18px; color:#333333; border:1px solid #f63737; text-transform:uppercase; padding:10px; text-align:center; margin-left:auto; margin-right:auto;}
h2 {font-weight:normal; font-size:16px; color:#333333;}
@media (min-width: 750px) {
    h1 {font-weight:normal; font-size:20px; max-width:65%;}
}

img {border:none;}
a {text-decoration:none; color:#333;}
a:hover {text-decoration:underline; color:#333;}

.devnote{background-color:#ffff00; color:#333; padding:5px; font-style:italic; margin:10px 0px 10px 0px; text-align:center;}

.clr {clear:both;}
.img-center{vertical-align:middle;}
.img-right{float:right; margin-left:10px; margin-bottom:10px; }
.gallery-img {border:none}
.gallery-img-zoom {border:10px solid #fff;}
.photo {margin:5px; float:left;border:5px solid #fff; box-shadow: 2px 2px 2px #c1c1c1;}
.tweet {padding-bottom:5px; border-bottom:1px solid #eee; margin-bottom:5px;}

.white {color:#ffffff;}
.white-bg {background-color:#ffffff;}
.dark-grey {color:#4d4d4d;}
.dark-grey-bg {background-color:#4d4d4d;}
.medium-grey {color:#b2b2b2;}
.medium-grey-bg {background-color:#b2b2b2;}
.light-grey {color:#f2f2f2;}
.light-grey-bg {background-color:#f2f2f2;}
.red {color:#f63737;}
.red-bg {background-color:#f63737;}

.align-left{text-align:center;}
.align-center{text-align:center;}
.align-right{text-align:center;}

.float-left{float:left;}
.float-right{float:right;}

.desktop-only{display:none;}
.mobile-only{display:block;}

@media (min-width: 750px) {
	.align-left{text-align:left;}
	.align-center{text-align:center;}
	.align-right{text-align:right;}
	.desktop-only{display:block;}
	.mobile-only{display:none;}
}

.shaddow{box-shadow: 0px 5px 5px #777777;}

.sep{width:100%; height:1px; border-radius:5px; margin:5px 0px 5px 0px;}
.sep-5{width:100%; height:5px; margin:0px;}
.sep-10{width:100%; height:10px; margin:0px;}
.sep-15{width:100%; height:15px; margin:0px;}
.sep-20{width:100%; height:20px; margin:0px;}
.sep-25{width:100%; height:25px; margin:0px;}
.sep-30{width:100%; height:30px; margin:0px;}
.sep-35{width:100%; height:35px; margin:0px;}
.sep-40{width:100%; height:40px; margin:0px;}
.sep-45{width:100%; height:45px; margin:0px;}
.sep-50{width:100%; height:50px; margin:0px;}

#message {background-color:#080; color:#fff; font-weight:bold; padding:10px 5px 10px 5px; text-align:center; margin: 5px 0px 0px 0px;}
#error   {background-color:#c00; color:#fff; font-weight:bold; padding:10px 5px 10px 5px; text-align:center; margin: 5px 0px 0px 0px;}
#warning {background-color:#F90; color:#fff; font-weight:bold; padding:10px 5px 10px 5px; text-align:center; margin: 5px 0px 0px 0px;}

#menu-wrapper-mobile {display:block;}
#header-menu{display:none;}
	
#header-wrapper{position:relative;}
#menu-wrapper{position:relative;}
#slider-box{}

.centered-boxes{width:auto; text-align:center;} 
.centered-box{position:relative; width:250px; margin:5px 5px 5px 5px; text-align:center; display:inline-block; vertical-align:top;}

.shots{width:auto; text-align:center;} 
.shot{position:relative; width:130px; margin:10px; text-align:center; display:inline-block; vertical-align:top;}

.shot img {xborder:5px solid #fff; xbox-shadow: 0px 0px 10px #c1c1c1;}
@media (min-width: 750px) {
    .shot{width:180px;}
}

.full-width{position:relative; width:100%;}
.content-wrapper{position:relative; padding:10px; width:auto;}
.content-wrapper img {width:auto; max-width:100%; height:auto;}

.content-wrapper-nopad{position:relative; padding:0px; width:auto;}
.content-wrapper-nopad img {width:auto; max-width:100%; height:auto;}

.col1-of-6 {}
.col2-of-6 {}
.col3-of-6 {}
.col4-of-6 {}
.col5-of-6 {}
.col6-of-6 {}

.col12-of-6 	{}
.col123-of-6 	{}
.col1234-of-6 	{}
.col12345-of-6	{}

.col56-of-6		{}
.col456-of-6	{}
.col3456-of-6	{}
.col23456-of-6	{}


.col1-of-5 {}
.col2-of-5 {}
.col3-of-5 {}
.col4-of-5 {}
.col5-of-5 {}

.col12-of-5 	{}
.col123-of-5 	{}
.col1234-of-5	{}

.col2345-of-5 	{}
.col345-of-5 	{}
.col45-of-5 	{}

.col1-of-4 {}
.col2-of-4 {}
.col3-of-4 {}
.col4-of-4 {}

.col12-of-4 {}
.col23-of-4 {}
.col34-of-4 {}

.col123-of-4 {}
.col234-of-4 {}

.col1-of-3 {}
.col2-of-3 {}
.col3-of-3 {}

.col12-of-3 {}
.col23-of-3 {}

.col1-of-2 {}
.col2-of-2 {}

@media (min-width: 750px) {
	.full-width{}
	.content-wrapper{position:relative; max-width:1200px; width:auto; margin-left:auto; margin-right:auto; }
	.content-wrapper-nopad{position:relative; max-width:1220px; width:auto; margin-left:auto; margin-right:auto; }
	
	.col1-of-6 	{position:relative; float:left; width:15.11%; }
	.col2-of-6 	{position:relative; float:left; width:15.11%; margin-left:1.61%; }
	.col3-of-6 	{position:relative; float:left; width:15.11%; margin-left:1.62%; }
	.col4-of-6 	{position:relative; float:left; width:15.11%; margin-left:1.62%; }	
	.col5-of-6 	{position:relative; float:left; width:15.11%; margin-left:1.62%; }	
	.col6-of-6 	{position:relative; float:right; width:15.11%; }			

	.col12-of-6 	{position:relative; float:left; width:32.0%; }
	.col123-of-6 	{position:relative; float:left; width:49.0%; }
	.col1234-of-6 	{position:relative; float:left; width:66.0%; }
	.col12345-of-6	{position:relative; float:left; width:82.9%; }
	
	.col56-of-6		{position:relative; float:right; width:32.0%; }
	.col456-of-6	{position:relative; float:right; width:49.0%; }
	.col3456-of-6	{position:relative; float:right; width:66.0%; }
	.col23456-of-6	{position:relative; float:right; width:82.9%; }
	
	.col1-of-5 	{position:relative; float:left; width:18.5%;}
	.col2-of-5 	{position:relative; float:left; width:18.5%; margin-left:1.6%;}
	.col3-of-5 	{position:relative; float:left; width:18.5%; margin-left:1.6%;}
	.col4-of-5 	{position:relative; float:left; width:18.5%; margin-left:1.6%;}	
	.col5-of-5 	{position:relative; float:right; width:18.5%;}		

	.col12-of-5 	{position:relative; float:left; width:38.6%;}
	.col123-of-5 	{position:relative; float:left; width:58.9%;}
	.col1234-of-5 	{position:relative; float:left; width:79.2%;}
	
	.col2345-of-5 	{position:relative; float:right; width:79.5%;}
	.col345-of-5 	{position:relative; float:right; width:59.2%;}
	.col45-of-5 	{position:relative; float:right; width:38.6%;}
	
	.col1-of-4 	{position:relative; float:left; width:23.5%;  }
	.col2-of-4 	{position:relative; float:left; width:23.5%; margin-left:2%;  }
	.col3-of-4 	{position:relative; float:left; width:23.5%; margin-left:2%;  }
	.col4-of-4 	{position:relative; float:right; width:23.5%;  }	

	.col12-of-4 {position:relative; float:left; width:49.0%; }
	.col23-of-4 {position:relative; float:left; width:49.0%; margin-left:1.7%;  }
	.col34-of-4 {position:relative; float:right; width:49.0%;  }
	
	.col123-of-4 {position:relative; float:left; width:74.4%; }
	.col234-of-4 {position:relative; float:right; width:74.4%;  }

	.col1-of-3 	{position:relative; float:left; width:32%; }
	.col2-of-3 	{position:relative; float:left; width:32%; margin-left:1.4%; }
	.col3-of-3 	{position:relative; float:right; width:32%; }

	.col12-of-3 {position:relative; float:left; width:66%; margin-right:1.4%; }
	.col23-of-3 {position:relative; float:right; width:66%; margin-left:1.4%; }
	
	.col1-of-2 	{position:relative; float:left; width:49%; }
	.col2-of-2 	{position:relative; float:right; width:49%; }

	.col-sep		{position:relative; float:left; width:1.4%; border:1px solid #eee}

	#menu-wrapper-mobile {display:none;}
	#header-menu{display:block; position:relative; width:auto; margin:0px; z-index:99999; text-transform:uppercase}
	.menu-sep{display:block; position:relative; background-color:#a41737; height:40px; width:1px; margin-top:0px; font-size:0%; }
	
	ul.topnav {position:relative; right:50%; float:right; clear:left; list-style:none; padding:0px; margin:0px; font-size: 14px; margin-top:3%;}
	ul.topnav li {display:block; float:left; margin:0px; padding:0px; position: relative; left:50%;}
	ul.topnav li a{display:block; float:left;     padding: 5px 15px 5px 15px; margin:0px 0px 0px 0px; color:333333;  text-decoration: none; font-weight:normal; height:18px; text-align:center;}
	ul.topnav li a:hover{background-color:#f63737; color:#ffffff; overflow:hidden;}
	
	ul.topnav li ul.subnav {list-style:none; position:absolute; left:-115px; top:28px; margin:0; padding:0; display:none; z-index:99999;}
	ul.topnav li ul.subnav li{margin:0; padding:0; clear:both;}
	ul.topnav li ul.subnav li a {float:left; width:200px; text-align:left; background-color:#f2f2f2; color:#383738; border-top:1px solid #ffffff;}
	ul.topnav li ul.subnav li a:hover {background-color:#f63737; color:#ffffff; background-image:none;}
}

/* ------------------------------------------------------------------------------------------
	QForm
	------------------------------------------------------------------------------------------ */
.qform-label {margin-bottom:0px; padding:5px 0px 5px 0px;}
.qform-input {border:none; background-color:#f2f2f2; width:100%; }
.qform-input input {border:none; background-color:#f2f2f2; width:100%;}
.qform-input textarea{border:none; background-color:#f2f2f2; width:100%; min-height:250px;}
.button-qform{position:relative; text-align:center; padding:10px 25px 10px 25px; background-color:#be202e; width:135px; font-size:14px; margin:15px auto 10px auto; color:#fff; cursor:pointer;}
.button-qform a{color:#fff; text-decoration:none;}
.qform-input table {width:100%; text-align:left;}
.qform-fld-error{color:#d00!important; font-size:14px;}
.delivery-error{color:#d00!important; margin:0px 0px 0px 0px}
.inline-button-red{color:#ea1d2b; font-weight:bold; display:inline;}
.inline-button-red a {color:#ea1d2b; text-decoration:underline;}
.q-form-help{font-size:12px; color:#999;}
.form-div{padding-right:0px;}
#prod-chk input{border:1px solid #000; cursor:pointer; font-size:12px;}

@media (min-width: 750px) {
	.qform-label {margin-bottom:10px;}
	.qform-input {margin-bottom:10px;}
	.button-qform{float:left;}
	.qform-fld-error{float:left;}
        .form-div{padding-right:25px;}
        #prod-chk input{font-size:14px;}
}

/* ------------------------------------------------------------------------------------------
    Body
------------------------------------------------------------------------------------------ */
.grey-button{background-color:#4d4d4d; padding:10px 15px 10px 15px; display:inline-block; color:#ffffff; text-decoration:none; text-transform:uppercase}

.red-button{background-color:#f63737; padding:10px 15px 10px 15px; display:inline-block; color:#ffffff; text-decoration:none; text-transform:uppercase}

.white-button{background-color:#ffffff; padding:10px 15px 10px 15px; display:inline-block; color:#f63737; text-decoration:none; text-transform:uppercase}

.logo img {max-height:75px;}
.sub-heading{font-size:18px; text-transform:uppercase; padding:5px 0px 5px 0px;}
.content-box{position:relative; background-color:#e5e5e5; padding:15px 15px 15px 15px; border:2px solid #f63737; min-height:150px; line-height:150px; margin-top:5px!important; text-align:center; background-size:cover; background-position:center;}
.content-box a {color:#fff;}
.first-box{border-top-left-radius:10px; background-color:#f63737; color:#fff;}
.box-span {  display: inline-block; vertical-align: middle; line-height:20px }

.content-box-nopad{position:relative; background-color:#e5e5e5; border:2px solid #f63737; min-height:180px; line-height:180px; margin-top:5px!important; text-align:center; background-size:cover; background-position:center;}
.content-box-hover{background-image:url('/img/trans_60.png'); background-repeat:repeat; width:100%; height:100%; color:#fff;}
.content-box-title{font-weight:bold; text-transform:uppercase; font-size:18px;}

.office-scene{background-image:url('/img/office.jpg'); background-size:cover;}

.our-work-col{padding:0px 5px 0px 5px}

#map_canvas{position:relative; width:99%; height:150px; border:2px solid #f63737; margin-top:5px;}
#map_canvas img { max-width: none; }

#map_canvas_wide{position:relative; height:150px;}
#map_canvas_wide img { max-width: none; }


.content-col-box{margin:0px 0px 10px 0px; padding:5px 10px 5px 10px;}
.content-col-box-title{font-size:16px; margin-top:5px; font-weight:bold; text-transform:uppercase}

.width900{max-width:800px}

.top-left-rounded{border-top-left-radius:10px;}

.summary-box{border:1px solid #f63737; padding:25px;}

.services-box{position:relative; min-height:200px; background-size:cover; background-position:center; cursor:pointer;}
.services-box-off-bg{position:absolute; top:0px; left:0px; width:100%; height:100%; text-align: center; color:#fff; background-image: url("/img/trans_80.png")}
.services-box-off{position:absolute; top:0px; left:0px; width:100%; padding:65px 0px 5px 0px; font-size:18px;}

.services-box-on-bg{display:none; position:absolute; top:0px; left:0px; width:100%; height:100%; text-align: center; color:#fff; background-image: url("/img/trans_80_red.png")}
.services-box-on{position:absolute; top:0px; left:0px; padding:25px 10px 5px 10px; font-size:16px;}
.services-box-on-small{font-size:10px;}

.one-col-title{ padding:15px; font-size:16px; }
.one-col-details{ padding:15px; font-size:14px; }

.form-cell{padding:10px; margin-bottom:10px; font-size:22px;}
.form-cell input{border:none; background-color:#f2f2f2; width:100%; font-size:18px;}
.form-cell textarea{border:none; background-color:#f2f2f2; width:100%; min-height:250px;  font-size:18px;}
.form-button{background-color:#f63737; padding:10px 15px 10px 15px;  color:#ffffff; text-decoration:none; text-transform:uppercase; text-align:center; cursor:pointer;}

.header-button-corners{border-radius:5px; font-size:16px;}

.footer-logos{}
.footer-logo{height:50px!important;}

@media (min-width: 750px) {
    .footer-logo{height:90px!important;}
    
    .content-box-hover{display:none;}
    
    .grey-button{margin:0px 0px 0px 0px; float:left;}
    .red-button{float:right; margin-right:10px;}    
    .header-button{margin-right:15px;}
    .logo img {max-height:100px;}

    .our-work-col{padding:0px 10px 0px 10px}
    .sub-heading{padding-left:10px}
    #map_canvas{width:100%; height:180px;}
    #map_canvas_wide{width:100%; height:350px;}
    
    .content-col-box{min-height:150px;}
    .summary-text {padding-top:10px}

    .one-col-title{ width:81%; margin-left:auto; margin-right:auto;}
    .one-col-details{ width:81%; margin-left:auto; margin-right:auto;}
    .form-button{} 
    
    .header-button-corners{font-size:inherit;}
    
    .form-cell{padding:5px;}
    .form-cell input{font-size:14px;}
    .form-cell textarea{font-size:14px;}
}

/* do not group these rules */
*::-webkit-input-placeholder {
    color: #4d4d4d;
}
*:-moz-placeholder {
    /* FF 4-18 */
    color: #4d4d4d;
}
*::-moz-placeholder {
    /* FF 19+ */
    color: #4d4d4d;
}
*:-ms-input-placeholder {
    /* IE 10+ */
    color: #4d4d4d;
}