/* Reset START */
body,div,blockquote,pre,code,h1,h2,h3,h4,h5,h6,p,ol,ul,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea {
	margin:0;
	padding:0;
}

caption,th,td {
	text-align:left;
	vertical-align:top;
}

abbr,acronym {
	font-variant:normal;
	border-bottom:1px dotted #666;
	cursor:help;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
blockquote,q {
	quotes:none;
}
fieldset,img {
	border:0;
}
li {
	list-style-type:none;
}
sup {
	vertical-align:text-top;
}
sub {
	vertical-align:text-bottom;
}
del {
	text-decoration:line-through;
}
ins {
	text-decoration:none;
}
:focus {
	outline:0;
}
/* Reset END */


@font-face {
    font-family: 'mandara';
    src: url(http://www.griechisch-mit-nicco.de/candara.ttf) format('truetype');
}

@font-face {
    font-family: 'mandara2';
    src: url(candara.ttf) format('truetype');
}


@font-face {
    font-family: 'hatti';
    src: url(hatten.ttf) format('truetype');
}

@font-face {
    font-family: 'hatti2';
    src: url(http://www.griechisch-mit-nicco.de/hatten.ttf) format('truetype');
}





/* the font didnt load into chrome in desktop, so i use it again as jpg
   this worked. I have no idea why it didnt load in the first place.
   On Android with ghostery it seems it did load, which would mean that the
   server is ok. Anyway - i now load it both ways so it works more often */
   


 body {
	background-color: #231f20;
	font-family:  candara, 'mandara','mandara2','mandara3','palatino linotype',palatino, georgia,'times new roman',times,serif; 
	font-size: 24px;
	color: #fff;
	font-weight: normal;
	line-height:125%;
}


@media only screen and (max-width: 850px) { body { font-size: 24px; } }
@media only screen and (max-width: 797px) { body { font-size: 23px; } }
@media only screen and (max-width: 750px) { body { font-size: 22px; } }
@media only screen and (max-width: 670px) { body { font-size: 21px; } }
@media only screen and (max-width: 600px) { body { font-size: 21px; } }
@media only screen and (max-width: 530px) { body { font-size: 20px; } }



/* width 525px had been to big for google mobile test as of 15.12.2016 */
#WRAPPER {
  width:100%;
	min-width:450px;
	max-width:750px;
	
	margin: 0;
}

#WRAPPER #HEADER {
	overflow: hidden;
	clear: both;
	padding-top: 10px;
	background-color: #68B2E4;
	  background-image: url('sky.png');
            background-size: cover; 

}

#WRAPPER #HEADER #LOGO img {
	padding-left: 2.9%;
	padding-top: 1.5%;
	float: left;
	height: auto;

	text-align: right;
	color: #393335;
}


/* for 100% images in freeversion page */
#WRAPPER #CONTENT #SALESLETTER img {
	clear: both;
	height: auto;
	width: 100%;
	max-width:800px;
}

/* 82% images - 9% + center + 9% right */
#WRAPPER #CONTENT #SALESLETTER .IMG90PERC img {
  clear: both;
	height: auto;
  padding-left: 9%;
  width: 82%;
}


#WRAPPER #CONTENT #SALESLETTER p {
	width:82%;
	padding-left: 9%;
	padding-right: 9%;
}


#WRAPPER #CONTENT #SALESLETTER .mycheckmark ul {
	padding-left: 4%;

}

#WRAPPER #CONTENT #SALESLETTER #RDSTANDARD {
	width:100%;
	max-width:800px;
	
	background-repeat: repeat;
	border-radius: 10px;
}

#WRAPPER #CONTENT #SALESLETTER #RICHSCENE {
	width:100%;
	max-width:800px;

	background-color: rgba(255,215,0,  0.2);
	border-radius: 10px;
}


#WRAPPER #CONTENT #SALESLETTER #RDEXTREME {
	width:100%;
	max-width:800px;


	background-repeat: repeat;
	border-radius: 10px;
}

#RDSTANDARD #STEXT p {
	font-size: 110%;
	padding-top: 1.5%;
	padding-bottom: 1.5%;
	text-align: left;
	color: black;
	font-family: Arial, Serif;
	line-height: 18pt;
}

/* checkmark for sales letter */
.mycheckmark {
  padding-left: 11%;
}

.mycheckmark li {
  padding-top: 1.8%;
}

.mycheckmark2 {
  padding-left: 14%;
}


/* must reset ul, if there is a padding the slideshow 
   makes width computation and shrinks the image */
#WRAPPER #CONTENT #SALESLETTER #RDSTANDARD ul {
	padding-left: 0px;

}

#WRAPPER #CONTENT #SALESLETTER #RDEXTREME ul {
	padding-left: 0px;
}


/* is id to get higher specifity */
#MYCENTERIMG {
  padding-left:12%;
  padding-right:12%;
}

#MYCENTERIMG2 {
  padding-left:0%;
  padding-right:9%;
}

#MYCENTERIMG3 {
  padding-left:0%;
  padding-right:9%;
}


