/*!
 *
 * Copyright 2019
 * Created by: Petra Kolb-Distler
 * URL: http://inbetw.in
 * Designed and built based on my mind :-) */

/*
===========================
CONTENTS:

01 Sensible defaults
02 Typography
03 Non-semantic
04 Navbar
05 Single-Page Sections
06 Footer
07 Bootstrap Carousel
08 Buttons
09 Media queries
===========================
*/

/* ----------------------------------------------------------------------------------------------------------
01 Sensible defaults ----------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */
body {
        font-family: 'PT Sans Narrow';
        font-size: 1.5em;
        color: white;
}


div {
        /*border: thin solid black;*/
        box-sizing: border-box;
}

p {
        margin: 20px 0 0 0;
}

#index {
  background: url(palliativ/bg-website-hospiztag.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/bg-website-hospiztag.jpg', sizingMethod='scale');
  -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/bg-website-hospiztag.jpg', sizingMethod='scale')";
}

#programm {
        background: rgba(221,16,107,1.0) url(palliativ/bg-folgeseiten.png) no-repeat scroll top center;
        -webkit-background-size: contain;
   -moz-background-size: contain;
   -o-background-size: contain;
   background-size: contain;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/bg-folgeseiten.png', sizingMethod='scale');
   -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/bg-folgeseiten.png', sizingMethod='scale')";
}

#veranstalter {
        background: rgba(221,16,107,1.0) url(palliativ/bg-folgeseiten.png) no-repeat scroll top center;
        -webkit-background-size: contain;
   -moz-background-size: contain;
   -o-background-size: contain;
   background-size: contain;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/bg-folgeseiten.png', sizingMethod='scale');
   -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/bg-folgeseiten.png', sizingMethod='scale')";
}

#paKopf{
        width: 100%;
        height: 476px;
        text-align: center;
        background: url(palliativ/kopf-programm-anmeldung.png) no-repeat top center;
        -webkit-background-size: contain;
   -moz-background-size: contain;
   -o-background-size: contain;
   background-size: contain;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/bg-folgeseiten.png', sizingMethod='scale');
   -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/bg-folgeseiten.png', sizingMethod='scale')";
}

#paInhalt{
        width: 100%;
        height: auto;
        background: url(palliativ/inhalt-programm-anmeldung.png) repeat-y top center;
}

#paFuss{
        width: 100%;
        height: auto;
}

#doKopf{
        width: 100%;
        height: 476px;
        text-align: center;
        background: url(palliativ/kopf-dozenten.png) no-repeat top center;
        -webkit-background-size: contain;
   -moz-background-size: contain;
   -o-background-size: contain;
   background-size: contain;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/folgeseite-bg.png', sizingMethod='scale');
   -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/folgeseite-bg.png', sizingMethod='scale')";
}

#doInhalt{
        width: 100%;
        height: auto;
        background: url(palliativ/inhalt-dozenten.png) repeat-y top center;
}

#doFuss{
        width: 100%;
        height: auto;
}

#vgKopf{
        width: 100%;
        height: 476px;
        text-align: center;
        background: url(palliativ/kopf-veranstalter-grusswort.png) no-repeat top center;
        -webkit-background-size: contain;
   -moz-background-size: contain;
   -o-background-size: contain;
   background-size: contain;
   filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='.palliativ/folgeseite-bg.png', sizingMethod='scale');
   -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='palliativ/folgeseite-bg.png', sizingMethod='scale')";
}

#vgInhalt{
        width: 100%;
        height: auto;
        background: url(palliativ/inhalt-veranstalter-grusswort.png) repeat-y top center;
}

#vgFuss{
        width: 100%;
        height: auto;
}

.responsiveContainer {
  position: relative;
  padding-bottom: 56%;
  height: 0;
  overflow: hidden;
}

.responsiveContainer iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 25px;
}

.doz{
        float:right;
        margin-left: 2%;
        border-radius: 10px;
}

.work{
        margin-left: 2%;
        border-radius: 10px;
        max-width: 12%;
        height: auto;
}


/* ----------------------------------------------------------------------------------------------------------
02 Typography -----------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

/* pt-sans-narrow-regular - latin */
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/pt-sans-narrow-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/pt-sans-narrow-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/pt-sans-narrow-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/pt-sans-narrow-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/pt-sans-narrow-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/pt-sans-narrow-v17-latin-regular.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}

