/* Chianti Style per www.chiantiwinetour.com */
/* chiantistyle.css */

/* generale */

body { border: 0; margin: 0; font-family: Open Sans, Arial, Sans Serif; background-color: transparent; width: 100%; }
body img { border:0; }
.clear { clear: both; }
.rclear { clear: right; }
.lclear { clear: left; }
.banner { background-color: #ddd; width: 940px; margin: 6px auto; border:0px solid #ddd; padding: 20px; }
.supermain { margin:0 auto; overflow: hidden; width: 100%; }
.main { overflow: hidden; width: 100%; margin: 0 auto; }
.main h2 { font-size: 1.2vw; margin: 3.4vw 0; color: #444; }
.main a { text-decoration: none; }
.main a:hover { text-decoration: underline; cursor: pointer; }
.main .picture { width: 100%; }
#titoletto { font-size: 29px; color: #c58903; line-height: unset; }
#fotogrande { width: 100%; }
#titolo-box { margin-bottom: 1.6vw; float: none; padding-bottom: 10px; border-bottom: 1px solid #999; }
.hideme { visibility: hidden; width: 1px; padding: 0; }
.disegno { margin: 0 auto; width: 60%; }
.disegno img { width: 100%; }
#icona_bus_steps { width: 400px; float: right; }

/* navigation */

.topnav { overflow: hidden; background-color: #c6006e; margin-top: 20px; }
.topnav a { overflow: hidden; line-height: 24px; float: left; display: block; color: #f2f2f2; text-align: center; padding: 10px 16px; text-decoration: none; font-size: 17px; text-transform: uppercase; letter-spacing: 2px; }
.topnav a:hover { background-color: #ddd; color: black; }
.active { background-color: #c58903; color: white; }
.topnav .icon { display: none; }
.topnav .icon i { line-height: 24px; }
.topnav a p { float: right; margin: 0 10px 0 0; position: relative; right: -6px; }

/* overview */

.box-overview { width: 76%; margin: 20px auto; padding: 20px 2%; overflow: hidden; border: 0.1vw solid #999; }
.box-overview .colonna { width: 100%; border: 0; background-color: #fff; overflow: hidden; }
.box-overview .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #000; float: left; font-weight: normal; }
.box-overview .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-overview .dx { width: 48%; float: left; overflow: hidden; }
.box-overview .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto; }
.box-overview .colonna .itinere-optionpayment { padding: 0 5% 20px 5%; overflow: hidden; width: 90%; margin: 0 auto; background-color: #ececec; }
.box-overview .colonna .itinere-optionpayment input { width: 10%; float: left; }
.box-overview .colonna .itinere h4 { font-size: 24px; font-weight: normal; }
.box-overview .colonna .itinere h4 span { font-size: 15px; }
.box-overview .colonna .itinere p span { color: #c6006e; font-weight: normal; font-size: 15px; }
.box-overview i { color: green; font-weight: bold; }
#pulsante_booknow { text-align: center; background-color: #fc0; border-color: #fc0 #e4a000 #e4a000 #fc0 ; color: #000; padding: 10px 60px; font-weight: bold; font-size: 16px; line-height: 20px; cursor: pointer; border-radius: 2px; }
.box-overview a:hover { text-decoration: none; }
.box-overview a:active #pulsante_booknow { background-color: #e4a000; }

/* prices */

.box-prices { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-prices .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-prices .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #000; float: left; font-weight: normal; }
.box-prices .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-prices .dx { width: 48%; float: left; overflow: hidden; }
.box-prices .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto; }
.box-prices .colonna .itinere-optionpayment { padding: 0 5% 20px 5%; overflow: hidden; width: 90%; margin: 0 auto; background-color: #ececec; }
.box-prices .colonna .itinere-optionpayment input { width: 10%; float: left; }
.box-prices .colonna .itinere h4 { font-size: 24px; font-weight: normal; }
.box-prices .colonna .itinere h4 span { font-size: 15px; }
.box-prices .colonna .itinere p span { color: #C63900; font-weight: bold; }
#titolone { padding: 0 1.5vw; color: #C63900; background-color: transparent; font-size: 45px; margin: 0; font-weight: normal; text-align: center; }
#categoria { font-size: 30px; text-align: center; margin: 5px 30px 30px 30px; color: #666; }
#adultlist p { margin: 2px 0; }
#studentlist, #adultlist { overflow: hidden; }
#studentlist p { float: left; margin: 5px 10px; color: #666; }
#studentlist i { float: left; top: 4px; right: 2px; position: relative; }
#studentlist a { color: #C63900; }

/* confirmation */

.box-confirmation { width: 80%; margin: 60px auto 20px auto; padding: 0; overflow: hidden; max-width: 800px; }
.box-confirmation .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-confirmation .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #000; float: left; font-weight: normal; }
.box-confirmation .colonna p { font-size: 17px; margin: 15px 0; color: #000; }
.box-confirmation .modellomessaggio { width: 100%; margin-top: 30px; }
.box-confirmation .modellomessaggio h2 { color: #000; font-size: 17px; text-align: left; margin:0; font-family: 'Open Sans'; font-weight: normal; }
.box-confirmation .modellomessaggio textarea, input { border: 1px solid #444; width: 100%; }
.box-confirmation .modellomessaggio input { width: 100%; font-size: 20px; float:left; color: #000; font-family: 'Open Sans'; }
.box-confirmation .modellomessaggio p { margin: 0; font-size: small; }
.box-confirmation .modellomessaggio .field { margin: 0; padding: 20px 0 40px 0; overflow: hidden; border-top: 1px solid #999; }
.box-confirmation .modellomessaggio .field p { font-size: small; float:right; color: #888; }

#annotazione {font-size: 10px; }
#pulsantebuy {width: 300px; margin: 60px auto 0 auto; }
#pulsantebuy input {border: none; }
#pulsantebuy img {border:0; width: 1px ;height: 1px; }

/* highlights */

.box-highlights { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-highlights .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-highlights .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-highlights .colonna p { font-size: 17px; margin: 15px 0; color: #666; line-height: 1.8; }
.box-highlights .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-highlights .dx { width: 48%; float: left; overflow: hidden; }
.box-highlights .colonna h4 { font-weight: normal; font-size: 19px; padding: 10px 20px; margin: 20px 0 0 0; color: #fff; background-color: #c58903; float:left; }
.box-highlights .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto; }
.box-highlights .colonna .itinere p span { color: #C63900; font-weight: bold; }
.box-highlights img { width: 100%; margin-top: 10px; }

/* team */

.box-team { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-team .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-team .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-team .colonna h2 { margin: 20px 0; font-weight: normal; color: #666; font-size: 20px; line-height: 1.8; }
.box-team .colonna p { font-size: 17px; margin: 15px 0; color: #666; line-height: 1.8; }
.box-team .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-team .dx { width: 48%; float: left; overflow: hidden; }
.box-team .colonna h4 { font-size: 19px; padding: 0; margin: 20px 0 0 0; color: #C63900; }
.box-team .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto 30px ; text-align: center; }
.box-team .colonna .itinere p span { color: #C63900; font-weight: bold; }
.box-team a { decoration: none; }
#fb { color: blue; }
#wp { color: green; }
#insta { color: brown; }
#largescreen { display: none; }
#mediumscreen { display: block; }

/* team-tf */

.box-team-tf { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-team-tf .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-team-tf .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-team-tf .colonna h2 { margin: 0; font-weight: normal; color: #666; font-size: 20px; }
.box-team-tf .colonna p { font-size: 17px; margin: 15px 0; color: #666; line-height: 1.8; }
.box-team-tf .sx { width: 30%; float: left; overflow: hidden; margin-right: 5%; }
.box-team-tf .dx { width: 30%; float: left; overflow: hidden; }
.box-team-tf .colonna h4 { font-size: 19px; padding: 0; margin: 20px 0 0 0; color: #c6006e; }
.box-team-tf .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto 30px ; text-align: center; }
.box-team-tf .colonna .itinere p span { color: #C63900; font-weight: bold; }
.box-team-tf a { decoration: none; }
.box-team-tf a:hover { color: #C63900; }
.box-team-tf a:active img { border-bottom: 3px solid #C63900; }
.box-team-tf .colonna .itinere .foto-tour { width: 70%; margin: 0 auto; }
.box-team-tf .colonna .itinere img { width: 100%; }
#tf-smallscreen { display: none; }

/* team-tt */

.box-team-tt { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-team-tt .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-team-tt .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-team-tt .colonna h2 { margin: 0; font-weight: normal; color: #666; font-size: 20px; }
.box-team-tt .colonna p { font-size: 17px; margin: 15px 0; color: #666; line-height: 1.8; }
.box-team-tt .sx { width: 30%; float: left; overflow: hidden; margin-right: 5%; }
.box-team-tt .dx { width: 30%; float: left; overflow: hidden; }
.box-team-tt .colonna h4 { font-size: 19px; padding: 0; margin: 20px 0 0 0; color: #c6006e; }
.box-team-tt .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto 30px ; text-align: center; }
.box-team-tt .colonna .itinere p span { color: #C63900; font-weight: bold; }
.box-team-tt a { decoration: none; }
.box-team-tt a:hover { color: #C63900; }
.box-team-tt a:active img { border-bottom: 3px solid #C63900; }
.box-team-tt .colonna .itinere .foto-tour { width: 70%; margin: 0 auto; }
.box-team-tt .colonna .itinere img { width: 100%; }
#tt-smallscreen { display: none; }

/* includes */

.box-includes { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-includes .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-includes .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-includes .colonna p { font-size: 22px; margin: 0.7vw 0; color: #666; }
.box-includes .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-includes .dx { width: 48%; float: left; overflow: hidden; }
.box-includes .colonna .item { padding-bottom: 1.5vw; overflow: hidden; width: 90%; margin: 0 auto; padding-left: 10%; }
.box-includes .colonna .item .voce { margin: 1.5vw 0 0 0; overflow: hidden; }
.box-includes .colonna .item .voce p { float: left; margin: 0 0 0 1.1vw; padding: 0; background-color: #fff; font-size: 20px; }
.box-includes .colonna .item img { float: left; width: 60px; padding: 12px; border: 0; border-radius: 50%; }

/* itinerary */

.box-itinerary { width: 80%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-itinerary .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-itinerary .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-itinerary .colonna p { font-size: 17px; margin: 0.7vw 0; color: #666; line-height: 1.8; }
.box-itinerary .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-itinerary .dx { width: 48%; float: left; overflow: hidden; }
.box-itinerary .colonna h4 { font-weight: normal; font-size: 19px; padding: 10px 20px; margin: 20px 0 0 0; color: #fff; background-color: #c6006e; float:left; }
.box-itinerary .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto; }
.box-itinerary .colonna .itinere p span { color: #C63900; font-weight: bold; }
#note-itinerario { color: #999; font-size: small; }
#box-note { margin-top: 20px; }

/* fulldescription */

.box-fulldescription { width: 80%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-fulldescription .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-fulldescription .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-fulldescription .colonna p { font-size: 17px; margin: 0.7vw 0; color: #666; line-height: 1.8; }

/* terms */

.box-terms { width: 60%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-terms .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-terms .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-terms .colonna p { font-size: 17px; margin: 20px 0; color: #666; line-height: 1.8; }
.box-terms .colonna p span { font-weight: bold; }
.box-terms a:hover { text-decoration: none; }

/* meeting */

.box-meeting { width: 80%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-meeting .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-meeting .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-meeting .colonna p { font-size: 17px; margin: 0.7vw 0; color: #666; line-height: 1.8; }
#cartina { border: 0; width: 100%; height: 400px; margin-top: 1.5vw; }

/* videoinfo */

.box-videoinfo { width: 80%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-videoinfo .sx { width: 58%; float: left; overflow: hidden; margin-right: 4%; }
.box-videoinfo .dx { width: 38%; float: left; overflow: hidden; }
.box-videoinfo .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-videoinfo .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-videoinfo .colonna p { font-size: 17px; margin: 0.7vw 0; color: #666; }
.box-videoinfo .colonna .itinere { padding: 0; overflow: hidden; width: 100%; margin: 0 auto; }
.box-videoinfo .colonna .itinere p span { color: #C63900; font-weight: bold; }
#videospace { height: 0; overflow: hidden; padding-bottom: 56.25%; padding-top: 30px; position: relative; }
#videospace iframe, #videoframe object, #videoframe embed { height: 100%; left: 0; position: absolute; top: 0; width: 100%; }
.box-videoinfo i { color: #c58903; font-weight: normal; }
#important-list p { float: left; margin: 5px 10px; line-height: 1.8; }
#important-list i { float: left; top: 8px; right: 0; position: relative; }

/* travelers */

.box-travelers { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-travelers .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-travelers .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #000; float: left; font-weight: normal; }
.box-travelers .colonna p { font-size: 17px; margin: 0.7vw 0; color: #000; }
.box-travelers .colonna h4 { font-size: 19px; padding: 0.3vw 0.7vw; margin: 1.5vw 0 0 0; color: #fff; background-color: #888; float:left; }
.box-travelers .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-travelers .dx { width: 48%; float: left; overflow: hidden; }
.box-travelers .modellomessaggio { width: 100%; margin-top: 0; }
.box-travelers .modellomessaggio h2 { color: #000; font-size: 20px; text-align: left; margin:0; font-family: 'Open Sans'; font-weight: normal; }
.box-travelers .modellomessaggio textarea, input { border: 1px solid #444; width: 100%; }
.box-travelers .modellomessaggio input { padding: 5px; font-size: 20px; float:left; color: #000; font-family: 'Open Sans'; }
.box-travelers .modellomessaggio p { margin: 0; font-size: small; }
.box-travelers .modellomessaggio .field { margin: 0; background-color: transparent; padding: 0; overflow: hidden; }
.box-travelers .modellomessaggio .field p { font-size: small; float:right; color: #888; }
#travello { font-size: 29px; color: #C63900; margin-top: 20px; }
.box-travelers .colonna-terms { width: 90%; padding: 5%; margin-top: 30px; border: 0; background-color: #ddd; overflow: hidden; }
.box-travelers .colonna-terms h2 { font-size: 20px; line-height: 28px; margin-bottom: 10px; }
.box-travelers .colonna-terms input { float: left; width: 24px; height: 24px; margin-right: 20px; }
.box-travelers .colonna-terms p { font-size: 20px; line-height: 28px; width: 50px; float: left; }
.box-travelers .colonna-terms hover:a { cursor: pointer; }

/* buy */

.box-buy { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-buy .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-buy .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-buy .colonna p { font-size: 17px; margin: 0.7vw 0; color: #000; }
.box-buy .colonna h4 { font-size: 19px; padding: 0.3vw 0.7vw; margin: 1.5vw 0 0 0; color: #fff; background-color: #888; float:left; }
.box-buy .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-buy .dx { width: 48%; float: left; overflow: hidden; }
.box-buy .modellomessaggio { width: 100%; margin-top: 30px; }
.box-buy .modellomessaggio h2 { color: #666; font-size: 20px; text-align: left; margin:0; font-family: 'Open Sans'; font-weight: normal; }
.box-buy .modellomessaggio h2 span { float: right; font-size: small; color: #999; margin-left: 40px; }
.box-buy .modellomessaggio textarea, input { border: 1px solid #999; width: 100%; font-size: 20px; color: #000; font-family: 'Open Sans'; padding: 5px; }
.box-buy .modellomessaggio input { font-size: 20px; float:left; color: #666; font-family: 'Open Sans'; padding: 5px; margin-top: 10px; }
.box-buy .modellomessaggio p { margin: 0; font-size: small}
.box-buy .modellomessaggio .field { margin: 0; background-color: transparent; padding: 0.7vw 0; overflow: hidden; }
.box-buy .modellomessaggio .field p { font-size: small; float:right; color: #888; }
#adulstud { margin: 1.5vw 0 0; }
#prezziadulstud { padding: 0 1.5vw; color: #C63900; background-color: transparent; font-size: 45px; margin: 0; font-weight: normal; }
#h2guests { margin-top: 1vw; }
#h2findus { margin-top: 20px; }
#h2findus input { width: 24px; height: 24px; border: 0; margin-top: 8px; position: relative; top: -5px; right 3px; }
#continua  { overflow: hidden; margin: 40px 0 20px 0; }
#continua input { background-color: #fc0; border-color: #fc0 #e4a000 #e4a000 #fc0 ; color: #000; padding: 10px 60px; font-weight: bold; font-size: 16px; line-height: 20px; cursor: pointer; border-radius: 2px; }
#continua input:active { background-color: #e4a000; }
#disclaimer { background-color: #fff; }
#disclaimer .legge { font-size: small; color: #999; margin-top: 1vw; }
#disclaimer .afternoon { font-size: 0.9vw; color: #999; margin-top: 1.5vw; }
#campo { width: 100%; overflow:hidden; margin-top: 1.5vw; }
#campo1 { width: 100%; overflow:hidden; }
#pulsanteok { width: 100px; font-weight:bold; background-color:#C63900; color:#fff; }
#pulsantedelete { width: 100px; font-weight:bold; background-color:#fff; margin-left: 1.5vw; }
#labelguest { line-height: 30px; margin-left: 10px; float: left; margin-right: 10px; }
#specialmeals input { margin-top: 10px; }
#travelers input { margin-top: 10px; }

/* contact */

.box-contact { width: 80%; margin: 20px auto; padding: 0; overflow: hidden; }
.box-contact .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-contact .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #666; float: left; font-weight: normal; }
.box-contact .colonna p { font-size: 17px; margin: 0.7vw 0; color: #666; }
.box-contact .sx { width: 48%; float: left; overflow: hidden; margin-right: 4%; }
.box-contact .dx { width: 48%; float: left; overflow: hidden; }
.box-contact .modellomessaggio { width: 100%; margin-top: 30px; }
.box-contact .modellomessaggio h2 { color: #666; font-size: 20px; text-align: left; margin:0; font-family: 'Open Sans'; font-weight: normal; }
.box-contact .modellomessaggio h2 span { font-size: small; color: #999; margin-left: 40px; }
.box-contact .modellomessaggio textarea { border: 1px solid #666; width: 100%; font-size: 20px; font-family: 'Open Sans'; color: #666; }
.box-contact .modellomessaggio input { padding: 5px; font-size: 20px; float:left; color: #666; font-family: 'Open Sans'; border: 1px solid #666; width: 100%; }
.box-contact .modellomessaggio p { margin: 0; font-size: small; }
.box-contact .modellomessaggio .field { margin: 0; background-color: transparent; padding: 0; overflow: hidden; }
.box-contact .modellomessaggio .field p { font-size: small; float:right; color: #888; }

/* sent */

.box-sent { width: 80%; margin: 0 auto 20px auto; padding: 0; overflow: hidden; }
.box-sent .colonna { width: 100%; margin-top: 2vw; border: 0; background-color: #fff; overflow: hidden; }
.box-sent .colonna h3 { font-size: 20px; padding: 0; margin: 0; color: #000; float: left; font-weight: normal; }
.box-sent .colonna p { font-size: 17px; margin: 0.7vw 0; color: #000; }


/* intro */

.box-intro { width: 100%; background-color: #fff; margin: 20px auto; border: 0; }
.box-intro .intro-content { width: 80%; overflow: hidden; margin: 1.5vw auto; text-align: center; }
.box-intro .intro-content p { color: #666; font-size: 40px; padding: 0 2vw; margin: 0; }
.box-intro .intro-content p span { color: #c58903; }

/* scroll */

.box-scroll { width: 100%; background-color: #c6006e; margin: 20px auto; border: 0; padding: 20px 0; }
.box-scroll .scroll-content { width: 80%; overflow: hidden; margin: 1.5vw auto; text-align: center; }
.box-scroll .scroll-content p { color: #fff; font-size: 40px; padding: 0 2vw; margin: 0; }
.box-scroll .scroll-content p span { color: #fff; }

/* header */

.box-header { width: 100%; background-color: #fff; margin: 0 auto; border: 0; }
.box-header .header-content { width: 80%; overflow: hidden; margin: 1.5vw auto; text-align: center;}
.box-header .header-content p { color: #666; font-size: 40px; padding: 0 2vw; margin: 0; }
.box-header .header-content p span { color: #C6006e; font-size: 20px; }
.box-header .header-content p span a { color: #C6006e; }
#home:hover { text-decoration: none; }

/* gotop */

.box-gotop { background-color: #c6006e; margin: 0 20px; border: 0; float: left; cursor: pointer; }
.box-gotop .gotop-content p { margin: 0; color: #fff; font-size: 25px; padding: 8px; }
.box-gotop a { text-decoration: none; color: #fff; }
.box-gotop a:hover { text-decoration: underline; }

/* footer */

.box-footer { width: 100%; background-color: #c6006e; margin: 0 auto; border: 0; }
.box-footer .footer-content {width: 80%; margin: 0 auto; }
.box-footer .footer-content p { text-align: center; margin: 0; color: #fff; font-size: 15px; padding: 40px 0; line-height: 1.8; }


/* media queries */

@media only screen and (min-width: 1400px) { 
 
                  #largescreen  { display: block; }
                  #mediumscreen { display: none; }
                  .box-team .sx { width: 30%; float: left; overflow: hidden; margin-right: 5%; }
                  .box-team .dx { width: 30%; float: left; overflow: hidden; }
}

@media only screen and (max-width: 900px) { 

         .box-terms { width: 80%; }


}

@media only screen and (max-width: 900px) {
 
         #tf-smallscreen { display: block; }  
         #tf-largescreen { display: none; }       
         .box-team-tf .sx { width: 48%; margin-right: 4%; }
         .box-team-tf .dx { width: 48%; }
         #tt-smallscreen { display: block; }  
         #tt-largescreen { display: none; }
         .box-team-tt .sx { width: 48%; margin-right: 4%; }
         .box-team-tt .dx { width: 48%; }

}


@media only screen and (min-width: 650px) and (max-width: 900px) {

         #titolone { font-size: 35px; }
         #categoria { font-size: 25px; }
}

@media only screen and (max-width: 780px) {

         .box-videoinfo .sx { width: 100%; margin: 0; }
         .box-videoinfo .dx { width: 100%; }
}

@media only screen and (max-width: 700px) {

 .box-itinerary .sx { float: none; width: 100%; margin: 0; }
 .box-itinerary .dx { float: none; width: 100%; margin: 0; }
 .box-itinerary .colonna .itinere { margin: 0 auto 10px auto; }
 .box-highlights .sx { float: none; width: 100%; margin: 0; }
 .box-highlights .dx { float: none; width: 100%; margin: 0; }
 .box-highlights .colonna .itinere { margin: 0 auto 10px auto; }
 .box-prices .sx { float: none; width: 100%; margin: 0; }
 .box-prices .dx { float: none; width: 100%; margin: 0; }
 .box-prices .colonna .itinere { margin: 0 auto 10px auto; }
 .box-buy .sx { float: none; width: 100%; margin: 0; }
 .box-buy .dx { float: none; width: 100%; margin: 0; }
 .box-travelers .sx { float: none; width: 100%; margin: 0; }
 .box-travelers .dx { float: none; width: 100%; margin: 0; }
 .box-contact .sx { float: none; width: 100%; margin: 0;  }
 .box-contact .dx { float: none; width: 100%; margin: 0; }
 .box-overview .sx { float: none; width: 100%; margin: 0;  }
 .box-overview .dx { float: none; width: 100%; margin: 0; }
 .box-team .sx { float: none; width: 100%; margin: 0;  }
 .box-team .dx { float: none; width: 100%; margin: 0; }

}

@media only screen and (min-width: 556px) and (max-width: 715px) { .box-header .header-content p { font-size: 30px; } }

@media only screen and (min-width: 501px) and (max-width: 750px) { .box-intro .intro-content p { font-size: 30px; } }

@media only screen and (min-width: 501px) and (max-width: 750px) { .box-scroll .scroll-content p { font-size: 30px; } }

@media only screen and (min-width: 501px) and (max-width: 700px) { .box-includes .colonna .item .voce p { font-size: 15px; } }

@media only screen and (min-width: 401px) and (max-width: 700px) { #titoletto { font-size: 27px; } }

@media only screen and (max-width: 700px) { .disegno { width: 80%; } }

@media screen and (max-width: 680px) {

                .topnav a:not(:first-child) {display: none; }
                .topnav a.icon { float: right; display: block; }
                .topnav a i { float: left; }
                .topnav a p { float: none; }

}

@media screen and (max-width: 680px) {

                .topnav.responsive {position: relative; }
                .topnav.responsive .icon { position: absolute; right: 0; top: 0; }
                .topnav.responsive a { float: none; display: block; text-align: left; }
}

@media screen and (max-width: 649px) {

                  #titolone { font-size: 30px; }
                  #categoria { font-size: 20px; }
}

@media only screen and (max-width: 555px) { 

                  .box-header .header-content p { font-size: 26px; } 
                  .box-header .header-content p span { font-size: 18px; } 
                  .box-header { margin: 20px 0; } 
                  .box-team-tf .sx { width: 100%; margin: 0; float: none; }
                  .box-team-tf .dx { width: 100%; margin: 0; float: none; }
                  .box-team-tt .sx { width: 100%; margin: 0; float: none; }
                  .box-team-tt .dx { width: 100%; margin: 0; float: none; }

}

@media only screen and (max-width: 520px) { 

                  #important-list p { float: none; text-align: center; }
                  #important-list i { float: none; width: 100%; text-align: center; font-size: 80px; }
}


@media only screen and (max-width: 500px) { 

                  .box-includes .sx { float: none; width: 96%; margin-right: 2%; margin-left: 2%; } 
                  .box-includes .dx { float: none; width: 96%; margin-right: 2%; margin-left: 2%; } 
                  .box-includes .colonna .item img  { padding: 0; border: 0; border-radius: 0; } 
                  .box-includes .colonna .item { padding-left: 0; width: 100%; } 
                  .box-includes .colonna .item .voce p { width: unset; padding-left: 10px; font-size: 15px; margin: 0; } 
                  #prezziadulstud { font-size: 35px; }
                  .box-intro .intro-content p span{ font-size: 20px; }
                  .box-intro .intro-content p { font-size: 26px; }
                  .box-scroll .scroll-content p { font-size: 20px; }
                  #categoria { margin-bottom: 0; }
                  .box-overview { border: 0; }
                  #icona_bus_steps { width: 100%; }    
                  .box-overview { margin: 0 auto 20px auto; padding: 0 2% 20px 2%; }
}

@media only screen and (max-width: 400px) { 

                  #cartina { height: 300px; } 
                  #titoletto { font-size: 24px; }   
                       
}