/* RESPONSIVE */

/** 
 * iPad with portrait orientation.
 */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait){
	header svg {
		width: 100%;
		height: auto;
	}
	.foo {height: 1024px;}
	
	header {height: 80px;}
	section, .frontpage section {margin-top: 80px;}
	
	section {height: 944px;}
	.frontpage section {height: 895px;}
	.hTopFull {height: 870px;}
	.vh5 {margin-top: 40px;}
	.BGprime, .BGsecondary {height: 1024px}
	
	#homeCollage, .centro {
		top: 0;
		padding: 0 50px;
		position: relative;
		margin-bottom: 50px;
		transform: translate(0,0);
		-ms-transform: translate(0,0);
		-webkit-transform: translate(0,0);
	}

	.titleMid {padding: 0 50px;}
	#homeCollage {padding: 0;}
	#homeCollage .containerTitle {padding-top: 50px;}

	#lista.inner-bottle .bottleGroup.first {
		background: #F2EEE5;
		background: -webkit-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 70%, #FFF 70%, #FFF 100%);
		background: -o-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 70%, #FFF 70%, #FFF 100%);
		background: -moz-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 70%, #FFF 70%, #FFF 100%);
		background: linear-gradient(to top, #F2EEE5 0%, #F2EEE5 70%, #FFF 70%, #FFF 100%);
	}
	#lista.inner-bottle .bottleGroup {padding-bottom: 0}	
	#lista.inner-bottle .bottleGroup .previewBottle {margin: 50px 0;}
	.sottoBase {padding: 60px 50px;}

	.containerText--left {padding-left: 0px;}
	.containerText--Right {padding-right: 0px;}
	
	.riconoscimenti .anno:after {width: 100%;}
}

/** 
 * iPad with landscape orientation.
 */
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape){
	.foo {height: 768px;}
	header svg {
		width: 100%;
		height: auto;
	}
	header {height: 80px;}
	section {
		margin-top: 80px;
		height: 688px;
	}
	.hTopFull {height: 648px;}
	.vh5 {margin-top: 40px;}
	.frontpage section {height: 648px}
	.BGprime, .BGsecondary {height: 768px}

	.riconoscimenti .anno:after {width: 100%}
}


@media (min-width: 768px) and (max-width: 991px) {
    .centro {
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
		position: relative;
		z-index: 1000;
		width: 100%;
		top: auto;
		
		margin-bottom: 50px;
	}
	
	ul#headerNav, ul#menu-menu-pricipale, ul#menu-main-menu {margin: 32px 0 0 0;}
	.jack {padding-top: 0px;}
    
}


