@import url(https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700);
html{height:100%;box-sizing: border-box;}
body{height:100%;margin:0;padding:0; font-size:16px; font-weight:300; font-family: 'Open Sans', sans-serif; line-height:25px; color:#000; background:#e1e2e2;}
ul,div,form,ol{margin:0;padding:0;}
a,textarea,input,a:hover,a:focus {outline: 0px; text-decoration:none;}
img, embed, object, video {max-width: 100%; height: auto; width: auto; border:0 !important; width: auto\9; /* ie8 */}
*{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}



.rasten{width:100%; width:940px; margin:0 auto; padding:0; /*overflow:hidden;*/ min-width:320px;}
.rasten:before,
.rasten:after {content:" "; display:table; }
.rasten:after {clear:both;}


/*--Text--*/
h1,h2,h3,h4,h5,h6,p,.bodytext{color:#000; font-size:16px; font-weight:400; line-height:40px; margin:0; padding:0;}
h1{font-weight:600; font-size:28px; line-height:30px; color:#900606; letter-spacing:2px; margin:0 0 20px 0;}
h2{font-weight:600; font-size:18px; line-height:28px; margin:0 0 5px 0;  letter-spacing:1px;}
h3,h4,h5,h6{font-weight:400; font-size:16px; line-height:20px; margin:0; color:#000;}
p{padding:0; margin:0 0 20px 0; font-size:16px; line-height:22px; font-weight:400; color:#000; letter-spacing:0px; }
p strong{color:#222; font-weight:600;}
p span{font-size:10px; line-height:18px; letter-spacing:1px;}
p a{text-decoration:none; color:#900606;}
p a:hover{text-decoration:underline;}
table td{ font-size:16px; line-height:26px;}
.noab{margin:0;}
.noab-pst{margin:160px 0 0 0;}



.head{clear:both; float:left; width:100%; height:112px; margin:41px 0 0 0; position:relative; background:url("/tpl/img/friseur-slogan.png") no-repeat 165px 0;}
.head .logo{position:absolute; top:0; left:19px; z-index:99; display:block; width:136px; height:229px; background:url("/tpl/img/friseur-logo.png") no-repeat;}
.head img{float:none;display:inline-block;}
.head .info{clear:both; float:right; font-size:14px; line-height:22px;font-weight:400; color:#333; text-align:right;}

.main{clear:both; float:left; width:100%; min-height:477px; background:#e1e2e2;}
.main:before,
.main:after { content:" "; display:table; }
.main:after { clear:both;}


.main .front{float:left; display:block; width:246px; min-height:477px; overflow:hidden;}
.main .front img{float:left; transition:all 0.2s ease;}
.main .front:hover img{-webkit-transform: scale(1.2) rotate(3deg);-ms-transform: scale(1.2) rotate(3deg);transform: scale(1.2) rotate(3deg);}
.main .front2{width:241px;}
.main .front3{width:239px;}
.main .front4{width:214px;}

.main article{clear:both; float:left; display:block; width:100%; margin:0; padding:0;}

.main .top{clear:both; display:block; float:left; margin:0; padding:0; width:100%; height:72px; background:url("/tpl/img/friseur-nav-tr.jpg") repeat-x top left;}
.main h1{display:block; width:100%; margin:0; font-size:22px; font-weight:300; height:53px; line-height:53px; text-transform:uppercase; text-align:center; text-decoration:none; letter-spacing:2px; color:#fff;  /*text-shadow: 1px 1px 2px rgba(0, 0, 0, 1);*/ background:url("/tpl/img/friseur-top.jpg") no-repeat top center;}

.main .team{clear:both; float:left; width:100%;}
.main .team img{margin:0 0 0 184px;}

.main .preisliste{clear:both; float:left; width:100%;}
.main .preisliste h1{margin-bottom:40px;}
.main .preisliste .list-preise{clear:both; float:left; padding:0; margin:0px 0 20px 275px; list-style:none;}
.main .preisliste .list-preise li{clear:both; float:left; width:400px; height:20px; line-height:20px; font-weight:400;font-size:14px; color:#000; position:relative;}
.main .preisliste .list-preise li .wert{ position:absolute; padding:0 0 0 10px; top:0; right:0;display:block; float:right; background:#e1e2e2; z-index:111;}
.main .preisliste .list-preise li .data{position:absolute; width:auto;  padding:0 10px 0 0; top:0; left:0;display:block; float:left; background:#e1e2e2; z-index:112;}
.main .preisliste .list-preise li:after{clear:both; float:left; content:' '; width:100%; position:absolute;top:13px; left:0; z-index:0;font-size:0; line-height:0px; height:1px;background:url("/tpl/img/friseur-top.jpg") no-repeat -140px;}

.main .preisliste p{clear:both; float:left;  margin:0 0 0 275px; line-height:20px; font-weight:400;font-size:12px; color:#000; position:relative;}
.main .preisliste p sub{font-weight:400;font-size:15px; line-height:16px;}


nav{clear:both; display:block; float:left; margin:0 0 60px 0; padding:0; width:100%; height:72px; background:url("/tpl/img/friseur-nav-tr.jpg") repeat-x top left;-webkit-box-shadow: 0px 39px 54px -16px rgba(0,0,0,0.95);-moz-box-shadow: 0px 39px 54px -16px rgba(0,0,0,0.95);box-shadow: 0px 39px 54px -16px rgba(0,0,0,0.95);}
nav .main-nav{clear:both; float:left; display:block; list-style:none; margin:0; padding:0; width:100%;}
nav .main-nav li{float:left; display:block; width:187px; margin-right:1px;}
nav .main-nav li a{display:block; width:100%; font-size:15px; font-weight:400; line-height:72px; text-transform:uppercase; text-align:center; text-decoration:none; letter-spacing:1px; color:#fff; text-shadow: 1px 1px 2px rgba(0, 0, 0, 1); background:url("/tpl/img/friseur-nav2.jpg") no-repeat left top; transition:all 0.2s ease;}
nav .main-nav li a:hover,
nav .main-nav li.sel a{color:#fff; background-position:left bottom;}

.main .kontakt .box{clear:both; float:left; margin:40px 0 0 184px; line-height:20px; font-weight:400;font-size:12px; color:#000; position:relative;}
.main .kontakt .box p{margin:0; width:600px;}


.main .salon .box{clear:both; float:left; width:100%; margin:40px 0 0 0px; line-height:20px; font-weight:400;font-size:12px; color:#000; position:relative;}
.main .salon .box .l{display:block; float:left; width:185px;}
.main .salon .box .m{display:block; float:left; width:518px; margin-left:20px;}
.main .salon .box .m p{clear:both; float:left; width:100%; padding:10px 0 0 0;font-weight: 400;font-size: 14px;line-height:20px;}
.main .salon .box .r{display:block; float:right; width:187px;}


.main .impressum{clear:both; float:left; width:100%;}
.main .impressum h1{margin-bottom:40px;}
.main .impressum .box{clear:both; float:left; margin:0px 0 0 184px; line-height:20px; font-weight:400;font-size:12px; color:#000; position:relative;}
.main .impressum .box p{margin:0; padding-right:40px; line-height:20px; font-weight:400;font-size:14px; }
.main .impressum .box p .minitab{ line-height:20px; font-weight:400;font-size:14px; display:inline-block; width:80px;}

.devError{margin:30px 0 15px 0; width:100%; padding:15px; border:1px solid #c20000; background:#c20000; color:#fff;}
.devError p{color:#fff;}
.boxKontakt{clear:both; float:left; width:600px; text-align:left; margin-top:0px;}
.boxKontakt textarea{clear:both; float:left; width:100%; height:160px; padding:10px; margin:0 0 0px 0; border:1px solid #000; font-size:16px; line-height:22px;}
.boxKontakt  select,
.boxKontakt  input[type="text"]{clear:both; float:left; width:90%; height:40px; padding:0 10px; margin:0 0 25px 0; border:1px solid #000; font-size:16px; line-height:40px;}
.boxKontakt select:hover,
.boxKontakt select:focus,
.boxKontakt textarea:hover,
.boxKontakt textarea:focus,
.boxKontakt  input[type="text"]:hover,
.boxKontakt  input[type="text"]:focus{border-color:#596670;}
.boxKontakt select:hover option,
.boxKontakt select:focus option{color:#000;}
.boxKontakt .right .data{display:block; float:left; width:100%; border-left:1px solid #000;}
.boxKontakt .right .data  input[type="text"]{ float:right;}
.boxKontakt .left,
.boxKontakt .right{width:50%; padding:0; margin:0;}
.boxKontakt .full option{line-height:24px;}
.boxKontakt .full select{width:100%; color:#b3b3b3;}
.boxKontakt .full input[type="text"]{margin:0; width:100%;}
.boxKontakt  .senden {clear:both; float:none; background:#000;display:block;font-weight:400;cursor:pointer;color:#fff; border:0; font-size:16px;margin:20px auto 50px auto; padding:10px 25px;text-decoration:none; text-transform:none; line-height:20px;-webkit-transition: background-color .5s ease-out;-moz-transition: background-color .5s ease-out;-o-transition: background-color .5s ease-out;transition: background-color .5s ease-out;}
.boxKontakt  .senden:hover {background-color:#900606; color:#fff; font-weight:400;}
.boxKontakt  .senden:active {position:relative;top:1px;}
.boxKontakt  .subtxt p{font-size:13px;}
.boxKontakt  button{float:none!important; border:0; outline:0; margin:0 auto; width:200px;}




.V0,.V5,.V10,.V15,.V20,.V25,.V30,.V50{clear:both;margin:0px;font-size:0px;line-height:0px;width:0px;height:0px;padding:0px;}
.V5{height:5px;}
.V10{height:10px;}
.V15{height:15px;}
.V20{height:20px;}
.V25{height:25px;}
.V30{height:30px;}
.V50{height:50px;}

/*--Grid--*/
.row{clear: both; float:left; width:100%; padding:40px 0; zoom:1;}
.row2{clear: both; float:left; width:100%; padding: 40px 0 0 0; margin: 0px; zoom:1;}
.row3{clear: both; float:left; width:100%; padding: 0 0 40px 0; margin: 0px; zoom:1;}
.row4{clear: both; float:left; width:100%; padding:0; margin: 0px; zoom:1;}
.col {display: block; float:left; margin: 0 0 0 3.3%;}
.col:first-child {margin-left:0;}
.col img{width:100%; max-width:100%; float:left;}

.span12_12 {width: 100%;}
.span11_12 {width: 91.39%;}
.span10_12 {width: 82.78%;}
.span9_12  {width: 74.17%;}
.span8_12  {width: 65.56%;}
.span7_12  {width: 56.95%;}
.span6_12  {width: 48.35%;}
.span5_12  {width: 39.74%;}
.span4_12  {width: 31.13%;}
.span3_12  {width: 22.52%;}
.span2_12  {width: 13.91%;}
.span1_12  {width: 5.308%;}




.ifrm{clear:both; float:left; width:100%; height:1450px; overflow:hidden; z-index:99999;}

.videoExt {
	width:80%;
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 0px;
    height: 0;
    overflow: hidden;
	margin-bottom:50px;
}
.videoExt iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
	z-index: 9999;
}

@media only screen and (max-width: 767px){
	.span1_12, .span2_12, .span3_12, .span4_12, .span5_12, .span6_12, .span7_12, .span8_12, .span9_12, .span10_12, .span11_12, .span12_12 {width: 100%;}
	.col{margin:3.3% 0 0 0%;}
	.col:first-child {margin-top:0;}
	.main nav .main-nav{display:none;}
	.main nav .nav-mobil{display:inline-block; /*float:left; margin-left:20px;*/}
	.main article .list-news li span{display:block;}
	.main article .list-news li span:after{display:none;}
	
}