/* ----------------------------------------------- */

/* BASIC SETUP */

/* ----------------------------------------------- */



* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;

}



html,

body {

    background: #f7f5f5;

    color: #333;

    font-family: sans-serif;

    font-size: 15px; 

}

    text-rendering: optimizeLegibility;

}



h1 {

	font-size: 200%;

}



h2 {

	font-size: 180%;

}



h3 { 

   font-size: 135%;

}



h4 {

	font-size:  110%;

}



.strong {

    font-weight: 600;

}



.red {

   color: #ff0000; 

}



.clearfix {zoom: 1;}

.clearfix:after {

    content: '.';

    clear: both;

    display: block;

    height: 0;

    visibility: hidden;

}



.row {

    max-width: 1000px;

    margin: 0 auto;

}



div.wrapper {

	width: 855px;

	margin: 0 auto;

	position: relative;

}



h1.head {

    text-align: center;

    color: #0075a1;

    padding-top: 30px;

}



h2.title{

	font-size: 180%;

    padding-top: 30px

}



h3.blurb {

    text-align: center;

    color: #0075a1;

    padding-bottom: 30px;

}



h4.sub_head {

    text-align: center;

    color: #0075a1;

    padding-top: 5px;

}



h4.con {

    text-align: center;

    color: #17a248;

    padding-top: 30px;

}



h4.con_sub {

    text-align: center;

    color: #17a248;

    padding: 30px; 0 0 60px;

}



p.body {

    text-align: center;

    line-height: 20px;

    padding-top: 20px;

}



.form_body {

    text-align: center;

    color: #0075a1;

    padding-top: 20px;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* NAVIGATION */

/* ----------------------------------------------- */



#header {

    height: 170px;

    width: 855px;

    font-size: 15px;

    margin: 0 auto;

    background: #f7f5f5

}



#header .header {

	position: relative;

}



#logo {

    position: absolute;

	top: 23px;

	left: 10px;

	display: block;

	height: 70px;

	border: 0;

}



.logo_footer {

    display: block;

    height: 50px;

    border: 0;

}



#top {

    height: 100px;

    width: 500px;

    float: right;

}



.top_contact {

    padding: 10px 10px 0 0;

    float: right;

}



.icon_wrapper {

    margin-bottom: 20px;

    padding-bottom: 50px;

}



.icon {

    color: #0075a1;

    padding-left: 20px;

}



.email a {

    text-decoration: none;

    color: #333;

}



.email a:hover {

    text-decoration: none;

    color: #0075a1;

}



#nav-a {

	height: 98px;

}



#nav-a ul {

	padding: 20px 0 0 10px;

	margin: 0;

	float: left;

}



#nav-a li {

	margin: 0;

	padding-left: 12px;

	float: left;

	display: block;

}



#nav-a li a {

    display: block;

    color: #333;

    text-align: center;

    padding: 10px 16px;

    text-decoration: none;

}



#nav-a li a:hover {

    color: #0075a1;

}



#nav-a .active {

    color: #0075a1;

}



#banner {

    margin: 0 auto;

    background-color: #f7f5f5;

}



#mainbody {

    background: #f7f5f5;

    margin: 0 auto;

}



@media (min-width:856px) {

    #header {

        width: auto;

    }

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* SHOWCASE */

/* ----------------------------------------------- */

.box_green {

    max-width: 855px;

    height: 110px;

    background-color: #17a248;

}



.box_text_wrap {

    text-align: center;

    padding-top: 10px;

    color: #fff;

}