@media only screen and (max-width: 991px) {
    .lang_selector a {margin: 31px 0 0 0;}
	header svg {
		width: 100%;
        max-width: 135px;
		height: auto;
	}
	header {height: 80px;}
	.containerQuote h2 {
		line-height: 26px;
		font-size: 21px;
	}
	p {text-align: justify;}
	section {
		margin-top: 80px;
		height: 100%;
	}
	footer {
		margin-top: 50px;
		height: auto;
	}
	footer p {
		margin-left: 0;
		font-size: 10px;
		line-height: 16px;
	}
	.intro {padding: 0px;}

	.containerText--Right {padding-right: 0;}
	.containerText--Left {padding-left: 0;}

	#homeCollage, #olioCollage, .centro {
		-webkit-transform: translateY(0%);
		-ms-transform: translateY(0%);
		transform: translateY(0%);
		position: relative;
		z-index: 1000;
		width: 100%;
		top: auto;
	}
	#azienda {padding: 0;}
	.m_mrgTop70 {margin-top: 70px !important}
	.m_mrgBtm70, section.open {margin-bottom: 70px;}
	.frontpage section {height: 100%;}
	.row.stack {
		margin-top: 0;
		margin-bottom: 70px;
	}
	.frontpage .row.stack {
		margin-top: 0;
		margin-bottom: 0;
	}
	section.show-nav-linee {margin:0;}
	.closing {padding: 0;}

	#homeCollage .containerText--Left {padding-left: 0;}
	#homeCollage .containerTitle {padding-top: 20px;}
	#homeCollage .containerParagraph {margin-bottom: 20px;}
	#homeCollage .containerParagraph p {
		line-height: 28px;
		font-size: 16px;
	}
	
	.containerLinea {
		overflow: hidden;
		margin: 20px 0;
		left: 0;
	}
	h1 {
		line-height: 26px;
		font-size: 24px;
	}
	.containerParagraph p {
		font-size: 16px;
		line-height: 28px;
	}

	.riconoscimenti .anno:after {width: 100%}


	.logo {
		margin-left: 0;
		margin-top: 15px;
	}
	#burgerIcon {
		right: 20px;
		top: 28px;
	}
	.nav-container {margin: 20px 0;}
	.navList.first {margin-bottom: 5px;}
	.navList {margin-bottom: 15px;}
	
	span.contatti {
		margin-top: 5px;
		display: inline-block;
	}

	.navList span {font-size: 22px;}
	.navList span:after {margin: 15px 0 20px;}
	nav a {font-size: 16px;}
	.navList ul li ul {margin: 5px 0 0 0;}
	.navList ul li ul li {line-height: 32px;}
	
	.navList .address span {
		margin-bottom: 5px;
		font-size: 16px;
	}
	.navList .address p {
		line-height: 26px;
		font-size: 14px;
	}
	.last .social {
		margin-bottom: 15px;
		position: relative;
		text-align: left;
		right: auto;
		top: auto;
		bottom: 0;
	}
	.last .social ul li:first-child {margin-left: 0;}
	.last p {
		padding: 15px 0 0 0;
		margin-bottom: 8px;
		line-height: 20px;
	}
	span.pie {
		display: block;
		line-height: 18px;
		margin-bottom: 10px;
	}
	.ca {
		z-index: -1;
		left: 0;
	}
	.miniatureP {}
	.inner-olio .macchie, .show-nav-linee .macchie {
		overflow: hidden;
		text-align: left;
		display: block;
		width: 100%;
	}
	.inner-olio .inner-wHdt, .show-nav-linee .inner-wHdt {
		display: inline-block;
		margin: 0 15px 0 0;
	}
	.inner-olio .macchie a, .show-nav-linee .macchie a {position: relative;}
	.inner-olio .macchie a .bottleOverlay, .show-nav-linee .macchie a .bottleOverlay {
		visibility: visible;
    	opacity: 1;
	}
	.nomenclatura {
		top: 50%;
		width: auto;
		position: absolute;
		transform: translate(0%, -50%);
		-o-transform: translate(0%, -50%);
		-ms-transform: translate(0%, -50%);
		-moz-transform: translate(0%, -50%);
		-webkit-transform: translate(0%, -50%);
	}
	.inner-olio .macchie a h4, .show-nav-linee .macchie a h4 {
		font-size: 16px;
		line-height: 22px;
	}
	.inner-olio .macchie a span, .show-nav-linee .macchie a span {font-size: 14px;}

	.show-nav-linee .titleMid h1 {
		text-transform: uppercase;
		display: inline-block;
		width: 100%;
	}
	.show-nav-linee .titleMid h1:after {
		margin: 20px auto;
		width: 100%;
	}
	.show-nav-linee p {
		line-height: 28px;
		font-size: 16px;
	}

	.inner-olio .macchie a, .show-nav-linee .macchie a {
		margin-bottom: 20px;
		margin-top: 20px;
	}
	.inner-olio .inner-wHdt, .show-nav-linee .inner-wHdt {width: 100px;}
	.inner-olio .macchie a .bottleOverlay, .show-nav-linee .macchie a .bottleOverlay {
		width: 60px;
		margin: 0 auto;
	}
	.inner-linea {margin-bottom: 70px;}
	.inner-linea.news {margin-bottom: 0;}
	.inner-linea.bigBottle {margin-bottom: 0;}
	.inner-linea .inner-wHdt {
		margin: 0 auto;
		position: relative;
		width: 100px;
	}
    .inner-linea.news h1 {
        line-height: 26px;
        margin: 0 0 20px 0;
        font-size: 18px;
        text-align: center;
	}
	.inner-linea h1:after {
		margin: 20px auto;
		width: 100%;
	}
	.inner-linea .titleMid p {
		line-height: 28px;
		font-size: 16px;
		text-align: justify;
	}

	#lista.inner-bottle .bottleGroup span.titleProduct {
		min-height: 60px;
		margin: 25px 0;
		font-size: 14px;
	}
	#lista.inner-bottle .bottleGroup a {display: none;}

	#lista.inner-bottle .bottleGroup a.titleLink,
	#lista.inner-bottle .bottleGroup a.titleLink:hover,
	#lista.inner-bottle .bottleGroup a.titleLink:focus {
		text-decoration: none;
		display: block;
		color: #313131;
	}
	#lista.inner-bottle .bottleGroup {
		height: auto;
		margin-top: 0;
		padding-top: 0;
		padding-bottom: 0;
	}
	#lista.inner-bottle .bottleGroup.first {
		background: #F2EEE5;
		background: -webkit-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 75%, #FFF 75%, #FFF 100%);
		background: -o-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 75%, #FFF 75%, #FFF 100%);
		background: -moz-linear-gradient(to top, #F2EEE5 0%, #F2EEE5 75%, #FFF 75%, #FFF 100%);
		background: linear-gradient(to top, #F2EEE5 0%, #F2EEE5 75%, #FFF 75%, #FFF 100%);
	}
	#lista.inner-bottle .bottleGroup.last {margin-bottom: 70px}

	.inner-dettaglio .caratteristiche {
		margin-top: 0;
		margin-bottom: 15px;
	}

	.inner-dettaglio .scheda p {
		text-align: justify;
		margin: 0 0 30px 0;
		line-height: 28px;
		font-size: 16px;
	}
	.inner-dettaglio .caratteristiche, .inner-dettaglio .zona, .inner-dettaglio .cultivar, .inner-dettaglio .aspetto, .inner-dettaglio .altitudine, span.certificazioni_territorio {
		margin-top: 0;
		margin-bottom: 15px;

	}
	ul#listaCert {margin: 0 0 10px 0;}
	.inner-dettaglio .cultivar {margin-top: 30px;}	
	ul#legal {margin-top: 0px;}
	a.credits {
	    display: block;
        float: none;
        width: 100%;
	}
	.newsOpenTitleBlock {margin-top: 35px;}
	.newsOpenTitleBlock p {
        text-align: center;
        margin-bottom: 5px;
        display: block;
    }
    #singleOlio .top p {
        margin-bottom: 45px;
        text-align: center;
    }
}