@charset "UTF-8";

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&family=Comfortaa:wght@300..700&display=swap');
@import url(uxicons.css);

:root{
    --primary-color:#395382;
    --secondary-color:#0098da;
    --dark-color:#646566;
    --dark-alt-color:#00224f;
    --dark-alt-rgb:0,34,79;
    --light-color:#f1f2f1;
    --zeta-font:"Poppins",sans-serif;
    --zeta-font-title:"Comfortaa",var(--zeta-font);
}

::selection{
    background-color:var(--secondary-color);
    color:#fff;
}

nav{
    top:-100%;
    transition:top 0.5s ease-in-out;
}

nav.active{
    top:0;
}

nav > .nav-wrapper > .modules > ul > li > a{
    font-weight:500;
    font-size:1rem;
    color:var(--dark-color);
}

nav > .nav-wrapper > .modules > ul > li > a:hover,
nav > .nav-wrapper > .modules > ul > li > a:focus,
nav > .nav-wrapper > .modules > ul > li > a:active{
    background-color:var(--dark-alt-color);
    color:#fff;
}

nav > .nav-wrapper > .modules > ul > li.current a{
    background-color:var(--secondary-color);
    color:#fff;
}

nav > .nav-wrapper > .button{
    height:60px;
    box-shadow:none;
}

nav > .nav-wrapper > .bridge{
    align-items:center;
}

nav > .nav-wrapper > .bridge > a.launch-navi{
    width:60px;
    height:60px;
    background-color:var(--dark-alt-color);
    border-top-right-radius:5px;
    border-bottom-right-radius:5px;
}

nav > .nav-wrapper > .bridge > a.launch-navi::before,
nav > .nav-wrapper > .bridge > a.launch-navi::after,
nav > .nav-wrapper > .bridge > a.launch-navi > span{
    background-color:#fff;
}

h1,h2,h3,h4,h5{
    font-family:var(--zeta-font-title);
    font-weight:700;
}

figure{
    margin:0;
    padding:0;
}

p a{
    color:var(--secondary-color);
    text-decoration:none;
}

form input,
form select,
form textarea{
    padding:0 1rem;
    height:70px;
    border-width:2px;
    color:var(--dark-color);
    transition:border-color 0.3s ease-in-out;
}

form textarea{
    padding:1rem;
    resize:none;
}

form input:focus,
form select:focus,
form textarea:focus{
    border-color:var(--secondary-color);
}

map{
    display:block;
    width:100%;
    height:500px;
}

.fab{
    font:var(--fa-font-brands);
}

.right-align{
    text-align:right;
    justify-content:end;
}

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

.button{
    width:auto;
    height:60px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:5px;
    box-shadow:0 20px 30px rgb(211, 220, 232, 0.8);
    text-decoration:none;
    position:relative;
    transition:all 0.3s ease-in-out;
}

.button.md{
    height:50px;
}

.button::after{
    content:'';
    width:0;
    height:inherit;
    display:block;
    border-radius:inherit;
    position:absolute;
    top:0;
    left:0;
    z-index:0;
    transition:width 0.3s ease-in-out;
}

.button > p{
    margin-bottom:0;
    padding:0 2rem;
    font-size:1.1rem;
    font-weight:600;
    text-transform:uppercase;
    position:relative;
    z-index:1;
    transition:color 0.3s ease-in-out;
}

.button.md > p{
    padding:0 1rem;
    font-size:0.9rem;
}

.button > span{
    width:60px;
    height:inherit;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}

.button > span > i{
    font-size:2rem;
    color:#fff;
}

.button:hover::after,
.button:focus::after,
.button:active::after{
    width:100%;
}

.button.secondary{
    background-color:var(--secondary-color);
}

.button.secondary::after{
    background-color:var(--dark-alt-color);
}

.button.secondary > span{
    background-color:var(--primary-color);
    border-top-right-radius:inherit;
    border-bottom-right-radius:inherit;
}

.button.secondary > p{
    color:#fff;
}

.button.dark{
    background-color:var(--dark-alt-color);
}

.button.dark > p{
    color:#fff;
}

.button.dark::after{
    background-color:var(--secondary-color);
}

.button.outline{
    background-color:transparent;
    border:2px solid var(--light-color);
    box-shadow:none;
}

.button.outline > p{
    color:var(--dark-alt-color);
}

.button.outline::after{
    background-color:var(--secondary-color);
}

