/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++ STARTBILD GANZES FENSTER +++++++++++++++++++++ */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#head
   {
   background-image: url("../images/global/background.jpg");
   }
      	      	      	
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++ WEITERER INHALT +++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
   #content_ueberschrift
      {
      width: 96%;
      padding-left: 2%;
      padding-right: 2%;
      padding-top: 5%;
      padding-bottom: 5%;
      background-color: rgb(255,255,255);
      font-weight: bold;
      font-size: 150%;
      text-align: center;
      }
      	      	      	
   #content_ueberschrift_text
      {
      
      }
      	      	      	
   #content
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      -webkit-align-items: center;
      align-items: center;
      align-content: center;
      -webkit-justify-content: center;
      justify-content: center;
      height: auto;
      min-height: 50%;
      padding-left: 2%;
      padding-right: 2%;
      padding-top: 1%;
      padding-bottom: 5%;
      background-color: rgb(255,255,255);
      overflow: hidden;
      }
      @media only screen and (min-width: 768px)
      	{
      	#content
      	   {
      	   width: 46%;
      	   }
      	}
      	      	      	
   #content_bg_left
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      -webkit-align-items: stretch;
      align-items: stretch;
      align-content: flex-start;
      -webkit-justify-content: flex-start;
      justify-content: flex-start;
      height: auto;
      min-height: 300px;
      background-position: center;
      background-repeat: no-repeat;
      -moz-background-size:cover;
      -o-background-size:cover;
      -webkit-background-size:cover;
      background-size: cover;
      }
      @media only screen and (min-width: 768px) and (max-width: 1199px)
      	{
      	#content_bg_left
      	   {
     	   width: 90%;
      	   }
      	}
      @media only screen and (min-width: 1200px)
      	{
      	#content_bg_left
      	   {
     	   width: 70%;
      	   margin-left: 25%;
      	   margin-right: 10%;
      	   }
      	}
      	      	      	
   #content_bg_right
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      -webkit-align-items: stretch;
      align-items: stretch;
      align-content: flex-start;
      -webkit-justify-content: flex-start;
      justify-content: flex-start;
      height: auto;
      min-height: 300px;
      background-position: center;
      background-repeat: no-repeat;
      -moz-background-size:cover;
      -o-background-size:cover;
      -webkit-background-size:cover;
      background-size: cover;
      }
      @media only screen and (min-width: 768px) and (max-width: 1199px)
      	{
      	#content_bg_right
      	   {
     	   width: 90%;
      	   }
      	}
      @media only screen and (min-width: 1200px)
      	{
      	#content_bg_right
      	   {
     	   width: 70%;
      	   margin-left: 10%;
      	   margin-right: 25%;
      	   }
      	}
      	      	      	
   .bg_bild
      {
      background-color: rgb(35,120,255);
      }
      	      	      	
   #content_text
      {
      display: -webkit-flex;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      flex-direction: column;
      -webkit-align-items: center;
      align-items: center;
      align-content: center;
      -webkit-justify-content: center;
      justify-content: center;
      height: 100%;
      min-height: 300px;
      width: 96%;
      padding-left: 2%;
      padding-right: 2%;
      padding-top: 1%;
      padding-bottom: 1%;
      background-color: rgba(255,255,255,0.7);
      }
      	      	      	
      #content_text h2
      	{
      	text-align: center;
      	}
      	      	      	
      #content_text p
      	{
      	text-align: justify;
      	}
      	      	      	
      	#content_text p sup
      	   {
      	   
      	   }
      	      	      	
      #content_text h3
      	{
      	text-align: center;
      	font-size: 120%;
      	font-weight: bold;
      	color: rgb(255,255,255);
      	text-shadow: -2px -2px 2px rgb(0,0,0), -2px 2px 2px rgb(0,0,0), 2px -2px 2px rgb(0,0,0), 2px 2px 2px rgb(0,0,0);
      	}
      	      	      	
      #content_text p#zitat
      	{
      	text-align: center;
      	font-size: 120%;
      	font-weight: bold;
      	color: rgb(255,255,255);
      	text-shadow: -2px -2px 2px rgb(0,0,0), -2px 2px 2px rgb(0,0,0), 2px -2px 2px rgb(0,0,0), 2px 2px 2px rgb(0,0,0);
      	}
      	      	      	
      	#content_text p#autor sup
      	   {
      	   font-style: italic;
      	   font-size: 75%;
      	   font-weight: normal;
      	   color: rgb(0,0,0);
      	   text-shadow: -1px -1px 1px rgb(255,255,255), -1px 1px 1px rgb(255,255,255), 1px -1px 1px rgb(255,255,255), 1px 1px 1px rgb(255,255,255);
      	   }
      	      	      	
/* ------------------------------------------------------------------------- */
/* ------------------------------- Animation ------------------------------- */
/* ------------------------------------------------------------------------- */
.animate-right
   {
   opacity: 0;
   visibility: hidden;
   transform: translate(-200px, 0)
   }
      	      	      	
   .animate-right.animated
      {
      opacity: 1;
      visibility: visible;
      -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      backface-visibility: hidden;
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      transform: translate(0, 0);
      -webkit-transition: -webkit-transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms;
      -moz-transition: -moz-transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms;
      transition: transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms
      }
      	      	      	
.animate-left
   {
   opacity: 0;
   visibility: hidden;
   transform: translate(200px, 0)
   }
      	      	      	
   .animate-left.animated
      {
      opacity: 1;
      visibility: visible;
      -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      backface-visibility: hidden;
      -webkit-transform: rotate(0, 0);
      -moz-transform: translate(0, 0);
      transform: translate(0, 0);
      -webkit-transition: -webkit-transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms;
      -moz-transition: -moz-transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms;
      transition: transform 800ms ease-out 200ms, opacity 800ms ease-out 200ms
      }
      	      	      	
.animate-up
   {
   opacity: 0;
   visibility: hidden;
   -webkit-transform: translate(0, 30px);
   -moz-transform: translate(0, 30px);
   transform: translate(0, 30px)
   }
      	      	      	
   .animate-up.animated
      {
      opacity: 1;
      visibility: visible;
      -webkit-backface-visibility: hidden;
      -moz-backface-visibility: hidden;
      backface-visibility: hidden;
      -webkit-transform: translate(0, 0);
      -moz-transform: translate(0, 0);
      transform: translate(0, 0);
      -webkit-transition: -webkit-transform 800ms ease-out 200ms, opacity 1300ms ease-out 200ms;
      -moz-transition: -moz-transform 800ms ease-out 200ms, opacity 1300ms ease-out 200ms;
      transition: transform 800ms ease-out 200ms, opacity 1300ms ease-out 200ms
      }
      	      	      	
/* ################################################################################## */
/* ################################## MOBILE VERSION ################################## */
/* ################################################################################## */
@media only screen and (max-width: 768px)
   {
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* +++++++++++++++++++++++++ WEITERER INHALT +++++++++++++++++++++++++ */
/* ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#container
   {
   
   }
      	      	      	
   #content
      {
      width: 96%;
      }
      	      	      	
      #content_text p
      	{
      	
      	}
      	      	      	
      	#content_text p sup
      	   {
      	   
      	   }
      	      	      	
      #content_text img
      	{
      	height: auto;
      	max-height: 200px;
      	width: auto;
      	max-width: 90%;
      	}
   }