#MYCENTERIMG4 {
  padding-left:10%;
  padding-right:10%;
}

#MYCENTERBUTTON {
  padding-left:35%;
  padding-right:35%;
  transition-duration: 0.25s;
}

#MYCENTERBUTTON:hover {
  padding-left:33%;
  padding-right:33%;
  transition-duration: 0.25s;
}

.IMGHOVER:hover img {
  box-shadow: 0px 1px 20px #888878;
  transition-duration: 0.25s;

}


/* class to control fist slideshow in salesletter */
#RDSTANDARD .rslides2 {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  margin: 0;
 
  }

#RDSTANDARD .rslides2 li {
  list-style-type: none;
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  top: 0;
 
  }

#RDSTANDARD .rslides2 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

#RDSTANDARD .rslides2 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

#RDSTANDARD .rslides3 {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 82%;
  margin: 0;
  }

#RDEXTREME .rslides3 li {
  list-style-type: none;
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  padding-left:  9%;
  width: 82%;
  top: 0;
  }

#RDEXTREME .rslides3 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

#RDEXTREME .rslides3 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }

#RDEXTREME .rslides4 li {
  list-style-type: none;
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  padding-left:  9%;
  width: 82%;
  top: 0;
  }

#RDEXTREME .rslides4 li:first-child {
  position: relative;
  display: block;
  float: left;
  }

#RDEXTREME .rslides4 img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  }


#WRAPPER #CONTENT #SALESLETTER #BELOWEXTREME .FREEVERSION {
    background: #A0FFA0;
    background: goldenrod;
    
  	width: 440px; 
  	margin-left:9%;
  	padding-top:3%;
  	padding-left:2%;
  	padding-right:9%;
  	padding-bottom:3%;
  	font-size: 90%;
}

/* reset p padding */
#WRAPPER #CONTENT #SALESLETTER #BELOWEXTREME .FREEVERSION p {
  padding-left:0%;
}


#BELOWEXTREME #FACEBOX {
  background: white;
  width:400px;
  height:215px;
  margin-left:1%;
}


#BELOWEXTREME #CLASSICALDOWNLOAD {
  background: #f0f0f0;
  margin-left:1%;
  width:390px;

  border-width:1px;
  border-style:solid;
  border-color:#ccc;

}


/* end of freeversion page part */

#WRAPPER #HEADER #MENU {
	overflow: hidden;
	float: left;
	clear: both;
  width:100%
	min-width: 490px;
	padding-top: 3.1%;
	font-family: Verdana, Tahoma, Arial, Serif;	
}





#WRAPPER #HEADER #MENU ul  {
}
#WRAPPER  #HEADER  #MENU ul li{
	list-style-type: none;
	float: left;
	color: #E8E8E8;
	display: block;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #221E20;
	border-right-color: #221E20;
	border-left-color: #221E20;
}

#WRAPPER #HEADER #MENU ul li  a{
	padding-top: 12px;
	padding-right: 17px;
	padding-bottom: 12px;
	padding-left: 17px;
	text-decoration: none;
	font-size: 100%;
	color: #ffffff;
	display: block;
}

/* need extra breakpoints for non-mobile devices to get nice design .  padding left and right */


@media only screen and (max-width: 770px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 15px; padding-left: 15px; } }
@media only screen and (max-width: 740px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 14px; padding-left: 14px; } }
@media only screen and (max-width: 710px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 13px; padding-left: 13px; } }
@media only screen and (max-width: 690px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 12px; padding-left: 12px; } }
@media only screen and (max-width: 660px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 11px; padding-left: 11px; } }
@media only screen and (max-width: 630px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 10px; padding-left: 10px; } }
@media only screen and (max-width: 615px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 7px; padding-left: 7px; } }
@media only screen and (max-width: 600px) { #WRAPPER #HEADER #MENU ul li  a { padding-right: 5px; padding-left: 5px; } }


#WRAPPER #HEADER #MENU ul li:hover a , #WRAPPER #HEADER #MENU ul li.hover a{
	color: #231f20;
	font-weight: normal;
}
#WRAPPER #HEADER #MENU ul li:hover, #WRAPPER #HEADER #MENU ul li.hover {
	color: #231f20;
	background-color: #CAC5BF;
	border-top-width: 1px;
	border-right-width: 1px;
	border-left-width: 1px;
	border-top-style: solid;
	border-right-style: solid;
	border-left-style: solid;
	border-top-color: #666666;
	border-right-color: #999999;
	border-left-color: #666666;
}
#WRAPPER #GRADIENT {
	overflow: hidden;
	background-color: #FFF;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #666;
	border-left-color: #666;
	color: #231F20;
	background-image: url(/images/bg_menu.jpg);
	background-repeat: repeat-x;
	height: 40px;
}

#WRAPPER #MAIN {
	overflow: hidden;
	background-color: #fff;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #666;
	border-left-color: #666;
	padding: 1.5%;
	color: #231F20;
}

