html {font-family: 'Monda', sans-serif; font-size: 18px; line-height: 25px; font-weight: lighter;}
@media screen and (max-width : 680px){ html {font-size: 13px; line-height: 16px;} }
body {margin: 0px;}
* {margin: 0; padding: 0;}
.clear {clear: both;}
img {border: 0px;}




@media screen and (max-width : 680px){ .novis680 {display: none;} }





#wrapdiv {width: 100%; max-width: 1000px; margin: auto;}


h1, h2, h3, h4 {margin: 0% 1% 1% 1%; padding-top: 3%; font-size: 30px; line-height: 40px; font-weight: 700;}
@media screen and (max-width : 680px){ h1, h2, h3, h4 {font-size: 16px; line-height: 25px;} }

#wrapdiv p {padding: 1% 1% 3% 1%;}







.points1 {max-width: 1200px; padding-left: 8%; margin: 20px auto; text-align: left; list-style-type: none;}
.points1 li {margin-bottom: 1%;}
.points1 li:before {font-family: FontAwesome; content: "\f0da"; margin-right: 10px;}


.points2 {text-align: left; max-width: 900px; margin: 50px auto 0 auto; list-style-type: none;}
.points2 li {margin-bottom: 2%;}
.points2 p {clear: both; margin-top: 15px; width: 100%;}
@media screen and (max-width : 680px){
	.points2 li {margin-bottom: 20%;}
	.points2 p {margin-top: 3%;}
}



.ico-check1 {border-radius: 30px; float: left; font-size: 18px; height: 30px; line-height: 30px; margin-right: 12px; margin-top: 2px; text-align: center; width: 30px;}
.ico-check1:before {font-family: FontAwesome; content: "\f00c";}

@media screen and (max-width : 680px){
	.ico-check1 {font-size: 14px; width: 20px; height: 20px; line-height: 20px; margin-right: 8px; margin-top: 0px;}
}







.iconbox {display: table; width: 100%; max-width: 1100px; margin: 4% auto;}
.iconbox .iconboxpic {display: table-cell; width: 20%; vertical-align: top;}
.iconbox .space {display: table-cell; width: 10%;}
.iconbox .iconboxtxt {display: table-cell; width: 70%; vertical-align: top; text-align: left; font-size: 18px; line-height: 24px;}
.iconbox .iconboxtxt h2:before {font-family: FontAwesome; content: "\f0da"; font-weight: lighter; margin-right: 5px;}

@media screen and (max-width : 680px){
	.iconbox .iconboxpic {width: 30%;}
	.iconbox .space {width: 0%;}
}

@media screen and (max-width : 480px){
	.iconbox {display: flex; flex-wrap: wrap; margin: 15% auto;}
	.iconbox .iconboxpic {display: block; width: 100%; order: 1;}
	.iconbox .space {display: none;}
	.iconbox .iconboxtxt {display: block; width: 100%; order: 2;}
}



.icon1 {width: 100%; height: 0; padding-bottom: 100%; background: url(img/icon1.jpg); background-size: 100%;}
.icon2 {width: 100%; height: 0; padding-bottom: 100%; background: url(img/icon2.jpg); background-size: 100%;}
.icon3 {width: 100%; height: 0; padding-bottom: 100%; background: url(img/icon3.jpg); background-size: 100%;}

@media screen and (max-width : 480px){
	.icon1 {width: 200px; height: 0; padding-bottom: 200px; background: url(img/icon1.jpg); background-size: 100%; margin: auto;}
	.icon2 {width: 200px; height: 0; padding-bottom: 200px; background: url(img/icon2.jpg); background-size: 100%; margin: auto;}
	.icon3 {width: 200px; height: 0; padding-bottom: 200px; background: url(img/icon3.jpg); background-size: 100%; margin: auto;}
}





.moreerotic {display: table;}
.moreerotic > div:nth-of-type(1) {display: table-cell; vertical-align: middle; width: 40%;}
.moreerotic > div:nth-of-type(2) {display: table-cell; vertical-align: middle; width: 60%;}

