/*==================================================================================================================================================
bg
===================================================================================================================================================*/

.bg-manual {
    background-image: url(/_2021/modules/Site/Imballaggi/bg.jpg);
    background-size: cover;
    background-position: center;
    height: 700px;
    position: relative;
    width: 100%;
}
/*.bg-manual::before{
    content: '';
    background: rgba(0,0,0,.4);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}*/

/*==================================================================================================================================================
general
===================================================================================================================================================*/

.p-150{padding: 0 150px;}
.btn-danger {
    color: #fff;
    background-color: rgb(4, 162, 238);
    border-color: rgb(4, 162, 238);
    padding: 0.375rem 4rem;
}
.btn-danger:hover,
.btn-danger:active,
.btn-danger:focus{
    color: rgb(4, 162, 238);
    box-shadow: none !important;
    background-color: #fff !important;
    border-color: #fff !important;
}
#manuale .btn-danger:hover{border-color: rgb(4, 162, 238) !important;}
.dy-none{display: none;}

/*==================================================================================================================================================
filtro
===================================================================================================================================================*/

#filtro{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 100%;
    color: #fff;
}
#manuale{color: #000;}
#manuale h2{margin-bottom: 0; font-weight: 400; }
#manuale h3{color: rgb(4, 162, 238); font-size: 1.4rem;}
#filtro h1{font-weight: 400; font-size: 3rem;}
#filtro p{font-weight: 100; font-size: 1.3rem;}
#manuale p{font-size: 1rem;font-weight: 500;color: #212529;letter-spacing: .1rem; margin-bottom: 0;}
#manuale .cod-prod-man{margin-bottom: 10px;}
#filtro option{font-size: .9rem; color: #000;}
.form-select:focus {border-color: transparent; outline: 0; box-shadow: unset;}
#manuale img{width: 300px; height: auto; margin: 0 auto 1.5rem;}
#manuale .pdf_download a{
    color: #212529;
    display: block;
    font-size: .9rem;
    text-decoration: none;
}
#manuale .pdf_download a:hover{color: rgb(4, 162, 238);}
#box-manuale{
    width: 700px;
    margin: 0 auto;
    box-shadow: 1px 1px 10px #cacaca;
    border-radius: 10px;
    padding: 30px;
}
#box-manuale h2{font-size: 1.8rem;}
.pdf_download{text-align: left; margin-left: 28%;}

/*================================================
Registra prodotto
=================================================*/

#box-manuale.registraprodotto h3{color: #000; margin-bottom: 1rem; font-size: 1.3rem;}
#box-manuale.registraprodotto p{font-size: .9rem;}

/*================================================
Preloader Area
=================================================*/

.preloader {
  position: fixed;
  z-index: 999999;
  background-color: #ffffff;
  width: 100%;
  height: 100%;
  text-align: center;
  left: 0;
  right: 0;
}
.loader{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.triple-spinner {
  display: block;
  position: relative;
  width: 125px;
  height: 125px;
  border-radius: 50%;
  border: 4px solid transparent;
  border-top: 4px solid rgb(4, 162, 238);
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}
.triple-spinner::before,
.triple-spinner::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  border: 4px solid transparent;
}
.triple-spinner::before {
  top: 5px;
  left: 5px;
  right: 5px;
  bottom: 5px;
  border-top-color: rgb(4, 162, 238);
  -webkit-animation: spin 3s linear infinite;
  animation: spin 3.5s linear infinite;
}
.triple-spinner::after {
  top: 15px;
  left: 15px;
  right: 15px;
  bottom: 15px;
  border-top-color: rgb(4, 162, 238);
  -webkit-animation: spin 1.5s linear infinite;
  animation: spin 1.75s linear infinite;
}
@-webkit-keyframes spin {
  from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}
@keyframes spin {
  from {-webkit-transform: rotate(0deg);transform: rotate(0deg);}
  to {-webkit-transform: rotate(360deg);transform: rotate(360deg);}
}

/*================================================
Aggiornamenti
=================================================*/

.bg-manual .form-control,
.bg-manual label,
#manuale .pdf_download a{font-weight: normal;}
.bg-manual .col-lg-6{text-align: left;}
.bg-manual .form-control{letter-spacing: unset;}

/*================================================
Responsive
=================================================*/

@media screen and (max-width: 1199px){
    .p-150{padding: unset;}
    #filtro form .row:nth-child(2){margin-top: 0rem !important;}
}
@media screen and (max-width: 1199px){
    #first{margin-top: 1rem;}
    #filtro form .btn-danger{width: 100%;}
}
@media screen and (max-width: 767px){
    #filtro div.mt-5{margin-top: 1rem !important;}
    #manuale{position: relative; top: unset; left: unset; transform: none; margin: 1rem 0;}
    #box-manuale{width: unset;}
    #filtro p{font-size: 1rem;}
    #filtro h1{font-size: 2rem;}
    .pdf_download{margin-left: 21.5%;}
}
@media screen and (max-width: 575px){
    .form-select-lg{font-size: 1rem !important;}
    .pdf_download{margin-left: 23.5%;}
}
@media screen and (max-width: 480px){
    #filtro p{font-size: .9rem;}
    .pdf_download{margin-left: 17.5%;}
}
@media screen and (max-width: 425px){
    #filtro h1{font-size: 1.7rem;}
    #manuale h3{font-size: 1.2rem;}
    .bg-manual .form-control-lg{font-size: 1rem !important;}
    #box-manuale h2{font-size: 1.4rem;}
    #box-manuale a.btn-danger{font-size: .9rem; width: 100%;}
    .pdf_download{margin-left: 11.5%;}
}
@media screen and (max-width: 400px){
    #box-manuale{padding: 20px;}
    .pdf_download{margin-left: 9%;}
}
@media screen and (max-width: 380px){
    .pdf_download{margin-left: 8%;}
}
