﻿@charset 'utf-8';
/* @import url(https://fonts.googleapis.com/css?family=Hind:700,500,300);
@import url(https://fonts.googleapis.com/css?family=Playball); */

@import url(fonts.css);
@import url(font-awesome.min.css);
@import url(owl.carousel.css);
@import url(owl.theme.css);



/* CSS DIE HAAR EXPERTEN */   
*{
	padding:0;
	margin: 0;
	outline: none;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box; 
	box-sizing: border-box;
}

html {
    -ms-text-size-adjust: none;
    -webkit-text-size-adjust: none;
    text-size-adjust: none;
	height: 100%;
}

body {
	height: 100%;
	font-family: 'Hind', sans-serif;
	font-weight: 500;
	color: rgb(0,0,0);
	font-size: 20px;
	line-height: 120%;
	color: rgb(88,88,90);	
	min-height: 100%; 
	/*min-width: 1040px;*/
	overflow-x: hidden;
}

ul, ul li{
	list-style: none;
}

img {
    display: block;
    border: 0;
}

a {
	color: #757575;	
	text-decoration: none;
}

a :hover{
	text-decoration: none;
}

.clearfix:after {
    content: "";
    clear: both;
    display: block;
}

strong {
	font-weight: 700;
}

p {
	padding: 0 0 20px 0;
}

/* STRUCTURE */
.wrapper {
	margin: 0 auto;
	position: relative;
	max-width: 940px;
	width: 100%;
	height: 100%;
	padding: 0 20px;
}

/* HEADLINES */
h1 {
	font-weight: 700;
	text-transform: uppercase;
	font-size: 65px;
	color: rgb(226,0,113);
	padding: 0 0 70px 0;
	line-height: 120%;
}

h2 {
	font-weight: 700;
	font-size: 32px;
	color: rgb(226,0,113);
	padding: 30px 0;
	line-height: 120%;
	max-width: 100%;
}

h3 {
	font-weight: 700;
	font-size: 40px;
}


h4 {
	font-weight: 300;
	font-size: 24px;
    padding: 10px 0;
}

/* HEADER */
header {
	/*border-top: 15px rgb(226,0,113) solid;*/
	background: rgb(12,7,3);
	background: rgb(80,80,80);
	color: rgb(255,255,255);
}

header .logo {
	display:table-cell;
}

header .logo img {
	height: 138px;
	padding: 13px 0;	
}

header .wrapper{
	position: relative;
	max-width: 1000px;
	width: 100%;
	display: table;
}

header ul.nav {
	display: table-cell;
    padding: 20px 0;
    font-weight: 300;
	vertical-align: middle;
	text-align:right;
}

header ul.nav li {
    list-style: none;
    padding: 0 0 0 20px;
    display: inline;	
}

header ul.nav li a {   
	color: #fff;
}

header ul.nav li a:hover {
    color: rgb(226,0,113);
}

header .keyvisual {	
	width:100%;
	height:100%;
}




/* SECTIONS INFOS /INTTRO */

section.headline .wrapper {
	padding: 60px 20px 0px 20px;
}

section.infos .wrapper {
	padding: 0 20px 60px;
	text-align: center;
}

section.info-card .wrapper {
	padding: 0 20px 60px;	
}

section.intro .wrapper {
	padding: 60px 20px;
	text-align: center;
}

section.infos .contact {
	float: left;
	width: 65%;
	text-align: left;
}

section.infos .contact a.call_ico {
	background: url(../images/iconphone.png) no-repeat;
	display: inline-block;
	width: 68px;
	height: 68px;
	margin: 0 20px 0 0;
}

section.infos .contact h3 {
	display: inline-block;
	vertical-align: top;
	padding: 25px 0 0 0;
}

section.infos .contact a.location_ico {
	background: url(../images/iconlocation.png) no-repeat;
	display: inline-block;
	width: 68px;
	height: 68px;
	margin: 0 20px 0 0;
}

section.infos .contact p {
	display: inline-block;
	vertical-align: top;
	padding: 15px 0 0 0;
}

section.infos .telephone {
	margin: 0 0 40px 0;
}

section.infos .hours {
	float: right;
	width: 30%;
	background: rgb(247,247,247);
	padding: 20px;
	font-weight: 300;
	color: rgb(26,26,26);
	line-height: 140%;
	text-align: left;
}

section.infos .hours table tr td:first-child{
	min-width: 120px;
}

section.info-card .card {
	background: rgb(247,247,247);
	padding: 40px 35px 10px 35px;
	font-weight: 300;
	color: rgb(26,26,26);
	line-height: 140%;	
}

section.info-card ul {
	list-style-type: disc;
    margin: 0 0 1.25em 1.25em;
}

section.info-card ul li {
    font-weight: 300;
    color: rgb(88,88,90);
    list-style-type:disc;
}

