/*********************************************************************************************

Project : rwdgrid - responsive grid system for your next project
URI: http://rwdgrid.com/
Version: 2.0
Author: Vineeth G S
Author URI: http://www.gsvineeth.com
Github URI: https://github.com/gsvineeth/rwdgrid/

*********************************************************************************************/




@font-face {
  font-family: 'Bitter';
  font-style: normal;
  font-weight: 400;
  src: url('bitter-v28-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('bitter-v28-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('bitter-v28-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('bitter-v28-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('bitter-v28-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('bitter-v28-latin-regular.svg#Bitter') format('svg'); /* Legacy iOS */
}


/*********************************************************************************************

1.  Base code

*********************************************************************************************/


*, *:after, *:before {
    margin: 0;
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

[class*='grid-'] {
    float: left;
    padding: 10px;
    width: 100%;
}

.clear-grid{
    clear:both;
    float:inherit;
}
.container {
    margin:0%;
    width: 100%;
}
.container:after, .container:before {
    display: table;
    clear:both;
    content: " ";
}
.nest {
    margin:0 -10px;
    padding:0;
    width:auto;
}


/*********************************************************************************************

2.  Mobile Grid

*********************************************************************************************/

.grid-m-12 {
    width: 100%;
}
.grid-m-11 {
    width: 91.666663%;
}
.grid-m-10 {
    width: 83.33%;
}
.grid-m-9 {
    width: 74.999997%;
}
.grid-m-8 {
    width: 66.66666664%;
}
.grid-m-7 {
    width: 58.333%;
}
.grid-m-6 {
    width: 50%;
}
.grid-m-5 {
    width: 41.6665%;
}
.grid-m-4 {
    width: 33.33%;
}
.grid-m-3 {
    width: 24.99%;
}
.grid-m-2 {
    width: 16.66666%;
}
.grid-m-1 {
    width: 8.33%;
}

@media (min-width: 550px) {
    .grid-s-12 {
        width: 100%;
    }
    .grid-s-11 {
        width: 91.666663%;
    }
    .grid-s-10 {
        width: 83.33%;
    }
    .grid-s-9 {
        width: 74.999997%;
    }
    .grid-s-8 {
        width: 66.66666664%;
    }
    .grid-s-7 {
        width: 58.333%;
    }
    .grid-s-6 {
        width: 50%;
    }
    .grid-s-5 {
        width: 41.6665%;
    }
    .grid-s-4 {
        width: 33.33%;
    }
    .grid-s-3 {
        width: 24.99%;
    }
    .grid-s-2 {
        width: 16.66666%;
    }
    .grid-s-1 {
        width: 8.33%;
    }
}

/*********************************************************************************************

3.  Grid 720px+

*********************************************************************************************/


@media (min-width: 720px) {
    .grid-12 {
        width: 100%;
    }
    .grid-11 {
        width: 91.666663%;
    }
    .grid-10 {
        width: 83.33%;
    }
    .grid-9 {
        width: 74.999997%;
    }
    .grid-8 {
        width: 66.66666664%;
    }
    .grid-7 {
        width: 58.333%;
    }
    .grid-6 {
        width: 50%;
    }
    .grid-5 {
        width: 41.6665%;
    }
    .grid-4 {
        width: 33.33%;
    }
    .grid-3 {
        width: 24.99%;
    }
    .grid-2 {
        width: 16.66666%;
    }
    .grid-1 {
        width: 8.33%;
    }

    .grid-t-12 {
        width: 100%;
    }
    .grid-t-11 {
        width: 91.666663%;
    }
    .grid-t-10 {
        width: 83.33%;
    }
    .grid-t-9 {
        width: 74.999997%;
    }
    .grid-t-8 {
        width: 66.66666664%;
    }
    .grid-t-7 {
        width: 58.333%;
    }
    .grid-t-6 {
        width: 50%;
    }
    .grid-t-5 {
        width: 41.6665%;
    }
    .grid-t-4 {
        width: 33.33%;
    }
    .grid-t-3 {
        width: 24.99%;
    }
    .grid-t-2 {
        width: 16.66666%;
    }
    .grid-t-1 {
        width: 8.33%;
    }
}

/*********************************************************************************************

4.  Grid 1024px+

*********************************************************************************************/

@media only screen and (min-width: 1024px) {
    .grid-tl-12 {
        width: 100%;
    }
    .grid-tl-11 {
        width: 91.666663%;
    }
    .grid-tl-10 {
        width: 83.33%;
    }
    .grid-tl-9 {
        width: 74.999997%;
    }
    .grid-tl-8 {
        width: 66.66666664%;
    }
    .grid-tl-7 {
        width: 58.333%;
    }
    .grid-tl-6 {
        width: 50%;
    }
    .grid-tl-5 {
        width: 41.6665%;
    }
    .grid-tl-4 {
        width: 33.33%;
    }
    .grid-tl-3 {
        width: 24.99%;
    }
    .grid-tl-2 {
        width: 16.66666%;
    }
    .grid-tl-1 {
        width: 8.33%;
    }
}


/*********************************************************************************************

5.  Grid 1200px+

*********************************************************************************************/

@media only screen and (min-width: 1200px) {
    .container {
        max-width:1180px;
        margin:0 auto;
    }
    .container-fluid {
        max-width:90%;
        margin:0 5%;
    }
    .grid-d-12 {
        width: 100%;
    }
    .grid-d-11 {
        width: 91.666663%;
    }
    .grid-d-10 {
        width: 83.33%;
    }
    .grid-d-9 {
        width: 74.999997%;
    }
    .grid-d-8 {
        width: 66.66666664%;
    }
    .grid-d-7 {
        width: 58.333%;
    }
    .grid-d-6 {
        width: 50%;
    }
    .grid-d-5 {
        width: 41.6665%;
    }
    .grid-d-4 {
        width: 33.33%;
    }
    .grid-d-3 {
        width: 24.99%;
    }
    .grid-d-2 {
        width: 16.66666%;
    }
    .grid-d-1 {
        width: 8.33%;
    }
}

/*********************************************************************************************

6.  Helper classes

*********************************************************************************************/


img.scale, img.responsive {
    max-width: 100%;
    height: auto;
}


/*********************************************************************************************

7. Classes

*********************************************************************************************/


*, *:before, *:after {
	margin: 0;
	padding: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
html {
	font-size: 12px;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	line-height: 1.4;
	color: #752700;
	font-family: 'Bitter', serif;
	font-weight:400;
	position: relative;
}
body {
	background: #FFFFFF;
	-webkit-touch-callout: none !important;
	-webkit-user-select: none !important;
	-khtml-user-select: none !important;
	-moz-user-select: -moz-none !important;
	-ms-user-select: none !important;
	user-select: none !important;
}
html, body, .main {
	height: 100%;
	width: 100%;
}
/* scroll */
.scroll {
    position: fixed;
    z-index: 100;
    width: 100%;
    top: 0;
}
.progress-container {
    width: 100%;
    height: 7px;
    z-index: 999;
}
.progress-bar {
    height: 5px;
    background: #752700;
    width: 0%;
}

/* h4 */
h4.bgline {
	font-size:1em;
    position: relative;
    z-index: 1;
	padding:20px;
}
h4.bgline:before {
        border-top: 3px double #752700;
        content:"";
        margin: 0 auto; 
        position: absolute; 
        top: 50%; left: 0; right: 0; bottom: 0;
        width: 100%;
        z-index: -1;
    }
h4.bgline span { 
        background: #ffffff; 
        padding: 0 20px; 
    }
.formate {
	color:#484848;
	font-size:1em;
	line-height:1.2em;
}	
.hinweis {
	color:#fc0b37;
	font-size:1em;
	line-height:1.2em;
}	
.bedingungen {
	color:#484848;
	font-size:1em;
	line-height:1.2em;
}	
.brands {
	color:#484848;
	font-size:0.8em;
	line-height:1.2em;
	margin-bottom:100px;
}	
/* ad9 */
.ad9 {
	position: fixed;
	z-index:99999;
	bottom: 40px;
	right:20px;
	text-align:right;
}

/* brand */
.thebrand {
	text-align: center;
	margin-top: 40px;
	margin-bottom: 60px;
}
#thebrandlogo {
	display: inline-block;
	background-repeat: no-repeat !important;
	background-size: 800px 400px;
	background-image: url("sprite.png");
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 200px;
	height: 75px
}
#thebrandlogo {
	background-position: -600px -325px
}
#thebrandlogo  {
    font-size: 0px;
    letter-spacing: 0px;
    word-spacing: 0px
}
/* greift */
.greiftsite {
	text-align: center;
	margin-top: 40px;
	margin-bottom: 40px;
}
#greift {
	display: inline-block;
	background-repeat: no-repeat !important;
	background-size: 800px 400px;
	background-image: url("sprite.png");
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 200px;
	height: 75px
}
#greift {
	background-position: -400px -325px
}
#greift  {
    font-size: 0px;
    letter-spacing: 0px;
    word-spacing: 0px
}