.box_text {

    width: 460px;

    margin-left: 200px;

    padding-top: 10px;

    text-align: center;

    line-height: 20px;

    color: #fff;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* COLUMNS */

/* ----------------------------------------------- */



.column_left {

    float: left;

    width: 33%;

    padding: 30px 10px;

    background: #f7f5f5;

}



.column_right {

    float: right;

    width: 34%;

    padding: 30px 10px;

    background: #f7f5f5;

}



.column_right_padding {

    padding-right: 28px;

    padding-bottom: 70px;

}



.icon_box {

    background-color: hsla(196, 100%, 32%, 0.1); 

    padding-top: 10px;

    font-size: 100px; 

    text-align: center;

}



.column_left h3 {

    padding: 26px;

    text-align: center;

    text-transform: uppercase;

}



.column_right h3 {

    padding: 26px;

    text-align: center;

    text-transform: uppercase;

}



.learn_button {

    color: #fff;

    text-transform: uppercase;

    text-decoration: none;

    text-align: center;

    background-color: #0075a1;

    padding: 6px;

    margin: 72px;   

}



.learn_button:hover {

    background-color: #97c4d5;

}



.column_wrapper_box {

    width: 855px;

    margin: 0 auto;

    height: 175px;

}



.column_left_box {

    float: left;

    width: 66%;

    margin-top: 30px;

    background-color: #0075a1;

    color: #fff;

    text-align: center;

    line-height: 20px;

    padding: 15px;

}



.column_right_box {

    float: right;

    width: 34%;

    margin-top: 30px;

    background-color: #17a248;

    color: #fff;

    text-align: center;

    text-decoration: none;

    padding: 43.4px;

}



.column_right_box:hover {

    background-color: #78c994;

}



hr.divider {

    width: 855px;

    margin: 0 auto;

    border-top: 1px solid #d9d9d9;

}



.column_left_products {

    float: left;

    width: 500px;

}



.column_right_products {

    float: right;

    width: 300px;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* BODY */

/* ----------------------------------------------- */



#index {

    height: 350px;

}



#about {

    height: 795px;

}



#services {

    height: 450px;

}



#products {

    height: 450px;

}



#quote {

    height: 880px;

}



#pickup {

    height: 1435px;

}



#contact {

    height: 1800px;

}



#thankyou {

    height: 60px;

}



.blurb {

    width: 765px;

    padding-left: 33px;

    padding-top: 30px;

}



.disc {

    padding: 30px 0 10px 130px;

}



ul.a {

    list-style-type: disc;

    line-height: 25px;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* FORMS */

/* ----------------------------------------------- */



label {



}



.form_wrapper_quote h1 {

    padding: 0 0 20px 0;

}



.form_wrapper_quote {

    width: 750px;

    height: 750px;

    background-color: #d9d9d9;

    margin: 40px 10px 0 50px;

    padding: 30px 0 0 30px;

    border-radius: 4px;

}



.form_wrapper_pickup {

    width: 750px;

    height: 1260px;

    background-color: #d9d9d9;

    margin: 40px 0 50px 50px;

    padding: 30px 0 0 30px;

    border-radius: 4px;

}



.form_wrapper_contact {

    width: 750px;

    height: 910px;

    background-color: #d9d9d9;

    margin: 10px 10px 50px 50px;

    padding: 30px 0 0 30px;

    border-radius: 4px;

}



.form_left {

    width: 375px;

    height: 150px;

    float: left;

}



.form_right {

    float: right;

    height: 150px;

    width: 375px;

}



.form_left_yn {

    padding-left: 30px;

}



.form_right_yn {

    padding-left: 30px;

}



input[type=text] {

    width: 94%;

    padding: 12px 20px;

    margin: 3px 20px 20px 0;

    box-sizing: border-box;

    border: 2px solid #ccc;

    border-radius: 4px;

}



input[type=submit] {

    color: #fff;

    border-radius: 4px;

    text-align: center;

    background-color: #0075a1;

    padding: 10px 0 10px 0;

    margin: 0px 45px 0 60px;

    width: 15%;

    float: right;  

}



input[type=submit]:hover {

    background-color: #97c4d5;

}



input[type=checkbox] {

    margin: 5px 0 0 0;

}



textarea {

    width: 94%;

    height: 150px;

    margin: 3px 20px 20px 0;

    padding: 12px 20px;

    box-sizing: border-box;

    border: 2px solid #ccc;

    border-radius: 4px;

    font-size: 15px;

    font-family: sans-serif;

    resize: none;

}



.submit_button {

    color: #fff;

    border-radius: 4px;

    text-align: center;

    background-color: #0075a1;

    padding: 10px 0 10px 0;

    margin: 0px 30px 0 60px;

    width: 15%;

    float: right;  

}



.submit_button:hover {

    background-color: #97c4d5;

}



/* The container */

.container {

    display: block;

    position: relative;

    padding-top: 5px;

    padding-left: 35px;

    margin-bottom: 20px;

    cursor: pointer;

    -webkit-user-select: none;

    -moz-user-select: none;

    -ms-user-select: none;

    user-select: none;

}



/* Hide the browser's default checkbox */

.container input {

    position: absolute;

    opacity: 0;

    cursor: pointer;

    height: 0;

    width: 0;

}



/* Create a custom checkbox */

.checkmark {

    position: absolute;

    top: 0;

    left: 0;

    height: 25px;

    width: 25px;

    background-color: #eee;

}



/* On mouse-over, add a grey background color */

.container:hover input ~ .checkmark {

    background-color: #ccc;

}



/* When the checkbox is checked, add a blue background */

.container input:checked ~ .checkmark {

    background-color: #0075a1;

}



/* Create the checkmark/indicator (hidden when not checked) */

.checkmark:after {

    content: "";

    position: absolute;

    display: none;

}



/* Show the checkmark when checked */

.container input:checked ~ .checkmark:after {

    display: block;

}



/* Style the checkmark/indicator */

.container .checkmark:after {

    left: 9px;

    top: 5px;

    width: 5px;

    height: 10px;

    border: solid white;

    border-width: 0 3px 3px 0;

    -webkit-transform: rotate(45deg);

    -ms-transform: rotate(45deg);

    transform: rotate(45deg);

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* CONTACT */

/* ----------------------------------------------- */



.form_left_con {

    padding-bottom: 30px;

}



.form_right_con {

    padding-bottom: 30px;

}



#con ul {

    text-align: center;

    padding: 10px;

}



#con li {

    display: block;

    line-height: 25px;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* MAP */

/* ----------------------------------------------- */



 #map {

   width: 100%;

   height: 400px;

   background-color: grey;

 }



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* FOOTER */

