/* ********** */
/* CONTAINERS */
/* ********** */

#container-hero {
    width:80%;
    margin:0 auto;
}
#container-herorow {
    width:auto;
    margin:0 auto;
}
.container-hero-text {
    width:100%;
    margin:0 auto 30px;
}
.container-hero-image {
    width:50%;
    margin:0 auto 30px;
}
.container-featurerow {
    padding-bottom:40px;
    padding-top:20px;
    border-top:1px solid #cccccc;
}
.container-feature-image-left {
    float:left;
    width:48%;
    text-align:center;
}
.container-feature-image-right {
    float:right;
    width:48%;
    text-align:center;
}
.container-feature-text-right {
    float:right;
    width:48%;
    margin-right:20px;
}
.container-feature-text-left {
    float:left;
    width:48%;
    margin-left:40px;
}
.container-sidebar-text-left {
    float:left;
    padding:0 20px;
}
.container-sidebar-text-right {
    float:right;
    padding:0 20px;
}

/**********/
/* STYLES */
/**********/

.hero-text-block {
    width:50%;
    background:url(../../images/bg-white-70-percent.png);
    padding:20px;
    margin:auto;
    text-align:center;
    font-size:1.25rem;
    font-weight:bold;
    font-style:italic;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius: 10px;
}
.hero-image {
    width:auto;
    text-align:center;
}
.feature-image,
.feature-image-01,
.feature-image-02,
.feature-image-03 {
    width:auto;
    margin:0px;
    padding:0px;
}
.feature-title {
    margin-top:0px;
}
.feature-text {
    padding-bottom:0px;
}

/* INTERACTIVE ELEMENTS */

.button {
    display:inline-block;
    margin-top:2px;
    padding:4px 10px 8px;
    font-size:18px;
    font-weight:bold;
    text-decoration:none;
    text-align:center;
    -webkit-border-radius:2px; /* Safari 3-4, iOS 1-3.2, Android 1.6- */
    -moz-border-radius:2px; /* Firefox 1-3.6 */
    border-radius:2px; /* Opera 10.5, IE 9, Safari 5, Chrome, Firefox 4, iOS 4, Android 2.1+ */
}

/* COLORS */

.bg-skyblue {
    background-color:#1e9cd7;
}
.button-text-white {
    color:#FFFFFF !important;
    text-shadow: 0px 1px #000000;
}


/*******************************************************************/
/*                        MEDIA QUERIES                            */
/*******************************************************************/


/* *********************** */
/* SCREENS LESS THAN 960px */
/* *********************** */


@media screen and (max-width: 960px) {

    .container-hero-image {
        width:80%;
        margin:0 auto 30px;
    }
    .hero-image {
        width:100%;
    }
    .hero-text-block {
        font-size:1.1rem;
    }
    #container-featurerow-01,
    #container-featurerow-02,
    #container-featurerow-03 {
    }

}

/* *********************** */
/* SCREENS LESS THAN 799px */
/* *********************** */

@media screen and (max-width: 799px) {

    .container-hero-image {
        width:80%;
        margin:0 auto 30px;
    }
    .hero-image {
        width:100%;
    }
    .hero-text {
        width:100%;
        font-size:1.0rem;
    }
    .container-feature-image-left,
    .container-feature-image-right {
        float:none;
        margin:0 auto;
        width:80%;
        text-align:center;
    }
    .container-feature-text-left,
    .container-feature-text-right {
        float:none;
        width:100%;
        margin:20px 0 0 0;
    }
    .feature-image,
    .feature-image-01,
    .feature-image-02,
    .feature-image-03 {
        width:auto;
        max-width:50%;
        padding:0px;
    }
    .feature-title {
        text-align:center;
        padding-top:0px;
    }
    .feature-text {
        margin:0 auto;
        width:80%;
        padding-bottom:0px;
    }
    .container-button {
        margin:0 auto;
        text-align:center;
    }

}

/* *********************** */
/* SCREENS LESS THAN 640px */
/* *********************** */

@media screen and (max-width: 640px) {

    .container-hero-image {
        width:80%;
        margin:0 auto 30px;
    }
    .hero-image {
        width:100%;
    }
    .hero-text {
        width:100%;
        font-size: 1.0rem;
    }
}