.main {
	display: table;
	/*border: 7px solid #FF4200;*/
	padding: 10px;
}

.main-inner {
	display: table-cell;
	vertical-align: middle;
}
.moon {
	text-align: center;
	margin-top: 80px;
}
.main h1 {
	font-size: 32px;
	font-weight:700;
}
.main h2 {
	font-size: 18px;
	font-weight:700;
	text-align:center;
	background-color:transparent;
}
.main h3 {
	font-size: 12px;
	font-weight:700;
	margin: 0 0 20px;
}
.cent  {
	text-align:center;
}
.nocent  {
	text-align:left;
}

a, a:link, a:hover, a:visited, a:active {
	color: #752700;
	text-decoration:none;
	}

a:hover {
	opacity: 0.7;
}
a:hover img {
	opacity: 0.7;
}
p {
	padding: 10px;
	text-align:center;
	color:#484848;
	max-width:600px;
}
.big {
	font-size:2.4em;
	font-weight:900;
}
.mittel {
	font-size:1.5em;
}
.brandhead {
	text-align:center;
	font-size:1.4em;
	color:#484848;
	padding-top:20px;
	padding-bottom:20px;
}
.brandtext {
	padding-top:10px;
	padding-left:20px;
	padding-right:20px;
	font-size:1.2em;
	color:#484848;
}
.brandurl {
	padding-top:10px;
	color:#FF4200;
	font-size:1.6em;
}
/* social */                     
.brand-social {
	margin-top: 10px;
	margin-right: 0px;
}
.brand-social a {
	transition: all 150ms ease-out
}
.brand-social a:hover, .brand-social a:focus {
	transform: scale(1.4);
}
.brand-social a:not(:last-child) {
	margin-right: 7px
}
#soc_in, #soc_fb, #soc_yt, #soc_tw, #soc_ti, #soc_gi, #soc_te, #soc_un, #soc_sn, #soc_th, #soc_nl, #soc_bs, #soc_wa, #soc_li, #soc_dem, #soc_ded, #soc_deb {
	display: inline-block;
	background-repeat: no-repeat !important;
	background-size: 200px 100px;
	background-image: url("sprite.png");
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 25px;
	height: 25px
}
#soc_in {
	background-position: 0px 0px
}
#soc_fb {
	background-position: -25px 0px
}
#soc_yt {
	background-position: -50px 0px
}
#soc_tw {
	background-position: -75px 0px
}
#soc_ti {
	background-position: -100px 0px
}
#soc_gi {
	background-position: -125px 0px
}
#soc_te {
	background-position: -150px 0px
}
#soc_un {
	background-position: -175px 0px
}
#soc_sn {
	background-position: 0px -75px
}
#soc_th {
	background-position: -25px -75px
}
#soc_nl {
	background-position: -50px -75px
}
#soc_bs {
	background-position: -75px -75px
}
#soc_wa {
	background-position: 0px -25px
}
#soc_li {
	background-position: -25px -25px
}
#soc_dem {
	background-position: -50px -25px
}
 #soc_ded {
	background-position: -75px -25px
}
#soc_deb {
	background-position: -100px -25px
}
#soc_in, #soc_fb, #soc_yt, #soc_tw, #soc_ti, #soc_gi, #soc_te, #soc_un, #soc_sn, #soc_th, #soc_nl,#soc_bs,#soc_wa, #soc_li, #soc_dem, #soc_ded, #soc_deb {
    font-size: 0px;
    letter-spacing: 0px;
    word-spacing: 0px
}
/* brands logos */
.brand-logos {
	justify-content: center;
}
.brand-logos a {
	transition: all 150ms ease-out;
	margin-top:75px;
    margin-left:50px;
    margin-right:25px;
    }
