/* =======================================
	Reset
======================================= */
* { padding: 0; margin: 0; border: 0; }
body { position: relative; font-family: "Montserrat", sans-serif; font-weight: 400; font-size: 100%; font-style: normal; color: #000; }
img { width: 100%; height: auto; }


/* Typography   =========================== */
p { font-size: 1em; line-height: 1.438em; }
h1 { font-weight: 300; font-size: 2.5em; line-height: 1em; }
#kontakt h1 { padding-bottom: 40px; }
h2 { font-weight: 600; font-size: 1.25em; line-height: 1.438em; margin-bottom: 20px; }
h3 { font-weight: 400; font-size: 1em; line-height: 1.438em; }
strong { font-weight: 600; }
header ul { list-style-type: none; }
#wrapper_content ul { list-style-type: disc; margin-left: 0.5em; padding-left: 0.5em; }
#wrapper_content li { font-size: 1em; line-height: 1.25em; padding-bottom: 5px; }
#nav i { margin-right: 12px; }
.content i { margin-right: 8px; }
#utility { font-size: 1em; font-weight: 600; }

/* Linkverhalten   =========================== */
a:link, a:visited, a:active { color: #a28b35; text-decoration: none; border-bottom: none; }
a:focus, a:hover { color: #a28b35; text-decoration: none; border-bottom: 1px solid #a28b35; }
header a:link, header a:visited, header a:active { border-bottom: none; }
header a:focus, header a:hover { border-bottom: none; }
#logo a, #logo_folgeseiten a { border-bottom: none; }
#utility a:link, #utility a:visited, #utility a:active { color: #a3a2a2; border-bottom: none; }
#utility a:focus, #utility a:hover { color: #a28b35; border-bottom: none; }
.social-bookmarks a { margin-right: 25px; border-bottom: none; }

ul .current a { color: #a28b35; }

.teaser a { position: absolute; top: 0; right: 0; bottom: 0; left: 0; }
.teaser a:link, .teaser a:visited, .teaser a:active { border-bottom: none; }
.teaser a:focus, .teaser a:hover { background-color: rgba(0,0,0,0.05); border-bottom: none; transition-duration: 0.5s; }

.btn_back a:link, .btn_back a:visited, .btn_back a:active { padding: 5px 15px; border-radius: 4px; color: #FFF; background-color: #a28b35; border-bottom: none; }
.btn_back a:focus, .btn_back a:hover { color: #FFF; background-color: #7f6e2d; border-bottom: none; transition-duration: 0.5s; }


/* Layout   =========================== */
#wrapper_header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; margin: auto; background-color: rgba(255,255,255,0.8); 
-webkit-box-shadow: 0 10px 8px -2px rgba(25,0,0,0.3);
-moz-box-shadow: 0 10px 8px -2px rgba(25,0,0,0.3);
-ms-box-shadow: 0 10px 8px -2px rgba(25,0,0,0.3);
-o-box-shadow: 0 10px 8px -2px rgba(25,0,0,0.3);
box-shadow: 0 10px 8px -2px rgba(25,0,0,0.3); }
header { position: relative; height: 80px; transition-duration: 0.5s; }
#logo { width: 300px;  margin-left: -150px; position: absolute; top: 60%; left: 50%; z-index: 10; transition-duration: 0.5s; }
#logo_folgeseiten { width: 250px; position: absolute; top: 7px; right: 30px; z-index: 10; transition-duration: 0.5s; }
#logo_folgeseiten a { display: block; }

#utility { position: absolute; right: 30px; top: 53px; z-index: 10; transition-duration: 1s; }
#utility li { color: #a3a2a2; float: left; transition-duration: 0.5s; }
#utility a { padding: 6px 25px; }
#utility li:nth-of-type(5) a { padding-right: 0; }

#wrapper_content { position: relative; min-width: 280px; max-width: 1000px; margin: 120px 15px 60px 15px; padding: 4% 4% 0 4%; background-color: #FFFFFF; overflow: hidden; }
.content { overflow: hidden; padding-bottom: 20px; transition-duration: 0.5s; }
.content img { padding-bottom: 20px;}
.content p + img { padding-top: 20px; }
.content_33 { padding-bottom: 20px; }
.content_66 { padding-bottom: 20px; }
.content_75 { position: relative; }

.teaser { padding: 0; position: relative; margin-bottom: 40px; padding-top: 10px; }
.teasertext { position: relative; bottom: 10px; font-size: 1em; text-align: center; color: #000; font-size: 1em; width: 100%; }



/* Extras   =========================== */
body { height: 100%; overflow: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch; }
html { 
	height: 100% !important; 
	background-position: center center !important; 
	background-attachment: fixed !important; 
	background-repeat: no-repeat !important; 
	-webkit-background-size: cover !important; 
	-moz-background-size: cover !important; 
	-o-background-size: cover !important; 
	background-size: cover !important;
	overflow: hidden !important;
	}
		
#weingut { background-image: url("../img/hg_weingut_mobil.jpg"); }
#weine { background-image: url("../img/hg_weine_mobil.jpg"); }
#anbau { background-image: url("../img/hg_anbau_mobil.jpg"); }
#besichtigung { background-image: url("../img/hg_besichtigung_mobil.jpg"); }
#vertrieb { background-image: url("../img/hg_vertrieb_mobil.jpg"); }
#kontakt { background-image: url("../img/hg_kontakt_mobil.jpg"); }

.wein_typ { line-height: 1em; display: inline-block; background-color: #e3c84b; color: #FFF; padding: 5px 10px; margin: 10px 0 5px 0; }
.wein_bio { line-height: 1em; display: inline-block; background-color: #33cc00; color: #FFF; padding: 5px 10px; margin: 10px 0 5px 0; }
.btn_back { margin-top: 10px; text-align: right; }
.social-bookmarks { clear: both; text-align: right; }
.logo_mallorca { display: none; }
.printadresse { display: none; }


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

@media screen and (min-width: 640px) {

.navi_intern_1 { margin-top: 30px }
.navi_intern_2 { display: none; }

#logo { width: 600px;  margin-left: -300px; }
#logo_folgeseiten { width: 325px; right: 40px; }
#utility { top: 52px; right: 40px; }

#wrapper_content { margin: 110px 30px 100px 30px; padding: 2% 3% 0 3%; }
.content { padding-bottom: 40px; }
.content .content_40 { width: 37%; float: left; }
.content .content_60 { width: 55%; float: right; }
.content:nth-of-type(1) .content_40 { padding-top: 0; }    
.content:nth-of-type(1) .content_60 { padding-top: 0; }    

.content_33 { width: 30.666666%; margin-right: 4%; float: left; border-bottom: none; }
.content_33:nth-of-type(3n) { margin-right: 0; }
.content_66 { width: 65.333333%; float: left; }
     
.teaser { margin-bottom: 0; }
    
    
/* Extras   =========================== */
#weingut { background-image: url("../img/hg_weingut.jpg"); }
#weine { background-image: url("../img/hg_weine.jpg"); }
#anbau { background-image: url("../img/hg_anbau.jpg"); }
#besichtigung { background-image: url("../img/hg_besichtigung.jpg"); }
#vertrieb { background-image: url("../img/hg_vertrieb.jpg"); }
#kontakt { background-image: url("../img/hg_kontakt.jpg"); }
    
.wein_typ { padding: 5px 13px; }
.wein_bio { padding: 5px 13px; }
.logo_mallorca { display: block; position: absolute; right: 0; top: 0; width: 65px; transition-duration: 0.5s; }
}


@media screen and (min-width: 1140px) {
p { font-size: 1.064em; }
h1 { font-size: 3em; }
h2 { font-size: 1.313em; }
h3 { font-size: 1.25em; }
#wrapper_content li { font-size: 1.064em; }
#wrapper_content { margin: 110px auto 100px auto; }
}


/* Mobile only   =========================== */
@media only screen and (min-device-width: 300px) and (max-device-width : 1024px) {
#logo_folgeseiten { right: 15px; }
#utility { right: 15px; }
    
#weingut { background-image: url("../img/hg_weingut_mobil.jpg"); }
#weine { background-image: url("../img/hg_weine_mobil.jpg"); }
#anbau { background-image: url("../img/hg_anbau_mobil.jpg"); }
#besichtigung { background-image: url("../img/hg_besichtigung_mobil.jpg"); }
#vertrieb { background-image: url("../img/hg_vertrieb_mobil.jpg"); }
#kontakt { background-image: url("../img/hg_kontakt_mobil.jpg"); }
}

@media only screen and (min-device-width: 640px) and (max-device-width : 1024px) {
#logo_folgeseiten { right: 30px; }
#utility { right: 30px; }
}