* {
    font-size: 16px;
    font-family: 'Montserrat', sans-serif;
    color: #000000;
}

body,html {
    overflow-x:hidden;
}

a:hover {
    text-decoration: none;
}

h2 {
    font-size: 53px;
    font-weight: 400;
}

h3 {
    font-weight: 400;
}

nav {
    background: #005295;
}

nav li a {
    color: #FFFFFF;
    margin-left: 30px;
    text-transform: uppercase;
}

nav li a:hover {
    color: #FFFFFF!important;
    border-bottom: 1px solid #FFFFFF;
}

.logo-navbar {
    max-height: 60px;
    width: auto;
}

.whatsapp-icon {
    max-height: 35px;
    margin-left: 60px;
}

#intro {
    padding-top: 75px;
    padding-bottom: 75px;
}

#intro h1 {
    color: #005295;
    font-size:  53px;
    font-weight: 400;
}

#intro h2 {
    font-size: 53px;
    font-weight: 400;
}

#intro h5 {
    color: #005295;
    font-size: 16px;
    font-weight: 400;
}

.bg-reverse
{
    background: #005295;
}

.bg-dark {
    background: #505050!important;
}

.bg-grey {
    background-color: #505050!important;
}

.bg-light-grey {
    background-color: #f5f5f5;
}

.bg-grey * {
    color: #FFF;
}

.section-75 {
    padding-top: 75px;
    padding-bottom: 75px;
}

#section-icone {
    padding-top: 75px;
    padding-bottom: 25px;
}

#section-icone .icon-servizi
{
    max-width: 100px;
    margin-bottom: 20px;
}

#section-icone h5 {
    text-align: center;
    color: #FFFFFF;
    text-transform: uppercase;
    font-size: 20px;
    font-weight: 400;
    margin-bottom: 75px;
}

#progetti .bg-progetto {
    min-height: 50vh;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    padding: 0;
}

#progetti .bg-progetto.home {
    min-height: 70vh;
}

.veil-progetto {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    background: rgba(0, 82, 149, 0.8);
    width: 90%;
    height: 90%;
}

.veil-progetto h4 {
    color: #FFF;
    text-align: center;
    position: relative;
    top: 50%;
    -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    font-size: 36px;
    text-transform: uppercase;
}

.btn-float-allegati {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.btn-float-allegati .btn {
    border-radius: 0;
    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
}

.btn-float-allegati .btn:hover {
    border-radius: 0;

    padding-top: 20px;
    padding-bottom: 20px;
    width: 100%;
}

.veil-progetto h4 a {
    color: #FFF;
    text-align: center;
    font-size: 36px;
    text-transform: uppercase;
}

#progetti .bg-progetto:hover .veil-progetto,
.allegato:hover .veil-progetto {
    opacity: 1;
}

.logo-cliente {
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    width: 100%;
    padding-bottom: 66%;
    margin-right: 20px;
}

.label-condividi {
    font-size: 12px;
    width: 100%;
}

footer {
    padding-top: 30px;
    padding-bottom: 30px;
    background: #f5f5f5;
}

footer * {
    font-size: 12px;
}

/**
 * TOP element
 */

.top-20 {
    margin-top: 20px;
}

.top-40 {
    margin-top: 40px;
}

.top-50 {
    margin-top: 50px;
}

.top-75 {
    margin-top: 75px;
}

.bottom-40 {
    margin-bottom: 40px;
}

.bottom-50 {
    margin-bottom: 50px;
}

.bottom-75 {
    margin-bottom: 75px;
}

.padding-50 {
    padding: 75px 4%;
}

.font-400 {
    font-weight: 400;
}

.right-20 {
    margin-right: 20px;
}

.no-padding {
    padding-left: 0!important;
    padding-right: 0!important;
}

.left-15 {
    margin-left: 15px;
}

/**
 * BUTTON
 */

.btn-primary {
    padding: 10px 20px;
    border: 1px solid #005295;
    border-radius: 8px;
    background: #ffffff;
    color: #005295;
    text-transform: uppercase;
}

.btn-primary:hover {
    background: #005295;
    border: 1px solid #005295;
}

.btn-reverse{
    padding: 10px 20px;
    border: 1px solid #005295;
    border-radius: 8px;
    background: #005295;
    color: #FFFFFF;
    text-transform: uppercase;
}

.btn-reverse:hover {
    border: 1px solid #ffffff;
    background: #005295;
    color: #FFFFFF;
}

/**
 * PAGINE INTERNE
 */

.top-banner
{
    padding-top: 120px;
    padding-bottom: 120px;
    background-position: left top;
    background-size: cover;
    background-repeat: no-repeat;
}

.top-banner h1 {
    text-align: center;
    font-size: 53px;
    font-weight: 400;
    text-transform: uppercase;
}

#filters {
    width: 100%;
    padding-top: 20px;
    padding-bottom: 20px;
    text-align: center;
}