.button.button.outline:hover,
.button.button.outline:focus,
.button.button.outline:active{
    border-color:transparent;
}

.button.button.outline:hover > p,
.button.button.outline:focus > p,
.button.button.outline:active > p{
    color:#fff;
}

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

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

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

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

.bg-pattern-1{
    background-image:url(../img/pattern-1.png);
    background-size:contain;
    background-repeat:no-repeat;
    background-position-x:right;
    background-position-y:top;
}

.bg-pattern-2{
    background-image:url(../img/pattern-2.png);
    background-size:50%;
    background-repeat:no-repeat;
    background-position-x:left;
    background-position-y:top;
}

.bg-pattern-3{
    background-image:url(../img/pattern-3.png);
    background-size:cover;
    background-repeat:no-repeat;
    background-position-x:right;
    background-position-y:center;
}

.bg-pattern-6{
    background-image:url(../img/pattern-6.png);
    background-size:22px;
    background-repeat:no-repeat;
    background-position-x:1rem;
    background-position-y:1rem;
}

.bg-pattern-7{
    background-image:url(../img/pattern-7.png);
    background-size:50%;
    background-repeat:no-repeat;
    background-position-x:right;
    background-position-y:top;
}

.background{
    width:100%;
    height:100%;
    overflow:hidden;
    position:relative;
}

.background > img{
    object-fit:cover;
    object-position:center;
    width:100%;
    height:100%;
}

.social a{
    margin:0 0.25rem;
    width:30px;
    height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background-color:var(--primary-color);
    color:#fff;
    text-decoration:none;
    position:relative;
    z-index:0;
}

.social a::after{
    content:"";
    width:inherit;
    height:inherit;
    display:block;
    background-color:var(--secondary-color);
    border-radius:inherit;
    position:absolute;
    top:0;
    left:0;
    transform:scale(0);
    z-index:-1;
    transition:transform 0.3s ease-in-out;
}

.social a:first-child{
    margin-left:0;
}

.social a:last-child{
    margin-right:0;
}

.social a:hover::after{
    transform: scale(1);
}

.icon{
    width:60px;
    height:60px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:3px solid var(--light-color);
    border-radius:50%;
}

.icon span{
    margin-top:0.4rem;
    font-size:1.5rem;
    line-height:1;
    color:var(--secondary-color);
}

.icon-2{
    margin-bottom:1rem;
    width:145px;
    height:145px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    position:relative;
}

.icon-2::before{
    content:url(../img/pattern-5.png);
    width:inherit;
    height:inherit;
    position:absolute;
    top:0;
    left:0;
    z-index:1;
}

.icon-2::after{
    content:url(../img/pattern-4.png);
    width:inherit;
    height:inherit;
    position:absolute;
    top:0;
    left:0;
    z-index:2;
}

.icon-2 > span{
    font-size:3rem;
    color:var(--primary-color);
}

.box{
    padding:2rem;
    background-color:#fff;
    box-shadow:0 15px 40px rgb(211 220 232 / 60%);
    border-radius:10px;
}

.box h4{
    font-weight:700;
    color:var(--dark-alt-color);
}

.separator{
    margin:1rem 0;
    display:inline-block;
    width:50px;
    height:3px;
    border-radius:3px;
}

.owl-carousel .owl-dots button{
    width:auto;
}

.owl-carousel .owl-dots button.owl-dot span{
    width:8px;
    height:8px;
    transition:all 0.3s ease-in-out;
}

.owl-carousel .owl-dots button.owl-dot:hover span{
    background-color:var(--primary-color);
}

.owl-carousel .owl-dots button.owl-dot.active span{
    width:15px;
    height:15px;
    background-color:var(--secondary-color);
}

#topBar #barInfo p{
    margin-bottom:0;
    display:flex;
    align-items:center;
    flex-flow:row nowrap;
}

#topBar #barInfo p span{
    margin-right:0.5rem;
    font-size:1.2rem;
    color:var(--primary-color);
}

#topBar #barContact figure.logo{
    display:flex;
    align-items:center;
}

#topBar #barContact figure.logo img{
    display:inline-block;
}

#topBar #barContact figure.logo figcaption{
    margin-left:0.75rem;
    width:auto;
    display:inline-block;
    font-family:var(--zeta-font-title);
    font-weight:700;
    font-size:2.75rem;
    color:var(--dark-color);
}

