@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface|Arimo');
@import url('/css/fontawesome.css');
@import url('/css/simple-lightbox.css');
@import url('/css/slide.css');

* { margin: 0; padding: 0; box-sizing: border-box!important; -webkit-box-sizing: border-box!important; outline: none; }

body { background: url('/img/site/background.jpg'); color: #222222; font-family: 'Arimo'; font-size: 16px; }
h1 { color: #c5af74; font-family: 'Abril Fatface'; font-size: 3rem; font-weight: normal; margin: 1.5rem 0 2rem; text-align: center; }
h2 { color: #c5af74; margin-bottom: 2rem; font-family: 'Abril Fatface'; font-size: 2rem; font-weight: normal; text-align: center; }
h3 { font-size: 1.5rem; margin-bottom: 1rem; text-transform: uppercase; }
h4 { font-size: 1.125rem; margin-bottom: 1rem; text-align: center; }
a { color: #c5af74; display: block; cursor: pointer; text-decoration: none; }
img { display: block; max-width: 100%; }
p { font-size: 1.25rem; margin: 0 auto 1rem; text-align: justify; }
li { font-size: 1.25rem; list-style: square; }

header { background: url('/img/site/navigation.jpg'); color: #ffffff; }
nav { height: 10vh; }
nav ul { list-style: none; text-align: center; }
nav ul li { display: inline-block; }
nav ul li a { font-size: 1.25rem; padding: 2rem 2rem 0; }

#main { background: #ffffff; border-top: 2rem solid #c5af74; padding: 3rem 0; }

footer { background: url('/img/site/navigation.jpg'); text-align: center; }
footer a { display: inline-block; margin: 1rem; padding: 1rem; }


.slide { position: relative; justify-content: center; }
.slide h1 { bottom: 2rem; color: #c5af74; font-family: 'Abril Fatface'; font-size: 3rem; font-weight: normal; left: 0; position: absolute; right: 0; text-align: center; }

.content { margin: 0 auto; max-width: 900px; width: 90%; }
.flex { display: -ms-flexbox; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }

/* Home */

.text { margin: 0 auto; width: 90%; }

.images { margin: 3rem 5% 1rem; width: 23.333%; }
.images img { border: 3px solid #c5af74; margin-bottom: 1rem; }
.images p { text-align: center; text-transform: uppercase; }

.contact { background: rgba(197,175,116,0.3); margin: 3rem 0 1rem; padding: 1rem; }
.contact p { font-size: 2rem; margin-bottom: 0; text-align: center; }
.contact a { display: inline-block; padding: 1rem 1rem 0; }

/* News */

.entry { margin: 0 auto; }
.date { color: #c5af74; font-size: 0.875rem; margin-bottom: 0.25rem; } 
.gold { border: 0; border-bottom: 3px solid #c5af74; margin: 1.5rem auto; width: 50%; }

/* Portfolio */

.portfolio img { border: 3px solid #c5af74; margin: 0 auto 3rem; width: 90%; }
.list { margin-bottom: 2rem; }
.list ul { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; -webkit-column-gap: 2rem; -moz-column-gap: 2rem; column-gap: 2rem; padding-left: 4.5rem; }

/* Galerie */

.pics { margin: 1rem 2%; width: 29.333%; }
.pics:hover img { opacity: 0.7; transition: all ease 0.3s; }
.pics img { border: 3px solid #c5af74; margin-bottom: 1rem; transition: all ease 0.3s; }
.pics p { text-align: center; }


/* Kontakt */

.kontakt p { text-align: center; }
.fieldlong input, .fieldlong textarea { background: rgba(197,175,116,0.3); border: none; display: block; font-family: 'Arimo', sans-serif; font-size: 1.125rem; margin: 0.5rem auto; padding: 1rem 2%; max-width: 700px; width: 80%; }
.fieldapprove { margin: 1rem auto; max-width: 700px; width: 80%; }
.captchapic img { display: block; margin: 0.5rem auto; max-width: 700px; width: 80%; }
.captchafield input { background: rgba(197,175,116,0.3); border: none; display: block; font-family: 'Arimo', sans-serif; font-size: 1.125rem; margin: 0.5rem auto; padding: 1rem 2%; max-width: 700px; width: 80%; }
.buttonfield input { background: #c5af74; border: none; color: #222222; display: block; font-family: 'Arimo', sans-serif; font-size: 1.5rem; margin: 0.5rem auto; padding: 1rem 2%; text-transform: uppercase; max-width: 700px; width: 80%; }
.buttonfield input:hover { background: #222222; color: #c5af74; cursor: pointer; }
.buttonfield input:disabled { background: #555555; color: #999999; cursor: default; }

/* Links */

.links a { display: inline-block; }
.links a:hover { color: #222222; }
.banner { display: block; margin-bottom: 2rem; }
.banner p { font-size: 0.875rem; margin-bottom: 1.5rem; text-align: center; }
.links img { margin: 0 auto 0.5rem; }

/* Impressum & Datenschutz */

.impressum ul { margin-left: 2rem; margin-bottom: 1rem; }
.impressum a { display: inline-block; }

iframe.piwik { border: none; height: 150px; width: 100%; }