@import url(https://fonts.googleapis.com/css?family=Anton);


html,body {
	-webkit-text-size-adjust: none;
	width: 100%;
	height: 100%;
	font-family: 'Anton', sans-serif;
	}

html {
    -webkit-font-smoothing: antialiased;
}

/* Reset CSS
 * --------------------------------------- */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,
form,fieldset,input,textarea,p,blockquote,th,td {
    padding: 0;
    margin: 0;
}
a{
	text-decoration:none;
}
table {
    border-spacing: 0;    
}
fieldset,img {
    border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
    font-weight: normal;
    font-style: normal;
}
strong{
	font-weight: bold;
}
ol,ul {
    list-style: none;
    margin:0;
    padding:0;
}
caption,th {
    text-align: left;

}
q:before,q:after {
    content:'';
}
abbr,acronym { border: 0;
}

img{
	vertical-align: bottom;
	}

/*================================

clearfix

================================*/

.clearfloat{
	clear:both;
	height:1px;
	overflow:hidden;
	}

.clearfix {
	display: inline-table;
	}
* html .clearfix {
	height: 1%;
	}
.clearfix {
	display: block;
	}
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}


/*================================

myContainer

================================*/


#myContainer{
	position: relative;
	overflow-y: hidden;
	}

.ms-section{
	position: relative;
	background-size: contain;
	background-position: top right;
	background-repeat: no-repeat;
	width: 100%;
	height: auto;
	margin: 0 0 50px;
	text-align: center;
	}
.ms-section img{
	width:100%;
	}

/*==== title ====*/
#title{
	z-index: 100;
	margin: 50px 0 0;
	height: 250px;
	background-image: url(../images/logo.gif);
	background-position: top center;
	}

/*==== left0 ====*/
#left0{
	z-index: -1;
	background-image: url(../images/water.jpg);
	margin: 30px 0 0;
	height: 300px;
	}

/*==== left1 ====*/
#left1{
	}
#left1 h1{
	color:#000;
	}
#left1 h1 span{
	color:#f6eb67;
	}

/*==== left2 ====*/
#left2{
	}
#left2 h1{
	color:#f6eb67;
	}
#left2 h1 span{
	color:#000;
	}

/*==== left3 ====*/
#left3{
	}
#left3 h1{
	color:#00ade3;
	}
#left3 h1 span{
	color:#9b9b9b;
	}

/*==== left4 ====*/
#left4{
	}
#left4 h1{
	color:#fe9300;
	}
#left4 h1 span{
	color:#9b9b9b;
	}

/*==== left5 ====*/
#left5{
	}
#left5 h1{
	color:#9b9b9b;
	}
#left5 h1 span{
	color:#d7e079;
	}

/*==== left6 ====*/
#left6{
	}
#left6 h1{
	color:#818181;
	}
#left6 h1 span{
	color:#c3392c;
	}

/*==== left7 ====*/
#left7{
	}
#left7 h1{
	color:#000;
	}
#left7 h1 span{
	color:#c6cfda;
	}

/*==== left8 ====*/
#left8{
	}
#left8 h1{
	color:#000;
	}
#left8 h1 span{
	color:#e4ecdb;
	}

/*==== left9 ====*/
#left9{
	}
#left9 h1{
	color:#c4beb0;
	}
#left9 h1 span{
	color:#5a5c61;
	}

/*==== left10 ====*/
#left10{
	}
#left10 h1{
	color:#435079;
	}
#left10 h1 span{
	color:#000;
	}

/*==== left11 ====*/
#left11{
	}
#left11 h1{
	color:#000;
	}
#left11 h1 span{
	color:#bc3941;
	}

/*==== left12 ====*/
#left12{
	}
#left12 h1{
	color:#6d7177;
	}
#left12 h1 span{
	color:#079de6;
	}



/*================================

credit

================================*/

.credit{
	position: relative;
	text-align: center;
	}

#left1 .credit{
	}

.credit h1{
	font-size: 44px;
	}

.credit p{
	font-size: 12px;	
	color:#000;
	}

.credit p img{
	width:90px !important;
	height: auto;
	margin-top: 20px;
	}

.credit p.buy{
	margin-top:20px;
	font-size: 13px;	
	color:#fff;
	display: inline-block;
	padding:5px 40px;
	background: #000;
	-webkit-border-radius: 3px; 
	border-radius: 3px; 
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
	}

.credit a:hover p.buy{
	background: #999;
	-webkit-border-radius: 3px; 
	border-radius: 3px; 
	}