#WRAPPER #CONTENTBOX  {
	float: left;
	width: 220px;
	padding-right: 0px;
	min-height: 350px;
	margin-top: 2%;
	margin-bottom: 20px;
	padding-top: 7%;
	padding-bottom: 20px;
	padding-left: 10px;
	font-size:85%;
	font-family: Verdana, Tahoma, Arial, Serif;	
}

@media only screen and (max-width: 900px) { #WRAPPER #CONTENTBOX { width: 190px; } }
@media only screen and (max-width: 850px) { #WRAPPER #CONTENTBOX { width: 170px; } }
@media only screen and (max-width: 800px) { #WRAPPER #CONTENTBOX { width: 160px; } }
@media only screen and (max-width: 750px) { #WRAPPER #CONTENTBOX { width: 145px; } }
@media only screen and (max-width: 700px) { #WRAPPER #CONTENTBOX { width: 130px; } }
@media only screen and (max-width: 570px) { #WRAPPER #CONTENTBOX { width: 120px; } }
@media only screen and (max-width: 530px) { #WRAPPER #CONTENTBOX { width: 110px; } }
@media only screen and (max-width: 490px) { #WRAPPER #CONTENTBOX { width: 95px;  } }
@media only screen and (max-width: 470px) { #WRAPPER #CONTENTBOX { width: 90px;  } }


#WRAPPER #CONTENTBOX2 {
	float: left;
	width: 75px;
	padding-right: 20px;
	min-height: 350px;
	margin-top: 40px;
	margin-bottom: 20px;
	padding-top: 20px;
	padding-bottom: 20px;
	padding-left: 20px;
}

#WRAPPER #MAIN #CONTENTBOX .SUBMENU {
	padding-bottom: 19px;
	padding-left: 0px;
	overflow: hidden;
	clear: both;
	margin-bottom: 26px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #C7C6C4;
	padding-top: 19px;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #C7C6C4;
}

#WRAPPER #MAIN #CONTENTBOX p {

  margin-left:-5%;
}

#WRAPPER #MAIN #CONTENTBOX #HALFTRANSPARENT {
  opacity:0.4;
}

#WRAPPER #MAIN #CONTENTBOX .SUBMENU ul .hover a, #WRAPPER #MAIN #CONTENTBOX .SUBMENU ul li:hover a{
	font-weight: bold;
}

#WRAPPER #MAIN #CONTENTBOX .SUBMENU ul li {
	padding-top: 11px;
	padding-bottom: 11px;
}
#WRAPPER #MAIN #CONTENTBOX .SUBMENU ul li a {
	color: #333;
}
#WRAPPER #MAIN #CONTENTBOX p {
	clear: both;
	padding-bottom: 6px;
	line-height: 28px;
	font-size:110%; 
}
#WRAPPER #MAIN #CONTENTBOX p img , #WRAPPER #MAIN #CONTENTBOX table img{
	padding: 0px;
	float: left;
}

#WRAPPER #MAIN #CONTENTBOX a {
	text-decoration: none;
	font-weight: normal;
}
#WRAPPER #MAIN #CONTENTBOX a:hover {
	color: #333;
}
#WRAPPER #MAIN #CONTENTBOX .surveybox {
	clear: both;
	background-color: #F8E4BF;
	padding: 10px;
	margin-top: 15px;
	margin-bottom: 15px;
	border: 1px solid #E4C58D;
	overflow: hidden;
	color: #333;
}

#WRAPPER #CONTENT {
	border-left: none;
	padding-left: 5%;
	padding-right: 5%;
	overflow: hidden;
	padding-top: 0.1%;
	padding-bottom: 0.1%;
	text-align: justify;
}






#WRAPPER #CONTENT h1 {
	font-weight: normal;
	padding-bottom: 15px;
	font-size: 110%;
	padding-left: 0px;
	color: #393335;
}

#WRAPPER #CONTENT h2 {
	font-size: 120%;
	font-weight: bold;
	padding-bottom: 6%;
	padding-top: 8%;
}




#WRAPPER #CONTENT h3 {
	font-size: 100%;
	font-weight: normal;
	padding-bottom: 12px;
	color: #4F4F4F;
}
#WRAPPER #CONTENT h4 , #WRAPPER #CONTENT h5, #WRAPPER #CONTENT h6{
	font-size: 100%;
	font-weight: normal;
	padding-bottom: 10px;
	color: #4F4F4F;
	font-family: Georgia, serif;
}

#WRAPPER #CONTENT #SALESLETTER h1 {
	font-weight: bold;
	font-size: 30px;
	padding-left: 0px;
	padding-top: 0px;
	margin-top: -30px;
	padding-bottom: 0px;
	color: red;
	text-align: center;
  line-height: 32px;
	font-family: Verdana, Tahoma, Arial, Serif;
}

#WRAPPER #CONTENT #SALESLETTER h2 {
	font-size: 24px;
	font-weight: bold;
	padding-top: 24px;
	padding-bottom: 24px;
	text-align: left;
	color: black;
	font-family: Verdana, Tahoma, Arial, Serif;
  line-height: 26px;
}


