﻿@charset "utf-8";

/* FONTS
–––––––––––––––––––––––––––––––––––––––––––––––––– */
@font-face {
    font-family: 'firasans-light';
    src: url('../fonts/firasans-light-webfont.eot');
    src: url('../fonts/firasans-light-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/firasans-light-webfont.woff2') format('woff2'), url('../fonts/firasans-light-webfont.woff') format('woff'), url('../fonts/firasans-light-webfont.ttf') format('truetype'), url('../fonts/firasans-light-webfont.svg#firasans-light') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'firasans-regular';
    src: url('../fonts/firasans-regular-webfont.eot');
    src: url('../fonts/firasans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/firasans-regular-webfont.woff') format('woff'), url('../fonts/firasans-regular-webfont.ttf') format('truetype'), url('../fonts/firasans-regular-webfont.svg#firasans-regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'firasans-medium';
    src: url('../fonts/firasans-medium-webfont.eot');
    src: url('../fonts/firasans-medium-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/firasans-medium-webfont.woff2') format('woff2'), url('../fonts/firasans-medium-webfont.woff') format('woff'), url('../fonts/firasans-medium-webfont.ttf') format('truetype'), url('../fonts/firasans-medium-webfont.svg#firasans-medium') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'firasans-bold';
    src: url('../fonts/firasans-bold-webfont.eot');
    src: url('../fonts/firasans-bold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/firasans-bold-webfont.woff') format('woff'), url('../fonts/firasans-bold-webfont.ttf') format('truetype'), url('../fonts/firasans-bold-webfont.svg#firasans-bold') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'firasans-heavy';
    src: url('../fonts/firasans-heavy-webfont.eot');
    src: url('../fonts/firasans-heavy-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/firasans-heavy-webfont.woff') format('woff'), url('../fonts/firasans-heavy-webfont.ttf') format('truetype'), url('../fonts/firasans-heavy-webfont.svg#firasans-heavy') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face { font-family: 'fira_sansextrabold'; src: url('../fonts/firasans-extrabold-webfont.woff2') format('woff2'),url('../fonts/firasans-extrabold-webfont.woff') format('woff');font-weight: normal;font-style: normal; }

/* GLOBAL
–––––––––––––––––––––––––––––––––––––––––––––––––– */
* {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

html, body {
    overflow-x: hidden;
}

body {
    margin: 0;
    padding: 0;
    font-family: 'firasans-light';
    font-weight: normal;
    color: #505050;
    font-size: 19px;
}

.container {
    position: relative;
    max-width: 1077px;
    margin: 0 auto;
    height: 100%;
}

    .container:after {
        content: "";
        display: table;
        clear: both;
    }

a, i.fa {
    color: inherit;
    text-decoration: none;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    outline: 0;
}

    a img {
        border: 0;
        -webkit-transition: all 0.25s ease;
        -moz-transition: all 0.25s ease;
        -o-transition: all 0.25s ease;
        transition: all 0.25s ease;
    }

p {
    margin-top: 0;
    line-height: 26px;
}

/*ul, ol, li {
    margin: 0;
    padding: 0;
    list-style: none;
}*/

img {
    max-width: 100%;
    height: auto;
}

/* TYPEOGRAPHY
–––––––––––––––––––––––––––––––––––––––––––––––––– */

h1, h2, h3, h4, h5 {
    font-weight: normal;
    text-transform: uppercase;
    color: #3b0202;
    margin: 0;
}

h1 {
    font: 49px firasans-bold;
    line-height: 40px;
    background-color: #cccccc;
    padding: 20px;
    text-align: center;
    letter-spacing: -2px;
    margin-top: 60px;
    margin-bottom: 4px;
}

    h1 span {
        color: #fff;
    }

.topH1 { font-family: 'firasans-bold'; font-size: 53px; color: #3b0202; text-transform: uppercase; margin: 0; background: none; letter-spacing: -1px; padding:0; text-align: left; margin-left: -3px; }
.topH1 span { font-family: 'fira_sansextrabold'; font-size: 167px; color: #99cc33; display: block; line-height: 167px; margin-left: -5px; margin-top: -10px; }
.bottomTitle { font-family: 'firasans-bold'; font-size: 48px; color: #3b0202; text-transform: uppercase; margin: 0; margin-top: -22px; background: none; letter-spacing: -1px; padding:0; text-align: left; margin-left: -3px; font-weight: normal; }

h2 {
    font: 39px firasans-bold;
    line-height: 26px;
    letter-spacing: -1.3px;
    margin-bottom: 13px;
}

    h2 span.ship {
        font-size: 49px;
        line-height: 49px;
    }

    h2 span.green {
        font: 49px firasans-heavy;
        line-height: 49px;
        color: #83c334;
    }


b {
    font-family: 'firasans-bold';
    font-weight: normal;
}

strong { font-family: 'firasans-bold'; font-weight: normal; }

/* GENERAL
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.text-shadow {
    text-shadow: 1px 1px 5px #3b0202;
}

.uppercase {
    text-transform: uppercase;
}

.capitalize {
    text-transform: capitalize;
}

.nowrap {
    white-space: nowrap;
}

.block {
    display: block;
}

.relative {
    position: relative;
}

.absolute {
    position: absolute;
}

.center {
    text-align: center;
}

.overflow {
    overflow: hidden;
}

.clear:after {
    content: "";
    display: table;
    clear: both;
}

.left {
    float: left;
}

.right {
    float: right;
}

.hide {
    display: none;
}

.hidden {
    opacity: 0;
}

.visible {
    opacity: 1;
}

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

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

::selection {
    background: #003366;
    text-shadow: none;
    color: #fff;
}

::-moz-selection {
    background: #003366;
    text-shadow: none;
    color: #fff;
}


/* BUTTONS
–––––––––––––––––––––––––––––––––––––––––––––––––– */

.btn {
    font-family: 'firasans-bold';
    font-size: 30px;
    text-align: center;
    background-color: #340303;
    color: #fff;
    text-transform: uppercase;
    display: inline-block;
    -webkit-transition: all 0.25s ease;
    -moz-transition: all 0.25s ease;
    -o-transition: all 0.25s ease;
    transition: all 0.25s ease;
    cursor: pointer;
    padding-left: 10px;
    padding-right: 10px;
    border: 2px #fff solid;
    outline: 0;
	line-height: 53px;
}

    .btn i.fa {
        font-size: 26px;
        position: relative;
        left: 0;
    }

    .btn:hover i.fa {
        left: 4px;
    }

button.disabled {
    color: slategrey;
    background-color: #ecebef;
}

    button.disabled:hover i.fa {
        left: 0;
    }

/* FORM GLOBAL
–––––––––––––––––––––––––––––––––––––––––––––––––– */

select, select option {
    -webkit-appearance: none;
    -o-appearance: none;
    -moz-appearance: none;
    -ms-appearance: none;
    outline: none;
}

    input:focus, select:focus, textarea:focus {
        outline: none !important;
    }

/* HEADER
–––––––––––––––––––––––––––––––––––––––––––––––––– */

header {
    height: 124px;
    background-color: #fff;
    position: relative;
    width: 100%;
    top: 0;
    left: 0;
}

    header a.logo {
        padding-top: 21px;
    }

    header .container {
        padding-right: 91px;
    }

    header .logo-right {
        height: 100%;
        display: inline-block;
        float: right;
        padding-right: 41px;
    }

        header .logo-right img {
            position: relative;
            top: 50%;
            transform: translateY(-50%);
        }

/* CONTENT / INTERIOR
–––––––––––––––––––––––––––––––––––––––––––––––––– */

footer { background: url(../images/bottomShadow.png) top center no-repeat; }

.brownBar {
    background-color: #3b0202;
    padding-top: 10px;
    padding-bottom: 26px;
}

.content {
    padding-bottom: 40px;
}

    .content .left {
        width: 50%;
        position: relative;
        margin-top: 20px;
    }

    .content .right {
        width: 49%;
        position: relative;
    }

    .content p {
        text-align: justify;
    }

    .content .left p {
        padding-right: 41px;
    }

.view-cart {
    background: #83c334 url(../images/form-bg.jpg) repeat-x;
    padding: 26px;
    text-align: center;
}

.bx-wrapper .bx-viewport {
    -moz-box-shadow: none !important;
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    border: 0 !important;
    left: 0 !important;
    background: none !important;
    height: 100% !important;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    width: 13px !important;
    height: 13px !important;
    border-radius: 50% !important;
}

.bx-wrapper .bx-pager.bx-default-pager a {
    background: #fff !important;
}

    .bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active {
        background: #8dc130 !important;
    }

.stack-forms {
    position: absolute;
    top: -153px;
    height:152%;
    left: 6px;
}

#testimonials {
    background: url(../images/quote.png) no-repeat top 61px center;
    padding-top: 0px;
    padding-bottom: 0px;
}

    #testimonials ul {
        margin: 0;
    }

    #testimonials p {
        font: 24px firasans-regular;
        color: #99df00;
        text-align: center;
    }

.brownBar { padding-bottom: 0!important; }
.formTopTitle { 

	background: url(../images/formTopBg.png) top center no-repeat;
    font: 49px/40px firasans-bold;
	margin: 0;
    letter-spacing: -2px;
    margin-bottom: 4px;
    margin-top: 56px;
    padding: 5px 20px 20px 20px;
    text-align: center;
	font-weight: normal;
    text-transform: uppercase;
    color: #3b0202;
	position: relative;
	z-index: 10;
	height: 156px;
    
	
	 }
.formTopTitle span { color: #fff; }

/* CONTACT
–––––––––––––––––––––––––––––––––––––––––––––––––– */

#formWrapper {
    background-color: #ecebef;
    padding: 78px 31px 10px;
	margin-top: -77px;
}

    #formWrapper .item-wrapper {
        margin-bottom: 14px;
    }

        #formWrapper .item-wrapper:last-child {
            margin-bottom: 5px;
        }

        #formWrapper .item-wrapper p {
            font: 18px firasans-medium;
            color: #666666;
            padding-left: 0;
            display: inline-block;
            line-height: 19px;
            vertical-align: middle;
            margin: 0;
        }

            #formWrapper .item-wrapper p span {
                font: 14px firasans-light;
            }

    #formWrapper label {
        font: 17px firasans-medium;
        color: #3b0202;
        width: 130px;
        display: inline-block;
        line-height: 19px;
        vertical-align: middle;
        margin-right: 10px;
    }

        #formWrapper label span {
            font-size: 13px;
        }

            #formWrapper label span.required {
                color: red;
            }

    #formWrapper input, #formWrapper select {
        font: 18px firasans-medium;
        background-color: #fff;
        color: #666666;
        border: 2px #83c334 solid;
        padding-left: 10px;
        padding-top: 0;
        width: 319px;
        height: 39px;
        vertical-align: initial;
    }

        #formWrapper input.nobox, #formWrapper select.nobox {
            background-color: transparent;
            border: none;
        }

        #formWrapper select.required {
            border: 2px red solid;
        }

    #formWrapper .cost {
        font: 18px firasans-medium;
        color: #666666;
        padding-left: 0;
        padding-top: 0;
        width: 334px;
        height: 39px;
        vertical-align: top;
        display: inline;
    }

        #formWrapper .cost span {
            font: 26px firasans-heavy;
            float: right;
            color: #330000;
            position: relative;
            top: -7px;
        }


    #formWrapper select {
        background: #fff url(../images/select-arrow.png) no-repeat right 10px center;
    }

        #formWrapper select option {
            background-color: inherit;
        }

    #formWrapper ::-webkit-input-placeholder {
        opacity: 1 !important;
        color: #666666;
    }

    #formWrapper :-moz-placeholder {
        opacity: 1 !important;
        color: #666666;
    }

    #formWrapper ::-moz-placeholder {
        opacity: 1 !important;
        color: #666666;
    }

    #formWrapper :-ms-input-placeholder {
        opacity: 1 !important;
        color: #666666;
    }

