@import url(https://fonts.googleapis.com/css?family=Lora:400,700);
@import url(https://fonts.googleapis.com/css?family=Josefin+Sans:400,600,700);
@import 'lib/fontawesome/scss/font-awesome.scss';
@import url('searles-fonts.css');


$header-bg-color: #e0ce9c;

/****** Brand Colors*******/
$brand-primary: #587a48;
$brand-secondary: #7ca06b;
$brand-tertiary: #60bd72;
$brand-success: #5cb85c;
$brand-warning: #f0ad4e;
$brand-danger: #d9534f;
$brand-info: #5bc0de;

/****** Scaffolding********/
$body-bg: #000;
$link-color: #091e33;
$link-hover-color: darken($link-color, 15%);
$padding-base-vertical: 6px;
$padding-base-horizontal: 12px;
$padding-large-vertical: 10px;
$padding-large-horizontal: 16px;
$padding-small-vertical: 5px;
$padding-small-horizontal: 10px;
$border-radius-base: 0px;
$border-radius-large: 0px;
$border-radius-small: 3px;
$line-height-large: 1.33;
$line-height-small: 1.5;
$component-active-bg: $brand-primary;

/****** Typography********/

$font-size-base: 17px;
$icon-font-path: "fonts/";
$font-family: 'Lora', serif;
$font-family: 'Josefin Sans', sans-serif;
$font-family-serif: 'Lora', serif;
$font-family-sans-serif: 'Lora', serif;
$headings-font-family: $font-family-serif;

/***** Buttons********/
$btn-font-weight: normal;
$btn-default-color: $brand-primary;
$btn-default-bg: #fff;
$btn-default-border: #ccc;
$btn-primary-color: #fff;
$btn-primary-bg: $brand-primary;
$btn-primary-border: darken($btn-primary-bg, 5%);
$btn-success-color: #fff;
$btn-success-bg: $brand-success;
$btn-success-border: darken($btn-success-bg, 5%);
$btn-warning-color: #fff;
$btn-warning-bg: $brand-warning;
$btn-warning-border: darken($btn-warning-bg, 5%);
$btn-danger-color: #fff;
$btn-danger-bg: $brand-danger;
$btn-danger-border: darken($btn-danger-bg, 5%);
$btn-info-color: #fff;
$btn-info-bg: $brand-info;
$btn-info-border: darken($btn-info-bg, 5%);

/******** Dropdowns ********/
$dropdown-bg: #fff;
$dropdown-border: rgba(0,0,0,.15);
$dropdown-divider-bg: #e5e5e5;
$dropdown-link-active-color: #fff;
$dropdown-link-active-bg: $component-active-bg;
$dropdown-link-color: #091e33;
$dropdown-link-hover-color: $brand-primary;
$dropdown-link-hover-bg: #eaffde;
$dropdown-link-disabled-color: #091e33;
$dropdown-header-color: #091e33;
$dropdown-caret-color: #000;

/********** Navbar  **********/
$navbar-height: 50px;
$navbar-inverse-bg: #fff;
$navbar-border-radius: $border-radius-base;
$navbar-inverse-link-color: #565656;
$navbar-inverse-link-hover-color: #ccc;
$navbar-inverse-link-active-color: none;
$navbar-inverse-link-disabled-color: none;
$navbar-inverse-link-disabled-bg: transparent;
$navbar-inverse-brand-hover-bg: transparent;
$navbar-inverse-toggle-bg: none;
$navbar-inverse-toggle-hover-bg: none;
$navbar-inverse-toggle-icon-bar-bg: #fff;
$navbar-inverse-toggle-border-color: #ffffff;
$navbar-border-radius: $border-radius-base;

//== Iconography
//
//## Specify custom location and filename of the included Glyphicons icon font. Useful for those including Bootstrap via Bower.

//** Load fonts from this directory.

// [converter] If $bootstrap-sass-asset-helper if used, provide path relative to the assets load path.
// [converter] This is because some asset helpers, such as Sprockets, do not work with file-relative paths.

//** File name for all font files.
$icon-font-name: "glyphicons-halflings-regular" !default;
//** Element ID within SVG icon file.
$icon-font-svg-id: "glyphicons_halflingsregular" !default;

html, body {
    height: 100%;
}






@import 'lib/bootstrap-sass/assets/stylesheets/bootstrap';



.space-top {
    margin-top: 25px;
}



.space-bottom {
    margin-bottom: 25px;
}

body{
   font-family: 'Josefin Sans', sans-serif;
}

.space {
    margin-top: 25px;
    margin-bottom: 25px;
}


.space-small {
    margin-top: 15px;
    margin-bottom: 15px;
}

.space-large {
    margin-top: 50px;
    margin-bottom: 50px;
}

p {
    font-family: 'Josefin Sans', sans-serif;

    ul{
        font-family:'Josefin Sans', sans-serif;
    }
}


.img-responsive {
    width: 100%;
}

.btn {
    text-transform: uppercase;
    border-radius: 0;
}


.body-content {
    margin-top: 58px;
    background: #fff;

    @media (min-width: $screen-sm-min) {
        margin-top: 75px;
    }

    h1 {
        font-size: 28px;
        color: $brand-primary;
        font-weight: 800;
    }

    h2 {
        font-weight: 800;
        font-size: 24px;
        color: $brand-secondary;
    }

    h3 {
        font-weight: 800;
        font-size: 24px;
    }
 
}


.navbar-brand {
    max-width: 75px;
    height: auto;
    padding: 3px 14px;

    @media(min-width:$screen-sm-min) {
        padding: 0;
    }


    img {
        @extend .img-responsive;
        max-height: 65px;
        width: auto;
    }
}


.dropdown-menu {

    li {
        a {
            padding: 4px 20px;

            @media(min-width:$screen-sm-min) {
                padding: 9px 20px;
            }
        }
    }
}



#top-bar {
    background-color: $brand-secondary;
    height: 19px;

    .contact {
        margin-top: 7px;

        a {
            color: #fff;
            text-decoration: none;
            font-size: 12px;
        }
    }

    .fa {
        margin-left: 8px;
        color: #fff;
    }

    .social {

        a {
            color: #fff;
            text-decoration: none;
            font-size: 16px;
        }
    }

    p {
        color: #fff;
        font-size: 14px;
    }
}

.navbar-inverse .navbar-nav > li > a:hover {
    color: #000;
    background-color: none;
}


.navbar-nav{
    margin-top:10px;
}

.navbar-inverse {

    li {
        a {
            padding-left: 8px;
            padding-right: 7px;
            text-transform: uppercase;
            font-weight: 700;

            @media (min-width: $screen-sm-min) {
                padding-left: 9px;
                padding-right: 9px;
                font-size: 9px;
                margin-top: -6px;
            }

            @media (min-width: $screen-md-min) {
                padding-left: 16px;
                padding-right: 16px;
                font-size: 13px;
            }

            @media (min-width: $screen-lg-min) {
                padding-left: 18px;
                padding-right: 18px;
                font-size: 15px;
            }
        }
    }
}

.home-top {
    width: 100%;
    height: auto;
    text-align: center;
    color: #fff;
    background: no-repeat center;
    background-image: url(/Images/home-top.jpg);
    background-color: $brand-primary;
    background-size: cover;
    min-height: 400px;
    padding: 15px 0 30px 0;


    @media(min-width: $screen-sm-min) {
        max-height: 450px;
        padding: 0 0 30px 0;
    }

    @media(min-width: $screen-md-min) {
        min-height: 500px;
        max-height: 550px;
        padding: 0 0 30px 0;
    }

    @media(min-width: $screen-lg-min) {
        min-height: 600px;
        max-height: 700px;
        padding: 0 0 30px 0;
    }



    .callout {


        .btn {

            @media(min-width:$screen-sm-min) {
                margin-left: 15px;
            }
        }

        .space-bottom {
            margin-bottom: 15px;
        }

        h1 {
            font-size: 21px;
            font-weight: 200;
            margin-top: 100px;
            padding: 15px;
            color: #fff;
            text-shadow: 3px 3px 3px #000;

            span {
                font-weight: 900;
            }

            @media(min-width:$screen-sm-min) {
                width: auto;
                margin-top: 100px;
                font-size: 32px;
            }

            @media(min-width:$screen-md-min) {
                width: auto;
                margin-top: 140px;
                font-size: 42px;
            }
        }
    }
}



.threes {
    .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .green-one {
        background-color: $brand-primary;
    }

    .green-two {
        background-color: $brand-secondary;
    }

    .green-three {
        background-color: $brand-tertiary;
    }

    .icon {
        font-size: 140px;
        color: #fff;
        margin-bottom: -60px;
    }



    h2 {
        font-size: 24px;
        font-weight: 300;
        color: #fff;

        @media(min-width:$screen-sm-min) {
            font-size: 28px;
        }

        @media(min-width:$screen-md-min) {
            font-size: 34px;
        }




        span {
            font-weight: 900;
        }

        &.blue-text {
            color: $brand-primary;
        }
    }

    .text {
        /*padding: 20px;*/
    }
}



.btn-white-outline {
    color: #fff;
    background-color: none;
    border-color: #fff;
}

.btn-white-outline:hover,
.btn-white-outline:focus,
.btn-white-outline:active,
.btn-white-outline.active,
.open .dropdown-toggle.btn-white-outline {
    color: #fff;
    background-color: $brand-secondary;
    border-color: #fff;
}

.btn-white-outline:active,
.btn-white-outline.active,
.open .dropdown-toggle.btn-white-outline {
    background-image: none;
}

.btn-white-outline.disabled,
.btn-white-outline[disabled],
fieldset[disabled] .btn-white-outline,
.btn-white-outline.disabled:hover,
.btn-white-outline[disabled]:hover,
fieldset[disabled] .btn-white-outline:hover,
.btn-white-outline.disabled:focus,
.btn-white-outline[disabled]:focus,
fieldset[disabled] .btn-white-outline:focus,
.btn-white-outline.disabled:active,
.btn-white-outline[disabled]:active,
fieldset[disabled] .btn-white-outline:active,
.btn-white-outline.disabled.active,
.btn-white-outline[disabled].active,
fieldset[disabled] .btn-white-outline.active {
    background-color: none;
    border-color: #fff;
}

.btn-white-outline .badge {
    color: none;
    background-color: #fff;
}


.btn-orange-outline {
    color: $brand-secondary;
    background-color: none;
    border-color: $brand-secondary;
}

.btn-orange-outline:hover,
.btn-orange-outline:focus,
.btn-orange-outline:active,
.btn-orange-outline.active,
.open .dropdown-toggle.btn-orange-outline {
    color: $brand-secondary;
    background-color: none;
    border-color: $brand-secondary;
}

.btn-orange-outline:active,
.btn-orange-outline.active,
.open .dropdown-toggle.btn-orange-outline {
    background-image: none;
}

.btn-orange-outline.disabled,
.btn-orange-outline[disabled],
fieldset[disabled] .btn-orange-outline,
.btn-orange-outline.disabled:hover,
.btn-orange-outline[disabled]:hover,
fieldset[disabled] .btn-orange-outline:hover,
.btn-orange-outline.disabled:focus,
.btn-orange-outline[disabled]:focus,
fieldset[disabled] .btn-orange-outline:focus,
.btn-orange-outline.disabled:active,
.btn-orange-outline[disabled]:active,
fieldset[disabled] .btn-orange-outline:active,
.btn-orange-outline.disabled.active,
.btn-orange-outline[disabled].active,
fieldset[disabled] .btn-orange-outline.active {
    background-color: none;
    border-color: $brand-secondary;
}

.btn-orange-outline .badge {
    color: $brand-secondary;
    background-color: none;
}



.btn-orange {
    color: #fff;
    background-color: $brand-secondary;
    border-color: $brand-secondary;
}

.btn-orange:hover,
.btn-orange:focus,
.btn-orange:active,
.btn-orange.active,
.open .dropdown-toggle.btn-orange {
    color: #fff;
    background-color: $brand-secondary;
    border-color: $brand-secondary;
}

.btn-orange:active,
.btn-orange.active,
.open .dropdown-toggle.btn-orange {
    background-image: none;
}

.btn-orange.disabled,
.btn-orange[disabled],
fieldset[disabled] .btn-orange,
.btn-orange.disabled:hover,
.btn-orange[disabled]:hover,
fieldset[disabled] .btn-orange:hover,
.btn-orange.disabled:focus,
.btn-orange[disabled]:focus,
fieldset[disabled] .btn-orange:focus,
.btn-orange.disabled:active,
.btn-orange[disabled]:active,
fieldset[disabled] .btn-orange:active,
.btn-orange.disabled.active,
.btn-orange[disabled].active,
fieldset[disabled] .btn-orange.active {
    background-color: $brand-secondary;
    border-color: $brand-secondary;
}

.btn-orange .badge {
    color: #fff;
    background-color: $brand-secondary;
}













footer {
    background-color: $brand-primary;
    padding: 20px 0 30px 0;
    font-size: 11pt;



    p {
        color: #efeeee;
        font-size: 13px;
    }

    .logo {
        max-width: 200px;
        height: auto;
    }

    a {
        color: #efeeee;
        text-decoration: none;
        font-size: 13px;
        text-transform: capitalize;

        &:visited {
            color: #efeeee;
            text-decoration: none;
        }

        &:hover {
            color: #efeeee;
            text-decoration: none;
        }
    }

    .contact.html {
        p {
            color: #efeeee;
            font-size: 13px;
        }

        a {
            color: #efeeee;
            text-decoration: none;
            font-size: 13px;
            text-transform: capitalize;

            &:visited {
                color: #efeeee;
                text-decoration: none;
            }

            &:hover {
                color: #efeeee;
                text-decoration: none;
            }
        }
    }



    .purple-bolded-line {
        background-color: $brand-primary;
        display: block;
        height: 3px;
        margin-bottom: -1px;
        margin-top: 0px;
        width: 40px;
    }

    .social-icons {
        margin-top: 7px;
    }

    img {
        text-align: center;
    }

    h3 {
        text-transform: uppercase;
        font-weight: 900;
        color: #343434;
        font-size: 17px;
    }

    .links {
        a {
            color: #efeeee;
            text-decoration: none;
            font-size: 13px;
            text-transform: capitalize;

            &:visited {
                color: #efeeee;
                text-decoration: none;
            }

            &:hover {
                color: #efeeee;
                text-decoration: none;
            }
        }
    }



    .fa {
        color: #efeeee;
        font-size: 25px;
        padding: 2px;
    }

    .lined {
        border-bottom: solid 3px #efeeee;
        margin-bottom: 10px;

        h2 {
            color: #efeeee;
            font-weight: 800;
            text-transform: uppercase;
            font-size: 16px;
        }

        &.bolded-line {
            background-color: $brand-primary;
        }
    }



    ul {
        list-style-type: none;
        margin: 0;
        padding: 0;
        font-family: $font-family-serif;

        li {
            margin: 0;
            padding: 0;
        }
    }
}




.text-background {
	background-repeat: no-repeat;
	background-position: center center fixed;
	background-image: url(../Images/bg-text.jpg);
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding-bottom: 50px;
	margin-bottom: 0;
	width: 100%;
	min-height: 300px;



    h1 {
        color: #fff;
        font-size: 36px;
        font-weight: 800;
        text-shadow: 1px 2px 2px #000;
        margin-top: 90px;
        font-family: $font-family-sans-serif;
    }

    span {
        font-size: 46px;
    }
}



.feature-area {

    .link {
        color: $brand-secondary;
        text-transform: uppercase;
        font-weight: 700;
    }

    .main-text {
        border: solid #efefef 4px;
        padding: 10px;
    }


    .line {
        border-bottom: dotted rgba(0,0,0,.15) 2px;
    }

    h2 {
        color: #000;
        font-size: 28px;

        @media(min-width:$screen-sm-min) {
            font-size: 14px;
        }

        @media(min-width:$screen-md-min) {
            font-size: 28px;
        }


        span {
            color: $brand-secondary;
        }
    }


    h3 {
        color: #000;
        font-size: 21px;
        margin-top: 8px;

        @media(min-width:$screen-sm-min) {
            font-size: 12px;
        }

        @media(min-width:$screen-md-min) {
            font-size: 14px;
        }

        @media(min-width:$screen-lg-min) {
            font-size: 18px;
        }
    }
}


.header {
    padding-bottom: 52px;
    padding-top: 67px;

    &.history {
        background: url("/images/test-2.jpg") no-repeat scroll center center / cover;
    }




    h2 {
        color: #fff;
        font-size: 28px;

        @media(min-width:$screen-sm-min) {
            font-size: 36px;
        }
    }
}


.inner-page{

    .feature{
        background-color:#f8f8f8;



    h1{
        color:$brand-primary;
        text-transform:uppercase;
        font-size:20px;
        text-align:center;
        margin-top:-10px;

        @media(min-width:$screen-sm-min){
            margin-top:30px;
            text-align:left;
            font-size:26px;
        }
          @media(min-width:$screen-md-min){
            margin-top:40px;
            font-size:30px;
        }
          
    }



    h2{
        color: #565656;
        font-size: 28px;
        font-weight:700;
        font-size:17px;
        text-align:center;

        @media(min-width:$screen-sm-min){
            text-align:left;
            font-size:22px;
        }
          @media(min-width:$screen-md-min){
            font-size:24px;
        }
             @media(min-width:$screen-lg-min){
            font-size:28px;
        }
    }
    }
}




.callout-contact {
    background-color: $brand-primary;
    margin-bottom: 0;
    width: 100%;


    h2 {
        font-size: 20px;
        font-weight: 900;
        color: #fff;
        text-align: center;
        padding:15px;


        @media(min-width:$screen-sm-min) {
            font-size: 16px;
        }

        @media(min-width:$screen-md-min) {
            font-size: 22px;
        }
    }

    .btn {
        @media(min-width:$screen-sm-min) {
            margin-top: 20px;
        }
    }
}

/************************** map *********************/
.overlay {
    background: transparent;
    z-index: 999999;
    position: relative;
    width: 100%;
    height: 290px; /* your iframe height */
    top: 290px; /* your iframe height */
    margin-top: -290px; /* your iframe height */
}




.g-recaptcha {
    -moz-transform: scale(0.77);
    -ms-transform: scale(0.77);
    -o-transform: scale(0.77);
    -webkit-transform: scale(0.77);
    transform: scale(0.77);
    -moz-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    margin-top: 25px;
}



.services {


    h3{
        text-align:center;
        color:$brand-primary;
        text-transform:uppercase;
        font-weight:700;
        font-size: 24px;

    }

    .white {
        background: #fff;
    }

  

    .icon {
        max-width: 100px;
        height: auto;
    }

    p {
        font-size: 18px;
    }



    .top-white {
        background: #fff;
        height: 50px;
        position: relative;
    }

    .bottom-grey {
        background: #efeeee;
        height: 50px;
    }

    .triangle-down-white {
        width: 18%;
        height: 0;
        padding-left: 5%;
        padding-top: 2.5%;
        overflow: hidden;
        position: absolute;
        left: 8%;
        right: 0;
        margin: auto;
        top: 50px;
        z-index: 1;

        &:before {
            content: '';
            display: block;
            width: 0;
            height: 0;
            margin-left: -50px;
            margin-top: -50px;
            border-left: 50px solid transparent;
            border-right: 50px solid transparent;
            border-top: 50px solid #fff;
        }
    }


    .top-grey {
        background: #efeeee;
        height: 50px;
        position: relative;
    }

    .bottom-white {
        background: #fff;
        height: 50px;
    }

    .triangle-down-grey {
        width: 18%;
        height: 0;
        padding-left: 5%;
        padding-top: 2.5%;
        overflow: hidden;
        position: absolute;
        left: 8%;
        right: 0;
        margin: auto;
        top: 50px;
        z-index: 1;

        &:before {
            content: '';
            display: block;
            width: 0;
            height: 0;
            margin-left: -50px;
            margin-top: -50px;
            border-left: 50px solid transparent;
            border-right: 50px solid transparent;
            border-top: 50px solid #efeeee;
        }
    }

    .grey {
        background: #efeeee;
    }


    .main {
        margin: 0 auto -60px;
    }

    .main .img-responsive {
        margin-bottom: 30px;
    }


    .img-responsive {
        margin-bottom: 30px;
    }
}

.wade-way{
    background-color:$brand-primary;


    h2{
        color:$brand-secondary;
        text-transform:uppercase;
      
    }
     p{
           color:#fff;
           font-size:18px;
       }
}