/*FONT FRECCIA per safarii*/
@font-face {
    font-family: 'icomoon';
    src:  url('../font/freccia/icomoon.eot')  format('embedded-opentype'),
        url("../font/freccia/icomoon.ttf") format('truetype'),
        url("../font/freccia/icomoon.woff") format('woff'),
        url("../font/freccia/icomoon.svg")format('svg');
}

/*FONT FRECCIA*/
.icon-arrow_01:before {
    content: "\76";
}

/*font akzidenz*/
@font-face {
    font-family: akzidenz_regular;
    src: url("../font/Berthold-Akzidenz-Grotesk-Regular.woff") format('woff'),
    url("../font/Berthold-Akzidenz-Grotesk-Regular.ttf") format('truetype');
}

@font-face {
    font-family: akzidenz_medium;
    src: url("../font/Berthold-Akzidenz-Grotesk-Medium.woff") format('woff'),
    url("../font/Berthold-Akzidenz-Grotesk-Medium.ttf") format('truetype');
}

@font-face {
    font-family: akzidenz_bold;
    src: url("../font/Berthold-Akzidenz-Grotesk-Bold.woff") format('woff'),
    url("../font/Berthold-Akzidenz-Grotesk-Bold.ttf") format('truetype');
}



html, body{
    background-color: #FFFAF0 !important;
    width: 100%;
    height: 100%;
}

.video_ar{
    position: relative;

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.video_verticale{
    display: none !important;
}

.position{
    position: absolute;
    top: 5%;

    height: 95%;
}

.intestazione_video{
    background-color: none;
}

.titolo_video{
    font-family: akzidenz_bold;
    color: #FAF6EE;
    /*font-size: 60px;*/
}


/*NON PRENDE IL MEDIUM*/
.sottotitolo_video{
    font-family: akzidenz_medium;
    /*font-size: 48px;*/
    color: #FAF6EE;
}

.bottone{
    background-color: #0A4BA6;
    width: 350px;
    height: 65px;
    border-radius: 5px;

    color: #FAF6EE;

    display: flex;

    position: absolute;
    bottom: 10%;

    cursor: pointer;

    animation: shadow-pulse 1s infinite;
}

.text_bottone{
    font-family: akzidenz_regular;
    font-size: 35px;
    /**/
    color: #FFFCF6;

    padding-top: 8px;
    padding-left: 15px;

    flex: 80%;
}

.testo_freccia_bottone{
    font-family: icomoon;
    font-size: 35px;
    /**/
    padding-top: 6px;
    text-align: center;
    color: #FFFCF6 !important;
    flex: 20%;
}

@keyframes shadow-pulse
{
  0% {
    /*box-shadow: 0 0 0 0px rgba(130, 173, 233, 0.8);*/     /*nostro blu chiaro*/
    /*box-shadow: 0 0 0 0px rgba(10, 75, 166, 0.4);*/       /*nostro blu scuro*/
    box-shadow: 0 0 0 0px rgba(70, 126, 203, 0.8);         /*via da mezz*/
  }
  100% {
    box-shadow: 0 0 0 20px rgba(130, 173, 233, 0);
  }
}

/*carte*/
.generale_carte{
    position: relative;

    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.box_carte{
    margin-top: 5%;
    display: flex;
}

.carte{
    flex: 50%;
    background-color: #f0ebe4;
    /* height: 330px; */
    height: auto;
    border-radius: 5px;
}

.margine_destro{
    margin-right: 10px;
}

.contenuto_carte{
    margin: 30px;
}

.titolo_carta{
    font-family: akzidenz_bold;
    /*font-size: 38px;*/
    color: #1e1e1e;
}

.testo_carta{
    font-family: akzidenz_regular;
    /* font-size: 20px; */
    /*font-size: 24px;*/
    color: #1e1e1e;
}

.imagine_carta{
   background-image: url("../img/ar/screen_ar.jpg");
    height: 100%;
    /* background-position: center;  */
    background-repeat: no-repeat; 
    background-size: cover;

    border-radius: 5px;

}

/* .generale_footer{
    background-color: #F0ECE4;
    height: 160px;

    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 10%;
}

.box_footer{

    position: absolute;

    /*margin-top: 5%;
} */

.loghi{
    display: flex;

}

.logo{
    flex: 50%;
}

.logo img{
   /* height: 50%;*/
  height: 10vh;
}

.sssaa {
    text-align: right;

}

.footlogo {
    height: 40px !important;
    margin: 10px;
}


/*RESPONSIVE*/
  
/*Schermi Dekstop o Portatili*/
@media screen and (max-width:1689px){  
}

/*tablet in modalità orizzontale*/
@media screen and (max-width: 1279px){  
    /*altezza carte*/
    .carte{
        /* height: 430px; */
        height: auto;
    }
}

/*margini bootstrap_03*/
@media only screen and (max-width: 767px){

    /*responsive carte*/
    .contenuto_carte{
        margin: 20px;
    }
    .carte{
        /* height: 500px; */
        height: auto;
    }

}

/*tablet in modalità verticale*/
@media screen and (max-width: 736px){  
    /*carte su una colonna*/
    .box_carte{
        display: block;
    }

    .margine_destro{
        margin-right: 0px;

        margin-bottom: 10px;
    }
    
    .carte{
        display: block;
    }

    .carte{
        height: 365px;
    }

    .titolo_carta{
        padding-top: 30px;
    }

}

/*cel*/
@media screen and (max-width: 480px){
    /*footer_loghi*/
    .logo img{
        /* height: 50%;*/
       height: 7vh;
     }

     /*video*/
     .video_orizzontale{
        display: none;
    }

    .video_verticale{
        display: block !important;
    }

    .bottone{
        background-color: #0A4BA6;
        width: 93.5%;
        height: 65px;

        /*padding: 8px 0px 8px 15px;*/
        display: flex;
        align-items: center;
        padding-left: 15px;
        padding-top: 3px;
    }

    .text_bottone{
        margin: 0px;
        /*padding: 8px 0px 8px 15px;*/
       /*padding:2% 0% 2% 4%;*/
       /*padding: 2%;*/
       padding: 0px;

       font-size: 30px;
    }

    .testo_freccia_bottone{
        margin: 0px;
        /*padding: 6px 0px 6px 0px;*/
        padding: 0px;

        font-size: 30px;
    }


    /*carte*/
    .carte{
        height: 380px;
    }
}

/*per carte*/
@media screen and (max-width: 464px){
    .carte{
        height: 450px;
    }
}

/*per carte2*/
@media screen and (max-width: 384px){
    .carte{
        height: 525px;
    }
}

/*bottone*/
@media screen and (max-width: 365px){
    .text_bottone, .testo_freccia_bottone  {
        font-size: 25px;

    }
  
  } 

@media (max-width:348px) {
    .footlogo {
      height: 25px !important;
      margin: 10px;
    }
}
/*cel*/
@media screen and (max-width: 320px){
    .carte{
        height: 540px;
    }  
}