.brand-logos a:hover, .brand-logos a:focus {
	transform: scale(1.1);
}
#logos_alles, #logos_pict, #logos_toda, #logos_vere, #logos_rowi, #logos_pola, #logos_grue, #logos_uppr,#logos_news  {
	display: inline-block;
	background-repeat: no-repeat !important;
	background-size: 375px 150px;
	background-image: url("sprite-logos.png");
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 75px;
	height: 75px
}
#logos_alles {
	background-position: 0px 0px
}
#logos_pict {
	background-position: -75px 0px
}
#logos_toda {
	background-position: -150px -0px
}
#logos_vere {
	background-position: -225px -0px
}
#logos_rowi {
	background-position: -300px -0px
}
#logos_pola {
	background-position: 0px -75px
}
#logos_grue {
	background-position: -75px -75px
}
#logos_uppr {
	background-position: -150px -75px
}
#logos_news {
	background-position: -225px -75px
}
#logos_alles, #logos_pict, #logos_toda, #logos_vere, #logos_rowi, #logos_pola, #logos_grue, #logos_uppr, #logos_news {
    font-size: 0px;
    letter-spacing: 0px;
    word-spacing: 0px
}
/* links */
.brand-links {
	justify-content: center;
	padding-top:50px;
}
.brand-links a {
	transition: all 150ms ease-out
}
.brand-links a:hover, .brand-links a:focus {
	transform: scale(1.1);
}
#buchn_news {
	display: inline-block;
	background-repeat: no-repeat !important;
	background-size: 800px 400px;
	background-image: url("sprite.png");
	overflow: hidden;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	width: 150px;
	height: 150px
}
#buchn_news {
	background-position: 0px -100px
}
#buchn_news {
    font-size: 0px;
    letter-spacing: 0px;
    word-spacing: 0px
}
/* hoch */
.spa {height:50px;margin-bottom:50px;}
.hoch {height:550px;margin-bottom:100px;}
.anfragetext {
	text-align:center;
	font-size:1.4em;
	color:#484848;
	padding-top:20px;
}
.anfragemail {
	padding-top:10px;
	color:#FF4200;
	font-size:1.6em;
}
.textliste {
	font-size:1em;
	line-height:1.6em;
	color:#484848;
	padding-left:40px;
	padding-top:20px;
}
/* block */
/* BLOCK0 */
.bubble {
	padding: 0px;
}
.linzvideo {
	position: relative;
	background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAAXNSR0IArs4c6QAAABRJREFUCB1jYMAFbG1t/+OSI0McAIPfAbcdiWWVAAAAAElFTkSuQmCC) repeat;
	overflow: hidden;
}
.blockvideo {
	position: absolute;
	top: 50%;
	left: 50%;
	width: auto;
	min-width: 100%;
	height: auto;
	min-height: 100%;
	transform: translateX(-50%) translateY(-50%);
	z-index: -1;
	background-size:cover;
	background-position: center;
}
.block0zwei {
position:absolute;
top: 30px;
left:20px;
}
.b02text {
color:#f6e23e;
font-family: 'Bitter', cursive;
}
/* farben */
.fh {
	color: #FF4200;
}
.fd {
	color: #752700;
}
.fg {
	color: #484848;
}
.border1 {
	margin-top:100px;
	border-radius:12px;
	background: linear-gradient(to right, #fc0b37, purple);
	padding:4px;
}
.border2 {
	margin-top:100px;
	border-radius:12px;
	background: linear-gradient(to right, #fc0b37, orange);
	padding:4px;
}
.border3 {
	margin-top:100px;
	border-radius:12px;
	background: linear-gradient(to right, #752700, #FF4200);
	padding:4px;
}
.borderi {
	background:#ffffff;
    padding:30px;
    border-radius:9px;
}
/* preis */
.card-price {
	display: inline-block;
    width: auto;
	height: 38px;
	background-color: #f6e23e;
	-webkit-border-radius: 3px 4px 4px 3px;
	-moz-border-radius: 3px 4px 4px 3px;
	border-radius: 3px 4px 4px 3px;
	border-left: 1px solid #f6e23e;
	margin-left: 19px;
	position: relative;
	color: black;
	font-weight: 300;
	font-size: 22px;
	line-height: 38px;

	padding: 0 10px 0 10px;
}
.card-price:before {
	content: "";
	position: absolute;
	display: block;
	left: -19px;
	width: 0;
	height: 0;
	border-top: 19px solid transparent;
	border-bottom: 19px solid transparent;
	border-right: 19px solid #f6e23e;
}
.card-price:after {
	content: "";
	background-color: white;
	border-radius: 50%;
	width: 4px;
	height: 4px;
	display: block;
	position: absolute;
	left: -9px;
	top: 17px;
}
mark {
  margin: 0 -0.4em;
  padding: 0.1em 0.4em;
  border-radius: 0.8em 0.3em;
  background: transparent;
  background-image: linear-gradient(
    to right,
    rgba(255, 225, 0, 0.1),
    rgba(255, 225, 0, 0.7) 4%,
    rgba(255, 225, 0, 0.3)
  );
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}
.redbg {
  margin: 0 -0.4em;
  padding: 0.1em 0.4em;
  border-radius: 0.8em 0.3em;
  background: transparent;
  background-image: linear-gradient(
    to right,
    rgba(255, 225, 0, 0.1),
    rgba(255, 225, 0, 0.7) 4%,
    rgba(255, 225, 0, 0.3)
  );
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}