/* ----------------------------------------------- */



.footer {

    background-color: #f7f5f5;

}



#footer {

    height: 130px;

}



.footer_left {

    float: left;

    margin: 70px 0 0 10px;

}



.footer_right {

    float: right;

    margin: 100px 30px 0 0;

}



.footer_con {

    text-transform: uppercase;

    color: #0075a1;

    font-weight: 700;

}



.oms {

    font-size: 10px;

    text-align: center;

}



/* ----------------------------------------------- */

/* FOOTER MENU */

/* ----------------------------------------------- */



#footer_nav-a {

	height: 75px;

}



#footer_nav-a ul {

	padding: 10px 0 0 10px;

	margin: 0;

	float: left;

}



#footer_nav-a li {

	margin: 0;

	padding-left: 12px;

	float: left;

	display: block;

}



#footer_nav-a li a {

    display: block;

    color: #333;

    text-align: center;

    padding: 10px 20px;

    text-decoration: none;

    font-size: 13px;

}



#footer_nav-a li a:hover {

    color: #0075a1;

}



/* ----------------------------------------------- */







/* ----------------------------------------------- */

/* MEDIA QUERIES */

/* ----------------------------------------------- */



@media (max-width: 812px){

    div.wrapper {

        width: 812px;

    }

    #header {

        width: 812px;

    }

    #nav-a li a {

        font-size: 14px;

    }

    .TB_Wrapper {

        width: 812px;

    }

    .box_green {

        width: 812px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 812px;

    }

    .learn_button {

        margin: 64px;

    }

    .column_right_box {

        margin-top: 30px;

        padding: 53.4px;

    }

    hr.divider {

        width: 812px;

    }

    p.body {

        padding: 20px 20px 0 20px;

    }

    .form_wrapper_quote {

        margin: 40px 0 50px 30px;

    }

    .form_wrapper_pickup {

        margin: 40px 0 50px 30px;

    }    

    .form_wrapper_contact {

        margin: 40px 0 50px 30px;

    }

    #footer_nav-a li a {

        font-size: 12px;

    }

}







@media (max-width: 800px){

    div.wrapper {

        width: 800px;

    }

    #header {

        width: 800px;

    }

    #top {

        width: 780px;

        float: none;

    }

    #nav-a li a {

        font-size: 13px;

    }

    .TB_Wrapper {

        width: 800px;

    }

    .box_green {

        width: 800px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 800px;

    }

    .learn_button {

        margin: 64px;

    }

    .column_right_box {

        margin-top: 30px;

        padding: 53.4px;

    }

    hr.divider {

        width: 800px;

    }

    #footer_nav-a li a {

        font-size: 12px;

    }

}







