/*////////////////////////////////////////////////////////////////////////////////////////////////////

    Themes Bootstrap - Personal Portfolio Template v1.0.0 (https://themesbootstrap.com.mx/templates/bravo-agency-template.html)
    Copyright 2019 Themes Bootstrap
    Licensed under MIT (https://github.com/diegovr7/bravo-agency/blob/master/LICENSE)

////////////////////////////////////////////////////////////////////////////////////////////////////*/
:root {
    --dark:#1a1a1a;
    --white: #ffffff;
    --light-grey: #efefef;
    --gold: #ecd5a7;
	--cian: #33C5FF;
	--magenta: #cf3476;
	--green: #51FF33;
	--blue: #3357FF;
	--red: #F83917;
}

body {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1rem;
    font-weight: 300;
    letter-spacing: .05rem;
    background-color: var(--cian) !important;
}

h1, h2, h3, h4, h5, h6, .navbar-brand {
    font-family: 'Oswald', sans-serif;
    font-weight: 500 !important;
    line-height: 1.5 !important;
}

a {
    color: var(--light);
}

a:hover {
    color: var(--light);
    text-decoration: none;
}

.bg-light {
    background-color: var(--white) !important;
}

.bg-light-grey {
    background-color: var(--light-grey);
}

.bg-dark {
    background-color: var(--dark) !important;
}

.bg-gold {
    background-color: var(--gold);
}
.bg-green {
    background-color: var(--green);
}
.bg-blue {
    background-color: var(--blue);
}
.bg-magenta {
    background-color: var(--magenta);
}
.bg-red {
    background-color: var(--red);
}
.text-dark {
    color: var(--dark) !important;
}
.text-gold {
    color: var(--gold) !important;
}
.text-grey {
    color: var(--light-grey) !important;
}
.text-red {
    color: var(--red) !important;
}
.text-magenta {
    color: var(--magenta) !important;
}
.btn {
    padding: .5rem 1.8rem;
    border-radius: .2rem;
}

.btn-primary {
    background-color: var(--white) !important;
    color: var(--dark);
    border-color: var(--dark);
}

.btn-primary:hover {
    background-color: var(--light) !important;
    color: var(--dark);
    border-color: var(--dark);
}

.btn-secondary {
    background-color: var(--dark);
}
.btn-wats {
    background-color: var(--green);
	border-color: var(--dark);
}
.btn-messenger {
    background-color: var(--blue);
	border-color: var(--dark);
}
.btn-mail {
    background-color: var(--red);
	border-color: var(--dark);
}
.btn-gold {
    background-color: var(--gold);
    color: var(--dark);
}

.mt-6{
    margin-top: 4rem;
}

.mb-6 {
    margin-bottom: 4rem;
}

.navbar {
    background-color: var(--magenta);
    min-height: 5rem;
}

.nav-link {
    font-size: .8rem;
    font-weight: 400;
    text-transform: uppercase;
    color: var(--white);
}

.navbar-toggler {
    color: var(--white);
}

.badge {
    font-weight: 500;
    padding: .5rem 1.5rem;
    line-height: 1.5;
}

section {
    padding: 6rem 0;
}

#slider {
    padding: 5rem 0 0 0;
}

.blog-info {
    color: var(--white);
    bottom: 1rem;
    left: 1.5rem;
}

.form-control {
    padding: 1.5rem 1rem;
    font-weight: 300;
    border: 0;
}

.form-control:focus {
    outline: none;
    box-shadow: none;
    border: 1px solid var(--dark);
}

@media (max-width: 575.98px) {
    #slider h3 {
        font-size: 1.2rem;
    } 
    footer {
        text-align: center;
    }
}
.btn-whatsapp {
        display:block;
        width:70px;
        height:70px;
        color#fff;
        position: fixed;
        right:20px;
        bottom:20px;
        border-radius:50%;
        line-height:80px;
        text-align:center;
        z-index:999;
}
.redes-flotantes {
position: fixed;
right: 8px;
top: 75%;
z-index: 20;
}
.redes-flotantes img {
float: right; clear: right;
 margin: 5px;
-moz-transform: scale(.8) ;
-webkit-transform: scale(.8) ;
-o-transform: scale(.8) ;
-ms-transform: scale(.8) ;
transform: scale(.8) ;
-webkit-transition: all .2s ease-in-out;
-moz-transition: all .2s ease-in-out;
-o-transition: all .2s ease-in-out;
transition: all .2s ease-in-out;
}
.redes-flotantes img:hover {
-moz-transform: scale(1.1) rotate(6deg);
-webkit-transform: scale(1.1) rotate(6deg);
-o-transform: scale(1.1) rotate(6deg);
-ms-transform: scale(1.1) rotate(6deg);
transform: scale(1.1) rotate(6deg);
}
.google-maps {
position: relative;
padding-bottom: 75%;
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}