/* ==========================================================================
   Android Nv - Jeroen De Groof - Palm 2014 Responsive
   ========================================================================== */

/* main brown: #af8b23 */

/* Extralarge desktop */
@media (min-width: 1600px) { 
	.navbar-brand { margin: 0 175px;}
	.navbar .navbar-nav > li > a { padding: 10px 30px;}
}

/* Large desktop */
@media (min-width: 1200px) and (max-width: 1599px) { 
	.navbar-brand { margin: 0 125px;}
}
 
@media (min-width: 980px) and (max-width: 1199px){ 
	.navbar-brand { margin: 0 30px;}
	.navbar-brand img { width: 150px;}
	footer .footer-top { padding: 0 25px;}
	footer .open-close { left: 15px; }

	.content-box .btns .links a { padding: 10px;}
	.content-box .btns .links a:nth-child(2), .content-box .btns .links a:nth-child(2):hover { background-size: 25px; background-position: 0 8px; padding-left: 25px; padding-right: 6px;}
	.content-box .btns .links a:hover { padding: 8px; }
	.content-box .btns .social a { width: 30px; height: 30px; margin-top: 3px;}

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) {

	.navbar-brand { margin: 0 10px;}
	.navbar-brand img { width: 140px; margin-top: 8px;}
	.navbar .navbar-nav > li > a { margin-right: 10px; padding: 10px 10px;}
	.navbar .navbar-nav > li > a > span { font-size: 14px;  }
	.navbar .navbar-nav > li > a > span.brand { font-size: 14px; margin: 0 0 5px 0; }
	.navbar .navbar-nav > li > a > span.location { font-size: 12px; }
	.navbar .lang-nav > li > a {  font-size: 10px; }

	footer .footer-top { padding: 0 20px;}
	footer .footer-top ul li > a { font-size: 10px;}
	footer .open-close { left: 10px; }
	.mi-slider ul li a { font-size: 12px;}

	.content-box .txt h1 { font-size: 32px; margin: 40px 0;}
	.content-box .txt h1 span { font-size: 32px;}
	.content-box .btns .links a { padding: 5px; font-size: 11px; margin-right: 5px;}
	.content-box .btns .links a:nth-child(2), .content-box .btns .links a:nth-child(2):hover { background-size: 15px; background-position: 0 5px; padding-left: 15px; padding-right: 6px;}
	.content-box .btns .links a:hover { padding: 8px; }
	.content-box .btns .social { margin-top: 5px; }
	.content-box .btns .social a { width: 19px; height: 19px; margin-top: 5px;}

}
 