/* SECTION IMAGES */
section.images {
	background: rgb(247,247,247);
	padding: 20px 0;
}

section.images .wrapper {
	max-width: 750px;
}

section.images figure {
	float: left;
}

section.images figure:first-child {
	padding: 0 15px 0 0;
}

section.images figcaption {
	font-size: 12px;
    line-height: 14px;
    padding: 5px 0 0;
}

section.images figure.team {
	max-width: 73.33%;
}

section.images figure.team img{
	max-width: 100%;
	max-height: 400px;
}

section.images figure.owner {
	max-width: 26.66%;
}

section.images figure.owner img {
	max-width: 100%;
	max-height: 400px;
}

/* SECTION TEASER */
section.teaser {
	padding: 30px 0;
	font-weight: 300;
	color: rgb(26,26,26);
}

section.teaser img {
	float: left;
	margin: 0 90px 0 0;
}


/* LEGAL */

#legal header {
    border-top: 15px rgb(226,0,113) solid;
    background: rgb(12,7,3);
}

#legal header .wrapper {
    position: relative;
    max-width: 1000px;
    width: 100%;
    display: block;
}

#legal header .keyvisual{
    background:url(../images/keyvisualweb.jpg) no-repeat center center;
    background-size:cover;
    height:635px;
}

section.legal p, section.legal a, 
section.disclaimer p, section.disclaimer a,
section.privacy p, section.privacy a,
section.source p, section.source a {
    font-weight: 300;
    color: rgb(88,88,90);
}

section.legal a, 
section.disclaimer a,
section.privacy a ,
section.source a{
    font-weight: 300;
    color: rgb(156,156,156);
    text-decoration:none;
}

section.legal a:hover, 
section.disclaimer a:hover,
section.privacy a:hover,
section.source a:hover{
    color: rgb(226,0,113);
}


section.legal .wrapper, section.privacy .wrapper {
    padding: 40px 20px 20px 20px;
}

section.legal h1, section.privacy h1 {
    padding: 0px 0px 40px 0px;
}

section.privacy ul {   
    list-style-type:disc;
    margin: 0 0 1.25em 1.25em;
}

section.privacy ul li {
    font-weight: 300;
    color: rgb(88,88,90);
    list-style-type:disc;
}




/* FOOTER */
footer {
	padding: 40px 0;
	background: rgb(105,105,105);
	color: rgb(255,255,255);
}

footer strong {
	display: block;
}

footer a.googleplus {
	display: inline-block;
	background: url(../images/icongplus.png) no-repeat;
	width: 69px;
	height: 68px;	
	vertical-align: top;
}

footer p {
	display: inline-block;
	padding-left: 101px;
	font-weight: 300;
}

footer p span {
	margin: 20px 0 0 0;
	display: block;
	font-size: 14px;
	line-height: 20px;
}

footer ul {
	display: inline-block;
	padding: 20px 0 0 81px;
	font-weight: 300;
}

footer ul.nav li {
    list-style: none;
    padding: 0 0 0 20px;
    display: inline;
}

footer ul.nav li a {
    text-decoration:none;
	color: #fff;
}

footer ul.nav li a:hover {
    color: rgb(226,0,113);
}

/*----------------------------------
Social Icons
----------------------------------*/

a.social-icon  {
    font-size: 30px;	
}

a.social-icon span {
    margin-right: 10px;	
}

a.social-icon i {    
	color: #fff;
}

.social-icon  i.fa-circle {
    color: #000;
}

.social-icon i.fa-circle {
    color: rgb(226,0,113);
}


/*----------------------------------
Brautfrisuren
Color
dunkel-braun: #a28e74; 
mittel-braun: #b6a082;
hell-braun: #D6C9B8
----------------------------------*/

#wedding {
	font-weight:300;	
}

#wedding header {
    border-top: 15px  #a28e74 solid;
    background: #D6C9B7;
}

#wedding header .keyvisual {
	background: url(http://www.ankewos.de/images/keyvisualweb-wedding.jpg) no-repeat center center;	
}

#wedding {
	color: #838078;
}

#wedding section.teaser {
	color: #838078;
}

#wedding h1 , #wedding h2{
	color: #a28e74;	
	font-family: "Playball", serif;
	text-transform: none;
	font-weight:400;
}

#wedding h1{	
	font-size:70px;
}

#wedding h2 {	
	max-width: 100%;
	font-size:38px;
}

#wedding section.infos .contact a.call_ico {
	background: url(http://www.ankewos.de/images/iconphone_brown.png) no-repeat;
}

#wedding section.infos .contact a.location_ico {
	background: url(http://www.ankewos.de/images/iconlocation_brown.png) no-repeat;
}

#wedding footer {
	background-color: #a28e74;
}
#wedding footer a {
	text-decoration: none;
}