#WRAPPER #CONTENT #SALESLETTER .REASONS {
    background: #E8E8E7;
  	width: 590px;
  	padding-top:7px;
  	padding-left:10px;
  	padding-right:10px;
}


#WRAPPER #CONTENT #SALESLETTER #SUBTITLE h2 {
	text-align: center;
}


#WRAPPER #CONTENT #SALESLETTER table {
  font-size: 13pt;
  font-family: Verdana, Tahoma, Arial, Serif;
  color: black;
}


/* can not undo padding from #CONTENT, but can 
   use negative margin  to undo it*/
#WRAPPER #CONTENT #SALESLETTER {
	margin-left: -5%;
	margin-right: -5%;
}

#WRAPPER #CONTENT #SALESLETTER ul {
  list-style-type: none;
}

#WRAPPER #CONTENT #SALESLETTER h2 {
	padding-left: 2%;
}

#WRAPPER #CONTENT #SALESLETTER p {
	padding-bottom: 15px;
	text-align: left;
	font-weight: normal;
}



#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS {
  min-width:270px;
  width:75%;
  margin-left: 9%;
  outline: 1px solid #171717;
  background: #FAF8D8;
  font-family: Arial, Serif;
  margin-top: 60px;
  margin-bottom: 60px;
  line-height:110%;
  box-shadow: 0px 2px 20px #888878;
}

#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS p {
 width:90%;
 margin-top: 10px;
 margin-bottom: 10px;
 padding-left:  19px;
 font-size: 12pt;
}


#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS a {
 color: #45A;
}

#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS .PRODUCTREVIEW {
	
	text-align: left;
	font-weight: bold;
  color: #FFFFFF;
  background: #447;
  font-size: 9pt;
  letter-spacing: 0px;
}


#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS .START {
	
	text-align: center;
	font-weight: bold;
	color: #950;
	padding-left: 9px;
	padding-right: 9px;
	padding-top: 5px;
	font-family: Tahoma, Serif;
	font-size: 12pt;
}

#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS .NAME {
	
	text-align: left;
	font-weight: bold;
	color: #000;
	padding-left: 9px;
	padding-bottom: 5px;
  font-size: 10pt;
}

#WRAPPER #CONTENT #SALESLETTER .TESTIMONIALS .DISTANCE {
	
	margin-top: 70px;
	background: #FFF;
	color: #FFF;
	outline:0px solid;
}


.IMAGEANDTEXT {
  clear: both;
}


#WRAPPER #CONTENT #LOCKER h2 {
	font-size: 24px;
	font-weight: bold;
	padding-top: 24px;
	padding-bottom: 24px;
	text-align: left;
	color: black;
	font-family: Verdana, Tahoma, Arial, Serif;
  line-height: 26px;
}

#WRAPPER #CONTENT #LOCKER img {
	clear: both;
	height: auto;
	width: 100%;
	max-width:666px;
}



#WRAPPER #CONTENT #LOCKER p {
  text-align: left;
}



#WRAPPER #CONTENT #LOCKER  ul li {
  list-style-type: square;
  text-align: left;
  margin-left: 9%;
  width: 95%;
  font-size:90%;
}

#WRAPPER #CONTENT #LOCKERMO  ol li {
  float: left;
  text-align: left;
  margin-left: 20px;
}


#WRAPPER #CONTENT #LOCKER .IMAGEANDTEXT img {
  float: left;
  margin-left: 30px;
  margin-right: 10px;
  margin-top: 0px;
  margin-bottom: 5px; 
}



#FACEBOX {
  background: white;
  margin-left:38px;
  margin-bottom:10px;
  width:500px;
}


#CLASSICALDOWNLOAD {
  background: #f0f0f0;
  margin-left:38px;
  padding-left:8px;
  width:490px;
  border-width:1px;
  border-style:solid;
  border-color:#ccc;

}


#SLCONTAINER1 { margin-left:9%; width:82%; }
#SLCONTAINER2 { margin-left:9%; width:82%; }
#SLCONTAINER3 { margin-left:9%; width:82%; }
#SLCONTAINER4 { margin-left:9%; width:82%; padding-bottom:2%;}
#SLCONTAINER5 { margin-left:9%;margin-right:36%; }
#SLCONTAINER6 { margin-left:9%;margin-right:36%; }
#SLCONTAINER7 { margin-left:9%;margin-right:36%; padding-bottom:9%; }
#SLCONTAINER8 { margin-left:9%; }
#SLCONTAINERTUT { margin-left:0%; width:320px; }


#SLCONTAINER1 .twentytwenty-before-label:before {
    content: "without -optimize thin-  algorithm" }

#SLCONTAINER1 .twentytwenty-after-label:before {
    content: "optimize thin" }

#SLCONTAINER2 .twentytwenty-before-label:before {
    content: "9% Breakthrough" }

#SLCONTAINER2 .twentytwenty-after-label:before {
    content: "92% Breakthrough" }

#SLCONTAINER3 .twentytwenty-before-label:before {
    content: "35% Wash" }

#SLCONTAINER3 .twentytwenty-after-label:before {
    content: "44% Wash" }