/* Landscape phone to portrait tablet */
@media (max-width: 767px) { 
	.navbar .lang-nav { right: 20px;}
	.intro-item { width: 100%; height: 200px; margin-bottom: 10px; }
	.intro-item .overlay { display: none; }
	.intro-item .caption { display: block; bottom: 0; right: 0; width: 100%; height: 100%; background: none;  }
	.intro-item .caption h1 {font-size:28px; }
	.intro-item .caption p { display: none; }

	.navbar-brand {width: 100%; margin: 0; text-align: center;}
	.navbar-toggle {background-color: #af8b23; -webkit-border-radius: 0px; -moz-border-radius: 0px; border-radius: 0px; position: absolute; right: 20px; top: 63px; margin: 0;}
	.navbar-toggle .icon-bar { background-color: #fff;}

	.navbar-collapse.in {overflow: visible;}
	.navbar-nav {background-color: #af8b23; text-align: center; list-style: none; padding:0; margin-top: 0;}
	.navbar .navbar-nav > li { padding:0; border-bottom: 1px solid rgba(255, 255, 255, 0.3);  }
	.navbar .navbar-nav > li > a{ text-align: center; list-style: none; margin-right: 0; padding-top: 5px; padding-bottom: 5px; max-width: none; text-transform: uppercase; color: #fff;}
	.navbar .navbar-nav > li > a.active { color: #000;  background: #fff; }
	.navbar .navbar-nav > li > a:hover { color: #000;}
	.navbar .navbar-nav ul { list-style: none; -webkit-padding-start: 0px; display: none;}
	.navbar .navbar-nav ul > li { border-bottom: 1px solid rgba(175, 139, 35, 0.3); background: #fff; padding: 5px 0; }
	.navbar .navbar-nav ul > li > a { color: #af8b23; padding: 10px 0; }

	.row { margin: 0;}

	.column-left , .column-right { height: 33.33%; padding: 0;}
	.blok.bier .caption { opacity: 1; left: 10%; bottom: 20%; top: inherit; }

	.contact, .assortiment, .geschiedenis, .proces, .bezoek, .palm-hopselect, .rosso, .brugge-tripel , .oude-geuze{ height: 33.33%; padding: 5px 0; float: none;}
	.contact .caption, .assortiment .caption, .geschiedenis .caption, .proces .caption, .bezoek .caption, .dobbel-palm .caption, 
	.palm-royal .caption, .estaminet .caption, .palm-hopselect .caption, .palm .caption, .palm-na .caption, .palm-sauvin .caption  { left: 10%; bottom: 20%; }
 	.dobbel-palm, .palm-royal, .estaminet, .palm, .palm-na, .palm-sauvin, .grand-cru, .vintage, .char-rouge, .rodenbach, .steenbrugge-blond, .steenbrugge-dubbel, .steenbrugge-wit, .oude-kriek, .framboise  { height: 100%; padding: 5px 0; float: none;}
	
	.mobile-special { height: 66.66%; }
	.steenbrugge-tripel, .steenbrugge-abdijbock { height: 50%; padding: 5px 0; float: none; }

	#intro-img { display: none;}

	.txt ul.rabbithole, section.mainwrap > div#text-content ul.rabbithole { -webkit-padding-start: 0; position: relative; top: 0; width: 100%; background-color:#fff; float: left;}
	.txt ul.rabbithole li {float: left; list-style: none; color: #af8b23;}
	.txt ul.rabbithole li a {color: #af8b23; font-size: 11px; font-family: 'latolight';}
	.txt ul.rabbithole li a span{ text-transform: uppercase; font-family: 'latobold';  }
	.txt h1, section.mainwrap > div#text-content h1 { color: #af8b23; font-size: 28px; }
	.txt h2, section.mainwrap > div#text-content h2 { color: #af8b23; font-size: 24px; }
	.txt p b  { color: #af8b23; }

	.btns { margin-top: 10px; margin-bottom: 10px; }
	.btns .links { padding-left: 0; margin-top: 8px;}
	.btns .links a { color: #fff; background-color: #af8b23; padding: 5px 10px;margin-right: 5px;margin-bottom: 10px; float: left;}
	.btns .links a:hover { text-decoration: none;  background-color: #fff; color: #af8b23;  border: 2px solid #af8b23; padding: 8px 13px; }
	.btns .links a.with-arrow { background-image: url('/bundles/androidwebsite/img/download-btn.png'); background-repeat: no-repeat; background-size: 35px; background-position: 0 center; padding-left: 35px; }
	.btns .links a.with-arrow:hover {  margin-right: 0; background-image: url('/bundles/androidwebsite/img/download-btn-hover.png');}
	.btns .social { }
	.btns .social a { width: 35px; height: 35px; display: block; background-size: cover; float: left; margin-bottom: 20px; margin-right: 10px;}
	.btns .social a img { display: none;}
	.btns .social a:hover { text-decoration: none; border: 2px solid #af8b23; -webkit-border-radius: 50%;
	-moz-border-radius: 50%; border-radius: 50%;}
	.btns .social a.fb { background-image: url('/bundles/androidwebsite/img/social-fb.png'); margin-right: 5px;}
	.btns .social a.tweet { background-image: url('/bundles/androidwebsite/img/social-twitter.png'); }
	.btns .social a.fb:hover { background-image: url('/bundles/androidwebsite/img/social-fb-hover.png'); }
	.btns .social a.tweet:hover { background-image: url('/bundles/androidwebsite/img/social-twitter-hover.png'); }

	section.mainwrap > div#text-content a.fixed-img { position: relative; width: 100% !important; height: 150px; margin-bottom: 20px;}
	section.mainwrap > div#text-content .pers-row { height: auto !important; }
	section.mainwrap .gastronomie > div, section.mainwrap .stoeterij-mobile > div, section.mainwrap .stoeterij-mobile > div > div, 
	section.mainwrap .immo-mobile > div, section.mainwrap .immo-mobile > div > div { height: auto !important; }

	section.mainwrap > div#text-content.gastronomie .recept { width: 90%; }
	section.mainwrap > div#text-content.gastronomie .blok.corp p { display: block; padding-top: 60px; }
	section.mainwrap > div#text-content.gastronomie .blok.corp .overlay { display: block; }

	section.mainwrap > div.matrix > div { height: auto; }
	section.mainwrap > div#text-content #pairing-wrap .isotope-item { width: 44%; }
	section.mainwrap > div#text-content #pairing-wrap .isotope-item .imgLiquidFill { height: 65%; }

	section.mainwrap > div.erfgoed > div {height: auto; }

	section.mainwrap > div#text-content > div.row { height: auto; }

	#directions-panel { font-size:11px; }

	footer {display: none !important;}
}
 
/* Landscape phones and down */
@media (max-width: 480px) {
	body { font-family: 'latoregular'; overflow: visible;}

}

/* Landscape phones and down */
@media (max-width: 320px) {
	body { font-family: 'latoregular'; overflow: visible;}
	form img {margin-bottom:20px;}
	input#android_websitebundle_application_captcha, input#android_websitebundle_sponsorship_captcha {width: 50%}

}