/* ==========================================================
   BASE YOST - COLONNE E GRIGLIE
   Colonne/layout separati dalla base generale; nessuna rinomina dei selettori.
   ========================================================== */

.quattrocol .ycol1 .col {
    position: relative;
}

#inevidenza .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    justify-content: center;
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    -o-flex-wrap: wrap;
    flex-wrap: wrap;
}

.col-sm-4{  
width:33.33%;
padding: 0 15px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin-bottom:40px;}

.col-sm-4 small {
    
    display: none;
}

.trecol .ycol1 p {
    
    
    font-size: 24px;
    margin: 0 0 20px;
}

.container{
width: 96%; 
z-index:100;
max-width:1200px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
margin:0 auto;}

.container:after{   
clear:both;}

.grid_3{    
width: 30%;
float:right;
padding:0 15px 48px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}

.row:after{ 
clear:both}

.grid_3 ul li ul li a,.list2 li a{  
background:url(../Images/list.png) 0 7px no-repeat;
padding-left:15px;
background-size:8px 6px}

.grid_3 ul li{  
margin: 12px}

.grid_3 ul li a:before{ 
font-family:FontAwesome;
content:"";
color: #ef4523;
margin-right:10px}

.grid_3 ul li a{    
color:#aaa}

.grid_3 ul li a:hover{  
color:#ef4523}

.grid_3 ul li .text-footer{ 
display:block;
color:#fff;}

.grid_3 ul li .text-footer a:hover{ 
color:#e7e7e7;}

.evidenziato-cl1{   
float:left;
width:46%;
margin:1.5%}

.evidenziato-cl2{   
float:right;
width:46%;
margin:1.5%}

@media screen and (max-width:768px) {
.col-sm-top img{    
width:auto;
max-width:100%}

.grid_3{    
width:45%;
margin-bottom:30px}

.evidenziato-cl1,.evidenziato-cl2{  
float:none!important;
width:97%!important;
margin:20px 0!important}
}

@media screen and (max-width:600px) {
.grid_3 {
    width: 100%;
}
}

@media screen and (max-width:440px) {
.evidenziato-cl1,.evidenziato-cl2{  
float:none!important;
width:92%!important;
margin:10px auto!important}
}

/* ==========================================================
   YOST - SISTEMA COLONNE RECUPERATO DA yostcss.css ESTERNO
   ========================================================== */

.duecol,
.trecol,
.quattrocol {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

.duecol .ycol1 {
    width: 50%;
}

.duecol .ycol1 .col {
    margin: 0 15px 30px;
    padding: 0;
}

.trecol .ycol1 {
    width: 33.33%;
}

.trecol .ycol1 .col {
    margin: 0 10px 30px;
    padding: 0;
}

.quattrocol .ycol1 {
    width: 25%;
}

.quattrocol .ycol1 .col {
    margin: 0 5px 30px;
    padding: 0;
}

.duecol.grid-right,
.duecol.grid-left {
    display: block;
}

.duecol.grid-right::after,
.duecol.grid-left::after {
    content: "";
    display: block;
    clear: both;
}

.duecol.grid-right .ycol1,
.duecol.grid-left .ycol1 {
    float: left;
}

.duecol.grid-right .col,
.duecol.grid-left .col {
    padding: 40% 0 0;
    height: 0;
    margin: 0;
    background: transparent;
    position: relative;
}

.duecol.grid-right .ycol1:first-child .col {
    padding: 80% 0 0;
}

.duecol.grid-left .ycol1:nth-child(2) {
    float: right;
}

.duecol.grid-left .ycol1:nth-child(2) .col {
    padding: 80% 0 0;
}

.duecol.grid-right .col .item,
.duecol.grid-left .col .item {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: 0 15px 30px;
    overflow: hidden;
}

@media screen and (max-width: 960px) {
    .quattrocol .ycol1,
    .trecol .ycol1 {
        width: 50%;
    }
}

@media screen and (max-width: 768px) {
    .duecol,
    .trecol,
    .quattrocol {
        display: block;
        margin: 0;
    }

    .duecol .ycol1,
    .trecol .ycol1,
    .quattrocol .ycol1 {
        width: 100%;
        max-width: 350px;
        margin: auto;
    }

    .duecol.grid-right .ycol1,
    .duecol.grid-left .ycol1,
    .duecol.grid-left .ycol1:nth-child(2) {
        float: none;
    }

    .duecol.grid-right .col,
    .duecol.grid-left .col {
        padding: 80% 0 0;
    }
}