#topBar #barContact h5{
    margin-bottom:0;
    color:var(--primary-color);
}

#topBar #barContact p{
    margin-bottom:0;
}

#topBar #barMenu .col{
    position:relative;
    min-height:40px;
    height:auto;
}

#topBar #barMenu #menu{
    height:80px;
    display:flex;
    background-color:var(--primary-color);
    border-radius:5px;
    position:absolute;
    z-index:var(--zeta-index-1);
}

#topBar #barMenu #menu::after{
    content:"";
    width:95%;
    height:10px;
    background-color:rgba(255,255,255,0.2);
    border-bottom-left-radius:inherit;
    border-bottom-right-radius:inherit;
    position:absolute;
    bottom:-10px;
    left:2.5%;
    z-index:-1;
}

#topBar #barMenu #menu figure{
    padding:0 1rem;
    width:auto;
    height:inherit;
    display:flex;
    align-items:center;
}

#topBar #barMenu #menu ul{
    margin:0;
    padding:0;
    height:inherit;
    list-style-type:none;
    display:flex;
}

#topBar #barMenu #menu ul li{
    height:inherit;
    display:block;
}

#topBar #barMenu #menu ul li a{
    padding:0 0.75rem;
    width:auto;
    height:inherit;
    display:flex;
    align-items:center;
    font-size:1rem;
    font-weight:500;
    text-decoration:none;
    color:#fff;
    position:relative;
}

#topBar #barMenu #menu ul li a::after{
    content:"";
    width:100%;
    height:0;
    display:block;
    background-color:var(--dark-alt-color);
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
    transition:height 0.3s ease-in-out;
}

#topBar #barMenu #menu ul li a:hover::after{
    height:100%;
}

#topBar #barMenu #menu ul li.current a{
    background-color:var(--secondary-color);
    color:#fff;
}

#topBar #barMenu #menu .button{
    margin-left:auto;
    height:inherit;
    border-radius:0;
    border-top-right-radius:inherit;
    border-bottom-right-radius:inherit;
    box-shadow:none;
}

#carouselBlog h4{
    margin-bottom:2rem;
}

#carouselBlog .background{
    margin-bottom:1rem;
    width:50px;
    height:50px;
    border-radius:50%;
}

#carouselBlog p > time{}

#carouselBlog p > b{
    display:block;
    font-weight:500;
    color:var(--secondary-color);
}

section h2{
    color:var(--dark-alt-color);
}

footer h4{
    margin-bottom:2rem;
    color:#fff;
}

footer p{
    color:rgba(255,255,255,0.7);
}

footer ul{
    margin:0;
    padding:0;
    list-style-type:none;
}

footer ul li a{
    height:30px;
    display:flex;
    align-items:center;
    text-decoration:none;
    color:#fff;
    transition:color 0.3s ease-in-out;
}

footer ul li a:hover{
    color:cyan;
}

footer ul li a > span{
    margin-right:0.75rem;
    font-size:1.1rem!important;
    color:cyan;
}

footer ul.menu li a > span{
    margin-right:0.5rem;
    font-size:0.8rem!important;
}

footer .button{
    width:100%;
    box-shadow:none;
}

footer #copyright p{
    margin-bottom:0;
}

footer #copyright p.right-align a{
    margin:0 0.5rem;
    color:#fff;
}

footer #copyright p.right-align a:first-child{
    margin-left:0;
}

footer #copyright p.right-align a:last-child{
    margin-right:0;
}

@media(max-width:991px){
    #topBar #barInfo p{
        justify-content:center;
        text-align:center;
    }

    #topBar #barContact figure.logo{
        margin-bottom:var(--zeta-density-2);
        justify-content:center;
    }
    footer #copyright p,
    footer #copyright p.right-align{
        text-align:center;
    }
}

@media(max-width:767px){
    nav > .nav-wrapper > .button{
        margin-left:auto;
        border-top-right-radius:0;
        border-bottom-right-radius:0;
    }

    #topBar #barMenu #menu ul{
        display:none;
    }
}

@media(max-width:575px){
    #topBar #barContact{
        text-align:center;
    }

    #topBar #barContact figure.logo{
        margin-bottom:var(--zeta-density-1);
    }

    #topBar #barMenu #menu{
        border-radius:0;
        position:relative;
    }

    footer{
        text-align:center;
    }

    footer ul li a{
        justify-content:center;
    }
}