/* width-tob default 1440*/
#section_top{
            background-color: rgba(244, 242, 121, 0.8);
            background-repeat: no-repeat;
            background-size: cover;
        }
span.center_horizontal_arrow,
span.center_horizontal_up{
    display: block;
    position: absolute;
    z-index: 2;
    width: 100%;
    text-align: center;
}
span.center_horizontal_arrow a,
span.center_horizontal_up a{
    text-decoration: none;
    color: #22244C;
}
span.center_horizontal_arrow{
    /*position: absolute;*/
    bottom: 0px;
}
.arrow_down{
    bottom: 0px;
}
.arrow_up{

    top: 0px;
}
 #section_bottom,
 #section_bottom_tablet{
    background-color:rgba(244, 242, 121, 0.8);
}
.centra{
     display: flex;
     align-items: center;
}

#centra_contenuto{
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

#eventcontainer{
    text-align: center;
    width: 100vw;
        margin-bottom: 3%;
   }
#eventcontainer h1{
    display: none;
}
.right{
    float: right;
}
.left{
    float: left;
}

.eventone{
    height: auto;
    width: auto;
    display: inline-block;
    box-shadow: 0 0 40px #000000;
    margin-top: 2%;
    background-color: yellow;
    
}

.evento{
    width: 83vw;
    display: inline-block;
    height: 13vw;
    background-color: yellow;
}

.preview{
    width: 17%;
    height: 90%;
    margin: 1% 0;

}
.left.preview{
 
    margin-left: 1%;      
    
}
.right.preview{
        margin-right: 1%;  
}
.evento h1{
    margin-top:2%; 
    display: block !important;
    
}
.lefth1{
    float: left;
    margin-left: 2%; 
    font-size: 2.5vw
    
}
.righth1{
        float: right;
        margin-right: 2%;
        font-size: 2.5vw
}
.evento h3{
    margin-top:2%;
}
.lefth3{
    float: left;
    margin-left: 2%;
    font-size: 1.5vw;
    
}
.righth3{
    float: right;
    margin-right: 2%;
    font-size: 1.5vw;
}

.evento p{
    display: inline-block;
    margin-top:4%;
    font-size: 1.2vw;
 
}
.leftp{
    margin-left: 40%;      
    
}
.rightp{
    margin-right: 40%;  
}

.arrow{
   
    display: inline-block;
    width: 70%;
    height: 31%;
    background-image: url(../img/Arrow_bottom.png);
    background-repeat: no-repeat;
    background-size: contain;
    cursor: pointer;
}

.left.arrow{
    margin-left: 35%;      
    
}
.right.arrow{
    margin-right: 35%;  
}
.showevento{
    display: none;
}

 .showevento p{
    display: inline-block !important;
    width: 83vw;
    display: none;
    margin-bottom: 0;
    font-family: sans-serif;
    height: 7vw;
    background-color: yellow;
    font-size: 1.2vw;
    text-align: left;
    padding: 0 31px;
    
}

@media (max-width: 2560px) and (min-width: 1445px){
    
}

@media (max-width: 1024px){

 
}

@media (max-width:767px){

    #eventcontainer{
        margin-top:15%;
    }
}

@media (max-width:600px){
 

}
  
@media (max-width:425px){

    #eventcontainer h1{
        display: block;
        margin-top: 10%;
        font-size: 8vw; 
    }
    .evento {
        height: 25vw;
    }
    .evento img{
        width: 25%;
    }
    .evento p{
        font-size: 2.2vw;
    }
    .leftp{
        margin-left: 15%;
    }
    .rightp{
        margin-right:15%;
    }
    .evento h1 {
        margin-top: 4% !important;
        font-size: 2.9vw !important;
    }
    .evento h3{
        margin-top: 5%;
        font-size: 2.5vw;
    }
    .left.arrow {
        margin-left: 25%;
    }
    .left.arrow {
        margin-right: 25%;
    }
    .showevento p{
        height: 31vw;
        font-size: 2.5vw;
    }
}


@media (max-width:320px){
    .evento h3 {
        margin-top: 2%;
    }
}