.credit p.suche{
	margin-top:20px;
	font-size: 13px;
	color:#fff;
	display: inline-block;
	padding:5px 40px;
	background: #dd2113;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
}

.credit a:hover p.suche{
	background: #999;
	-webkit-border-radius: 3px;
	border-radius: 3px;
}


/*================================

lineup

================================*/

#lineup{
	position: absolute;
	display: table;
	z-index: 2000;
	width: 100%;
	background-color: #efefef;
	/*border-top: 1px solid #000;*/
	padding:80px 0 150px;
	vertical-align: middle;
	font-size:11px;
	text-align: center;
	}

#lineup .image{
	padding:20px 0;
	}

#lineup .image img{
	width: 90%;
	height: auto;
	}

#lineup p{
	font-size:24px;
	}

.jp #lineup{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	}

.jp #lineup p{
	font-family: 'Anton', sans-serif;
	}

#lineup p.manual{
	font-size: 12px;	
	color:#fff;
	display: inline-block;
	padding:10px 40px;
	background: #dd2113;
	-webkit-border-radius: 3px; 
	border-radius: 3px; 
	-webkit-transition: all .6s;
	-moz-transition: all .6s;
	-o-transition: all .6s;
	-ms-transition: all .6s;
	transition: all .6s;
	}

#lineup a:hover p.manual{
	background: #000;
	-webkit-border-radius: 3px; 
	border-radius: 3px; 
	}

.jp #lineup p.manual{
	font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	}


/*================================

pagetop

================================*/

#pagetop{
	margin-top: 40px;
	}

#pagetop img{
	width: 80px;
	height: 80px;
	}




/*================================

bubble

================================*/

#bubble{
	z-index: 1000;
	position: absolute;
	width: 300px;
	height: 10000px;
	top: 0;
	right: 50px;
	background-size: contain;
	background-position: top left;
	background-repeat: repeat-y;
	background-image: url(../images/awa1.png);
	}

#bubble2{
	z-index: 0;
	position: absolute;
	width: 100px;
	height: 10000px;
	top: 0;
	left: 50px;
	background-size: contain;
	background-position: top left;
	background-repeat: repeat-y;
	background-image: url(../images/awa1.png);
	}

#bubble3{
	z-index: 0;
	position: absolute;
	width: 200px;
	height: 10000px;
	top: 0;
	left: 300px;
	background-size: contain;
	background-position: top left;
	background-repeat: repeat-y;
	background-image: url(../images/awa2.png);
	}

#bar{
	z-index: 0;
	position: absolute;
	width: 100px;
	height: 20000px;
	top: 0;
	left: 1%;
	background-size: contain;
	background-position: top left;
	background-repeat: no-repeat;
	background-image: url(../images/bars.gif);
	}


/*================================

footer

================================*/

#footer{
	position: fixed;
	width:100%;
	height: 85px;
	bottom:0;
	left:0;
	z-index:10000;
	}

/*================================

bunner

================================*/

#bunner{
	width:100%;
	height:35px;
	text-align: center;
	}

#bunner img.online{
	width:150px;
	height:35px;
	}

/*================================

links

================================*/

#links{
	width:100%;
	height:30px;
	text-align: center;
	}

#links img{
	margin-top:5px;
	border:1px solid #fff;
	-webkit-transition: all 1.0s;
	-moz-transition: all 1.0s;
	-o-transition: all 1.0s;
	-ms-transition: all 1.0s;
	transition: all 1.0s;
	}

#links a img{
	border:1px solid #fff;
	}

#links a:hover img{
	margin-top:5px;
	border:1px solid #aaa;
	}

#links img.qqtop{
	margin-right:5px;
	width: 120px;
	height: auto;
	}

#links img.lang{
	width: 35px;
	height: auto;
	}

/*================================

copyright

================================*/

#copyright{
	width: 100%;
	height: 20px;
	font-size: 9px;
	text-align: center;
	line-height: 20px;
	color: #222;
	}


/*================================

haendlersuche

================================*/

#buy{
	width:100%;
	background-color: #dd2113;
	text-align: center;
	padding-top:41px;
	color:#fff;
	height:377px;
	position: relative;
}

#buy .headline{
	width: 100%;
}

#buy .headline h2{
	text-transform: uppercase;
	font-size: 28px;
	font-weight: 400;
	margin-bottom: 22px;
}

#buy .table{
	display: table;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	left:0px;
	right:0px;
}

#buy .table .row{
	display: row;
}

#buy .table .row .text{
	display:table-cell;
	text-align: left;
	font-weight: 400;
	font-size: 12px;
	line-height: 22px;
	padding-left: 10px;
	max-width: 580px;
}

