/**
*
* FONTS
*
**/
@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Light.otf);
    src: url(../../fonts/pano/Pano-Light.woff) format('woff'),
    url(../../fonts/pano/Pano-Light.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Light.ttf) format('ttf');
    font-weight: 200;
}

@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Light-Italic.otf);
    src: url(../../fonts/pano/Pano-Light-Italic.woff) format('woff'),
    url(../../fonts/pano/Pano-Light-Italic.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Light-Italic.ttf) format('ttf');
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Regular.otf);
    src: url(../../fonts/pano/Pano-Regular.woff) format('woff'),
    url(../../fonts/pano/Pano-Regular.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Regular.ttf) format('ttf');
    font-weight: 400;
}

@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Regular-Italic.otf);
    src: url(../../fonts/pano/Pano-Regular-Italic.woff) format('woff'),
    url(../../fonts/pano/Pano-Regular-Italic.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Regular-Italic.ttf) format('ttf');
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Bold.otf);
    src: url(../../fonts/pano/Pano-Bold.woff) format('woff'),
    url(../../fonts/pano/Pano-Bold.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Bold.ttf) format('ttf');
    font-weight: 700;
}

@font-face {
    font-family: pano;
    src: url(../../fonts/pano/Pano-Bold-Italic.otf);
    src: url(../../fonts/pano/Pano-Bold-Italic.woff) format('woff'),
    url(../../fonts/pano/Pano-Bold-Italic.woff2) format('woff2'),
    url(../../fonts/pano/Pano-Bold-Italic.ttf) format('ttf');
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-ExtraLight.ttf);
    font-weight: 100;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-ExtraLightItalic.ttf);
    font-weight: 100;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-Light.ttf);
    font-weight: 200;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-LightItalic.ttf);
    font-weight: 200;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-Regular.ttf);
    font-weight: 400;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-Italic.ttf);
    font-weight: 400;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-SemiBold.ttf);
    font-weight: 500;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-SemiBoldItalic.ttf);
    font-weight: 500;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-Bold.ttf);
    font-weight: 700;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-BoldItalic.ttf);
    font-weight: 700;
    font-style: italic;
}

@font-face {
    font-family: titillium;
    src: url(../../fonts/Titillium/TitilliumWeb-Black.ttf);
    font-weight: 900;
}

body {
    font-family: 'titillium', sans-serif;
    font-size: 18px;
}

.font-pano {
    font-family: 'pano', sans-serif;
}

.font-titillium {
    font-family: 'titillium', sans-serif;
}

.font-weight-thin {
    font-weight: 100;
}

.font-weight-slim {
    font-weight: 200;
}

.font-weight-black {
    font-weight: 900;
}

.letter-spacing-one {
    letter-spacing: -1px;
}

.letter-spacing-two {
    letter-spacing: -2px;
}

.letter-spacing-three {
    letter-spacing: -3px;
}

.h2-titles {
    font-size: 26px;
    letter-spacing: -1px;
}

.pt-45 {
    padding-top: 45px;
}

.pt-header {
    padding-top: 80px;
}

/**
*
* COLORS
*
**/
.color-primary {
    color: #003676;
/ / #004472;
}

.color-primary-bg {
    background-color: #003676;
/ / #004472;
}

.color-primary-light {
    color: #00A7EB;
/ / #00A0C8;
}

.color-primary-light-bg {
    background-color: #00A7EB;
/ / #00A0C8;
}

.color-primary-very-light {
    color: #e6f0f6;
}

.color-primary-very-light-bg {
    background-color: #e6f0f6;
}

.color-primary-ultra-light {
    color: #F5F7F8;
}

.color-primary-ultra-light-bg {
    background-color: #F5F7F8;
}

.color-primary-dark {
    color: #03275A;
/ / #01255C;
/ / #153656;
}

.color-primary-dark-bg {
    background-color: #034172;
/ / #03275A;
/ / #01255C;
/ / #153656;
}

.color-primary-arrows {
    color: #18B2DF;
}

.color-primary-arrows-bg {
    background-color: #18B2DF;
}

.color-secondary {
    color: #E83943;
}

.color-secondary-bg {
    background-color: #E83943;
}

.color-white {
    color: #ffffff;
}

.color-white-bg {
    background-color: #ffffff;
}

.color-black {
    color: #000000;
}

.color-black-bg {
    background-color: #000000;
}

.color-gray {
    color: #444444;
}

.color-gray-bg {
    background-color: #444444;
}

.color-gray-light {
    color: #eaeaea;
}

.color-gray-light-bg {
    background-color: #eaeaea;
}

