/*  
    font-family: 'Roboto', sans-serif;
    font-family: 'Roboto Condensed', sans-serif;

    teal:       #2CB4B9 rgba(44,180,185,1)
    orange:     #E54F1D rgba(229,76,29,1)
    dark gray:  #646464 rgba(100,100,100,1)
   
    320px — 480px: Mobile devices
    481px — 768px: iPads, Tablets
    769px — 1024px: Small screens, laptops
    1025px — 1200px: Desktops, large screens
    1201px and more —  Extra large screens, TV
*/

/*#region keyframes*/
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-webkit-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-o-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@-ms-keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

/*#endregion*/

#body-container {
    width: 100%;
    overflow: hidden;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0
}

#toTheTop a {
    color: #FFF;
}

#toTheTop a:hover {
    color: #2CB4B9;
}

.to-top-btn {
    position: fixed;
    bottom: 40px;
    right: 20px;
    height: 35px;
    font-size: 1rem;
    text-decoration: none;
    background-color: #E54F1D;
    color: #FFF;
    padding: 6px 10px;
    border-radius: 7px;
    display: none;
    z-index: 1100;
    opacity: .9;
}

.to-top-btn:hover, .to-top-btn:active, to-top-btn:focus {
    color: #2CB4B9;
}

.fade-in-text {    
    animation: fadeIn linear 2s;
    -webkit-animation: fadeIn linear 2s;
    -moz-animation: fadeIn linear 2s;
    -o-animation: fadeIn linear 2s;
    -ms-animation: fadeIn linear 2s;
}


.circle {
    border: .5rem solid #FFF;
    background-color: transparent;
    height: 100px;
    width: 100px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
}


/*#region welcome-hero*/
    #welcome-container {
        position: relative;
        height: 91vh;
        overflow: hidden;   
    }
    #welcome-container-content {
        background: #2CB4B9;
        text-align: center;
        color: #FFF;
        padding:2rem;
        line-height:1;
        padding-top:5%;
    }
    #welcome-container-content .line-one, #welcome-container-content .line-two, #welcome-container-content .line-three {
        font-weight:bold;
    }
    #welcome-container-content .line-one {
        font-size:2.9375rem;
    }
    #welcome-container-content .line-two {
        font-size: 8.5625rem;
    }
    #welcome-container-content .line-three {
        font-size: 6.875rem;
    }
    #hero-image-container {
        position: relative;
        height: 100%;
    }
    #welcome-container-content .wysiwyg {
        color:#FFF;
        font-size:1.5rem;
        line-height:1.75;
        text-align:center !important;
        width:100%;
        max-width:650px;
        margin:1rem auto;
    }
    #welcome-button {
        border:3px solid #FFF;  
        border-radius:25px;
        padding:1rem;
        color:#FFF;
        width:300px;
        margin:2rem auto;
        font-size:2.5rem;
        font-weight:bold;
        transition:.25s ease-in-out
    }
    #welcome-button:hover {
        border: 3px solid #E54F1C;
    }
    .hero-image-container img {
        position: relative;
        z-index: 0
    }
    .hero-caption-container {
        position: absolute;
        color: #FFF;
        text-shadow: 0.05em 0 black, 0 0.05em black, -0.05em 0 black, 0 -0.05em black;
        bottom: 0;
        right: 0;
        width: 50%;
        text-align: right;
        padding: 1rem;
        z-index: 5
    }
    #homeimages_UpdatePanel1 {
        height:100%;
    }
    #hero-image {
        height:100%;
    }
    #hero-image img {
        object-fit: cover;
        height:100%;
        width:100%;
    }

#homeimages_btnPrevious {
    position: absolute;
    bottom: 10%;
    left: 1rem;
    z-index: 200;
    font-size: 2rem;
    color: #FFF;
    transition: all .25s;
}

    #homeimages_btnNext {
        position: absolute;
        bottom: 10%;
        left: 4rem;
        z-index: 200;
        font-size: 2rem;
        color: #FFF;
        transition: all .25s;
    }

    #homeimages_btnPrevious:hover, #homeimages_btnNext:hover {
        color: #E54F1D;
    }

    #pauseplay {
        z-index: 250;
        position: absolute;
        bottom: 3rem;
        left: 1.25rem;
        padding: 1rem;
        height: 30px;
        width: 30px;
    }

    #pauseplay i {
        font-size: 2rem;
        position: absolute;
        top: 1rem;
        left: 1rem;
    }

    #pauseplay a {
        color: #FFF
    }

    #pauseplay a:hover {
        color: #222
    }
/*#endregion*/