#SLCONTAINER4 .twentytwenty-before-label:before {
    content: "Standard A0" }

#SLCONTAINER4 .twentytwenty-after-label:before {
    content: "Optimized Flat Cone" }

#SLCONTAINER5 .twentytwenty-before-label:before {
    content: "No check" }

#SLCONTAINER5 .twentytwenty-after-label:before {
    content: "Dry Area Check" }

#SLCONTAINER6 .twentytwenty-before-label:before {
    content: "Standard" }

#SLCONTAINER6 .twentytwenty-after-label:before {
    content: "Variety Per Object ID" }

#SLCONTAINER7 .twentytwenty-before-label:before {
    content: "Standard" }

#SLCONTAINER7 .twentytwenty-after-label:before {
    content: "Variety Per Wind" }



.embed-container {
  position: relative; 
  padding-bottom: 62%; /* ratio  */
  height: 0; 
  overflow: hidden; 
  margin-left:0%;
  width: 110%;
  height: auto;
}

.embed-container iframe {

  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
}



.CITATION  {
	//color: #404090;
	color: #717170;
	
}

.LIMITEDOFFER {
	text-align: left;
	font-weight: bold;
	color: black;
	font-size: 9pt;
  font-family: Verdana, Tahoma, Arial, Serif;
  margin-top: 15px;
  margin-left:179px;
  padding-left:40px;
  background: #FAF8B0;
  width: 235px;
}

.LIMITEDOFFER2 {
	text-align: left;
	font-weight: bold;
	color: black;
	font-size: 9pt;
  font-family: Verdana, Tahoma, Arial, Serif;
  margin-top: 15px;
  margin-left:179px;
  margin-bottom:20px;
  padding-left:20px;
  background: #FAF8B0;
  width: 215px;
}



#LIMITEDOFFERLICENSE {
	text-align: left;
	font-weight: bold;
	color: black;
	font-size: 9pt;
  font-family: Verdana, Tahoma, Arial, Serif;
   padding-left:40px;
  margin-top:15px;
  margin-left:179px;
  margin-bottom:21px;
  width: 225px;
}



#WRAPPER #CONTENT  #ORDER #ORDER2 p a {
	text-align: left;
	font-weight: bold;
	color: red;
	font-size: 20pt;
  font-family: Verdana, Tahoma, Arial, Serif;
  margin-left:175px;
}



#WRAPPER #CONTENT  #ORDER #ORDER2 p a {
	text-align: left;
	font-weight: bold;
	color: red;
	font-size: 20pt;
  font-family: Verdana, Tahoma, Arial, Serif;
  margin-left:175px;
}

#productvray {
  height: 160px;
  width: 630px; 
}


#productmray {
  height: 160px;
  width: 630px; 
}


#productvraymray {
  height: 160px;
  width: 630px; 
}


.productscolumn1 {
	  float:left;
	  width: 160px;
	 
	}

.productscolumn2 {
	  float:left;
	  width: 330px;
	  font-family: Verdana, Tahoma, Arial, Serif;	
	  font-size: 9pt;
	}

.productscolumn3 {   
    float:left;
	  width: 60px;
	  margin-top: 140px;
	  margin-left: 20px;	
	 
	}


#WRAPPER #CONTENT p {
	padding-bottom: 15px;
	text-align: justify;
	font-weight: normal;
}
#WRAPPER #MAIN #CONTENT table {
	margin-bottom: 20px;
}

#WRAPPER #CONTENT img{
	margin-bottom: 15px;
}

#WRAPPER #CONTENT ul {   
	padding-bottom: 1.5%;
}

#WRAPPER #CONTENT ol li {
	list-style-type: decimal;
	padding-bottom: 1.5%;
	padding-left: 0px;
	margin-left: 9%;
	font-size: 85%;
}



#WRAPPER #FOOTER {
	clear: both;
	overflow: hidden;
	font-size: 70%;
	background-color: #cccccc;
	color: #666;
	border: 1px solid #666;
	padding-top: 1%;
	padding-right: 3%;
	padding-bottom: 3px;
	padding-left: 3%;
	margin-bottom: 3%;
	font-family: Verdana, Tahoma, Arial, Serif;	
	
}
#WRAPPER #FOOTER p {
	float: left;
}
#WRAPPER #FOOTER #FOOTERMENU {
	overflow: hidden;
	float: right;
  padding-top:3px;
	padding-bottom:3px;

}
#WRAPPER #FOOTER #FOOTERMENU ul  {
	float: right;
}

#WRAPPER  #FOOTER  #FOOTERMENU ul li{
	list-style-type: none;
	float: left;
	padding-left: 15px;
}
#WRAPPER #FOOTER #FOOTERMENU ul li  a{
	text-decoration: none;
	color: #000;
}
#WRAPPER #FOOTER #FOOTERMENU ul li a:hover {
	text-decoration: none;
	color: #666;
}
#WRAPPER #CONTENT .formular label   {
	width: 30%;
	float: left;
	min-height: 21px;
}

#WRAPPER #CONTENT .rslides {
  position: relative;
  list-style: none;
  overflow: hidden;
  width: 100%;
  padding: 0;
  margin: 0;
  }

