/* 
https://www.colorhexa.com/0E292D
https://www.colorhexa.com/71331D
*/

:root {  
    --bg-color: #fff;
    
    --text-color: #0E292D;  
    --accent-dark:#0E292D;     
    --accent:#1c525a;    
    --bg-light:#FAF7F4;
    
    --terra-dark:#71331D;
    --terra-med:#7F4934;
    --terra-light:#7f493475;
    
    --white: #fff;
    --grey: #616675;
    --black: #000;
}

[id] {
  scroll-margin-top: 150px;
}
@media only screen and (max-width: 991px){
  [id] {
    scroll-margin-top: 74px;
  }
}

.w100, .size-large {
    width: 100%;
    height: auto;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    font-family: "Montserrat", sans-serif;    
    font-weight: 300;
}

h1, h2, h3 {
    font-family: "Playfair Display", serif;
}
h1 {      
    font-size: 4rem;
    font-weight: 100;
}
h1.hero {
    font-size: 3.5rem;
    font-weight: 200;
    font-family: "Montserrat", sans-serif;
}

h2 {
    font-size: 3rem;
    color: var(--accent);
}

h3 {
    font-size: 2rem; 
}
ul, ol {
    padding: 0;
    list-style-position: inside;
}
strong {font-weight: 500;}

blockquote {
    font-family: "Playfair Display", serif;
    font-size: 2rem;
    font-style: italic;
}
small {font-size:.8rem;}


.header {
    background: var(--accent-dark);
    padding: 1.5rem 0rem;
    position: fixed;
    width: 100%;
    z-index: 10;
}

.logo {
    width: 200px;
    height: auto;
}

.content {
    position: relative;
    top: 110px;
}

.content > .block:nth-of-type(1)  {
    margin-top: 0px;
}

.content a {
    text-decoration: none;
    color: var(--text-color);
    border-bottom: 1px solid var(--accent);
}

svg.hamburguer {
    color: var(--white);
}
svg.close {
    color: var(--text-color);  
}

.main-menu li {
    list-style-type:none ;
}
.main-menu li a {
    margin: .4rem;
    text-transform: uppercase;
    color:var(--white);
    text-decoration: none;
    font-size: .8rem;
}
.main-menu li a:hover, .current-menu-item a {
    border-bottom: 2px solid var(--accent);
}
.call-menu a {
    background: var(--accent);
    padding: .5rem .8rem;
    border-radius: 5px;
    color: #fff !important;
}
.lang-item a {
    margin: 5px !important;
}
.offcanvas {
    background: var(--bg-color);
    color: var(--text-color);
}
.mobile-menu {
    padding: .5rem;
}
.mobile-menu li {
    list-style-type: none;
    margin: 1rem 0rem;
}
.mobile-menu li a {
    margin: .5rem;
    text-transform: uppercase;
    color: var(--text-color);
    text-decoration: none;
}
.mobile-menu li a:hover {
    border-bottom: 4px solid var(--accent);
}

.block {
    margin: 6rem 0rem;
    position: relative;
}

.block span.pre-title {
    background: var(--bg-light);
    border-radius: 50px;
    padding: .2rem 1rem;
    color: var(--terra-dark);
    font-weight: 300;
    margin-bottom: 1rem;
    display: inline-block;
}
@media only screen and (max-width: 991px){
    .block {
        margin: 2rem 0rem;
    } 
}
.footer {
    color: #fff;
    background-color: var(--accent-dark);
    border-bottom: 6px solid var(--accent);
    border-top: 1px solid var(--terra-dark);
    padding: 2rem 0rem 0rem;
    font-size: .9rem;
    margin-top: 180px;
}
.footer span {
    font-size: .8rem;
    text-transform: uppercase;
    font-weight: 600;
}
.footer a {
    color: white;
    text-decoration: none;
}
.logo-footer {
    width: 120px;
}

.hero-image {
    height: 80vh;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

#about h2 {
    font-size: 2.2rem;
}


.list-group-item {
    border: none;
    padding: .2rem 0rem .3rem .2rem;
    font-size: .8rem;
}
.list-group-item {
    background: none;
    color: var(--text-color);
}
.list-group-item-action:focus, .list-group-item-action:hover {
    background-color: var(--accent);
}
.list-group-item:first-child, .list-group-item:last-child {
    border-radius: 0px;
}