/*#region home meet CGAND*/
#meet-cgand-container {
    background:#f9f9f9;
    color:#575757;
    text-align:center;
}
#meet-cgand-content {
    padding:5rem 2rem;
    width:100%;
    max-width:1200px;
    margin:0 auto;
    font-size:1.75rem;
}

#meet-cgand-container .howMuch {
    font-size: 4rem;
    font-weight: 700;
}
#howMuch-container {
    padding-top: 1rem;
    height: 350px;
}
#meet-cgand-container .center-circle {
    width: 300px;
    display: inline-block;
}

#meet-cgand-container .circle {
    border: .25rem solid #FFF;
    background: #E54F1D;
    padding-top:1rem;
    font-size: 7rem;
    color: #FFF;
    position: relative;
    font-weight: 900;
    margin: 0 0;
    width: 300px;
    height: 300px;
    box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

#meet-cgand-container .hash-sign {
    font-size: 4rem;
    top: 1.5rem;
    left:3.25rem;
    position: relative;
    float: left;
}
#meet-cgand-container .line-two {
    font-size: 2.25rem;
    position:relative;
    top:-7.25rem;   
}
#meet-cgand-container .line-three {
    font-size: 1.25rem;
    position: relative;
    top: -15.75rem;
}
#learnMoreButton {
    border: 3px solid #E54F1D;
    border-radius: 25px;
    padding: 1rem;
    color: #E54F1D;
    width: 300px;
    margin: 2rem auto;
    font-size: 2.5rem;
    font-weight: bold;
    transition: .1s ease-in-out
}

    #learnMoreButton:hover {
        border: 3px solid #575757;
        color: #575757;
    }
/*#endregion*/

/*#region about*/
    #about-container {
        background: #2CB4B9;
        color: #FFF;
    }

    #about-content {
        padding: 5rem 2rem;
        width: 100%;
        max-width: 1600px;
        margin: 0 auto;
        font-size: 1.3125rem;
    }
    #about-content h2 {
        font-size:3rem;
        font-weight:700;
    }
    #about-content-container {
        padding:1rem 4rem 1rem 0;
    }
    #about-news-container {
        padding: 1rem 0 1rem 4rem;
    }
    .about-news-item {
        padding-bottom:3rem;
    }
    #about-news-container a {
        color: #FFF;
    }
    #about-news-container a:hover {
        color: #e7e7e7;
    }
    .news-image {
        margin:1rem auto;
        border: 4px solid #FFF;
        box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
        width:175px;
        height:175px;
        border-radius:50%;
        overflow:hidden;    
    }

    .news-image img {
        height:175px;
        object-fit:cover;
    }
    .about-news-story {
        padding-left:1rem;
    }
/*#endregion*/

/*#region media breaks*/
@media(max-width:1560px) {
    #welcome-container-content {       
        padding-top: 7%;
    }
    #welcome-container-content .line-one {
        font-size: 2.4rem;
    }
    #welcome-container-content .line-two {
        font-size: 7rem;
    }
    #welcome-container-content .line-three {
        font-size: 5.62rem;
    }
    #welcome-container-content .wysiwyg {       
        font-size: 1.25rem;
        line-height: 1.43;
    }
    #welcome-button, #learnMoreButton {
        font-size: 2.05rem;
    }
    .hero-caption-container {
        width: 75%;
    }
    #meet-cgand-content {
        font-size:1.4rem
    }
    #meet-cgand-container .howMuch {
        font-size: 3.25rem;
        font-weight: 700;
    }
    #meet-cgand-container .center-circle {
        width: 275px;
    }
    #meet-cgand-container .circle {
        font-size: 5.62rem;
        width: 275px;
        height: 275px;
    }
    #meet-cgand-container .hash-sign {
        font-size: 3.2rem;
        top: 1.5rem;
        left: 4.25rem;
        position: relative;
        float: left;
    }
    #meet-cgand-container .line-two {
        font-size: 1.8rem;
        top: -1.5rem;
        display: block;
    }
    #meet-cgand-container .line-three {
        font-size: 1.1rem;
        top: -15.5rem;
    }
}
@media(max-width:1260px) {
    #welcome-container-content {
        padding-top: 8.5%;
    }

    #welcome-container-content .line-one {
        font-size: 1.92rem;
    }

    #welcome-container-content .line-two {
        font-size: 5.6rem;
    }

    #welcome-container-content .line-three {
        font-size: 4.5rem;
    }

    #welcome-button, #learnMoreButton {
        font-size: 1.64rem;
    }
    #meet-cgand-container .howMuch {
        font-size: 2.6rem;
    }
    #meet-cgand-container .center-circle {
        width: 250px;
    }
    #meet-cgand-container .circle {
        font-size: 4.5rem;
        padding-top:1.5rem;
        width: 250px;
        height: 250px;
    }
    #meet-cgand-container .hash-sign {
        font-size: 2.5rem;
        top: 1.2rem;
        left: 4.25rem;
        position: relative;
        float: left;
    }

    #meet-cgand-container .line-two {
        font-size: 1.44rem;
        top: -1rem;
        display: block;
    }

    #meet-cgand-container .line-three {
        font-size: 1rem;
        top: -12rem;
    }
    #about-content h2 {
        font-size: 2.4rem;
    }
    #about-content h3 {
        font-size: 1.8rem;
        line-height: 1.25
    }
}