#filters .btn-outline-primary {
    border: 0;
    color: #000;
    text-transform: uppercase;
    font-weight: 400;
    border-bottom: 1px solid #FFF;
    border-radius: 0;
}
#filters .btn-outline-primary:hover,
#filters .btn-outline-primary:active,
#filters .btn-outline-primary:focus
{
    border: 0;
    color: #000;
    background: #FFF;
    box-shadow: none;
}

.filter-active {
    border-bottom: 1px solid #005295!important;
    color: #005295!important;
    font-weight: 700;
}

.slick-prev {
    z-index: 9999999999999;
    position: absolute;
    left: 10px!important;
    top: 50%;
}

.slick-next {
    z-index: 9999999999999;
    position: absolute;
    right: 10px!important;
    top: 50%;
}

.side-by-side {
    display: flex;
    align-items: center;
    flex-direction: row;
    justify-content: center;
}

div.text-white *{
    color: #FFF!important;
}

.image-100 {
    padding-bottom: 400px;
    background-position: center;
    background-size: cover;
}

.form-control {
    border-radius: 0;
    padding: 20px 10px;
}

.btn-white {
    background: #FFF;
    color: #000;
    border-radius: 0;
    padding: 10px 30px;
    width: 100%;
}

.youtube-player {
    padding-top: 20px;
    padding-bottom: 20px;
    background: #FF0000;
}

.youtube-player h3 {
    text-align: center;
    color: #FFF;
}

.youtube-player h3 .fab {
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px;
    color: #FFF;
    font-size: 40px;
}

.youtube-player h3 span {
    display: inline-block;
    vertical-align: middle;
    margin-right: 20px;
    color: #FFF;
    font-size: 30px;
}

@media screen and (max-width: 1199px){

    .sm-width-100 {
        width: 100%!important;
    }
}

@media screen and (max-width: 991px){

    .whatsapp-icon{
        margin-left: 30px;
        margin-bottom: 20px;
        margin-top: 20px;
    }


    #intro h1 {
        color: #005295;
        font-size:  40px;
        font-weight: 400;
    }

    #intro h2 {
        font-size: 30px;
        font-weight: 400;
    }

    #intro h5 {
        color: #005295;
        font-size: 16px;
        font-weight: 400;
    }

    .sm-font-h3 {
        font-size: 26px;
        text-transform: uppercase;
    }

}

.btn-reverse-hover:hover {
    padding: 10px 20px;
    border: 1px solid #005295;
    border-radius: 8px;
    background: #ffffff;
    color: #005295;
    text-transform: uppercase;
}

.fa-xs {
    font-size: 20px!important;
}

@media screen and (max-width: 676px){
    .hide-on-mobile {
        display: none;
    }

    .sm-top-25 {
        padding-top: 40px;
    }
}

@media screen and (max-width: 768px){
    #progetti .bg-progetto {
        min-height: 30vh!important;
    }

    .sm-left-right-20 {
        padding-left: 30px;
        padding-right: 30px;
    }

    .padding-50 {
        padding: 50px 4%;
    }

    #section-icone {
        padding-top: 50px;
        padding-bottom: 0px;
    }

    .slick-dots {
        display: none!important;
    }

    .slick-dotted.slick-slider {
        margin-bottom: 0!important;
    }

    .section-75 {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .top-banner {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    footer,
    footer *,
    footer .text-right{
        text-align: center!important;
    }

    .creativy-logo {
        height: 45px;
    }

    .icona-servizi {
        height: 100px;
        width: auto!important;
        margin-top: 20px;
    }

    #elenco-servizi .container-fluid .top-75 {
        margin-top: 20px;
    }
    #elenco-servizi .container-fluid .bottom-75 {
        margin-bottom: 20px;
    }

    .veil-progetto h4 a {
        font-size: 26px;
    }
}

.img-fullscreen {
    width: 100%;
}

.text-red {
    color: #FF0000;
}

.thumb-banner {
    height: 50px;
    margin-right: 20px;
}
.thumb-banner-issuu {
    height: 45px;
    margin-right: 20px;
}

.section-70 {
    margin-top: 70px;
    margin-bottom: 70px;
}

.fancybox-button {
    background: #FFF!important;
}

form input,
form textarea{
    color: #0f0f0f!important;
}

.element-with-video-bg {
    height: 600px;
}

@media screen and (max-width: 991px){
    .element-with-video-bg {
        height: 20vh;
    }
}