#buy .table .row .linkList{
	display:table-cell;
	text-align: right;
	padding-right: 10px;
}

#buy .table .row .linkList a{
	color:#fff;
	font-weight: 400;
	font-size: 20px;
	line-height: 35px;
	text-transform: uppercase;
	text-decoration: none;
	background:url('../images/pfeil.png') no-repeat 100% 5px;
	padding-right:36px;
	text-align: right;
}



/*
@media screen and (min-width : 480px){
	#buy .text{
		font-weight: 400;
		font-size: 12px;
		line-height: 22px;
		text-align: left;
		position: absolute;
		left: 5%;
		width:320px;
	}
	#buy .linkList{
		text-align: right;
		position: absolute;
		right: 5%;
	}
}
@media screen and (min-width : 1000px){
	#buy .text{
		font-weight: 400;
		font-size: 12px;
		line-height: 22px;
		text-align: left;
		position: relative;
		left: 20%;
		width:420px;
		top:0px;
	}
	#buy .linkList{
		text-align: right;
		position: absolute;
		right: 20%;
		top:0px;
	}
}

@media screen and (min-width : 1024px){
#buy .text{
	font-weight: 400;
	font-size: 12px;
	line-height: 22px;
	text-align: left;
	position: relative;
	left: 20%;
	width:520px;
	top:0px;
}
	#buy .linkList{
		text-align: right;
		position: absolute;
		right: 20%;
		top:0px;
	}
}
*/




#haendlersuche{
	width:100%;
	background-color: #d2d2d2;
	text-align: center;
	padding-top:41px;
}

#haendlersuche h2{
	text-transform: uppercase;
	font-size: 28px;
	font-weight: 400;
}

@media screen{
	#haendlersuche #map {
		height: 350px;
		width: 90%;
		left: 0px;
		right: 0px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 45px;
	}
}

@media screen and (min-width : 767px) {
	#haendlersuche #map {
		height: 450px;
		width: 90%;
		left: 0px;
		right: 0px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 45px;
	}
}

#haendlersuche #result{
	max-width:1052px;
	width:90%;
	left: 0px;
	right: 0px;
	margin-left: auto;
	margin-right: auto;
	overflow:hidden;
	position: relative;
}

#haendlersuche #resultHolder{
	width:9999px;
	height:255px;
}

#haendlersuche #resultHolder .resultElement{
	float: left;
	width: 1052px;
	text-align: left;
	padding-bottom: 67px;
}
@media screen {
	#haendlersuche #resultHolder .resultElement .haendler {
		font-size: 14px;
		line-height: 24px;
		color: #000000;
		vertical-align: top;
		padding-right: 22px;
		max-width: 150px;
	}

	#haendlersuche #resultHolder .resultElement .haendler a {
		font-size: 14px;
		line-height: 24px;
		color: #000000;
		vertical-align: top;
		padding-right: 22px;
		max-width: 150px;
	}
}

@media screen and (min-width : 767px) {
	#haendlersuche #resultHolder .resultElement .haendler {
		font-size: 14px;
		line-height: 24px;
		color: #000000;
		vertical-align: top;
		padding-right: 42px;
		max-width: 220px;
	}

	#haendlersuche #resultHolder .resultElement .haendler a {
		font-size: 14px;
		line-height: 24px;
		color: #000000;
		vertical-align: top;
		padding-right: 42px;
		max-width: 220px;
	}
}

#haendlersuche #resultHolder .resultElement .haendler a:hover{
	color:#dd2113;
}

#haendlersuche #resultHolder .resultElement .haendler a h3 {
	margin:0px;
	padding: 0px;
	font-size: 20px;
	line-height: 24px;
	font-weight: 400;
}
#haendlersuche #resultHolder .resultElement .haendler a .badge {
	background-color: #000;
	color: #fff;
	border-radius: 20px;
	width:40px;
	height:40px;
	font-size: 18px;
	text-align: center;
	vertical-align: middle;
	box-sizing: border-box;
	padding-top: 8px;
	margin-bottom: 26px;
}
@media screen {
	#haendlersuche #resultHolder .resultElement .red a {
		color: #dd2113;
	}


	#haendlersuche #resultHolder .resultElement .red a h3{

	}
}

@media screen and (min-width : 767px) {
	#haendlersuche #resultHolder .resultElement .red a {
		color: #dd2113;

	}


	#haendlersuche #resultHolder .resultElement .red a h3{

	}
}

#haendlersuche #resultHolder .resultElement .red a .badge {

	background-color: #dd2113;

}