@media (max-width: 768px){

    div.wrapper {

        width: 768px;

    }

    #header {

        width: 768px;

    }

    #top {

        width: 765px;

        float: none;

    }

    #nav-a li a {

        font-size: 13px;

    }

    .TB_Wrapper {

        width: 768px;

    }

    .box_green {

        width: 768px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 768px;

    }

    .learn_button {

        margin: 64px;

    }

    .column_right_box {

        margin-top: 30px;

        padding-bottom: 30px;

    }

    hr.divider {

        width: 768px;

    }

    .blurb {

        padding-left: 0;

    }

    .disc {

        padding: 30px 0 10px 70px;

    }

    .column_left_products { 

        width: 465px;

    }

    .form_wrapper_quote {

        margin: 40px 0 50px 6px;

    }    

    .form_wrapper_pickup {

        margin: 40px 0 50px 6px;

    }    

    .form_wrapper_contact {

        margin: 40px 0 50px 6px;

    }

    #footer_nav-a li a {

        font-size: 11px;

    }

}







@media (max-width: 740px){

    div.wrapper {

        width: 740px;

    }

    #header {

        width: 740px;

    }

    #top {

        width: 730px;

        float: none;

    }

    #nav-a li a {

        font-size: 12px;

    }

    .TB_Wrapper {

        width: 740px;

    }

    .box_green {

        width: 740px;

    }

    h2 {

        font-size: 160%;

    }

    .box_text {

        margin-left: 135px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 740px;

    }

    .learn_button {

        margin: 53px;

    }

    .column_right_box {

        margin-top: 30px;

        padding-bottom: 30px;

    }

    hr.divider {

        width: 740px;

    }

    .blurb {

        width: 715px;

    }

    .column_left_products {

        width: 430px;

    }

    .form_wrapper_quote {

        width: 730px;

    }    

    .form_wrapper_pickup {

        width: 730px;

    }    

    .form_wrapper_contact {

        width: 730px;

    }

    .form_left {

        width: 350px;

    }

    .form_right {

        width: 350px;

    }

    #footer_nav-a li a {

        font-size: 10px;

    }

}







@media (max-width: 736px){

    div.wrapper {

        width: 736px;

    }

    #header {

        width: 736px;

    }

    #top {

        width: 730px;

        float: none;

    }

    #nav-a li a {

        font-size: 12px;

    }

    .TB_Wrapper {

        width: 736px;

    }

    .box_green {

        width: 736px;

    }

    h2 {

        font-size: 160%;

    }

    .box_text {

        margin-left: 135px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 736px;

    }

    .learn_button {

        margin: 53px;

    }

    .column_right_box {

        margin-top: 30px;

        padding-bottom: 30px;

    }

    hr.divider {

        width: 736px;

    }

    #about {

        height: 820px;

    }

    .form_wrapper_quote {

        margin: 40px 0 50px 3px;

    }    

    .form_wrapper_pickup {

        margin: 40px 0 50px 3px;

    }    

    .form_wrapper_contact {

        margin: 40px 0 50px 3px;

    }

    #footer_nav-a li a {

        font-size: 10px;

    }

}







@media (max-width: 668px){

    div.wrapper {

        width: 668px;

    }

    #header {

        width: 668px;

    }

    #top {

        width: 660px;

        float: none;

    }

    #nav-a li a {

        font-size: 12px;

        padding-left: 3px;

    }

    .TB_Wrapper {

        width: 668px;

    }

    .box_green {

        width: 668px;

    }

    h2 {

        font-size: 150%;

    }

    .box_text {

        margin-left: 115px;

    }

    #index {

        height: 365px;

    }

    .column_wrapper_box {

        width: 668px;

    }

    .learn_button {

        margin: 40px;

    }

    .column_left_box {

        margin-top: 12px;

    }

    .column_right_box {

        margin-top: 12px;

        padding-bottom: 50px;

    }

    hr.divider {

        width: 668px;

    }

    #about {

        height: 880px;

    }

    .blurb {

        width: 625px;

    }

    .column_left_products {

        width: 330px;

    }

    column_right_products {

        width: 300px;

    }

    .disc {

        padding: 30px 0 10px 30px;

    }

    .form_wrapper_quote {

        width: 660px;

    }    

    .form_wrapper_pickup {

        width: 660px;

    }    

    .form_wrapper_contact {

        width: 660px;

    }

    .form_left {

        width: 330px;

    }

    .form_right {

        width: 330px;

    }

    #footer_nav-a li a {

        font-size: 10px;

        padding-left: 3px;

    }

}