/*let's go mobile*/
@media(max-width:1190px) {
    #welcome-container {
        height:auto;
    }
    #welcome-container-content, #hero-image-container, #about-right, #about-left {
        width: 100%;
    }
    #about-content {
        padding: 3rem 2rem;
        font-size: 1.125rem;
    }
    #about-news-container {
        padding: 1rem 0 1rem 0;
    }
    .about-news-image {
        width:25% !important;
    }
    .about-news-story {
        width: 75% !important;
        padding-top: 2rem;
    }
}
@media(max-width:960px) {
    #meet-cgand-container .center-circle {
        width: 200px;
    }

    #meet-cgand-container .circle {
        font-size:3.6rem;
        padding-top: 1rem;
        width: 200px;
        height: 200px;
    }

    #meet-cgand-container .hash-sign {
        font-size: 2rem;
        top: 1.2rem;
        left: 3.25rem;
        position: relative;
        float: left;
    }

    #meet-cgand-container .line-two {
        font-size: 1.15rem;
        top: -1rem;
        display: block;
    }

    #meet-cgand-container .line-three {
        font-size: 1rem;
        top: -9.75rem;
    }
    #about-content h2 {
        font-size: 1.9rem;
    }
    #about-content h3 {
        font-size: 1.7rem;
        line-height:1.25
    }
}
@media(max-width:790px) {
    .news-image img {
        height: 125px;
    }
    .news-image {       
        width: 125px;
        height: 125px;
    }
    .about-news-story {
        padding-top: 1rem;
    }
}
@media(max-width:690px) {
    #howMuch-container {
        height:auto;
    }
    #howMuch-container .small-12 {
        width: 100% !important;
        height: 225px;
    }
}

@media(max-width:560px) {
    #welcome-container-content {
        padding-top: 8.5%;
    }

    #welcome-container-content .line-one {
        font-size: 1.5rem;
    }

    #welcome-container-content .line-two {
        font-size: 4.5rem;
    }

    #welcome-container-content .line-three {
        font-size: 3.65rem;
    }

    #welcome-container-content .wysiwyg {
        font-size: 1.15rem;
        line-height: 1.25;
    }

    #welcome-button, #learnMoreButton {
        font-size: 1.312rem;
        width: 200px;
    }

    #homeimages_btnNext, #homeimages_btnPrevious {
        bottom: 5rem;
    }

    #pauseplay {
        bottom: 1.5rem;
        right: 2rem;
        left: auto;
    }

    .hero-caption-container {
        width: 80%;
        text-align: left;
        left: 0
    }

    #meet-cgand-content {
        font-size: 1.15rem
    }

    #meet-cgand-container .howMuch {
        font-size: 2rem;
    }

    #meet-cgand-container .circle {
        font-size: 3.65rem;
    }
    #about-content-container {
        padding: 1rem 0;
    }
    .about-news-image, .about-news-story {
        width:100% !important;
    }
    .news-image img {
        height: 175px;
        width: 100%;
    }
    .news-image {
        width: 100%;
        height: 125px;
    }
    .news-image {
        border-radius:0;
    }
    .about-news-story {
        padding-top:0;
        padding-left: 0;
    }
}

@media(max-width:460px) {
    #welcome-container-content {
        padding-top: 8.5%;
    }

    #welcome-container-content .line-one {
        font-size: 1.25rem;
    }

    #welcome-container-content .line-two {
        font-size: 3.6rem;
    }

    #welcome-container-content .line-three {
        font-size: 2.9rem;
    }

    #welcome-container-content .wysiwyg {
        font-size: 1.15rem;
        line-height: 1.25;
    }

    #welcome-button, #learnMoreButton {
        font-size: 1.15rem;
        width: 200px;
    }
}
/*#endregion*/