/*------------------ RESET ------------------*/
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
    margin: 0;
    padding: 0;
    border: 0;
    font: inherit;
    font-size: 100%;
    vertical-align: baseline;
}

html {
    line-height: 1;
}

ol,ul {
    list-style: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

caption,th,td {
    text-align: left;
    font-weight: 400;
    vertical-align: middle;
}

q,blockquote {
    quotes: none;
}

q:before,q:after,blockquote:before,blockquote:after {
    content: "";
    content: none;
}

a img {
    border: none;
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
    display: block;
}

/*---------------------- PAGE ----------------------*/
body {
    font-family: 'Open Sans', helvetica, arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
    color: #333;
    background: #f8f8f8;
}
.container {
    background: #fff;
    border-left: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;
}
.no-pad {
    padding-left: 0;
    padding-right: 0;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 400;
    display: block;
}

/*---------------------- TOP ----------------------*/
.top {
    padding: 60px 0 30px 15px;
    overflow: auto;
}
.top header {
    
}
.branding {
    width: 200px;
    float: left;
    display: block;
}
.top h1 {
    font-size: 36px;
    line-height: 36px;
    color:  #175382;
    font-weight: 600;
    padding: 30px 0 0 30px;
    float: left;
    display: block;
}
@media (max-width: 767px) {
    .top {
        padding: 15px 0 15px;
        overflow: auto;
    }
    .branding {
        padding: 15px;
        max-width: 80%;
    }
    .top h1 {
        padding: 35px 0 10px;
        font-size: 30px;
        color: #175382;
        line-height: 36px;
    }
}
@media (max-width: 480px) {
    .top {
        text-align: center;
    }
    .branding {
        max-width: 60%;
        margin: 0 auto;
        text-align: center;
        float: none;
    }
    .top h1 {
        font-size: 26px;
        padding: 15px 0 0;
        color: #175382;
        line-height: 18px;
        float: none;
    }
}

/*---------------------- MID ----------------------*/
.mid {
    padding: 30px 0 60px;
    overflow: auto;
}
.mid h2 {
    padding: 0 0 30px;
    font-size: 28px;
    line-height: 31px;
    color: #175382;
}
.mid h3 {
    margin: 0 0 15px;
    font-size: 22px;
    color: #175382;
}
.mid h4 {
    padding: 0;
    font-size: 20px;
    color: #323439;
}
.mid h5 {
    padding: 0 0 15px;
    font-size: 14px;
    color: #8D8D91;
    text-transform: uppercase;
}
.copy {
    padding: 0 0 15px;
}
.copy p {
    margin-bottom: 15px;
}
.podcast {
    padding: 30px;
    border-left: 1px solid #F4F3F2;
    border-right: 1px solid #F4F3F2;
    border-top: 1px solid #F4F3F2;
    border-bottom: 2px solid #E9E8E7;
    background: #F8F7F6;
    -webkit-border-radius: 1px;
    -moz-border-radius: 1px;
    border-radius: 1px;
}
.mid ul {
    margin: 0 0 30px 20px;
}

.mid li {
    margin-bottom: 15px;
    list-style-type: none;
    line-height: 1.6;
}
.fa-crosshairs {
    color: #ea7f02;
}
.btn-group {
    width: 100%;
    padding: 15px 0;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}
.btn-contr {
    margin: 5px;
}
.cs-btn {
    padding: 20px 15px 18px;
    color: #fff;
    font-size: 13px;
    line-height: 14px;
    font-weight: 400;
    text-decoration: none;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    text-align: center;
    display: inline-block;
    white-space: nowrap;
    vertical-align: middle;
    text-transform: uppercase;
}
.mid a, a.cs-btn:hover, a.cs-btn:active, a.cs-btn:visited {
    text-decoration: none;
    color: #fff;
}
.btn-blue {
    background-color: #328CC5;
    border-bottom: 2px solid #527291;
    text-shadow: 0 1px 0 #527291;
}
.btn-blue:hover {
    background-color: #195478;
    -webkit-transition: background-color .5s ease-in-out;
    -moz-transition: background-color .5s ease-in-out;
    -ms-transition: background-color .5s ease-in-out;
    -o-transition: background-color .5s ease-in-out;
    transition: background-color .5s ease-in-out;
}
.btn-green {
    background-color: #47B178;
    border-bottom: 2px solid #4c8f86;
    text-shadow: 0 1px 0 #4c8f86;;
}
.btn-green:hover {
    background-color: #4c8f86;
    -webkit-transition: background-color .5s ease-in-out;
    -moz-transition: background-color .5s ease-in-out;
    -ms-transition: background-color .5s ease-in-out;
    -o-transition: background-color .5s ease-in-out;
    transition: background-color .5s ease-in-out;
}
.btn-gray {
    background-color: #b9b6b3;
    border-bottom: 2px solid #a9a6a3;
    text-shadow: 0 1px 0 #a9a6a3;
}
.btn-gray:hover {
    background-color: #a9a6a3;
    -webkit-transition: background-color .5s ease-in-out;
    -moz-transition: background-color .5s ease-in-out;
    -ms-transition: background-color .5s ease-in-out;
    -o-transition: background-color .5s ease-in-out;
    transition: background-color .5s ease-in-out;
}
@media (max-width: 767px) {
    .mid {
        padding: 15px 0 30px;
    }
    .mid h2 {
        font-size: 22px;
    }
    .mid h3 {
        font-size: 20px;
    }
    .mid h4 {
        font-size: 16px;
    }
    .mid h5 {
        font-size: 14px;
    }
    .podcast {
        padding: 15px;
    }
}
@media (max-width: 480px) {
    .copy {
        padding: 0;
    }
    .btn-blue {
        padding: 20px 20px 18px;
    }
}

/*---------------------- BOTTOM ----------------------*/
.bottom {
    padding: 0 0 30px;
    overflow: auto;
}
@media (max-width: 767px) {
    .bottom {
        padding: 0 0 30px;
    }
}

/*---------------------- FOOTER ----------------------*/
.footer-contr {
    background-color: #f8f8f8;
    border-top: 2px solid #e1e1e1;
    border-left: none;
    border-right: none;
}
footer {
    padding: 30px 0;
}
footer small {
    font-size: 75%;
    color: #b9b9b9;
}