@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

h1, h2, h3, h4, h5, h6 {
  font-family: 'Roboto', sans-serif;
}

h1 { font-size: 36px !important;}
h2 { font-size: 30px !important;}
h3 { font-size: 24px !important;}
h4 { font-size: 18px !important;}
h5 { font-size: 14px !important;}
h6 { font-size: 12px !important;}

.content-header>.breadcrumb { position: initial !important;}
.box-attivazione { padding: 5px 0px!important;}
.content-header { min-height: 60px !important;}
.info-box-text { font-weight: bolder;}
.box-okfile {width: 85%; float: left; height: 36px; border: 0px solid;}
.btn-okfile {width: 15%; float: left;}
.fl{float:left}
.fr{float:right}
.rigaFree {padding: 9px 13px}

.small-box h3 { font-size: 26px !important;}

label { margin-top: 5px}
.txtc { text-align:center;}
.txtr { text-align:right;}
.txtl { text-align:left;}
.txtj { text-align:justify;}

.txtBold { font-weight: bold; }

.rosso { color: #FF0000}

.bgBluChi { background-color: #ABCDEF}
.bgVerMen { background-color: #98FF98}
.bgRosVen { color: #000000 !important; background-color: #f8877d !important;}

.bgColGrey05 { background-color: #F7F7F7 }
.bgColGrey10 { background-color: #EFEFEF }
.bgColGrey15 { background-color: #E1E1E1 }
.bgColGrey20 { background-color: #D2D2D2 }
.bgColGrey25 { background-color: #C0C0C0 }
.bgColGrey30 { background-color: #B2B2B2 }
.bgColGrey35 { background-color: #A2A2A2 }
.bgColGrey40 { background-color: #8F8F8F }
.bgColGrey50 { background-color: #808080 }
.bgColGrey60 { background-color: #5F5F5F }
.bgColGrey70 { background-color: #4F4F4F }
.bgColGrey75 { background-color: #404040 }
.bgColGrey80 { background-color: #2F2F2F }

.noborder { border: 0px !important;}
.nomargin { margin: 0px !important;}
.nopadding { padding: 0px !important;}

.margin2px { margin-top: 2px !important;  margin-bottom: 2px !important;}

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

.marginTop20 {margin-top: 20px !important;}
.marginBot20 {margin-bottom: 20px !important;}
.marginSx10 {margin-left: 10px !important;}
.marginDx10 {margin-right: 10px !important;}

.paddingTop20 {padding-top: 20px !important;}
.paddingTop15 {padding-top: 15px !important;}
.paddingTop10 {padding-top: 10px !important;}
.paddingBot20 {padding-bottom: 20px !important;}

.box2per { position: relative; border-radius: 3px; border-top: 3px solid #3c8dbc; border-bottom: 3px solid #3c8dbc; padding: 5px; margin: 10px 0px 5px 0px !important; width: 100%; }

.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th {vertical-align: middle!important;}
th {text-align: center!important;}

.mb5{margin-bottom: 5px !important;}
.pl0{padding-left: 0px !important;}
.pr5{padding-right: 5px !important;}
.pt5{padding-top: 5px !important;}
.pt9{padding-top: 9px !important;}

.bgriga01 { color: #000000 !important; background-color: #bde6fa !important;}
.bgriga02 { color: #000000 !important; background-color: #b6f7c5 !important;}

.bgcolorred { background-color: #FDD7E4 !important;}

.ColRigbase { background-color: #FFFFFF !important;}
.ColRigopshop { background-color: #E75480 !important;}
.ColRigprezzi { background-color: #96DED1 !important;}
.ColRigspedizioni { background-color: #DAA520 !important;}

/* sezione nuovi colori blocco va con BCKcolorv e color*/

.line25 {line-height:25px !important;}
.line30 {line-height:30px !important;}
.line35 {line-height:35px !important;}
.line40 {line-height:40px !important;}
.line70 {line-height:70px !important;}

.hgt25 {height:25px !important;}
.hgt30 {height:30px !important;}
.hgt35 {height:35px !important;}
.hgt40 {height:40px !important;}
.hgt50 {height:50px !important;}
.hgt70 {height:70px !important;}
.wdt40 {width:40px !important;}
.wdt60 {width:60px !important;}

.info-box-icon2-geo {
border: 2px;
margin: 4px auto;
padding-top: 8px;
padding-left: 8px;
border-top-left-radius: 4px;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
display: block;
height: 30px;
width: 30px;
font-size: 14px;
line-height: 14px;
background: rgba(0, 0, 0, 0.2);
}


.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9,
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
  float: left;
  vertical-align: middle;
/*  text-align: center;*/
}

.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
/*  padding: 0px !important;*/
}

.text-label {text-align:center;}

.small-box {text-align:center;}

.pagination{margin:24px 0}
.pagination ul{display:inline-block;*display:inline;*zoom:1;margin-left:0;margin-bottom:0}
.pagination ul>li{display:inline}
.pagination ul>li>a,.pagination ul>li>span{float:left;padding:4px 12px;line-height:24px;text-decoration:none;background-color:#fff;border-left-width:0}
.pagination ul>li>a:hover,.pagination ul>li>a:focus,.pagination ul>.active>a,.pagination ul>.active>span{background-color:#f5f5f5}
.pagination ul>.active>a,.pagination ul>.active>span{color:#999;cursor:default}
.pagination ul>.disabled>span,.pagination ul>.disabled>a,.pagination ul>.disabled>a:hover,.pagination ul>.disabled>a:focus{color:#999;background-color:transparent;cursor:default}
.pagination ul>li:first-child>a,.pagination ul>li:first-child>span{}
.pagination-centered{text-align:center}
.pagination-right{text-align:right}
.pagination-large ul>li>a,.pagination-large ul>li>span{padding:11px 19px;font-size:17.5px}
.pagination-small ul>li>a,.pagination-small ul>li>span{padding:2px 10px;font-size:11.9px}
.pagination-mini ul>li>a,.pagination-mini ul>li>span{padding:0 6px;font-size:10.5px}

.pagination{margin-top:0}

.pagination .counter{font-size:11px;margin-bottom:12px;float:none;text-align:center}
.pagination-list{padding:24px 0;display:block;width:100%;text-align:center;border-top:1px solid #e5e5e5}
ul.pagination-list li:first-child{margin-left:30px}
.pagination ul>li{}
.pagination ul>li>a{margin-left:1px;background-color:#fff;font-size:12px;text-align:center;border-left:1px solid #f2f2f2;float:none;margin:0;position:relative;padding:15px}
.pagination ul>li.disabled{font-size:14px}
.pagination ul>li.disabled a{line-height:21px;border:0}
.pagination ul>li.disabled a:hover{background-color:#fff}
.pagination ul>li>a:hover,.pagination ul>li>a:focus,.pagination ul>.active>a,.pagination ul>.active>span{background-color:#f2f2f2;color:#444}

.box-header { padding: 5px!important;}
.box-attivazione { padding: 5px 0px!important;}

/* Box */
.box-video-gen { margin-top: 10px; padding: 5px!important;}
.box-video-old {background-color: #ffdede!important;} /* Box rosso */
.box-video-att {background-color: #d6ffd5!important;} /* Box verde */
.box-video-new {background-color: #ffffbf!important;} /* Box giallo */
.box-video-tem {background-color: #d5eaff!important;} /* Box celeste */
.box-video-alt {background-color: #ffd5f4!important;} /* Box rosa */

.back-rossochiarop {background-color: #ffdede!important;}
.back-rossop {background-color: #ff82a0!important;}
.back-rosap {background-color: #ffd5f4!important;}
.back-rosacipriap {background-color: #ffe0e6!important;}
.back-carotap {background-color: #f1d3b2!important;}
.back-zuccap {background-color: #e9c4a6!important;}
.back-ametistap {background-color: #d9c6e5!important;}
.back-verdep {background-color: #d6ffd5!important;}
.back-verdesmeraldop {background-color: #c1eccf!important;}
.back-giallop {background-color: #ffffbf!important;}
.back-bluep {background-color: #d5eaff!important;}
.back-azzurrop {background-color: #bedaf1!important;}
.back-turchesep {background-color: #b8e6dc!important;}
.back-asfaltop {background-color: #b9bfc6!important;}
.back-cementop {background-color: #dce1e1!important;}
.back-nuvolep {background-color: #f9fbfa!important;}
.back-argentop {background-color: #e9eaec!important;}

.hr-titolo { margin-top: 5px !important; margin-bottom: 5px !important; }

.info-box-icon2 {margin-top: 4px; padding: 7px 8px; border-radius: 6px; font-size: 15px;}

.elemButton{height:30px;padding:0px 2px;background-color:#293133;color:#ffffff;border-top:1px solid#708090;float:left;}
.elemButton{height:30px;padding:0px 2px;background-color:#293133;color:#ffffff;border-top:1px solid#708090;float:left;}
.elemButtPlus {border-right:1px solid#708090;}
.elemButton a {color:#DDD; font-weight: bold; float:left; display: block;padding: 5px 5px;}
.elemButton:hover{height:30px;padding:0px 2px;color:#FFF;background-color:#000;border-top:1px solid#708090;}

.elemArr{float:left;padding:5px 2px 4px 2px;background-color:#293133;border-top:1px solid#708090;}
.cRedPast{color:#ff6961}
.cGrePast{color:#7D7;border-right:1px solid#708090;}
.cRedPast:hover{color:#F00;background-color: #000}
.cGrePast:hover{color:#0F0;background-color: #000}

.elemButtonSel{color:#FFF;background-color:#708090}
.elemOgg{width:100%;height:0px;padding:0px;visibility:hidden;color:#FFF;background-color:#708090}
.elemOgg input{color:#000}
.elemOgg select{color:#000}
.elemLabel{width:80%;float:left}

.time05 {background-image: url("/img/time05.jpg"); background-size:100% 11px;background-repeat: no-repeat;}
.time10 {background-image: url("/img/time10.jpg"); background-size:100% 11px;background-repeat: no-repeat;}

@media (min-width: 768px) {
  .text-label {text-align:right;}
}
@media (min-width: 992px) {
  .text-label {text-align:right;}
}
@media (min-width: 1200px) {
  .text-label {text-align:right;}
}

.MenuSezTitolo {
  margin: 20px auto;
  border: #cccccc solid 2px; 
  box-shadow: 0 2px 4px 2px #00000020;
  border-radius: 999px;
  padding: 0.5rem 1rem;
  width:80%;
}

.MenuSezProd {
  margin: 20px 10%;
  border: #cccccc solid 1px; 
  box-shadow: 0 2px 4px 2px #00000020;
  border-radius: 20px;
  padding: 0.5rem 1rem;
  width:80%;
  overflow: hidden;
}

.MenuSezTitolo h2{
  padding: 20px;
}

.imgBoxProd {
  width: 300px; /* Larghezza del box */
  height: calc(2/3 * 300px); /* Altezza del box, 2/3 della larghezza in percentuale */
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  overflow: hidden;
}

.imgBoxProd img {
  max-width: 100%;
  border-radius: 20px 0 0 20px;
  /*max-height: 100%;*/
  object-fit: contain;
  transform: translate(0%, -16%);
}

.txtBoxImg {
  width: calc(100% - 300px);
}

.txtBoxProd {
  width: 100%;
}

.image-container img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  margin: 10px;
}
.padBox { }

@media (max-width: 768px) {
  .MenuSezTitolo { 
    font-size: 24px;
    font-weight: bold;
    margin: 10px auto;
    border: #cccccc solid 2px; 
    box-shadow: 0 2px 4px 2px #00000020;
    border-radius: 999px;
    padding: 10px;
    width:100%;
  }

  .MenuSezProd {
    margin: 10px 0px;
    border: #cccccc solid 1px; 
    box-shadow: 0 2px 4px 2px #00000020;
    border-radius: 20px;
    padding: 0;
    width:100%;
  }

  .MenuProdTitolo{
    font-size: 20px !important;
    font-weight: bold;
  }

  .imgBoxProd {
    width: 100%; /* Larghezza del box */
    height: calc(2/3 * 300px); /* Altezza del box, 2/3 della larghezza in percentuale */
    border-radius: 20px 20px 0 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    overflow: hidden;
  }

  .txtBoxImg {
    width: 100%;
  }
  
  .txtBoxProd {
    width: 100%;
  }
}