/* FOOTER
–––––––––––––––––––––––––––––––––––––––––––––––––– */

footer {
    background-color: #fff;
    padding-top: 30px;
    padding-bottom: 72px;
    width: 100%;
    text-align: center;
}

    footer a {
        display: inline-block;
        font-size: 0;
        margin-right: 33px;
        margin-bottom: 40px;
    }

        footer a:last-child {
            margin-right: 0;
        }

        footer a img {
            max-width: 100%;
            vertical-align: middle;
        }

    footer p {
        font: 14px firasans-light;
        color: #999999;
    }

.footerLogoHold { width: 428px; float: left; height: 250px; }
.footerGetStartedNow { width: 537px; height: 250px; float: right; padding-top: 79px; }
.footerContentHold { padding-top: 0; text-align:left; }
.footerPara1 { font-family: 'firasans-heavy'; font-size: 22px; color: #81bc00; margin-bottom: 20px; }
.footerPara2 { font-family: 'firasans-light'; font-size: 19px; color: #505050; margin-bottom: 28px; }
.footerPara3 { font-family: 'firasans-bold'; font-weight: bold; font-size: 19px; color: #505050; margin-bottom: 28px; font-weight: normal; }
.footerPara4 { font-family: 'firasans-light'; font-size: 19px; color: #505050; margin-bottom: 28px; }
.footerPara5 { font-family: 'firasans-light'; font-size: 19px; color: #505050; margin-bottom: 18px; }



/* RESPONSIVE
–––––––––––––––––––––––––––––––––––––––––––––––––– */

@media all and (max-width: 1140px) {
    .container {
        padding-left: 10px;
        padding-right: 10px;
    }

    #formWrapper label, #formWrapper input, #formWrapper select {
        width: 100%;
    }
}

@media all and (max-width: 1080px) {
    .content .right, .content .left {
        width: 100%;
    }

    .stack-forms {
        display: none;
    }

    h2 {
        line-height: 42px !important;
    }

    h2 span {
        font-size: 42px !important;
        line-height: 42px !important;
    }
}

@media all and (max-width: 700px) {

    header {
        height: inherit;
    }

        header .container {
            padding-right: inherit;
            text-align: center;
            padding-bottom: 10px;
        }

        header a.logo {
            float: none;
            display: block;
        }

            header a.logo img {
                padding-bottom: 10px;
            }

        header .logo-right {
            float: none;
            padding-right: inherit;
        }

            header .logo-right img {
                top: inherit;
                transform: inherit;
                vertical-align: middle;
            }
}