@charset "UTF-8";

/* html5doctor.com Reset v1.6.1 - http://html5doctor.com/html-5-reset-stylesheet/ */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin: 0;padding: 0;border: 0;outline: 0;font-size: 100%;vertical-align: baseline;background: transparent}
body{line-height: 1}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display: block}
nav ul{list-style: none}
blockquote,q{quotes: none}
blockquote::before,blockquote::after,q::before,q::after{content: none}
a{margin: 0;padding: 0;font-size: 100%;vertical-align: baseline;background: transparent}
ins{background-color: #ff9;color: #000;text-decoration: none}
mark{background-color: #ff9;color: #000;font-style: italic;font-weight: bold}
del{text-decoration: line-through}
abbr[title],dfn[title]{border-bottom: 1px dotted;cursor: help}
table{border-collapse: collapse;border-spacing: 0}
hr{display: block;height: 1px;border: 0;border-top: 1px solid #ccc;margin: 1em 0;padding: 0}
input,select{vertical-align: middle}
a, a:hover, a:active, a:focus {outline: none}
::-moz-selection { background: #FFFFEA; text-shadow: none; color: #624535; }
::selection { background: #FFFFEA; text-shadow: none; color: #624535; }

/* dosis-regular */
@font-face {
  font-family: 'Dosis'; font-style: normal; font-weight: 400; src: url('dosis-v7-latin-regular.eot'); src: local('Dosis Regular'), local('Dosis-Regular'), url('dosis-v7-latin-regular.eot?#iefix') format('embedded-opentype'), url('dosis-v7-latin-regular.woff2') format('woff2'), url('dosis-v7-latin-regular.woff') format('woff'), url('dosis-v7-latin-regular.ttf') format('truetype'), url('dosis-v7-latin-regular.svg#Dosis') format('svg');
}

/* Automatische Silbentrennung */
article { 
  hyphens: auto; /* Silbentrennung aktivieren */
  hyphenate-limit-chars: auto 3;
  hyphenate-limit-lines: 4;
  overflow-wrap: break-word; word-wrap: break-word; /* Wörter trennen wenn nötig */
}

body { padding: 0; margin: 0; background-color: #EFE4D0; font-family: Dosis, Arial, Helvetica, sans-serif; }
header { width: 100%; background-image: url('../hero_blickwinkelschmiede_alpen.jpg'); background-size: auto 100%; background-position: center top; background-repeat: no-repeat; }
header div { margin: 0 auto; max-width: 960px; }
header img { width: 100%; }
article { margin: 0 auto; max-width: 958px; color: #624535; padding: 10px 10px; height: 100%; text-align: left; }
section, .section { margin: 0 20px 40px 20.8%; }
h1, h2 { font-size: 22px; font-weight: normal; padding-top: 30px; line-height: 1.2;}
h3, .h3 { font-size: 20px; font-weight: bold; padding-top: 30px; line-height: 1.2; }
.dsimp h1, .dsimp h2 { font-size: 28px; }
.dsimp h3, .dsimp .h3 { font-size: 24px; font-weight: normal; padding-top: 45px; }
.dsimp h4, .dsimp .h4 { font-size: 20px; font-weight: normal; padding-top: 38px; padding-bottom: 10px; line-height: 1.2; }

p { font-size: 18px; line-height: 1.5; padding-top: 10px; }
a, a:link, a:visited { color: #624535; text-decoration: none; }
a:hover { color: #0C87C3; text-decoration: underline; }
a:focus, a:active { text-decoration: none; }
.dsimp a, .dsimp a:link, .dsimp a:visited { text-decoration: underline; }
.dsimp a:hover { text-decoration: none; }
dl { padding: 23px 0 0 0; text-align: left; font-size: 18px; line-height: 1.5;}
dl dt { clear: left; float: left; padding: 0; width: 90px; }
dl dd { padding: 0 0 0 95px; }
dl.dl-breit dt { width: 130px; padding-top: 5px; }
dl.dl-breit dd { padding-left: 140px; padding-top: 5px; }
ul { padding-left: 1.4rem; margin-bottom: 5px; font-size: 18px; line-height: 1.5; }
li { display: block; margin-top: 5px; }
li::before { content: "–"; float: left; margin-top: -2px; margin-left: -1.4rem; color: #624535; }
.impressum { margin-top: 60px; border-top: 1px solid #4D3B2C; }
.impressum p { text-align: right; font-size: 16px; }
.text-justify p, .text-justify li { text-align: justify !important; }

@media only screen and (max-width: 1000px) {
  section, .section { margin: 0 40px 40px 12%; }
}

@media only screen and (max-width: 800px) {
  section, .section { margin-left: 10%; }
}

@media only screen and (max-width: 680px) {
  section, .section { margin-left: 20px; margin-right: 20px; }
  dl dt { clear: both; float: none; width: 100% !important; padding-top: 10px !important; }
  dl dd { padding: 0 !important; }
}