/* pt-sans-narrow-700 - latin */
@font-face {
  font-family: 'PT Sans Narrow';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/pt-sans-narrow-v17-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/pt-sans-narrow-v17-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/pt-sans-narrow-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/pt-sans-narrow-v17-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/pt-sans-narrow-v17-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/pt-sans-narrow-v17-latin-700.svg#PTSansNarrow') format('svg'); /* Legacy iOS */
}


a.home:link {text-decoration: none;}

a:link {color: white; text-decoration: underline;}
a:hover {color: silver; text-decoration: none;}
a:visited {color: silver;}

h1 {
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 5.0em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:right;
   margin: 0 2% 0 0;
}

h2 {
        font-size: 3.0em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   line-height: 1.0em;
   padding-top: 15%;
}

h3 {
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 2.5em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:right;
   line-height: 1.0em;
        margin: 0 2.5% 0 0;
}

h4 {
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 1.5em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:left;
   line-height: 1.0em;
        margin: 0 2.5% 0 0;
}

h5 {
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 1.3em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:left;
   line-height: 1.0em;
        margin: 0 2.5% 0 0;
}

.logo {
        text-align:right;
        margin: -2% 3% 0% 0%;
}

.bodyContent-01 {
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  text-align: center;
  margin: -10% 0% 0% 2%;                        /* Position auf dem Screen */
  font-size: 2.5em;
  padding: 0%;
  display: flex;
  height: 7em;
  width: 7em;
  color: #fff;
  background: rgba(0,153,153,1.0);
}

.bodyContent-02 {
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  text-align: center;
  margin: -2.5% 0% 0% 30%;                        /* Position auf dem Screen */
  font-size: 2.5em;
  padding: 0%;
  display: flex;
  height: 7em;
  width: 7em;
  color: #fff;
  background: rgba(153,51,204,1.0);
}

.bodyContent-03 {
  justify-content: center;
  align-items: center;
  border-radius: 100%;
  text-align: center;
  margin: -31% 0% 0% 63%;                        /* Position auf dem Screen */
  font-size: 2.5em;
  padding: 0%;
  display: flex;
  height: 7em;
  width: 7em;
  color: #fff;
  background: rgba(22,182,207,1.0);
}

.bodyHeader-H1 {
        padding: 0 0 0 0;
}

.bodyHeader-H2 {
        padding: 0 0 0 0;
        margin-bottom: 3%;
}

.imp a {
        color: white;
        text-decoration: none;
}

#footer{
        color: white;
}
.copy{font-size: 0.8em; padding-left: 20%;}
.imp{text-align: right; font-size: 1.5em; padding-right: 5%; margin-bottom: 1%;}

#footerHome{
        color: white;
        margin-top: 8%;
}
.copyHome{
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 0.8em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:right;
   line-height: 1.0em;
        margin: 0 2.5% 0 0;
}
.impHome{
        font-family: 'PT Sans Narrow', sans-serif;
        font-size: 1.8em;
        color: white;
        text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
   text-align:right;
   line-height: 1.0em;
        margin: 0 2.5% 0 0;
}

.impHome a {
        color: white;
        text-decoration: none;
}

/* ----------------------------------------------------------------------------------------------------------
02 ToolTip --------------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------- */

.tooltip {
  color: rgba(221,16,107,1.0);
  position: relative;

}

.tooltip span[rel=tooltip] {
  display:none;

}

.tooltip:hover span[rel=tooltip] {
          display: block;
          position: absolute;
          bottom: 0.65em;
          left: 3.5em;
          width: auto;
          padding: 0.5em;
          z-index: 100;
          color: white;
          background-color: rgba(221,16,107,0.3);
          border: solid 1px rgba(221,16,107,1.0);
          border-radius: 0.2em;
          white-space: nowrap;


}


.tooltipPROG {
  color: rgba(0.153,153,1.0);
  position: relative;

}

.tooltipPROG span[rel=tooltipPROG] {
  display:none;

}

.tooltipPROG:hover span[rel=tooltipPROG] {
          display: block;
          position: absolute;
          bottom: 0.65em;
          left: 14em;
          width: auto;
          padding: 0.5em;
          z-index: 100;
          color: white;
          background-color: rgba(221,16,107,0.3);
          border: solid 1px rgba(221,16,107,1.0);
          border-radius: 0.2em;
          white-space: nowrap;