@media (max-width: 415px){

    div.wrapper {

        width: 415px;

    }

    #header {

        width: 415px;

    }

    #top {

        width: 412px;

        float: none;

        font-size: 13px;

    }

    #logo {

        top: 35px;

        height: 50px;

    }

    #nav-a ul {

        padding: 0 0 0 0;

    }

    #nav-a li a { 

        font-size: 12px;

        padding-left: 3px;

    }

    .TB_Wrapper {

        width: 415px;

    }

    .box_green {

        width: 415px;

    }

    h2 {

        font-size: 120%;

    }

    .box_text {

        width: 411px;

        margin-left: 1px;

    }

    #index {

        height: 365px;

    }

    .icon_box {

        font-size: 85px;

    }

    h3 {

        font-size: 75%;

    }

    .column_wrapper_box {

        width: 415px;

        height: 256px;

    }

    .learn_button {

        margin: 12px;

        font-size: 10px;

    }

    .column_left_box {

        margin-top: 12px;

    }

    .column_right_box {

        margin-top: 12px;

        padding-bottom: 135px;

    }

    hr.divider {

        display: none;

    }

    #about {

        height: 1165px;

    }

    #products {

        height: 495px;

    }

    #quote {

        height: 740px;

    }

    #pickup {

        height: 1490px;

    }

    #contact {

        height: 2000px;

    }

    .blurb {

        width: 410px;

    }

    .disc {

        padding: 30px 0 10px 35px;

    }

    .column_left_products {

        width: 345px;

    }

    .column_right_products {

        display: none;

    }

    .form_wrapper_quote {

        width: 407px;

        height: 580px;

    }    

    .form_wrapper_pickup {

        width: 407px;

        height: 1280px;

    }    

    .form_wrapper_contact {

        width: 407px;

        height: 885px;

    }

    .form_right {

        float: left;

    }

    textarea {

        width: 90%;

    }

    .form_left_con {

        padding-left: 80px;

    }

    .form_right_con {

        padding-left: 80px;

    }

    h4.con_sub {

        padding: 180px 0 0 0;

    }

    .form_right_yn {

        padding-top: 45px;

    }

    #footer_nav-a li a {

        font-size: 10px;

        padding-left: 3px;

    }

    .logo_footer {

        height: 24px;

    }

}







@media (max-width: 376px){

    div.wrapper {

        width: 376px;

    }

    #header {

        width: 376px;

    }

    #top {

        width: 373px;

        float: none;

        font-size: 12px;

    }

    #logo {

        top: 35px;

        height: 50px;

    }

    #nav-a ul {

        padding: 0 0 0 0;

    }

    #nav-a li a { 

        font-size: 12px;

        padding-left: 3px;

    }

    .TB_Wrapper {

        width: 376px;

    }

    .box_green {

        width: 376px;

    }

    h2 {

        font-size: 110%;

    }

    .box_text {

        width: 376px;

        margin-left: 1px;

        line-height: 16px;

    }

    #index {

        height: 340px;

    }

    .icon_box {

        font-size: 85px;

    }

    h3 {

        font-size: 75%;

    }

    .column_wrapper_box {

        width: 376px;

        height: 275px;

    }

    .learn_button {

        margin: 12px;

        font-size: 10px;

    }

    .column_left_box {

        margin-top: 12px;

    }

    .column_right_box {

        margin-top: 12px;

        padding-bottom: 155px;

    }

    hr.divider {

        width: 376px;

    }

    #about {

        height: 1230px;

    }

    #services {

        height: 480px;

    }

    #contact {

        height: 1940px;

    }

    .blurb {

        width: 366px;

    }

    .disc {

        padding: 30px 0 10px 25px;

    }

    .column_left_products {

        width: 375px;

    }

    .form_wrapper_quote {

        width: 370px;

    }    

    .form_wrapper_pickup {

        width: 370px;

    }    

    .form_wrapper_contact {

        width: 370px;

    }

    .form_left_con {

        padding-left: 40px;

    }

    .form_right_con {

        padding-left: 40px;

    }

    #footer_nav-a li a {

        font-size: 10px;

        padding-left: 3px;

    }

    .logo_footer {

        height: 24px;

    }

    .footer_right {

        float: right;

        margin: 10px 15px 0 0;

    }

}



/* ----------------------------------------------- */





