article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block;}
html, body, div, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, del, dfn, em,
img, ins, kbd, q, s, samp, small, strike, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, input,
table, caption, tbody, tfoot, thead, tr, th, td{margin:0;padding:0;border:0;outline:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
*, *:before, *:after {-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding:0; margin:0;}
html {-webkit-text-size-adjust:100%;}
hr {clear:both; display:block; width:100%; border:none; height:1px; position:relative; left:-9999em;}
a:focus, a:hover, a:active {text-decoration: none;}
h1, h2, h3 {font-weight:normal; margin:0;}
ul, ol {list-style:none;}


html {font-size: 62.5%;}/* Standard setzen, damit im body 1.5rem = 15px entspricht */
body {
  font-size:16px; font-size:1.6rem;/* ps+rem wegen Fallback */
  color:#444; font-weight:normal;
  font-family: Arial, Verdana, sans-serif;  
  }
body          {background:#FFF;}
.w100         {width:100%; position:relative;}
.w100:after   {content: "."; display: block; height: 0; clear: both; visibility: hidden; overflow:auto;}
.inner        {width:90%; max-width:1300px; margin:0 auto;}



/* +++++++++++++++++++++++++++++++++++
  Modifikatoren
++++++++++++++++++++++++++++++++++++*/
/*
.w33  {width:33.3% !important;}
.w10  {width:10% !important;}
.w15  {width:15% !important;}
.w20  {width:20% !important;}
.w25  {width:25% !important;}
.w30  {width:30% !important;}
.w35  {width:35% !important;}
.w40  {width:40% !important;}
.w45  {width:45% !important;}
.w47  {width:47% !important;}
.w48  {width:48% !important;}
.w50  {width:50% !important;}
.w55  {width:55% !important;}
.w60  {width:60% !important;}
.w65  {width:65% !important;}
.w70  {width:70% !important;}
.w75  {width:75% !important;}
.w80  {width:80% !important;}
.w85  {width:85% !important;}
.w90  {width:90% !important;}
.w95  {width:95% !important;}
.wi100{width:100% !important;}
*/

.space-above-2 {margin-top:2rem !important;}
.space-above-4 {margin-top:4rem !important;}
.space-above-5 {margin-top:5rem !important;}
.space-above-8 {margin-top:8rem !important;}

.space-below-15{margin-bottom:1.5rem !important;}
.space-below-2 {margin-bottom:2rem !important;}
.space-below-4 {margin-bottom:4rem !important;}
.space-below-5 {margin-bottom:5rem !important;}
.space-below-8 {margin-bottom:8rem !important;}

.padd-15  {padding:1.5rem;}
.padd-2   {padding:2rem;}
.padd-25  {padding:2.5rem;}


/*----------------------------------------------*\
  BUTTON
\*----------------------------------------------*/

/* Button Styles allgemein */
button {border:none;}

.button               {display:inline-block; padding:7px 20px; transition:all 0.2s;}
.button               {font-size:1.5rem; text-decoration:none !important; font-weight:700; text-align:center;}

/* Größen */
.button.large         {padding:10px 25px; font-size:1.65rem;}
.button.small         {padding:5px 15px;  font-size:1.35rem;}
.button.xsmall        {padding:4px 8px;   font-size:1.2rem;}
.button.xxsmall       {padding:3px;       font-size:1.0rem;}
.button.barebone      {padding:7px 3px 0 3px;}



/* Standardfarbe Gelb */
.button               {background-color:#1772B5; color:#FFF !important;}
.button:hover         {background-color:#237EDA; color:#FFF !important; text-decoration:none !important;}

/* Grün */
.button.action        {background-color:#E6B81A; color:#FFF !important;}
.button.action:hover  {background-color:#EFD272; color:#FFF !important; text-decoration:none !important;}

/* Clear */
.button.klar        {background-color:transparent; color:#444 !important; border:1px solid #999;}
.button.klar:hover  {background-color:#1C66B0; color:#FFF !important; text-decoration:none !important;}

/* Orange */
.button.orange        {background-color:#F09B0D; color:#FFF !important;}
.button.orange:hover  {background-color:#BF7B0B; color:#FFF !important; text-decoration:none !important;}

/* Weiss */
.button.weiss        {background-color:#FFF; color:#444 !important;}
.button.weiss:hover  {background-color:#E4F2D9; color:#111 !important; text-decoration:none !important;}


.button.grau1        {background-color:#666; color:#FFF !important;}
.button.grau1:hover  {background-color:#999; color:#FFF !important; text-decoration:none !important;}
.button.grau2        {background-color:#999; color:#FFF !important;}
.button.grau2:hover  {background-color:#CCC; color:#FFF !important; text-decoration:none !important;}


/* Praktisch ein reiner Textlink ohne BG */
.button.barebone        {background-color:transparent; color:#1C66B0 !important;}
.button.barebone:hover  {background-color:transparent; color:#000 !important; border-color:#000; text-decoration:none !important;}

.button.barebone.uline        {border-bottom:1px dashed #1C66B0; transition:all 0.2s;}
.button.barebone.uline:hover  {border-color:#000; border-bottom-style:solid; padding-left:15px; padding-right:15px;}


/* Schatten */
.button.shade         {box-shadow:2px 2px 3px rgba(60,60,60,0.4);}
.button.shade:hover   {box-shadow:none; text-decoration:none !important;}

/* Border um Button */
.button.rand          {border:1px solid #AAA;}
.button.rand:hover    {}
.button.action.rand   {border-color:#333;}
.button.orange.rand   {border-color:#666;}


/* Mit Icons */
.button.ico-button     {padding-left:40px; background-repeat:no-repeat; background-position:7px 50%;}
.button.ico-facts      {background-image:url(../images/icons/ico-facts.svg);}
.button.ico-facts:hover {background-image:url(../images/icons/ico-facts-weiss.svg);}

.button.ico-button.barebone {padding-bottom:7px;}     
.button.ico-button.barebone:hover {background-image:url(../images/icons/ico-facts.svg);}

.flexo {
  width:100%;
  display: -ms-flexbox; display: -webkit-flex; display: flex;  
 -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row;
 -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
 -webkit-align-content: stretch;  -ms-flex-line-pack: stretch; align-content: stretch;
 -webkit-align-items: stretch;  -ms-flex-align: stretch; align-items: stretch;
 -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
}

.flexo.verto        {-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;}
.flexo.flexo-start  {-webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start;}