#wedding footer .social-icon i {
    color: #a28e74;    
}

#wedding footer .social-icon  i.fa-circle {
    color: #fff;
}

#wedding footer ul.nav li a:hover {
    color: #D6C9B8;
}


#wedding  section.gallery {
	background-color:#b6a082;
	padding: 40px 0 10px 0;
}


#wedding-carousel .item{
  margin: 16px;
}
#wedding-carousel .item img{
  display: block;
  width: 100%;
  height: auto;
  border: 10px solid #fff
}

#wedding .owl-theme .owl-controls .owl-page span {    
    background: #fff;
}




/* Medi Queries */
@media only screen and (max-width: 880px) {
	
	/* SECTION INFOS */
	h1 {
		font-size: 50px;
	}
	
	#wedding h1{	
		font-size:55px;
	}
	
	section.infos .contact {
		float: none;
		width: 100%;
		margin-bottom: 40px;
	}
	
	section.infos .contact p {
		max-width: 65%;
		padding: 0;
	}
	
	section.infos .hours {
		float: none;
		max-width: 400px;
		width: 100%;
	}
}

@media only screen and (max-width: 640px) {	
	body {
		font-size: 18px;
	}
	
    header .logo img {
		height: 115px;		
		margin: 0 auto;	
	}

	header ul.nav {
		font-size:16px;
	}

	/* HEADER */
	/*
	header {
		padding: 25px 0 0 0;
		background: rgb(226, 0, 113);
		border: 0;
	}
	
	header .wrapper {
		padding: 0;
	}
	
	header .logo {
		position: static;
		margin: 0 auto 25px auto;
		background: url(../images/logo65.png) no-repeat;
		width: 197px;
		height: 107px;
	}
	
	header .keyvisual {
		height: 360px;
		background: url(../images/keyvisualweb-mobile.jpg) no-repeat top center;
		background-size: cover;
	}
	
	#wedding header .keyvisual {
		height: 360px;
		background: url(http://www.ankewos.de/images/keyvisualweb-mobile-wedding.jpg) no-repeat top center;
		background-size: cover;
	}
	*/

	/* SECTION INFOS */
	h1 {
		font-size: 38px;
		padding-bottom: 40px;
	}
	
	h2 {
		font-size: 34px;
		max-width: 100%;
		text-align: center;
	}
	
	#wedding h1{	
		font-size:42px;
	}
	
	#wedding h2{	
		font-size:34px;
	}
	
	section.infos .wrapper {
		padding: 40px 20px 20px 20px;
	}
	

	section.infos .contact h3 {
		font-size: 35px;
		padding: 17px 0 0 0;
	}

	section.infos .telephone a.call_ico {
		background: url(../images/iconphone.png) no-repeat;
		display: inline-block;
		background-size: cover;
		width: 50px;
		height: 50px;
		margin: 0 15px 0 0;
	}
	
	section.infos .contact a.location_ico {
		background: url(../images/iconlocation.png) no-repeat;
		display: inline-block;
		background-size: cover;
		width: 50px;
		height: 50px;
		margin: 0 15px 0 0;
	}
	
	#wedding section.infos .contact a.call_ico {
		background: url(http://www.ankewos.de/images/iconphone_brown.png) no-repeat;
		display: inline-block;
		background-size: cover;
		width: 50px;
		height: 50px;
		margin: 0 15px 0 0;
	}

	#wedding section.infos .contact a.location_ico {
		background: url(http://www.ankewos.de/images/iconlocation_brown.png) no-repeat;
		display: inline-block;
		background-size: cover;
		width: 50px;
		height: 50px;
		margin: 0 15px 0 0;
	}
	

	section.infos .contact p {
		font-weight: 300;
		max-width: 70%;
		padding: 0;
	}
	
	/* SECTION IMAGES */
	section.images figure.team {
		max-width: 100%;
	}
	
	section.images figure:first-child {
		padding: 0;
	}
	
	section.images figure.owner {
		display: none;
	}

	/* SECTION TEASER */
	section.teaser img {
		display: none;
	}

    /* LEGAL*/
    section.legal h2, 
    section.disclaimer h2,
    section.privacy h2 {
		font-size: 28px;
        text-align:left;
	}

	/* FOOTER */
	footer p {
		display: block;
		padding: 0;
		margin: 20px 0 0 0;
	}

    footer ul {	
	    padding: 5px 0px 0px 60px;	
    }

    footer ul.nav li {        
        padding: 0 0 0 0;
        display:list-item;       
    }

	.owl-item img {
		max-width: 100%;
	}
	
}

@media only screen and (max-width: 380px) {	
	body {
		font-size: 18px;
	}
	
    header .logo img {
		height: 90px;		
		margin: 0 auto;	
	}

	header ul.nav {
		display: none;
	}

	.owl-item img {
		max-width: 400px;
	}
	
}







