@font-face {
    font-family: 'Alata';
    src: url('./fonts/Alata/Alata-Regular.ttf')  format("truetype");
}

html,
body {
    max-width: 100%;

}

.navbar-brand {
    /*margin-left: 2em;*/
    max-height: 80px;
    max-width: 200px;
}

#navbarNavDropdown {
    padding-right: 200px;
}

section {
    margin-top: 3em;
}

h1,
h2 {
    font-family: Alata, Arial, Helvetica, sans-serif;
    /*font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;*/
    margin-bottom: 1em;
    color: #2b7c94;
}

#key {
    padding: 1em;
}

#key h3 {
    /*font-family: 'Khand', sans-serif;*/
    font-size: 2em;
}

#key h3 span {
    background-color: #3e869c;
    color: white;
}

/*#carouselExampleIndicators,.carousel-inner{
    max-height: 10em;
}*/

#formContainer {
    padding: 1.5em;
    border-radius: 2%;
    border: 1px solid lightgrey;
    background-color: white;
}

.form-group {
    width: 100%;
}
form a{
    color:#2b7c94;
}

.cta {
    width: 100%;
    font-size: 1.1em;
    text-align: center;
    background-color: #2b7c94;
    color: white;
}

.card {
    text-align: justify;
}
.card a{
    background-color: #2b7c94;
    color:white;
    text-align: center;
}

.cardContainer {
    padding: 1em;
}

.card-header {
    text-align: center;
}

#card1 {
    background-color: #049b9b;
}

#card2 {
    background-color: #3e869c;
}

#card3 {
    background-color: #56b2c4;
}

.logo img {
    max-width: 100px;
}

#mapContainer img {
    max-width: 100%;
}

#location p {
    text-align: justify;
    font-size: 1.2em;
}
.clientWrapper, .partnerWrapper{
    margin:auto;
}
.clientWrapper img,.partnerWrapper img{
    max-width:80%;
}

footer {
    margin-top: 2em;
    color: white;
    font-size:0.8em;
}

footer ul {
    list-style-type: none;
}
footer ul li{
    margin-top: 0.5em;
}
.footerCta {
    font-size: 1.1em;
    text-align: center;
    background-color: white;
    color: #2b7c94;
}
footer a {
    text-decoration: none;
    color: white;
}
#topFooter,#bottomFooter{
    padding-top: 1em;
    padding-bottom: 1em; 
}

#topFooter{
    background-color: #049b9b;
}
#bottomFooter{
    text-align: center;
    background-color: #3e869c;
    height: 100%;
}

.banner{
    margin:auto;
    background-repeat: none;
    width: 80%;
}
.banner img{
    max-width: 100%;
    cursor:pointer;
}
@media only screen and (min-width: 768px) {

    .desktop{
       display: block; 
    }
    .mobile{
        display:none;

    }

    .clientWrapper img, .partnerWrapper img{
    opacity:0.6;
    }
    .clientWrapper img:hover,.partnerWrapper img:hover{
        opacity:1;
    }
}
@media only screen and (max-width: 768px) {

    .desktop{
       display: none; 
    }
    .mobile{
        display:block;
    }
}