#WRAPPER #CONTENT .rslides li {
  list-style-type: none;
  -webkit-backface-visibility: hidden;
  position: absolute;
  display: none;
  width: 100%;
  left: 0;
  top: 0;
  }

#WRAPPER #CONTENT .rslides li:first-child {
  position: relative;
  display: block;
  float: left;
  }

#WRAPPER #CONTENT .rslides img {
  display: block;
  height: auto;
  float: left;
  width: 100%;
  border: 0;
  max-width:900px;

  }

#RSLIDECAPTION li {
  padding-left:40%;
  color:green;  
}



.textfeld {
	border: 1px solid #999;
	margin-top: 2px;
	margin-bottom: 2px;
	padding: 3px;
	width: 200px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.button {
	background-color: #FFF;
	border: 1px solid #999;
	font-size: 12px;
	font-weight: bold;
	padding: 7px;
	cursor: pointer;
	color: #666;
	background-image: url(/images/bg_menu.jpg);
	background-repeat: repeat-x;
}
.fehler_rahmen {
	border: 1px solid #900;
}
.fehler {
	color: #f00;
	font-weight: bold;
	padding: 10px;
}
.bildflusslinks {
	float: left;
	padding-right: 20px;
}
.box {
	overflow: hidden;
	padding-bottom: 30px;
	padding-top: 30px;
}

.small {
	overflow: hidden;
	padding-bottom: 15px;
	padding-top: 15px;
	font-size: 11px;
	clear: both;
	line-height:100%;
}

.statement {
	clear: both;
	height: 80px;
	padding-bottom: 0px;
	text-align: right;
	font-family: "Times New Roman", Times, serif;
	font-size: 36px;
	color: #393335;
	letter-spacing: 0.1em;
	margin-top: -50px;
	background-image: url(/images/crown.png);
	background-repeat: no-repeat;
	background-position: right top;
}

.statement p {
	float: right;
	padding-right: 120px;
	padding-top: 20px;
}

.statement2 {
	padding-bottom:1.5%;
}

.statement2 img {
	clear: both;
	height: auto;
	max-width: 100%; 
	text-align: right;
	color: #393335;
}


.free {
	color: #0C0 !important;
}




li:hover a.free, li.hover a.free{
	color: #090 !important;
}
a, a:visited {
	color: #545633;
}


#WRAPPER #MAIN #CONTENT table.abstand td {
	padding-right: 1px;
	padding-left: 1px;
}
#WRAPPER #MAIN #CONTENT table.tbliste td {
	border: none;
	padding-top: 2px;
	padding-right: 4px;
	padding-bottom: 2px;
	padding-left: 4px;
}


.gauche {
   float: left;
   margin-right: 15px;
   margin-left:30px;
}

.VANILLATEXTANDIMAGES p {
  width:500px;
}

.VANILLATEXTANDIMAGESWIDE p {
  width:600px;
  text-align:left;
}

.RD2EXCLUSIVE {
  font-size: 50%;
}


#WRAPPER #MAIN2 {
	overflow: hidden;
	background-color: #FFF;
	border-right-width: 1px;
	border-left-width: 1px;
	border-right-style: solid;
	border-left-style: solid;
	border-right-color: #666;
	border-left-color: #666;
	padding: 10px;
	color: #231F20;
}


#WRAPPER #MAIN2 #CONTENT #BUY {
   margin-left: 0px;
   margin-right:0px;
}

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN{
  float:left;
  border-radius: 3px;
 -moz-border-radius: 3px;
  padding-top:5px;
  padding-bottom:5px;
  margin-left:2px;
  margin-right:2px;
 	margin:1;
	padding:1;
 }

 #WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN ul li  {
	padding-left: 3%;
	padding-bottom: 0px;
}

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN li  {
 padding-left:5px;
 padding-top:5px;
 padding-right:5px; 
 padding-bottom:5px; 
 margin-left:2px;
 margin-right:2px;
 margin-bottom:1px;
 background-color:#e3e3e2;
 line-height:130%; 
 }


#WRAPPER  #MAIN2 #CONTENT #BUY {
    width:900px;
}
 
#WRAPPER  #MAIN2 #CONTENT #BUY p {
    width:70%;
}
 
#WRAPPER  #MAIN2 #CONTENT #BUY .ACOLUMN {
    width:180px;  
    white-space: nowrap;
    font-size:16px; 
}

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN  img {
  width:180px;
  height:280px;
 }

    
#WRAPPER #MAIN2 #CONTENT #BUY  .UPGRADE2015 img {
      width:180px;
      height:253px;
}

#WRAPPER #MAIN2 #CONTENT #BUY  .UPGRADE2016 img {
      width:180px;
      height:216px;
}



#WRAPPER #MAIN2 #CONTENT #BUY .ACOLUMN #GRAY180 li  {
 padding-top:208px;
 }

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAY220 li {
 padding-top:205px;
 }

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAY20 li {
 padding-top:20px;
 margin-bottom:0px;
 margin-top:0px;
 }