.moreerotic > div:nth-of-type(1) img {width: 65%; margin: auto; border-radius: 500px; display: block;}
.moreerotic > div:nth-of-type(2) h4 {padding-top: 0;}
.moreerotic > div:nth-of-type(2) ul {padding-left: 1%;}




/* ------BILDER------ */
.bilderleft {display: block; float: left; margin-right: 1%;}
.bilderright {display: block; float: right; margin-left: 1%;}
.bilderfull {display: block; width: 98%; margin: 1% auto;}
.bilder {padding: 1%;}

.pw20 {width: 20%;}
.pw25 {width: 25%;}
.pw30 {width: 30%;}
.pw35 {width: 35%;}
.pw40 {width: 40%;}

.mw200 {max-width: 200px;}
.mw250 {max-width: 250px;}
.mw300 {max-width: 300px;}
.mw350 {max-width: 350px;}
.mw400 {max-width: 400px;}
.mw450 {max-width: 450px;}
.mw500 {max-width: 500px;}
.mw550 {max-width: 550px;}
.mw600 {max-width: 600px;}
.mw650 {max-width: 650px;}
.mw700 {max-width: 700px;}
.mw750 {max-width: 750px;}
.mw800 {max-width: 800px;}

.mt1 {margin-top: 1%;}



.box {padding: 1%;}




/* ------YOUTUBEVIDEO------ */
.ytvideocontainer {width: 560px; height: 355px; padding: 10px; background: rgba(0,0,0, 0.2); display: block; margin: 1% auto;}
.ytvideo {display: block; width: 560px; height: 355px; margin: auto;}

@media screen and (max-width : 920px){ .ytvideo {width: 450px; height: 253px;} .ytvideocontainer {width: 450px; height: 253px;} }
@media screen and (max-width : 800px){ .ytvideo {width: 370px; height: 208px;} .ytvideocontainer {width: 370px; height: 208px; padding: 5px;} }
@media screen and (max-width : 680px){ .ytvideo {width: 550px; height: 309px;} .ytvideocontainer {width: 550px; height: 309px; padding: 10px;} }
@media screen and (max-width : 600px){ .ytvideo {width: 450px; height: 253px;} .ytvideocontainer {width: 450px; height: 253px;} }
@media screen and (max-width : 500px){ .ytvideo {width: 370px; height: 208px;} .ytvideocontainer {width: 370px; height: 208px; padding: 5px;} }
@media screen and (max-width : 400px){ .ytvideo {width: 280px; height: 158px;} .ytvideocontainer {width: 280px; height: 158px; padding: 5px;} }
/* ---------------------- */


/* ---------------------- */


footer {text-align: center; padding-bottom: 2%;}


/***** FARBANGABEN *****/

html {color: #222; background: #F2F2F2;}

a {color: #35b3e8; text-decoration: none;}
a:hover {color: #000;}


h1, h2, h3, h4 {color: #35b3e8;}


#wrapdiv {margin-bottom: 1%;}


.box {background: #FFF; box-shadow: 0 0 10px rgba(0,0,0, 0.3);}


.bilder {background: #FFF;}


/*!
*  Font Awesome 4.4.0 by @davegandy - http://fontawesome.io - @fontawesome
*  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
*/@font-face{font-family:'FontAwesome';src:url('fonts/fontawesome-webfont.eot?v=4.4.0');src:url('fonts/fontawesome-webfont.eot?#iefix&v=4.4.0') format('embedded-opentype'),url('fonts/fontawesome-webfont.woff2?v=4.4.0') format('woff2'),url('fonts/fontawesome-webfont.woff?v=4.4.0') format('woff'),url('fonts/fontawesome-webfont.ttf?v=4.4.0') format('truetype'),url('fonts/fontawesome-webfont.svg?v=4.4.0#fontawesomeregular') format('svg');font-weight:normal !important;font-style:normal}

