html
{
position: relative;
min-height: 100%;
}
body
{
color: #444444;
font-family: Arial, Georgia, "Times New Roman", Times, serif;
font-size:15px;
line-height: 1.3;
margin: 0 0 250px; /* bottom = footer height */
}
header
{
margin:0;
width: 100%;
position: relative;
z-index:99;
background-image: url(../images/SnackNTravel_Planks.jpg);
background-repeat: repeat;
}
@media only screen and (min-width: 200px)
{
header .wp_L1
{
margin: 0 auto;
width:100%;
min-height:29px;
height: auto;
background:#000;
border: dotted;
border: 0px solid red;
}
}
@media only screen and (min-width: 768px)
{
header .wp_L1
{
margin: 0 auto;
width:100%;
min-height:35px;
height: auto;
border: dotted;
border: 0px solid red;
}
}
@media only screen and (min-width: 200px)
{
header .wp_L2
{
margin: 0 auto;
height:120px;
width:100%;
border: dotted;
border: 0px solid red;
text-align:center;
}
}
@media screen and (min-width: 768px)
{
header .wp_L2
{
margin: 0 auto;
height:180px;
width:100%;
border: dotted;
border: 0px solid red;
}
}
header .wp_L3
{
margin: 0 auto;
width:100%;
min-height:30px;
background:#a19637;
border: dotted;
border: 0px solid red;
}
header .wp_L4
{
margin: 0 auto;
width:100%;
min-height:1px;
background:#777777;
position: absolute;
opacity: 0.8;
}
@media only screen and (min-width: 100px)
{
header .headerCenterBox
{
margin: 0 auto;
width:100%;
height:100%;
max-width:950px;
position: relative;
background:none;
background-size: 100% auto;
border: dotted;
border: 0px solid red;
}
}
@media only screen and (min-width: 400px)
{
header .headerCenterBox
{
margin: 0 auto;
width:100%;
height:100%;
max-width:950px;
position: relative;
background:none;
background-size: 100% auto;
border: dotted;
border: 0px solid red;
}
}
@media only screen and (min-width: 768px)
{
header .headerCenterBox
{
margin: 0 auto;
width:100%;
height:100%;
max-width:950px;
position: relative;
background:url('../images/weingut_johannesB_header.jpg');
background-size: 100% auto;
border: dotted;
border: 0px solid red;
}
}
header .log
{
margin: 0 auto;
width:auto;
max-width:950px;
position: relative;
border: dotted;
border-color: red;
border-width: 0px;
}
header .soc
{
margin: 0 auto;
width:auto;
height:auto;
max-width:950px;
position: relative;
border: dotted;
border: 0px solid red;
}
nav
{
margin: 0 auto;
width:auto;
max-width:950px;
position: relative;
padding: 0px 0px 0px 0px;
border: dotted;
border-color: red;
border-width: 0px;
}
section
{
position:relative;
clear:both;
width:auto;
}
@media only screen and (min-width: 100px)
{
section .sld
{
margin: 0px auto 0px auto;
position:relative;
clear:both;
width:auto;
height:auto;
border: dotted;
border: 0px solid red;
}
}
@media only screen and (min-width: 768px)
{
section .sld
{
margin: 50px auto 20px auto;
position:relative;
clear:both;
width:auto;
height:auto;
border: dotted;
border: 0px solid red;
}
}
section .main
{
position:relative;
clear:both;
width:auto;
height:auto;
background:none;
bottom:0;
border: dotted;
border-color: blue;
border-width: 0px;
}
section .column_row
{
clear:both;
}
.group:before,
.group:after { content:""; display:table; }
.group:after { clear:both;}
.group { zoom:1; /* For IE 6/7 */ }
article
{
}
article .flw
{
margin-left:15px;
width: auto;
}
/* clmns ****************************************** */
@media only screen and (min-width: 300px)
{
.column33
{
min-width: 300px;
float:left;
width: 100%;
border: 0px solid blue;
box-sizing: border-box;
padding: 15px;
}
}
@media only screen and (min-width: 650px)
{
.column33
{
min-width: 300px;
float:left;
width: 100%;
border: 0px solid blue;
box-sizing: border-box;
padding: 15px;
}
}
@media only screen and (min-width: 900px)
{
.column33
{
min-width: 300px;
float:left;
max-width: 33%;
border: 0px solid blue;
box-sizing: border-box;
padding: 15px 10px 15px 15px;
}
}
@media only screen and (min-width: 300px)
{
.column50
{
min-width: 300px;
float:left;
width: 100%;
border: 0px solid blue;
box-sizing: border-box;
padding: 15px;
}
}
@media only screen and (min-width: 650px)
{
.column50
{
min-width: 300px;
float:left;
width: 100%;
border: 3px solid blue;
box-sizing: border-box;
padding: 15px;
}
}
@media only screen and (min-width: 900px)
{
.column50
{
min-width: 300px;
float:left;
max-width: 50%;
border: 3px solid blue;
box-sizing: border-box;
padding: 15px 10px 15px 15px;
}
}
/* /clmns ****************************************** */
footer
{
position: absolute;
left: 0;
bottom: 0;
height: 250px;
width: 100%;
background-image: url(../images/SnackNTravel_Planks.jpg);
background-repeat: repeat;
border: 0px solid green;
}
footer .main
{
position:relative;
width:auto;
min-height:230px;
max-width:950px;
clear: both;
margin: 10px auto 0px auto;
border: dotted;
border-color: yellow;
border-width: 0px;
overflow:hidden
}
footer .f_full
{
margin: 0 auto;
width:100%;
height:100%;
border: dotted;
border: 0px solid red;
}
footer .f_full_t
{
margin: 0 auto;
width:100%;
min-height:100%;
background:#000;
position: absolute;
opacity: 0.4;
filter: alpha(opacity=40); /* For IE8 and earlier */
border: dotted;
border: 0px solid red;
z-index:-1;
border-bottom: 1px solid #444444;
}
#content
{
position:relative;
width:auto;
min-height:600px;
max-width:950px;
clear: both;
background:#fff;
margin: 10px auto 0px auto;
border: dotted;
border-color: yellow;
border-width: 0px;
padding: 5px;
box-sizing: border-box;
overflow:hidden
}
.centerBox
{
margin: 0 auto;
width:100%;
height:auto;
max-width:950px;
position: relative;
border: dotted;
border: 0px solid red;
}
/* Stuff */
@media only screen and (min-width: 100px)
{
.img_logo
{
width:250px;
text-align:center;
}
}
@media only screen and (min-width: 768px)
{
.img_logo
{
padding-top:35px;
width:400px;
float: left;
}
}
@media only screen and (min-width: 100px)
{
.img_logo2
{
width:100px;
float: left;
}
}
@media only screen and (min-width: 768px)
{
.img_logo2
{
width:150px;
float: left;
}
}
@media only screen and (min-width: 100px)
{
.img_slgn
{
position: relative;
width:120px;
float: right;
top:0px;
}
}
@media only screen and (min-width: 768px)
{
.img_slgn
{
width:100px;
float: right;
position: absolute;
bottom: 0;
right:0;
}
}
@media only screen and (min-width: 100px)
{
.img_soc
{
padding: 4px 5px 5px 0px;
width:20px;
float:right;
}
}
@media only screen and (min-width: 768px)
{
.img_soc
{
padding: 4px 5px 5px 0px;
width:26px;
height:26px;
float:right;
}
}
@media only screen and (min-width: 100px)
{
.img_mail
{
padding: 4px 5px 5px 0px;
width:30px;
float:right;
}
}
@media only screen and (min-width: 768px)
{
.img_mail
{
padding: 4px 5px 5px 0px;
width:40px;
height:26px;
float:right;
}
}
.img_bg
{
height: 1080px;
background-image: url(../images/Impuls_Fitness_BG.jpg);
background-size: cover;
border: 0px solid darkgray;
}
.img_sld
{
width:100%;
height: auto;
}
.f_head
{
color: #bfa86e;
font-size:16px;
border-bottom: 1px solid #444;
font-weight:regular;
}
.f_text
{
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
color:#999;
font-size:14px;
text-decoration: none;
}
.f_text2
{
text-align: right;
float:right;
color:#999;
font-size:14px;
text-decoration: none;
}
.fb:link
{
width:100%;
height:100%;
float:right;
background:url('../images/fb.jpg');
background-size: 100% 100%;
outline: none;
}
.fb:hover
{
width:100%;
height:100%;
float:right;
background:url('../images/fb_hover.jpg');
background-size: 100% 100%;
outline: none;
}
.fb:visited, .fb:active
{
width:100%;
height:100%;
float:right;
background:url('../images/fb_hover.jpg');
background-size: 100% 100%;
outline: none;
}
.mail:link
{
width:100%;
height:100%;
float:right;
background:url('../images/mail.jpg');
background-size: 100% 100%;
outline: none;
}
.mail:hover
{
width:100%;
height:100%;
float:right;
background:url('../images/mail_hover.jpg');
background-size: 100% 100%;
outline: none;
}
.mail:visited, .mail:active
{
width:100%;
height:100%;
float:right;
background:url('../images/mail_hover.jpg');
background-size: 100% 100%;
outline: none;
}
@media only screen and (min-width: 100px)
{
h1
{
font-size:20px;
font-weight:regular;
color: #a19637;
margin: 0 0 5px 0;
}
}
@media only screen and (min-width: 768px)
{
h1
{
font-size:28px;
font-weight:regular;
color: #a19637;
margin: 0 0 5px 0;
}
}
h2
{
width:100%;
font-size:18px;
font-weight:regular;
color: #fff;
background-color:#a19637;
padding:5px
}
h3
{
font-size:16px;
font-weight:regular;
color:#a19637;
margin: 0 0 0px 0;
}
a {color:#bfa86e; text-decoration:none;outline: 0;}
a:hover {color:#555; text-decoration:none;}
.responsiveMenuTheme1d.isDesktop > li > a
{
display: block;
padding: 0px 15px; display: block;
padding: 0px 15px;
}