#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAYLITTLEGAP li {
 padding-top:2px;
 margin-bottom:0px;
 margin-top:0px;
 }

/* on mobile screens we need 2 pixel more ... */
@media only screen and (max-width: 700px) 
{ 
  #WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAYLITTLEGAP li {
   padding-top:4px;
   margin-bottom:0px;
   margin-top:0px;
 }
}


.buybutton {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffb536) );
	background:-moz-linear-gradient( center top, #ffec64 5%, #ffb536 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffb536');
	background-color:#ffec64;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #ffaa22;
	display:inline-block;
	color:#333333;
	font-family:arial;
	font-size:16px;
	font-weight:bold;
	padding:5px 57px;
	margin-left:-11px;
	margin-right:-11px;
	margin-top:-6px;
	margin-bottom:-6px;
	
	text-decoration:none;
	text-shadow:1px 1px 1px #ffee66;
}

.buybutton:hover 
{
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffb536), color-stop(1, #ffec64) );
	background:-moz-linear-gradient( center top, #ffb536 5%, #ffec64 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb536', endColorstr='#ffec64');
	background-color:#ffb536;
}

@media only screen and (max-width: 700px) 
{ 
    #WRAPPER  #MAIN2 #CONTENT #BUY {
        width:500px;
    }
     
    #WRAPPER  #MAIN2 #CONTENT #BUY .ACOLUMN {
        width:120px;  
        white-space: nowrap;
        font-size:10px; 
    }

    #WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN  img {
      width:120px;
      height:180px;
     }
  
    #WRAPPER #MAIN2 #CONTENT #BUY  .UPGRADE2015 img {
      width:120x;
      height:175px;
     }

   #WRAPPER #MAIN2 #CONTENT #BUY  .UPGRADE2016 img {
      width:120x;
      height:144px;
     }


    #WRAPPER #MAIN2 #CONTENT #BUY .ACOLUMN #GRAY180 li  {
     padding-top:143px;
     }

    #WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAY220 li {
     padding-top:149px;
     }

    #WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN #GRAY20 li {
     padding-top:14px;
     margin-bottom:0px;
     margin-top:0px;
     }
     
     #BUY .liwhite {
       height:12px;
     }

   #BUY .buybutton {
    font-size:13px;
    padding:5px 33px;
    margin-left:-11px;
    margin-right:-11px;
    margin-top:-6px;
    margin-bottom:-6px;
  }

}



#WRAPPER #MAIN2 #CONTENT #BUY  .ACOLUMN li img  {
 padding-left:0px;
 padding-top:0px;
 padding-right:0px; 
 padding-bottom:0px;
 margin-left:-5px;
 margin-top:-5px;
 margin-right:-5px;
 margin-bottom:-5px;
 }


.buybutton {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffec64), color-stop(1, #ffb536) );
	background:-moz-linear-gradient( center top, #ffec64 5%, #ffb536 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffec64', endColorstr='#ffb536');
	background-color:#ffec64;
	-moz-border-radius:4px;
	-webkit-border-radius:4px;
	border-radius:4px;
	border:1px solid #ffaa22;
	display:inline-block;
	color:#333333;
	font-family:arial;
	font-size:16px;
	font-weight:bold;
	padding:5px 57px;
	margin-left:-11px;
	margin-right:-11px;
	margin-top:-6px;
	margin-bottom:-6px;
	
	text-decoration:none;
	text-shadow:1px 1px 1px #ffee66;
}

.buybutton:hover 
{
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ffb536), color-stop(1, #ffec64) );
	background:-moz-linear-gradient( center top, #ffb536 5%, #ffec64 100% );
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb536', endColorstr='#ffec64');
	background-color:#ffb536;
}

.buybutton:active {
	position:relative;
	top:1px;
}

 #libackgroundgreen {
   padding:10px;
   padding-bottom:15px;
   background-color:#bfd690;
}

 #libackgroundblue {
   padding:10px;
   padding-bottom:15px;
   background-color:#82bbbd;
}

 #libackgroundgold {
   padding:10px;
   padding-bottom:15px;
   background-color:#c7a017;
}

 #libackgroundplatinum {
   padding:10px;
   padding-bottom:15px;
   background-color:#8a8a8a;
}

.liwhite {
   padding-bottom:0px;
   padding-top:0px;
   height:20px;
   margin-top:0px;
   margin-bottom:0px;
   border:0px;
   background-color:#ffffff;
}



.fel1 {font-family: haettenschweiler, 'hatti','hatti2';
 font-weight: lighter;  } 



.fel1tra {font-family: haettenschweiler, 'hatti','hatti2';
 color: rgba(0, 0, 0, 0.6); 
  font-size: 62%;} 



/* before after with twenty twenty */

.twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after, .twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after {
  content: " ";
  display: block;
  background: white;
  position: absolute;
  z-index: 30;
  -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5); }

.twentytwenty-horizontal .twentytwenty-handle:before, .twentytwenty-horizontal .twentytwenty-handle:after {
  width: 3px;
  height: 9999px;
  left: 50%;
  margin-left: -1.5px; }