.call {
    background-color: var(--terra-med);
    padding: 1rem 1.5rem;
    color: var(--bg-color) !important;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 1rem;
    border-radius: 5px;
    display: inline-block;
    transition: all .3s;
}
.call:hover {
    background: var(--terra-dark);
}
button.call {
    border:none;
}

table {
    box-shadow: 0px 0px 20px #dfdfdf;
    border-radius: 1rem;
    width: 100%;
    font-size: .8rem;
    margin-bottom: 1rem;
}
th {  
    border-bottom: 1px solid #ededed;
}
th, td {
    padding: 1rem;
}
tbody td {
    border-bottom: 1px solid #ededed
}

.compare table td:nth-child(n+2),
.compare table th:nth-child(n+2) {
    /*text-align: center;*/
}

            .value h3 {
                font-size: 2.5rem;
                font-style: italic;
                font-weight: 700;
                color: var(--accent);
            }
            .value ul {
                padding: 0;
                margin: 0;
            }
            .value ul li {
                list-style-type: none;
                padding: 1rem 1rem;
                border-left: 8px solid var(--accent);
                margin-bottom: 1.5rem;
                border-radius: 10px;
                box-shadow: 0px 0px 5px #eaeaea;
            }
            .block-estrategia {
                background-image: url(../images/bg-estrategia.jpg);
                padding: 8rem 0rem;
                margin: 0 !important;
                background-position: top center;
                background-size: cover;
            }
            .block-mid {
                background: #EFEEEB;
                padding: 8rem 0rem;
                margin: 0 !important;
            }
            .block-dark {
                background: var(--accent);
                padding: 5rem 0rem;
                color: #fff;
            }
            h3.mixed-title em {font-size:2.2rem;}
            h3.mixed-title {font-size: 1.3rem;}
            .block-dark span.pre-title {
                background: var(--accent-dark);    
                color: #fff;
            }
            .serv-img {
                width: 90%;
                height: auto;
                border-radius: .5rem;
            }
            @media only screen and (max-width: 991px){
                .serv-img {
                    width: 100%;
                    margin-bottom: 1.5rem;
                }
            }
            .profile img {
                width: 170px;
                border-radius: 100px;
                margin-bottom: 1rem;
                box-shadow: 0px 0px 5px #eaeaea;
            }
            .profile a {
                border:none;
            }
            .profile a i {
                font-size: 1.2rem;
                color: var(--accent);
                margin: .2rem;
                display: inline-block;
            }
            .portfolio-item {
                padding: 1.5rem 1.5rem .5rem;
                border: 1px solid #eaeaea;
                border-radius: 1rem;
            }
            .portfolio-item img {border-radius: 5px;}
            .portfolio-item ul li {
                font-size: .8rem;
                list-style-type: none;
            }
            .post-title {
                font-family: 'Montserrat', sans-serif;
                font-size: 1.2rem;
            }



    .box {
        color: var(--accent-dark);
        margin-bottom: 0rem;
        border: 1px solid var(--terra-light);
        border-radius: 1rem;
        min-height: 260px;
    }

    .box i {
        font-size: 3rem;
        color: var(--terra-light);
    }
    .box span {
        font-size: 2rem;
        color: var(--terra-light);
        font-weight: 700;
    }
    .box p i {
        font-size: 1rem;
        color: var(--text);
    }
    

    .big-chip {
        padding: 1rem;
        text-align: center;
        background: var(--accent-dark);
        margin: 6rem;
        color: var(--white);
        border-radius: 1rem;
        box-shadow: 0px 0px 20px #dfdfdf;
    }
    .big-chip-item {
        text-align: center;
    }
    .big-chip-item i {
        color: var(--white);
        font-size: 2rem;
        background: var(--accent);
        padding: 17px;
        border-radius: 60px;
        display: inline-block;
        width: 80px;
        height: 80px;
        margin-bottom: .5rem;
    }
    .big-chip-item span {
        font-size: 2rem;
        font-weight: 600;
        color: var(--white);
    }

    

    .bi-check-circle-fill,
    .bi-dash-circle-fill,
    .bi-x-circle-fill {
        font-size: 1.5rem;
    }

    .bi-check-circle-fill {color:#c7d678;}
    .bi-dash-circle-fill {color:#e9c991;}
    .bi-x-circle-fill {color:#eb9c9c;}

    .chips {
        background-color: var(--bg-light);
        color: var(--terra-dark);
        text-align: center;
        margin: .5rem;
        border-radius: 1rem;
    }
    .chips span {
        font-weight: 700;
        color: var(--terra-light);
        font-size: 2rem;
    }
    .steps {
        background: var(--terra-med);
        padding: 6rem 0rem;
    }
    .scrollspy-container {
        position: relative;
        height: 340px;
        overflow-y: scroll;
        padding: 2rem;
        border-radius: 1rem;        
        background: var(--terra-dark);
        color: var(--white);
    }
    .paso {
        padding: 2rem;
        min-height: 280px;                            
    }
    .paso h4 {
        color: var(--white);
        font-family: 'Playfair Display';
        font-style: italic;
        font-weight: 100;
        font-size: 2rem;
    }
    .paso i {
        text-align: center;
        width: 100%;
        display: inline-block;
        font-size: 2rem;
        color: var(--white);
    }
    .list-group-item-action {
        border-color: #fff !important;
        font-size: 1rem;
        padding: 1rem;
    }
    .list-group-item {
        color: #fff !important;
        font-weight: 100;
        border-bottom: 1px solid var(--terra-dark) !important;        
    }
    .list-group-item:hover, .list-group-item:focus {
        background-color: var(--terra-dark);
    }
    .list-group-item-action.active {
        background: var(--terra-dark);
    }
    .green {color: green; font-weight: 500; }
    .blue {color: steelblue; font-weight: 500; }
    .grey {color: grey; font-weight: 500; }

    .call-box {
        background: var(--terra-med);
        border-radius: 1rem;
        padding: 4rem 2rem;
        text-align: center;
    }
    .call-box span {
        font-weight: 700;
        color: #fff;
        font-size: 2rem;
    }
    .call-box a {
        text-decoration: none;
        border-bottom: none;
        background: var(--terra-dark);
        color: var(--white);
        padding: .5rem 1rem;
        border-radius: 30px;
        margin-top: .5rem;
        display: inline-block;
        font-weight: 700;
    }

    .wsp {
        margin: 3rem 15%;
        background: #e7f0e8;
        border-radius: 1rem;
        box-shadow: 0px 0px 10px #eaeaea;
        overflow: hidden;
    }
    .wsp-text {
        margin: 3rem;
    }
    .wsp-text h3 {
        font-weight: 800;
        color: var(--accent-dark);
        font-size: 1.8rem;
    }
    .wsp-text .call {
        background-color: #34a343 !important;
    }
    .category h1 {
        font-size: 2rem;
    }
    .category h2 {
        font-size: 1.2rem;
    }
    .single h1 {
        font-size: 3rem;
    }
    .single h2 {
        font-size: 1.4rem;
    }
    .single h3 {
        font-size: 1.1rem;
    }
    .single blockquote {
        font-size: 1.2rem;
    }
    
@media only screen and (max-width: 991px){

    .single h1 {font-size: 2rem}
    .header {padding: 1rem 0rem;}
    .logo {width: 100px;}
    .content {
        position: relative;
        top: 65px;
    }
    .hero-image {height: 70vh; background-position: left;}
    h1.hero {font-size: 1.6rem;}
    h2 {font-size: 1.4rem;}
    h3 {font-size: 1.2rem;}
    #about h2 {
        font-size: 1.5rem;
    }
    .call {
        display: block;
        margin-bottom: 1rem;
    }
    .box {
        height: auto !important;     
        min-height: auto;
    }
    .box i {
        font-size: 2rem;
        color: var(--terra-light);
    }
    .block-mid {padding: 3rem 0rem}
    .big-chip {margin: 1rem ! important;}
    th, td {padding: .5rem;}
    .opportunities table tr td:nth-child(2),
    .opportunities table tr th:nth-child(2) {
        display: none;
    }
    .compare {overflow: scroll;}
    /*
    .compare table tr td:nth-child(1), .compare table tr th:nth-child(1) {display: none !important;}
    .compare table tr td:nth-child(3), .compare table tr th:nth-child(3) {display: none !important;}
    */
    .steps {padding: 1rem 0rem !important;}
    .paso {padding: 0rem !important;}
    .wsp {margin: 0rem .5rem ! important;}
}