﻿/*FONTS*/

@font-face {
    font-family: 'Coolvetica Rg';
    src: url('../fonts/CoolveticaRg-Regular.eot');
    src: url('../fonts/CoolveticaRg-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/CoolveticaRg-Regular.woff2') format('woff2'),
        url('../fonts/CoolveticaRg-Regular.woff') format('woff'),
        url('../fonts/CoolveticaRg-Regular.ttf') format('truetype'),
        url('../fonts/CoolveticaRg-Regular.svg#CoolveticaRg-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}


@font-face {
    font-family: 'Mustica Pro';
    src: url('../fonts/MusticaPro-SemiBold.eot');
    src: url('../fonts/MusticaPro-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/MusticaPro-SemiBold.woff2') format('woff2'),
        url('../fonts/MusticaPro-SemiBold.woff') format('woff'),
        url('../fonts/MusticaPro-SemiBold.ttf') format('truetype'),
        url('../fonts/MusticaPro-SemiBold.svg#MusticaPro-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}





/*generale*/
body{
    /*font-family: 'Oswald';*/
    font-family: 'Mustica Pro';
    background-color:#f0efef;
}
.page{
    width:100%;
    float:left;
}
.resize{
    max-width:100%;
}
.resize2{
    min-width:100%;
}
.resize3{
    min-width:100%;
    max-width:100%;
}
.margintop5{
    margin-top:5%;
}
.marginbott5
{
    margin-bottom:5%;
}
.marginbott2
{
    margin-bottom:2%;
}
.pad2{
    padding:2%;
}
.padbot2{
    padding-bottom:2%; 
}
.padright5{
    padding-right:5%;
}
.bkg-grey{
    background-color:#c5c5c5;
}

.bkg-lightgrey{
    background-color:#f0efef;
}
.bkg-red{
    background-color:#8c1422;
}

.nopadding{

    padding:0;
}
.quadro{
    display: flex;
    flex-wrap: wrap;
}

.bordo{
    margin:2%;
    width:96%;
    padding:1%;
    border:1px solid #333333;
}
.red{
    color:#8c1422;
}



/*sitemaster*/

.line{
    height:5px;
    background-color:#2a2a2a;
}
.footer{
    background-color:#2a2a2a;
    box-shadow: -1px -6px 24px -10px rgba(0,0,0,0.75);
    -webkit-box-shadow: -1px -6px 24px -10px rgba(0,0,0,0.75);
    -moz-box-shadow: -1px -6px 24px -10px rgba(0,0,0,0.75);
    padding-top:3%;
    padding-bottom:3%;
    color:#ffffff;
}
.footer strong{
    font-size:1.3em;
}
.box-call{
    padding:2%;
    border:2px solid #ffffff;
    width:250px;
    float:right;
    clear:both;
    margin-bottom:3%;
    font-size:1.2em;
    text-align:center;
}
.box-call:first-child{
    margin-top:2%;
}
.box-call a{
    color:#ffffff;
}
.box-call a:hover{
    color:#ffffff;
    font-weight:bold;
    text-decoration:none;
}
.box-call:hover{
    background-color:#808080;
}



/*MENU*/

.navbar{
    padding-top:20px;
    padding-left:15px;
    background-color:#887f65;
    border-radius:50px;
    height:60px;
    width:60px;
    text-align:center;
    position:fixed;
    top:20px;
    right:30px;
    z-index:98;
    cursor:pointer;
    box-shadow:#2a2a2a 2px 5px 20px;
}
.navbar:hover{
    background-color:#8c1421;
}

.icon-bar{
    display:block;
    width:60%;
    height:3px;
    background-color:#ffffff;
    margin-bottom:5px;
}
nav{
    width:100%;
    height:100%;
    position:fixed;
    top:0;
    left:0;
    padding-top:5%;
    background:#8c1422;
    z-index:68;
    transition: .3s;
    transform:translateX(-100%);

}

.wide{
    transform:translateX(0);

}

nav ul{
    list-style:none;
    padding:4%;
}

nav li{
    font-size:2em;
    color:#ffffff;
}
nav li a{
    color:#ffffff;
}
nav li a:hover{
    color:#ffd800;
}
nav li a:visited{
    color:#ffffff
}

@media (min-width: 1024px) {

    nav ul{
    padding:4%;
    }

    nav li{
        text-align:center;
        margin-bottom:3%;

    }

}




/*default*/

.testataH{
    background:url(../img/lorenzetti_viaggi.jpg) no-repeat center center;
    background-size:cover;
    min-height:500px;
}
.logo{
    float:left;
    width:100%;
    margin-top:15%;
}
.claim{
    float:right;
    width:98%;
    margin:1%;
    margin-top:50%;
    font-size:2em;
    color:#ffffff;
    font-family: 'Coolvetica Rg';
    text-shadow: 2px 2px 10px #333333 ;
}
.caption{
    background-color:#8c1421;
    padding:1%;
    width:200px;
    text-align:center;
    color:#ffffff;
    position:absolute;
    right:0;

}

.caption a{

    color:#ffffff;
}

.caption a:hover{
    color:#ffd800;
}

.caption a:visited{

    color:#ffffff;
}

@media (min-width: 425px) {

    .claim {
        margin-top: 30%;
    }
}

@media (min-width: 768px) {
    .logo{
        width:50%;
    }
    .claim {
        width:60%;
        font-size:3em;
        margin-top: 15%;
    }
    .caption{
        position:relative;
        font-size:20px;
        margin-left:40%;
    }
}


@media (min-width: 1024px) {
    .logo{
        width:30%;
        margin-top:5%;
        
    }
    .claim {
        width:50%;
        float:right;
        margin-top: 30%;
    }
}

@media (min-width: 1440px) {
        .logo{
        width:20%;
        margin-top:5%;
        
    }
    .claim {
        width:auto;
        text-align:right;
        font-size:5em;
        margin-top: 25%;
    }

        .testataH{

    min-height:700px;
}
}

@media (min-width: 1920px) {
     .logo{
        width:25%;
        margin-top:5%;
        
    }
    .claim {
        margin-right:10%;
        margin-top: 20%;
    }

}

.servizi{
    width:auto;
    float:left;
    background-color:#887f65;
    padding:10px;
    font-size:1.1em;
    font-weight:bold;
    color:#ffffff;
    margin-top:-15px;
}
.serv1{
    float:left;
    margin-left:5px;
    margin-right:5px;
    
}
.cerchio {
  width: 5px;
  height: 5px;
  margin-top:10px;
  background-color:#8c1421;
  border-radius: 50%;
  float:left;
}

@media (min-width: 1024px) {
    .servizi {
        font-size: 2em;
        margin-top:-25px;
        padding:1%;
    }

    .cerchio{
        margin-top:20px;

    }
    .serv1{

    margin-left:10px;
    margin-right:10px;
    
}

}

.bkgIter{
    background:url(../img/bkgIter.jpg) no-repeat bottom right;
    background-size:contain;
    min-height:500px;
    padding-top:10%;
    font-size:1.5em;
}
@media (min-width: 1600px) {

    .bkgIter{
    background:url(../img/bkgIter.jpg) no-repeat top right;
    min-height:1000px;
    padding-top:5%;
    font-size:1.5em;
}
}
.titoletto{
    font-size:1.8em;
    color:#8c1422;
    float:right;
    padding-right:10%;
    text-align:right;
    margin-top:3%;
}
.presentazione{
    line-height:2em;
    text-align:center;
    font-size:0.8em;
    padding:2%;
}
.trasferimento{
    background-color:#887f65;
    padding:1%;
    margin-bottom:3%;
    color:#ffffff;
}

@media (min-width: 1440px) {
    .trasferimento {
        margin-left:20%;
        width:80%;
        padding:2%;
        margin-bottom:5%;

    }
}

@media (min-width: 1900px) {
    .trasferimento {
        margin-left:30%;
        width:70%;
        padding:2%;
        margin-bottom:5%;
        font-size:1.3em;

    }
}


.base{
         background:url(../img/ncc_pinzolo_768.jpg) no-repeat top center;
         min-height:400px;
}

@media (min-width: 768px) {
    .base {
       background:url(../img/ncc_pinzolo.jpg) no-repeat top center;
       min-height:600px;
    }
}

.claim2{
    background-color:#2a2a2a;
    color:#ffffff;
    font-size:2em;
    z-index:999;
    width:auto;
    float:right;
    padding:1%;
    margin-top:-2%;
}

@media (min-width: 1440px) {
    .claim2{
        font-size:3em;
        padding-right:3%;
    }
}

.box1{
    background-color:#2a2a2a;
    color:#ffffff;
    padding:2%;
    width:auto;
    max-width:400px;
    float:left;
    margin:2%;
    font-size:1.2em;
}
.box1 strong{
    color:#ffd800;
}

/*mezzi*/

.testataM{
    background:url(../img/lorenzetti_viaggi2.jpg) no-repeat center center;
    background-size:cover;
    min-height:500px;
}

.nomeMezzo{
    font-size:1.5em;
    float:left;
    width:100%;
    background-color:#8c1422;
    color:#ffffff;
    padding:1%;

}


/*territorio*/

.testataT{
    background:url(../img/lorenzetti_viaggi3.jpg) no-repeat center center;
    background-size:cover;
    min-height:500px;
}
.testoT{
    width:94%;
    margin-top:3%;
    padding:2%;
    background-color:#c5c5c5;
    font-size:1.2em;
}

@media (min-width: 1024px) {
    .testoT{
        margin-top:10%;
    }
}
.map{
    background-color:#c5c5c5;
}



/*contatti*/
.testataC{
    background:url(../img/lorenzetti_viaggi4.jpg) no-repeat center center;
    background-size:cover;
    min-height:500px;
}

/*modulo di contatto*/

.modulo{
    width:100%;
    float:left;
    border-radius:5px;
    text-align:left;
    font-size:1em;
    color:#333333;
    margin-top:2%;
    margin-bottom:2%;
}

.tit-mod{

    font-family: 'geosanslightregular';
    margin:1%;
    color:#ffffff


}

.box50m{
    float:left;
    width:98%;
    margin:1%;
}

.box30m{
    float:left;
    width:98%;
    margin:1%;
}
.box100m{
    float:left;
    width:98%;
    margin:1%;
}

@media screen and (min-width: 768px) {

    .box50m {
        width: 48%;
        margin:1%;
    }

    .box30m {
        width: 31.3%;
    }



}


/*news*/

.testataN{
    background:url(../img/lorenzetti_viaggi5.jpg) no-repeat center center;
    background-size:cover;
    min-height:500px;
}
.news{
    padding:2%;
    border: 2px dashed  rgba(0,0,0,0.75);
    border-radius:10px;
}
.imgNews{
    text-align:center;
    
}
.txtNews{
    font-size:1.5em;
}

.txtNews h2{
    color:#8c1421;
    font-weight:bold;
}


/*pop in*/
.popin{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    font-family: 'arial', sans-serif;
    z-index:999999999;
}
.popin .layer{
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(0,0,0,0.5);
    z-index: -1;
    visibility:hidden;
    opacity:0;
    transition: all 0.5s;
}
.popin .content{
    max-width: 300px;
    width: 100%;
    box-sizing: border-box;
    margin: auto;
    padding: 8px;
    background: #fff;
    position: absolute;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 5px;
    box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
    visibility:hidden;
    opacity:0;
    transition: all 0.5s;
}
.popin .popin_check:checked ~ .layer,
.popin .popin_check:checked ~ .content{
    visibility:visible;
    opacity:1;
    margin-top:0;
}
.popin .content .header{
    padding: 5px;
    min-height: 1.5em;
    border-bottom: 1px solid;
}
.popin .close_popin{
    cursor: pointer;
    float: right;
    font-weight: bold;
}
.popin .content .main{
    padding: 5px 0;
}
.show_popin{
    cursor: pointer;
}
.modal-button {
  display: inline-block;
  padding: 10px 15px;
  background-color: #bdbcbc;
  border: none;
  color: #000;
  font-size: 1.0rem;
  font-weight: bold;
  cursor: pointer;
  margin: 10px;
}
.close {
    float: right;
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  }
  @-webkit-keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
  }
  @keyframes fadeIn {
  0% {opacity: 0;}
  100% {opacity: 1;}
 }
 
.box-ecomm-del
{
    width: 100%;
    line-height: 0;
    min-height: 1300px;
    height: 100%;
    height: auto;
    background-color: #CCCCCC;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=85);
    opacity: 0.85;
    position:absolute;
    z-index: 10000000;
    top: 0;
    left: 0;
    font-size: 25px;
    color: White;
    text-align: center;
    padding: 30px 0 30px 0;
}

.box-ecomm1-del
{
    width: 80%;
    min-height: 140px;
    height: 140px;
    height : auto;
    background-color: Black;
    position:absolute;
    z-index: 100000000;
    top: 20%;
    left: 10%;
    right : 10%;
    font-size: 25px;
    color: White;
    text-align: center;
    padding: 90px 0 30px 0;
    line-height:25px;
}

.button_pop
{
    border: 1px solid #FFFFFF;
    background-color: #666666;
    color: #FFFFFF;
    width: 200px;
    height: 35px;
    text-align: center;
    cursor: pointer;
    margin: 50px 10px 20px 10px;
    font-size: 18px;
}
