:root {
    --alizarin: #E94B35; /** red **/
    --belize: #227FBB; /** blue **/
    --clouds:#ECF0F1; /** white **/
    --midnight:#2B3E51; /** black **/
    --turquoise: #1DBC9B; /** green **/
}

/**** FONTS ****/
h1, h2, h3 {font-family: utopia-std-headline, serif; font-weight: 400; font-style: normal; margin-bottom:0}
body {font-family: interface, sans-serif; font-weight: 400; font-style: normal;}

h1, h2 {font-size:2em}
.lead {font-size:1.5em}

/**** COLOR ****/
a {color:var(--clouds); text-decoration: none}
a:hover {text-decoration:none; color:var(--alizarin)}

body {background:var(--belize); color:var(--midnight)}

.bg-midnight {background:var(--midnight)}
.bg-clouds {background:var(--clouds)}

.text-midnight {color:var(--midnight)}
.text-clouds {color:var(--clouds)}



/**** LINKS ****/
.btn {background:var(--turquoise); color: var(--clouds); margin-top:1em; margin-bottom:1em;}
.btn-o {background:none; color: var(--clouds); border:1px solid var(--clouds); margin-top:1em; margin-bottom:1em;}

.btn-social {font-size:1em; color:var(--clouds); padding:.5em 1em; display:inline-block; border-radius:.25em}
.btn-social:hover {color:var(--clouds); background:var(--midnight)}
.btn-whatsapp {background:#075e54}
.btn-telegram {background:#0088cc}
.btn-facebook {background:#3b5998}
.btn-facebook {background:#3b5998}
.btn-twitter {background:#1da1f2}
.btn-instagram {background:#e1306c}
.btn-rifatnajmi {background:#1E22AA}
.btn-social i {display:inline-block; margin-right:.5em}

.btn span {font-size:.75em}
.btn:hover {background:var(--alizarin); color: var(--clouds)}

footer a {font-weight: bold}
footer a:hover {color:var(--alizarin)}
footer .social a {display:inline-block; padding:.5em .75em; border:1px solid var(--clouds); color:var(--clouds)!important; border-radius:.25em}
footer .social a:hover {border:1px solid var(--turquoise); background:var(--turquoise); color:(var--clouds)}
footer .social a+a {margin-left:.25em}

.awards img:hover {filter: grayscale(100%); -webkit-filter: grayscale(100%)}
.awards img {filter: grayscale(0%); -webkit-filter: grayscale(0%); height:2em; width:auto}

/**** LAYOUT ****/
hr {margin-top:2em; margin-bottom:2em}
.download .col-md-6 {text-align: center}

.dress img, .landmark img {width: 100%; height: auto}


/**** RESPONSIVE ****/
@media (min-width:768px) {
    .hero {background:url('img/bg.svg') center bottom no-repeat; background-size:contain}
    .hero a+a {margin-left:1em}
    .logo {margin-bottom:8em}
    .btn {padding:.5em 1.5em; font-size:1.5em; border-radius:.5em}
    .btn i {display: inline-block; margin-right:.5em}
    .btn span {display:inline-block; margin-left:.5em}
}

@media (max-width: 767px) {
    .hero {background:url('img/bg.svg') center center no-repeat; background-size:contain}   
    .hero a+a {margin-left:.5em}
    .logo {margin-bottom:4em}
    .hero span {display: block}
    .btn {padding:.5em 1em; font-size:1em; border-radius:.25em}
    .btn i {display: none}
    .btn span {display:none;}
    .license {margin-bottom:2em}
}