.twentytwenty-vertical .twentytwenty-handle:before, .twentytwenty-vertical .twentytwenty-handle:after {
  width: 9999px;
  height: 3px;
  top: 50%;
  margin-top: -1.5px; }

.twentytwenty-before-label, .twentytwenty-after-label, .twentytwenty-overlay {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%; }

.twentytwenty-before-label, .twentytwenty-after-label, .twentytwenty-overlay {
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  transition-duration: 0.5s; }

.twentytwenty-before-label, .twentytwenty-after-label {
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  transition-property: opacity; }

.twentytwenty-before-label:before, .twentytwenty-after-label:before {
  color: white;
  font-size: 13px;
  letter-spacing: 0.1em; }

.twentytwenty-before-label:before, .twentytwenty-after-label:before {
  position: absolute;
  background: rgba(255, 255, 255, 0.2);
  line-height: 38px;
  padding: 0 20px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px; }

.twentytwenty-horizontal .twentytwenty-before-label:before, .twentytwenty-horizontal .twentytwenty-after-label:before {
  top: 50%;
  margin-top: -19px; }

.twentytwenty-vertical .twentytwenty-before-label:before, .twentytwenty-vertical .twentytwenty-after-label:before {
  left: 50%;
  margin-left: -45px;
  text-align: center;
  width: 90px; }

.twentytwenty-left-arrow, .twentytwenty-right-arrow, .twentytwenty-up-arrow, .twentytwenty-down-arrow {
  width: 0;
  height: 0;
  border: 6px inset transparent;
  position: absolute; }

.twentytwenty-left-arrow, .twentytwenty-right-arrow {
  top: 50%;
  margin-top: -6px; }

.twentytwenty-up-arrow, .twentytwenty-down-arrow {
  left: 50%;
  margin-left: -6px; }

.twentytwenty-container {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  z-index: 0;
  overflow: hidden;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none; }
  .twentytwenty-container img {
    max-width: 100%;
    position: absolute;
    top: 0;
    display: block; }
  .twentytwenty-container.active .twentytwenty-overlay, .twentytwenty-container.active :hover.twentytwenty-overlay {
    background: rgba(0, 0, 0, 0); }
    .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
    .twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label, .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-before-label,
    .twentytwenty-container.active :hover.twentytwenty-overlay .twentytwenty-after-label {
      opacity: 0; }
  .twentytwenty-container * {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box; }

.twentytwenty-before-label {
  opacity: 0; }
  .twentytwenty-before-label:before {
    content: "Before"; }

.twentytwenty-after-label {
  opacity: 0; }
  .twentytwenty-after-label:before {
    content: "After"; }

.twentytwenty-horizontal .twentytwenty-before-label:before {
  left: 10px; }

.twentytwenty-horizontal .twentytwenty-after-label:before {
  right: 10px; }

.twentytwenty-vertical .twentytwenty-before-label:before {
  top: 10px; }

.twentytwenty-vertical .twentytwenty-after-label:before {
  bottom: 10px; }

.twentytwenty-overlay {
  -webkit-transition-property: background;
  -moz-transition-property: background;
  transition-property: background;
  background: rgba(0, 0, 0, 0);
  z-index: 25; }
  .twentytwenty-overlay:hover {
    background: rgba(0, 0, 0, 0.5); }
    .twentytwenty-overlay:hover .twentytwenty-after-label {
      opacity: 1; }
    .twentytwenty-overlay:hover .twentytwenty-before-label {
      opacity: 1; }

.twentytwenty-before {
  z-index: 20; }

.twentytwenty-after {
  z-index: 10; }

.twentytwenty-handle {
  height: 38px;
  width: 38px;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -22px;
  margin-top: -22px;
  border: 3px solid white;
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  border-radius: 1000px;
  -webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  z-index: 40;
  cursor: pointer; }

.twentytwenty-horizontal .twentytwenty-handle:before {
  bottom: 50%;
  margin-bottom: 22px;
  -webkit-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0 3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); }
.twentytwenty-horizontal .twentytwenty-handle:after {
  top: 50%;
  margin-top: 22px;
  -webkit-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0 -3px 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); }

.twentytwenty-vertical .twentytwenty-handle:before {
  left: 50%;
  margin-left: 22px;
  -webkit-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); }
.twentytwenty-vertical .twentytwenty-handle:after {
  right: 50%;
  margin-right: 22px;
  -webkit-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: -3px 0 0 white, 0px 0px 12px rgba(51, 51, 51, 0.5); }

.twentytwenty-left-arrow {
  border-right: 6px solid white;
  left: 50%;
  margin-left: -17px; }

.twentytwenty-right-arrow {
  border-left: 6px solid white;
  right: 50%;
  margin-right: -17px; }

.twentytwenty-up-arrow {
  border-bottom: 6px solid white;
  top: 50%;
  margin-top: -17px; }

.twentytwenty-down-arrow {
  border-top: 6px solid white;
  bottom: 50%;
  margin-bottom: -17px; }