/**
*
* TRANSITIONS
*
**/
.transition-three {
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.transition-five {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.transition-one {
    -webkit-transition: all 1s ease;
    -moz-transition: all 1s ease;
    -ms-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

.transition-one-five {
    -webkit-transition: all 1.5s ease;
    -moz-transition: all 1.5s ease;
    -ms-transition: all 1.5s ease;
    -o-transition: all 1.5s ease;
    transition: all 1.5s ease;
}

.transition-three-s {
    -webkit-transition: 3s ease;
    -moz-transition: all 3s ease;
    -ms-transition: all 3s ease;
    -o-transition: all 3s ease;
    transition: all 3s ease;
}

.transition-wheelchair {
    -webkit-transition: all 0.8s ease-out;
    -moz-transition: all 0.8s ease-out;
    -ms-transition: all 0.8s ease-out;
    -o-transition: all 0.8s ease-out;
    transition: all 0.8s ease-out;
}

/**
*
* BUTTON STANDARD
*
**/
.btn-std {
    text-decoration: none !important;
    padding: 12px 30px;
    border-radius: 8px;
    border: none;
    font-size: 15px;
}

.btn-std:hover {
    color: #FFFFFF;
}

.btn-std i {
    padding-left: 8px;
}

.btn-std:hover i {
    padding-left: 15px;
}

/**
*
* BOOTSTRAP CONTAINER CHANGES
*
**/

/*MODAL OPEN*/
.modal-open {
    padding-right: 0 !important;
}

/* CUSTOM CLASSES */

.invisibleButton {
    background: transparent;
    border: 0px;
}

.invisibleButton:focus {
    outline-width: 0;
}


@media (min-width: 576px) {
    .container {
        max-width: 95%;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1140px;
    }

    video.responsive-center-md {
        position: fixed;
        right: 0;
        top: 0;
        min-width: 100%;
        min-height: 100%;
        transform: translate(calc((100% - 100vw) / 2), calc((100% - 100vh) / 2));
    }

    video.video-about-position {
        top: unset;
        bottom: -125px;
        margin-top: -60px;
    }
}

/**
*
* Other
*
**/
sup {
    top: -1em;
    font-size: 50%;
}

sub {
    font-size: 50%;
}

/**
*
* Headers
*
**/
.std-header,
.std-header .header-desktop,
.std-header .header-mobile {
    overflow: hidden;
    height: 650px;
    top: 0;
    left: 0;
}

.std-header .header-desktop,
.std-header .header-mobile {
    max-width: 1920px;
    z-index: -1;
    object-fit: cover;
    margin: auto;
}

.std-header .std-header-text {
    top: 0;
    left: 0;
}

.std-simple-header {
    height: 230px;
    padding-top: 100px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
}

.std-simple-header h1 {
    font-size: 32px;
}

#reply_message {
    position: relative;
    font-size: 20px;
    text-align: center;
}

img.header-mobile {
    display: none;
}

video.responsive-center {
    position: fixed;
    right: 0;
    top: 0;
    min-width: 100%;
    min-height: 100%;
    transform: translate(calc((100% - 100vw) / 2), calc((100% - 100vh) / 2));
}

/**
*
* MQ's
*
**/
@media (max-width: 1199px) {
    .std-header,
    .std-header .header-desktop,
    .std-header .header-mobile {
        height: 570px;
    }
    #home-header video, #product-section-header video, #about-section-header video, #carousel_comunnity image {
        height: 570px !important;
    }
    #carousel_community, #carousel_community .carousel-inner, #carousel_community .carousel-inner img{
        height: 570px !important;
    }
}

@media (max-width: 991px) {
    .std-header,
    .std-header .header-desktop,
    .std-header .header-mobile {
        height: 500px;
    }
    #home-header video, #product-section-header video, #about-section-header video, #carousel_comunnity image {
        height: 500px !important;
    }
    #carousel_community, #carousel_community .carousel-inner, #carousel_community .carousel-inner img{
        height: 500px !important;
    }
}

@media (max-width: 575px) {
    img.header-desktop {
        display: none;
    }

    img.header-mobile {
        display: block;
    }

    .std-header,
    .std-header .header-desktop,
    .std-header .header-mobile {
        height: 460px;
        background-size: cover;
    }

    .std-simple-header {
        padding-top: 60px;
    }
}

@media (max-width: 450px) {
    .std-header,
    .std-header .header-desktop,
    .std-header .header-mobile {
        height: 400px;
    }

    #home-header video, #product-section-header video, #about-section-header video, #carousel_comunnity image {
        height: 400px !important;
    }
    #carousel_community, #carousel_community .carousel-inner, #carousel_community .carousel-inner img{
        height: 400px !important;
    }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .modal-dialog{
        display: table;
    }
    .modal-content{
        display: block;
    }
}