#haendlersuche .formHolder{
	text-align: left;
	left: 0px;
	right: 0px;
	margin-left: auto;
	margin-right: auto;
	max-width: 700px;
	margin-bottom: 25px;
	width: 90%;
}

@media screen {
	#haendlersuche .formHolder #ort {
		font-size: 18px;
		font-family: Anton;
		width: 100%;
		max-width: 493px;
		border: 0px;
		border-bottom: 3px solid #000;
		padding: 10px 0px 10px 20px;
		margin-right: 15px;
		box-sizing: border-box;
		margin-bottom: 20px;
		-webkit-appearance: none;
		border-radius: 0;
	}
}

@media screen and (min-width : 568px) {
	#haendlersuche .formHolder #ort {
		font-size: 18px;
		font-family: Anton;
		width: 70%;
		max-width: 493px;
		border: 0px;
		border-bottom: 3px solid #000;
		padding: 10px 0px 10px 20px;
		margin-right: 15px;
		box-sizing: border-box;
		margin-bottom: 20px;
		-webkit-appearance: none;
		border-radius: 0;
	}
}

@media screen and (min-width : 767px) {
	#haendlersuche .formHolder #ort {
		font-size: 18px;
		font-family: Anton;
		width: 100%;
		max-width: 493px;
		border: 0px;
		border-bottom: 3px solid #000;
		padding: 10px 0px 10px 45px;
		margin-right: 15px;
		box-sizing: border-box;
		margin-bottom: 20px;
		-webkit-appearance: none;
		border-radius: 0;
	}
}

#haendlersuche .formHolder input[type="radio"] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	width: 40px;
	height: 40px;
	background: url(../images/radio_lo.png) left center no-repeat;
	background-size: 40px;
	margin-right: 10px;
	vertical-align: middle;
	display: none;
	opacity: 0;
}

#haendlersuche .formHolder input[type="radio"]:checked {
	background: url(../images/radio_hi.png) left center no-repeat;
	display: none;
	opacity: 0;
}

@media screen {
	#haendlersuche .formHolder label {
		font-size: 18px;
		margin-right: 8px;
	}
}
@media screen and (min-width : 568px) {
	#haendlersuche .formHolder label {
		font-size: 18px;
		margin-right: 21px;
	}
}

#haendlersuche .formHolder input[type="radio"] + label::before{
	content: ' ';
	background: url(../images/radio_lo.png) left center no-repeat;
	background-size: 40px;
	margin-right: 10px;
	vertical-align: middle;
	display: inline-block;
	width:40px;
	height:40px;
}

#haendlersuche .formHolder input[type="radio"]:checked + label::before{
	content: ' ';
	background: url(../images/radio_hi.png) left center no-repeat;
	background-size: 40px;
	margin-right: 10px;
	vertical-align: middle;
	display: inline-block;
	width:40px;
	height:40px;
}

@media screen{
	#haendlersuche .formHolder button {
		border: 0;
		background-color: #000;
		color: #fff;
		text-transform: uppercase;
		font-size: 15px;
		font-family: Anton;
		padding: 10px 20px;
		height: 50px;
		border-radius: 3px;
		cursor: pointer;
		margin-bottom: 20px;
		float:right;
	}
}

@media screen and (min-width : 568px) {
	#haendlersuche .formHolder button {
		border: 0;
		background-color: #000;
		color: #fff;
		text-transform: uppercase;
		font-size: 15px;
		font-family: Anton;
		padding: 10px 20px;
		height: 50px;
		border-radius: 3px;
		cursor: pointer;
		margin-bottom: 20px;
		float: none;
	}
}
#haendlersuche #result .haendler {
	display: inline-block;
	text-align: left;
}

*:focus {
	outline: none;
}

@media screen {
	#haendlersuche #result #next {
		bottom: 30px;
		position: absolute;
		right: 0px;
		display: none;
	}
}

@media screen and (min-width : 768px) {
	#haendlersuche #result #next {
		bottom: auto;
		top: 110px;
		position: absolute;
		right: 0px;
		display: none;
	}
}



.ui-autocomplete {
	border-radius: 0px;
	font-size: 15px;
	font-family: Anton;
}
.ui-autocomplete.source:hover {
	border-radius: 0px;
	font-size: 15px;
	font-family: Anton;
}

.ui-menu .ui-menu-item a{
	font-size: 15px;
	font-family: Anton;
	border-radius: 0px;
}

.ui-menu-item{
	font-size: 15px;
	font-family: Anton;
	border-radius: 0px;
}