* {     -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
         box-sizing: border-box;

         }



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

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



/* noto-serif-regular - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/noto-serif-v21-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/noto-serif-v21-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/noto-serif-v21-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/noto-serif-v21-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/noto-serif-v21-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/noto-serif-v21-latin-regular.svg#NotoSerif') format('svg'); /* Legacy iOS */
}

/* noto-serif-700 - latin */
@font-face {
  font-family: 'Noto Serif';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/noto-serif-v21-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/noto-serif-v21-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/noto-serif-v21-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/noto-serif-v21-latin-700.woff') format('woff'), /* Modern Browsers */
       url('fonts/noto-serif-v21-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/noto-serif-v21-latin-700.svg#NotoSerif') format('svg'); /* Legacy iOS */
}









/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-300italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/roboto-v30-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-300italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

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

/* roboto-italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/roboto-v30-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-500 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('fonts/roboto-v30-latin-500.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-500.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-500italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  src: url('fonts/roboto-v30-latin-500italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-500italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-500italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-500italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-500italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-500italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

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

/* roboto-700italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  src: url('fonts/roboto-v30-latin-700italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-700italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-700italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-700italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-700italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-700italic.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-900 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/roboto-v30-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-900.svg#Roboto') format('svg'); /* Legacy iOS */
}

/* roboto-900italic - latin */
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  src: url('fonts/roboto-v30-latin-900italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-v30-latin-900italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-v30-latin-900italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-v30-latin-900italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-v30-latin-900italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-v30-latin-900italic.svg#Roboto') format('svg'); /* Legacy iOS */
}


/* roboto-slab-100 - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 100;
  src: url('fonts/roboto-slab-v24-latin-100.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-slab-v24-latin-100.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-slab-v24-latin-100.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-slab-v24-latin-100.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-slab-v24-latin-100.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-slab-v24-latin-100.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}

/* roboto-slab-300 - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/roboto-slab-v24-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-slab-v24-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-slab-v24-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-slab-v24-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-slab-v24-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-slab-v24-latin-300.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}

/* roboto-slab-regular - latin */
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/roboto-slab-v24-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/roboto-slab-v24-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/roboto-slab-v24-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/roboto-slab-v24-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/roboto-slab-v24-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/roboto-slab-v24-latin-regular.svg#RobotoSlab') format('svg'); /* Legacy iOS */
}










/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/lato-v23-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato-v23-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato-v23-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato-v23-latin-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato-v23-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato-v23-latin-300.svg#Lato') format('svg'); /* Legacy iOS */
}

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

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

/* lato-900 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/lato-v23-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/lato-v23-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/lato-v23-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/lato-v23-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/lato-v23-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/lato-v23-latin-900.svg#Lato') format('svg'); /* Legacy iOS */
}









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

/* rubik-900 - latin */
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/rubik-v21-latin-900.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('fonts/rubik-v21-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/rubik-v21-latin-900.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/rubik-v21-latin-900.woff') format('woff'), /* Modern Browsers */
       url('fonts/rubik-v21-latin-900.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/rubik-v21-latin-900.svg#Rubik') format('svg'); /* Legacy iOS */
}



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


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




/* sofia-sans-semi-condensed-200 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 200;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-300 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 300;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 400;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-500 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 500;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-600 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 600;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* sofia-sans-semi-condensed-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 700;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-800 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 800;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



/* sofia-sans-semi-condensed-900 - latin */
@font-face {
  font-display: swap;
  font-family: 'Sofia Sans Semi Condensed';
  font-style: normal;
  font-weight: 900;
  src: url('CC_fonts/sofia-sans-semi-condensed-v4-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

}




/* frank-ruhl-libre-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/frank-ruhl-libre-v23-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-regular - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 400;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-500 - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 500;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-600 - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 600;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-700 - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 700;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-800 - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 800;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* frank-ruhl-libre-900 - latin */
@font-face {
  font-display: swap;
  font-family: 'Frank Ruhl Libre';
  font-style: normal;
  font-weight: 900;
  src: url('CC_fonts/frank-ruhl-libre-v21-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}



.fw400 {font-weight: 300; }
.fw500 {font-weight: 500; }
.fw600 {font-weight: 600; }
.fw700 {font-weight: 700; }
.fw800 {font-weight: 800; }
.fw900 {font-weight: 900; }



body {
         animation:fadein 0.9s;
         -moz-animation:fadein 0.9s;
         -webkit-animation:fadein 0.9s;
         scroll-behavior: smooth;
         -ms-user-select: none;
         -webkit-user-select: none;
         -moz-user-select: none;
         user-select: none;
         margin: 0 auto;

}



.wrapperfullwide {
        max-width: 1860px;
        padding: 0 0px 0 0px;
        margin: 0 auto;
         }

@media all and (max-width: 1890px) {
        .wrapperfullwide {
        padding: 0 20px 0 20px;
         }
}

.wrapperwide {
        max-width: 1600px;
        padding: 0 0px 0 0px;
        margin: 0 auto;
         }

@media all and (max-width: 1630px) {
        .wrapperwide {
        padding: 0 20px 0 20px;
         }
}





.wrapper {
        max-width: 1300px;
        padding: 0 0px 0em 0px;
        margin: 0 auto;
         }

@media all and (max-width: 1330px) {
        .wrapper {
        padding: 0 20px 0em 20px;
         }
}


.wrapper960 {
        max-width: 960px;
        padding: 0 0px 0em 0px;
        margin: 0 auto;
         }


@media all and (max-width: 959px) {
        .wrapper960 {
        padding-left: 15px;
        padding-right: 15px;
         }
}



.wrapperCC {max-width: 1200px;
         margin: 0px auto;
         padding: 0 20px;
         border:0px solid #00ff00;
        }







/* ----------------- Zweispaltiges Layout ------------------------------ */
.two-columns {
  display: flex;
  gap: 1rem 2rem;
  flex-wrap: wrap;

}

.spalte{
  flex: 1;
  padding: 0.0rem;
  border: 0px solid #ddd;
}

.spalte1 {
  flex: 1;
  padding: 0.0rem;
  border: 0px solid #ddd;
}

.spalte2 {
  flex: 2;
  padding: 0.0rem;
  border: 0px solid #ddd;
}

.spalte3 {
  flex: 3;
  padding: 0.0rem;
  border: 0px solid #ddd;
}

/* Für kleinere Geräte */
@media (max-width: 768px) {
  .two-columns {
    flex-direction: column;
  }
}









/* --- menuebalken unten --- */
.menubar {
        width: 100%;
        position: fixed;
        bottom: -80px;
        border-top: 0px solid #CEAD16;
        background: #2F2F2F;
        opacity:1;
        z-index: 50
}

.menubar:hover {
        width: 100%;
        position: fixed;
        bottom:-10px;
        border-top: 0px solid #DFDFDF;
        padding-top: 0px;
        background: #EFEFEF;
        opacity:1;
        transition: all .2s ease-in-out;
}



.menuboxhome {
        max-width: 960px;
        margin: 0 auto;
        padding-top: 10px;
        padding-bottom: 10px;
}


.menubox {
        max-width: 960px;
        margin: 0 auto;
        padding-bottom: 10px;
        padding-top: 12px;
        margin-bottom: 100px;
}



.lastelement {
    /*    background-color: #EFEFEF;    */
        background: linear-gradient(0deg, #FFFFFF, #FFFFFF, #CFCFCF);
        height:200px;
         }



/* Mid screens */
@media all and (max-width: 810px) {

        .menubar {
        width: 100%;
        position: fixed;
        bottom: 0px;
        background-color: #EFEFEF;
         }
        .menubar:hover {
        width: 100%;
        position: fixed;
        bottom: 0px;
        padding-top: 0px;
        background-color: #EFEFEF;
         }
         .menubox {
        padding-bottom: 0px;
        padding-top: 12px;
        margin-bottom: 0px;
         }
         .lastelement {
        height:150px;
         }
}




.menucell_1 {
        width: 10%;
        float:left;
        display: block;
}


.menucell_2 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_3 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_4 {
        width: 20%;
        float:left;
        display: block;
}

.menucell_5 {
        width: 20%;
        float:left;
        display: block;

}

.menucell_6 {
        width: 10%;
        float:left;
        display: block;
}


.menucell_30 {
        width: 30%;
        float:left;
        display: block;
}


/* Small screens    7er          */
@media all and (max-width: 560px) {
        .menubox {
        width:100%;
        margin-bottom:62px;
         }


         .lastelement {
        height:135px;
         }

        .menucell_1 {
        width: 14.28%;
         }
        .menucell_2 {
        display: none;
         }
         .menucell_3 {
        width: 28.56%;
         }
         .menucell_4 {
        width: 28.56%;
         }
         .menucell_5 {
        width: 28.56%;
         }
         .menucell_6 {
        display: none;
         }
}





.preloads {
  width:0px;
  height:0px;
  visibility:hidden;
}


/* --- hintergrundfarben --- */

.bgcolor_CC {background-color:#001727;}





.bgcolor_blue {background-color: #68d0e7; }
.bgcolor_cyanblue {background-color: #01c5ff; }
.bgcolor_darkblue {background-color: #133645; }
.bgcolor_nightblue {background-color: #090f3e; }
.bgcolor_gold {background-color: #CEAD16; }
.bgcolor_altgold {background-color: #ab8a00; }

.bgcolor_red {background-color: #A51C8C; }

.bgcolor_orange {background-color: #F37D0B; }
.bgcolor_orange2 {background-color: #ed823a; }
.bgcolor_violet {background-color: #631B85; }


.bgcolor_green {background-color: #afd510; }
.bgcolor_petrol {background-color: #16CECB; }
.bgcolor_yellow {background-color: #FEE803; }
.bgcolor_waldmeistereis {background-color: #e6feef; }
.bgcolor_screenblue {background-color: #dcfcff; }

.bgcolor_creme {background-color: #F9F7EB; }
.bgcolor_citron {background-color: #efffb7 ; }
.bgcolor_cremegreen {background-color: #e7f2e4; }
.bgcolor_brown {background-color: #522405 ; }
.bgcolor_videoblue {background-color: #6cf6ff ; }

.bgcolor_white {background-color: #FFFFFF; }
.bgcolor_black {background-color: #000000; }
.bgcolor_darkgrey {background-color: #5F5F5F; }
.bgcolor_lightgrey {background-color: #EFEFEF; }
.bgcolor_shinygrey {background-color: #f4f4f5; }
.bgcolor_midgrey {background-color: #DFDFDF; }
.bgcolor_mittelgrau {background-color: #5F5F5F; }
.bgcolor_swipergrey {background-color: #8F8F8F; }


.bgcolor_show {background-color: #CFCFCF; }
.bgcolor_diskurs {background-color: #f8f6f6; }

.bgcolor_kartongrau {background-color: #cbd1cb; }
.bgcolor_kartonhell {background-color: #e9ece9; }
.bgcolor_showhide {background-color: #f2f4f2; }


.bgcolor_online {background-color: #f6eee6 ; }
.bgcolor_offline {background-color: #3e4254 ; }

.bgcolor_CC {background-color:#001727;}




/* --- fades --- */
.bgcolor_fadefromgrey {background: linear-gradient(to right, #5F5F5F, #FFFFFF); }

.bgcolor_redgrad { background: linear-gradient(135deg, #A51C8C, #871BAE); margin-top:-15px;}

.bgcolor_greengrad { background: linear-gradient(135deg, #afd510, #85C619); margin-top:-0px;}



.bgcolor_fadeblacktogreen {background: linear-gradient(135deg, #000000, #005F00); }











/* NAVI NEU nur Up-Bottom unten */
nav {
        position: fixed;
        width: 60px;
        height: auto;
        bottom: 70px;
        right: 20px;
        background-color: none;
        z-index: 60;
}



@media all and (max-width: 810px) {
         nav {
        width: 32px;
        height: auto;
        bottom: 85px;
        right: 10px;
         }
}


@media all and (max-width: 560px) {
         nav {
        width: 32px;
        height: auto;
        bottom: 75px;
        right: 10px;
         }
}

nav:hover {
        opacity:70%;
}


nav ul {
        padding: 0em;
        margin: 0;
        }


nav ul li {
        list-style-type: none;
}


nav ul li a:link {
        color: white;
}








/* TOGGLE-SECTIONS */
        .toggle-section {
            max-width: 90%;
            margin: 20px auto;
            text-align: center;
            z-index:20;

        }

        .overlap {
            margin-top:-60px;
        }

        .toggle-button {
            background-color: #001727;
            color: #ffffff;
            padding: 10px 10px;
                        width:120px;
                        height:120px;

            border: 0px solid #ffffff;
            cursor: pointer;
            z-index:100;
            font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
            font-size: 0.9em;
                        text-transform:uppercase;
                        letter-spacing:0.15em;
                        text-align:center;
            transition: background-color 0.3s ease;
                        box-shadow: 0px 0px 50px 50px #E3F8EE;
                        box-shadow: 0px 0px 50px 50px #dde0ff;
                        transition: 0.3s;

        }

        .toggle-button:hover {
            background-color: #293642;
                        transform: scale(1.5);
                        box-shadow: 0px 0px 100px 100px #E3F8EE;
                        box-shadow: 0px 0px 100px 100px #dde0ff;
                        color: #ffdfb5;
        }

        .toggle-content {
            max-height: 0;

            overflow: hidden;
            transition: max-height 0.0s ease-in;
                                 border:0px solid #ff0000;
            padding: 0 20px;
            margin-top: 50px;
            border-radius: 0px;
            font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
            font-size: 1em;
            color: #ffffff;
            text-align: left;
        }

        .toggle-content.active {
            max-height: 10000px; /* Adjust based on content length */
            padding: 20px;
        }

        @media (max-width: 768px) {
            .toggle-content {font-size: 0.9em;}
            .toggle-content.active {padding: 00px;}
        }



















/* ----------- botton  ----------- */

.gotobuttons {
  margin-top:20px;
  margin-bottom:0px;
  width:100%;
}

.gotomail {
  background: #FFFFFF;
  height: 60px;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  border-color: #133645;
  width:50%;
  margin-left:50%;


  font-family: 'Roboto', sans-serif;
        font-size: 75%;
        color: #000000;
        line-height:1.3em;
        letter-spacing: 0.2em;
        text-align:center;
        text-transform: uppercase;
        hyphens: none;

  display: -webkit-flex;
  display:         flex;
  -webkit-align-items: center;
          align-items: center;
  -webkit-justify-content: center;
          justify-content: center;
  -webkit-transition: .9s ease-in-out;
  transition: .3s ease-in-out;
}


.gotomail:hover {
  background: #CEAD16;
  border-top: 1px solid;
  border-bottom: 1px solid;
  border-left: 1px solid;
  border-right: 1px solid;
  border-color: #133645;
  color: #FFFFFF;
  letter-spacing: 0.4em;
  transform:scale(1.0);
  -webkit-transition: .2s ease-in-out;
  transition: .2s ease-in-out;
}


@media all and (min-width: 560px) {
        .gotomail     {height: 60px; width:60%;  font-size: 80%;}

}

@media all and (min-width: 1200px) {
        .gotomail     {height: 60px; width:60%; font-size: 90%;}
}






/* Social Media Icons */
.img_smicons {width: 50px;}

@media all and (max-width: 560px) {
         .img_smicons { width: 30px;}
         ul.share-buttons li{margin-right:8px;}
}

.img_smicons:hover {transform: scale(1.1);}

ul.share-buttons{
  list-style: none;
  padding: 0px;
  text-align: center;
}

ul.share-buttons li{
  display: inline;
  margin-right:15px;

}

ul.share-buttons .sr-only {
  position: absolute;
  padding: 0px;
  border: 0;
  height: 1px;
  width: 1px;
  overflow: hidden;
}






/* --------------- BILDER ===================================  ------------- */
img {
        width: 100%;
}


.img100 {
        width: 100%;
        margin-bottom:-4px;
}


.imgauto {
        width: auto;
}


.imgcenter {
        width: auto;
        display: block;
        margin-left: auto;
        margin-right: auto
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgcenter {
                width: 100%;
                margin-left: 0;
                margin-right:0;
                }
}





/* --------------- zwei Bilder ohne Abstand nebeneinander ------------- */
.imgtwin {
        width: 50%;
        float:left;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgtwin {
                width: 100%;
                }
}



.imgthirds {
        width: 33.33%;
        float:left;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgthirds {
                width: 100%;
                }
}



/* --------------- zwei Bilder mit Abstand nebeneinander ------------- */
.imgdouble {
        width: calc(50% - 30px);
        margin:10px 15px 30px 15px;
        background-color: #DFDFDF;
        box-shadow: 5px 10px 10px #CFCFCF;
        float:left;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgdouble {
                width: 100%;
                margin:10px 0px 15px 0px;
                }
}



/* --------------- drei Bilder mit Abstand nebeneinander ------------- */
.imgtriple {
        width: calc(33.333% - 20px);
        margin:10px 10px 10px 10px;
        background-color: #DFDFDF;
        box-shadow: 5px 10px 10px #CFCFCF;
        float:left;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgtriple {
                width: 100%;
                margin:10px 0px 10px 0px;
                }
}




/* --------------- drei Bilder OHNE Abstand nebeneinander ------------- */
.imgdreier {
        width: calc(33.333% - 0px);
        margin:0;
        background-color: #FFFFFF;

        float:left;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imgdreier {
                width: 100%;
                margin:0;
                }
}




/* --------------- Box für 1 Bild halb ------------- */
.imghalf {
        width: 50%;
        margin:10px 0px 10px 0px;
        box-shadow: 5px 10px 10px #CFCFCF;
}

/* Small screens */
@media all and (max-width: 560px) {
        .imghalf {
                width: 100%;
                margin:10px 0px 10px 0px;
                }
}



.img50 {
        width: 50%;
}

/* Small screens */
@media all and (max-width: 560px) {
        .img50 {width: 100%;}
}


.img33 {
        width: 33.3333%;
}

/* Small screens */
@media all and (max-width: 560px) {
        .img33 {
                width: 50%;
                }
}








.imglesen {
        width: 48%;
}


/* Small screens */
@media all and (max-width: 560px) {
        .imglesen {
                width: 100%;
                }
}



.ms_logo {
        width: 20px;
        float:left;
        margin-right:10px;;
}


/* Small screens */
@media all and (max-width: 560px) {
        .ms_logo {
                width: 25px;
                }
}




.topright {
        float: right;
        width: auto;
        margin: 20px 0 1.6em 1.6em;
}


.topleft {
        float: left;
        width: auto;
        margin: 0 1.6em 1.6em 0;
}

/* Small screens */
@media all and (max-width: 560px) {
        .topright,
        .topleft {
                float: none;
                width: 100%;
                margin: 0 0 5px 0;
                }
}


.middle {
        width: auto;
        display: block;
        margin: 0 auto;
}


.picdistance {
        height:30px;
}

/* Small screens */
@media all and (max-width: 560px) {
        .picdistance {
                height:20px;
                }
}





























/* ===================== ALTES MENU ALS TAB ========================= */
.tab_nav_oben       {
         width: 100%;
         margin-bottom: -2em;
         border: 0px;
         cellpadding: 0;
         cellspacing: 0;
         }





/* ===================== SPANS ========================= */
span.mehr {
         display: block;
         margin-top: 30px;
         height: 30px;
         background-color: #CFCFCF;
         padding: 3px 10px 1px 2%;
         color: #FFFFFF;
         font-size: 1.7em;
         font-weight: normal;
         letter-spacing: 0.08em;
         cursor: Pointer;
}
span.mehr:hover {
         color: #5F5F5F;
}


span.aufklapp {
         color: #9F9F9F;
         cursor: Pointer;
}
span.aufklapp:hover {
         color: #FFFFFF;
}




/*  SHOW HIDE neu 03  */
.show_container {

  padding:0% 0% 0% 0%;
  cursor: pointer
}


.show_container div p {
  cursor: default !important;
  margin-bottom: 10px

  -webkit-animation: scale 0.7s ease-in-out;
  -moz-animation: scale 0.7s ease-in-out;
  animation: scale 0.7s ease-in-out;
  }

         @keyframes scale {
                 0% {
                 transform: scale(0.9);
                 opacity: 0;
                 }
                 50% {
                 transform: scale(1);
                 opacity: 0.8;
                 }
                 100% {
                 transform: scale(1);
                 opacity: 1;
                 }
}






form,
.subscribe:hover>div,
.hidden>div {
  display: none
}








span.mehrklein {
         display: block;
         margin-top: 00px;
         height: 30px;
         background-color: #FFFFFF;
         padding: 0px 10px 1px 0;
         color: #1AAFB4;
         font-size: 1.1em;
         font-weight: bold;
         letter-spacing: 0.08em;
         cursor: Pointer;
}
span.mehrklein:hover {
         color: #5F5F5F;
}


span.aufklappklein {
         color: #9F9F9F;
         cursor: Pointer;
}
span.aufklappklein:hover {
         color: #FFFFFF;
}








/* ===================== TYPO ========================= */

h1 {
        font-family: 'Frank Ruhl Libre';
        font-weight:700;
        margin-top:30px;
}



h1 {font-size: 220%; line-height: 1.0em;}

@media all and (min-width: 560px) {
h1 {font-size: 260%; line-height: 1.0em; margin-top:40px;}}

@media all and (min-width: 640px) {
h1 {font-size: 500%; line-height: 1.0em; margin-top:40px;}}







.headline_first {
        font-size:0%; margin:0;color:#FFFFFF;
}







@media all and (min-width: 560px) {
        .h1_eng {
                font-size:260%;
                line-height: 1.0em;
                margin-top:40px;
                }
}


@media all and (min-width: 640px) {
        .h1_eng {
                font-size:500%;
                line-height: 1.0em;
                margin-top:40px;
                }
}


/* Small screens */
@media all and (min-width: 560px) {
        .h1_eng_2 {
                font-size:240%;
                line-height: 1.0em;
                margin-top:40px;
                }
}









h2 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:900;
        font-size: 200%;
        word-spacing: 0.05em;
        line-height: 1.0em;
        color: #3F3F3F;
        text-transform: uppercase;
}

@media all and (min-width: 100px) {
        h2 {
                font-size:130%;
                line-height: 1.1em;
                }
}



/* Mid screens */
@media all and (min-width: 560px) {
        h2 {
                font-size: 180%;
                line-height: 1.2em;
                }
}



/* Small screens */
@media all and (min-width: 960px) {
        h2 {
                font-size:260%;
                line-height: 1.1em;
                margin-top:40px;
                }
}






.arbeitsbeispielhead {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 160%;
        letter-spacing: 0.1em;
        font-weight: 700;
        line-height: 1.0em;
        color: #C6B619;
}


/* Small screens */
@media all and (max-width: 960px) {
        .arbeitsbeispielhead {
                font-size: 120%;
                line-height: 1.0em;
                }
}






.h2mid {
        font-size: 150%;
        font-weight: normal;
        word-spacing: 0.05em;
        line-height: 1.4em;
        color: #C9B319;
        text-transform: uppercase;
}



/* -------------- Heads mit 2 Größen z.B. Geschäftsberichte ----  */
.doubletypeA {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 400%;
        line-height: 1.5em;
        font-weight: normal;
        color: #000000;
        text-transform: uppercase;
}


.doubletypeB {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 200%;
        font-weight: normal;
        line-height: 1.4em;
        color: #BFBFBF;
        text-transform: uppercase;
}

/* Small screens */
@media all and (max-width: 560px) {
        .doubletypeA {
                font-size:240%;
                }
        .doubletypeB {
                font-size:120%;
                color: #7F7F7F;
                }
}
/* ----End ---------- Heads mit 2 Größen z.B. Geschäftsberichte ----  */










.h2_tease {
        color: #FFFFFF;
        text-transform: none;
}

.h2_themen {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 200%;
        font-weight: normal;
        line-height: 0.8em;
        color: #000000;
        text-transform: uppercase;
}




.thin {
      font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:900;
        font-size: 400%;

        color: #0F0F0F;
        text-transform: uppercase;
}

/* Small screens */
@media all and (max-width: 560px) {
       .thin     {
                font-size:240%;
                line-height: 0.8em;
                margin-top:0px;
                padding-bottom:0px;
                }
}



.thin2 {
        font-family: 'Frank Ruhl Libre';
        font-size: 340%;
        font-weight: normal;
        color: #0F0F0F;
        text-transform: uppercase;
}


/* Small screens */
@media all and (max-width: 560px) {
       .thin2     {
                font-size:200%;
               }
}

.thin3 {
        font-family: 'Frank Ruhl Libre';
        font-size: 350%;
        font-weight: normal;
        color: #FFFFFF;
        text-transform: uppercase;
}




.thin4 {
        font-family: 'Frank Ruhl Libre';
        font-size: 200%;
        font-weight: normal;
        color: #FFFFFF;
        text-transform: none;
}

/* Small screens */
@media all and (max-width: 560px) {
       .thin4     {
                font-size:130%;
               }
}


.thin5 {
        font-family: 'Frank Ruhl Libre';
        font-size: 200%;
        font-weight: normal;
        word-spacing: 0.05em;
        line-height: 1.4em;
        color: #1F1F1F;
        text-transform: none;
         -moz-hyphens: auto;
         -o-hyphens: auto;
         -webkit-hyphens: auto;
         -ms-hyphens: auto;
         hyphens: auto;
}

/* Small screens */
@media all and (max-width: 560px) {
        .thin5 {
                font-size: 130%;
                }
}

.thin6 {
        font-family: 'Frank Ruhl Libre';
        font-size: 200%;
        font-weight: normal;
        color: #7F7F7F;
        text-transform: none;
}

.thin7 {
        font-family: 'Frank Ruhl Libre';
        font-size: 160%;
        font-weight: normal;
        word-spacing: 0.05em;
        line-height: 1.4em;
        color: #1F1F1F;
        text-transform: none;
}



.h2_intro
        {
        font-family: 'Frank Ruhl Libre';
        font-size: 240%;
        font-weight: 300;
        word-spacing: 0.05em;
        line-height: 1.3em;
        color: #000000;
        text-transform: none;
}

/* Small screens */
@media all and (max-width: 560px) {
       .h2_intro     {
                font-size:140%;
               }
}



.h2_philo {
        font-family: 'Frank Ruhl Libre';
        font-size: 160%;
        font-weight: 500;
        word-spacing: 0.05em;
        line-height: 1.5em;
        color: #000000;
        text-transform: none;
}






/* Mid screens */
@media all and (max-width: 960px) {
        .h2_philo {
                font-size: 160%;
                line-height: 1.3em;
                }
}

/* Small screens */
@media all and (max-width: 560px) {
        .h2_philo {
                font-size: 130%;
                line-height: 1.25em;
                }
}


.h2_thesis {
        font-family: 'Frank Ruhl Libre'; ;
        font-size: 400%;
        font-weight: 700;
        word-spacing: 0.05em;
        line-height: 1.0em;
        color: #000000;
        text-transform: none;
}










h3 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:900;
        font-size: 85%;
        letter-spacing: 0.1em;
        font-weight: 700;
        line-height: 1.6em;
        color: #C6B619;
         -moz-hyphens: auto;
         -o-hyphens: auto;
         -webkit-hyphens: auto;
         -ms-hyphens: auto;
         hyphens: auto;
}


/* Small screens */
@media all and (max-width: 960px) {
        h3 {
                font-size: 70%;
                line-height: 1.5em;
                }
}


/* Small screens */
@media all and (max-width: 560px) {
        h3 {
                font-size: 70%;
                line-height: 1.5em;
                }
}





h4 {
        font-family: 'Frank Ruhl Libre';
        font-weight:600;
        font-size:200%;
        line-height:0.8em;
        color: #000;
        margin-top:100px;
        margin-bottom:50px;
}


@media all and (max-width: 960px) {
        h4     {
        margin-top:50px;
        margin-bottom:10px;
        }
}


/* Small screens */
@media all and (max-width: 560px) {
        h4     {
        margin-top:50px;
        margin-bottom:10px;
        }
}






.twosizefirst {
        font-size:100%;}

.twosizesecond {
        font-size:75%;}


/* Mid screens */
@media all and (max-width: 960px) {
        .twosizefirst {
        font-size:80%;
        line-height:1.1em;
        }

        .twosizesecond {
        font-size:55%;
        line-height:1.1em;
        }
}


/* Small screens */
@media all and (max-width: 560px) {
        .twosizefirst {
        font-size:60%;
        line-height:1.1em;
        }

        .twosizesecond {
        font-size:35%;
        line-height:1.1em;
        }
}








h5 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:900;
        letter-spacing:0.02em;
        word-spacing:0.05em;
        font-size:210%;
        color: #000;
        margin-top:40px;
        margin-bottom:20px;
}

.h5_gold {
        color: #CEAD16;
        text-transform: uppercase;
}

/* Small screens */
@media all and (max-width: 560px) {
        h5 {
                font-size: 150%;
                margin-top:30px;
                margin-bottom:10px;
                }
}







/* ----- H 6 ------ */
h6 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 100%;
        letter-spacing: 0.3em;
        font-weight: 800;
        line-height:1.4em;
        text-transform: uppercase;
        color: #C9B319;

}

/* Small screens */
@media all and (max-width: 560px) {
        h6 {
                font-size: 70%;
                font-weight: bold;
                letter-spacing: .2em;
                }
}


.gridhead {
        font-weight:900;
        font-size: 200%;
        word-spacing: 0.05em;
        line-height: 1.0em;
        color: #FFFFFF;
        text-transform: uppercase;
}






p {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 140%;
        font-style:normal;
        font-weight: 400;
        color: #333;
        line-height:150%;
        letter-spacing: 0.02em;

         -moz-hyphens: auto;
         -o-hyphens: auto;
         -webkit-hyphens: auto;
         -ms-hyphens: auto;
         hyphens: auto;
}


@media all and (max-width: 1900px) {  p { font-size: 125%; }}

@media all and (max-width: 1300px) {  p { font-size: 110%; }}

@media all and (max-width: 560px)  { p {font-size: 100%; line-height:140%;}}



.whatabout {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 120%;
        color: #FFFFFF;
        letter-spacing: 0.05em;


}

@media all and (max-width: 960px) {
        .whatabout {
                font-size: 100%;
                }
}


@media all and (max-width: 660px) {
        .whatabout {
                font-size: 90%;
                }
}












.anlauf {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:700;
        font-size: 140%;
        letter-spacing: 0.02em;
        color: #6F6F6F;
        word-spacing: 0.05em;
        line-height:150%;


}




/* Small screens */
@media all and (max-width: 960px) {
        .anlauf {
                 font-size: 125%;
                 letter-spacing: 0.01em;
                 line-height:140%;
                 margin-top:0px;
                 margin-bottom:15px;
                }
}



/* Small screens */
@media all and (max-width: 560px) {
        .anlauf {
                 font-size: 110%;
                 letter-spacing: 0.01em;
                 line-height:140%;
                 margin-top:0px;
                 margin-bottom:15px;
                }
}





.leistungen
        {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;

        letter-spacing: 0.12em;
        line-height: 1.4em;
        color: #B89D1B;
        padding:10px 0 0 0px;
        text-align:left;
        text-transform: uppercase;
}


.leistungenlist
        {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        letter-spacing: 0.05em;
        line-height: 1.4em;
        color: #000000;
        padding:0 0 0 0px;
        text-align:left;
        text-transform: uppercase;
        margin-top:10px;
}





.font_4 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 70%;
        color: #7F7F7F;
        line-height:1.4em;
}

.font_5 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 70%;
        font-weight: normal;
        letter-spacing: .1em;
        color: #5F5F5F;
        word-spacing: 0.1em;
        line-height:1.3em;
}


.font_6 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 80%;
        font-weight: normal;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.8em;
}


.font_7 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 80%;
        font-weight: bold;
        color: #333;
        word-spacing: 0.1em;
        line-height:150%;
         -moz-hyphens: auto;
         -o-hyphens: auto;
         -webkit-hyphens: auto;
         -ms-hyphens: auto;
         hyphens: auto;
}


.font_8 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 85%;
        color: #333;

        letter-spacing: 0.09em;
        line-height:150%;
         -moz-hyphens: auto;
         -o-hyphens: auto;
         -webkit-hyphens: auto;
         -ms-hyphens: auto;
         hyphens: auto;
}


/* Small screens */
@media all and (max-width: 560px) {
        .font_8 {
                font-size: 70%;
                }
}

.font_9 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 80%;
        color:#8F8F8F;
        word-spacing: 0.1em;
        line-height:150%;
        padding-left:50%;
         -moz-hyphens: none;
         -o-hyphens: none;
         -webkit-hyphens: none;
         -ms-hyphens: none;
         hyphens: none;
}



/* Small screens */
@media all and (max-width: 560px) {
        .font_9 {
                font-size: 75%;
                line-height:140%;
                padding-left:20%;
                }
}


.font_credits {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 55%;
        color: #5F5F5F;
        line-height:150%;
}



.fliesshead {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 95%;
        font-weight: bold;
        letter-spacing: .1em;
        padding-top: 1.5em;
        color: #C9B319;
        line-height:1.2em;
        text-transform: uppercase;
        margin-bottom:0px;
}


.fliesshead_petrol {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 95%;
        font-weight: bold;
        letter-spacing: .1em;
        padding-top: 1.5em;
        color: #1B9083;
        line-height:1.2em;
        text-transform: uppercase;
}




#adresshead {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size:70%;
        font-weight: 400;
        letter-spacing: 0.1em;
        line-height:1.4em;
        color: #5F5F5F;
        margin-top:15px;
        margin-bottom:0px;
}


/* Small screens */
@media all and (max-width: 560px) {
        #adresshead {
               font-size:50%;
                }
}


#adresshead_bottom {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;

        font-size:65%;
        font-weight: 400;
        letter-spacing: 0.1em;
        line-height:1.0em;
        color: #9F9F9F;
        margin-top:0px;
        margin-bottom:10px;
        text-align:center;
}


/* Mid screens */
@media all and (max-width: 810px) {
        #adresshead_bottom {
               display:none;
                }
}


.adresshead2 {
         font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size:70%;
        font-weight: 400;
        letter-spacing: 0.1em;
        line-height:1.4em;
        color: #DFDFDF;
        margin-top:15px;
        margin-bottom:0px;
}


/* Small screens */
@media all and (max-width: 560px) {
        .adresshead2 {
               font-size:50%;
                }
}



.ruhl300 {
        font-family: 'Frank Ruhl Libre';
        font-weight: 200;
        letter-spacing: 0.0em;

}





/* ===================== LISTEN 2 ========================= */

ul, ol {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        color: #333;
        word-spacing: 0.1em;
        line-height:1.8em;
        padding-left: 0.6em;
        margin-left: 0.6em;

}


.overview {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 105%;
        color: #CEAD16;
        word-spacing: 0.1em;
        line-height:1.7em;
        letter-spacing: 0.1em;

}


.overviewcolor {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        color: #B6DDEF;
        word-spacing: 0.1em;
        line-height:1.7em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}


#goodies {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 85%;
        letter-spacing: 0em;
        font-weight: normal;
        line-height:1.6em;
        color: #666;
}


d1 {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 85%;
        letter-spacing: 0em;
        font-weight: normal;
        line-height:1.3em;
        color: #0F0F0F;
        background-color:#7A7A7A;
}


dl {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 85%;
        letter-spacing: 0em;
        font-weight: normal;
        line-height:1.3em;
        color: #0F0F0F;
        background-color:#7A7A7A;
}


/* =================== SPRUNGADRESSEN LINKS ALS LISTE ==================== */
.pauswahl {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-size: 120%;
        font-style: normal;
        font-weight:400;
        line-height: 1.8em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}




/* Mid screens */
@media all and (max-width: 810px) {
        .pauswahl {
                font-size: 110%;
                }
}


/* Small screens */
@media all and (max-width: 560px) {
        .pauswahl {
                font-size: 100%;
                line-height: 1.1em;
                }
}





/* ===================== LISTEN ========================= */
#menuethemen {
        padding-left: 20px;
        list-style-image: url(images/themen_bullet_gold.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;

        font-size: 120%;
        font-style: normal;
        font-weight:400;
        line-height: 1.4em;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}

.menuethemen_li_abstand {
        padding-bottom:10px;
}



/* Mid screens */
@media all and (max-width: 810px) {
        #menuethemen {
                font-size: 110%;
                }
}


/* Small screens */
@media all and (max-width: 560px) {
        #menuethemen {
                font-size: 100%;
                line-height: 1.1em;
                }
        .menuethemen_li_abstand {
                 padding-bottom:12px;
         }
}








#details {
        padding-left: 102px;
        list-style-image: url(images/themen_bulletarrow_black.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        line-height: 2em;
        font-weight: normal;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}


/* Small screens */
@media all and (max-width: 560px) {
        #details {
                padding-left: 52px;
                list-style-image: url(images/themen_bulletarrow_black_mobile.svg);
                font-size:85%;
                line-height: 1.4em;
                }
}


#info {
        padding-left: 102px;
        list-style-image: url(images/themen_bulletarrow_black.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        line-height: 2em;
        color: #708F8F;
        font-weight: normal;
        letter-spacing: 0.1em;
        text-transform: uppercase;
}


/* Small screens */
@media all and (max-width: 560px) {
        #info {
                padding-left: 52px;
                list-style-image: url(images/themen_bulletarrow_black_mobile.svg);
                font-size:85%;
                line-height: 1.4em;
                }
}



#zurauswahl {
        padding-left: 25px;
        list-style-image: url(images/arrow_zurauswahl_up.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 100%;
        letter-spacing: .4em;
        line-height:1.9em;
        text-transform: uppercase;
        color: #C9B319;          /* gold */
}


/* Small screens */
@media all and (max-width: 560px) {
        #zurauswahl {
                padding-left: 25px;
        list-style-image: url(images/arrow_zurauswahl_up.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 70%;
        letter-spacing: .4em;
        line-height:1.9em;
                }
}


.nobullet  {
        list-style: none;

}



.listeh2  {
        padding-left: 10px;
        list-style-image: url(images/themen_bullet_gold.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 160%;
        line-height: 1.7em;
        font-weight: normal;
        letter-spacing: 0.05em;
        text-transform: uppercase;
}


.listemittel  {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund_green.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #3ea189;
        font-size: 120%;
        line-height: 1.7em;
        font-weight: normal;

}


@media all and (max-width: 560px) {
        .listemittel {
                font-size:100%;
                line-height: 1.5em;
                }
}


#listegross,
#listegross2 {
        padding-left: 25px;
        list-style-image: url(images/themen_bullet.png);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #1C83A5;
        font-size: 160%;
        line-height: 1.4em;
        font-weight: normal;
        letter-spacing: 0.05em;
}


#listegross2 {
        color: #3F3F3F;
}


@media all and (max-width: 560px) {
        #listegross,
        #listegross2 {
                font-size:120%;
                padding-left: 18px;
                padding-right: 5px;
                }
}



.p_listegross_addtext  {
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #6F6F6F;
        font-size: 60%;
        line-height: 140%;
        font-weight: normal;
        letter-spacing: 0.05em;
}


@media all and (max-width: 560px) {
        .p_listegross_addtext {
                font-size:70%;

                }
}




.listeklein {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #CEAD16;              /*  color: #1C83A5;        */
        font-size: 110%;
        line-height: 1.4em;
        letter-spacing: 0.05em;
        text-transform: uppercase;
}


@media all and (max-width: 560px) {
        .listeklein {
                font-size:90%;
                }
}



.listecase {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund_case.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #333;
        font-size: 100%;
        line-height: 140%;
}


.listephysik {
        padding-left: 10px;
        margin-bottom: 10px;
        list-style-image: url(images/liste_bullet_rund.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #1C6895;
        font-size: 95%;
        line-height: 160%;
}

.liabstand {
        margin-bottom: 1em;
}


.listemodule {
        padding-left: 10px;

        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        color: #1C83A5;
        font-size: 120%;
        line-height: 1.4em;
        letter-spacing: 0.05em;
}


.liste_p {
        padding-left: 10px;
        list-style-image: url(images/liste_bullet_rund.svg);
        font-family: 'Sofia Sans Semi Condensed', Helvetica, Arial, sans-serif;
        font-weight:400;
        font-size: 95%;
        color: #333;
        line-height:160%;
}








a {
        text-decoration: none;
}



a:link {
        color: #AFAFAF;     <!-- grau -->
}


a:visited
        {
        color: #AFAFAF;     <!-- grau -->
}


a:link:hover
        {
        color: #E1C513;     <!-- gold -->
}

a:visited:hover
        {
        color: #87BE1A;     <!-- gruen -->
}



q::before
        {
        content: '„';
}


q::after
        {
        content: '“';
}




/* ===========================     --- VIDEOS --- */
.wrappervideo {
        max-width: 1400px;
        padding: 0 0px 0em 0px;
        margin: 0 auto;
         }


.backgroundvideo {
        background-color: #000;

         }

/* ===================== elastic video ========================= */
.elastic-video {
         position: relative;
         padding-bottom: 55%;
         padding-top: 15px;
         height: 0;
         overflow: hidden;
}

.elastic-video iframe {
         position: absolute;
         top: 0;
         left: 0;
         width: 100%;
         height: 100%;
}





/* ===================== einrückungen ========================= */
.padding {padding:0% 2% 0% 2%;}

.padding_3 {padding:3px;}

.padding_5 {padding:5px;}


.margin_3 {margin:3px;}

.margin_5 {margin:5px;}

.paddingfixLR {padding:0px 20px 0px 10px;}

.padding_def {
         padding-left: 20%;
}




.padding_25 {padding-left: 25%;}
.padding_33 {padding-left: 33%;}
.padding_50 {padding-left: 50%;}

@media all and (max-width: 560px) {
        .padding_25,
        .padding_33,
        .padding_50
        {padding-left: 0%;}
}




.beschreibung_L {max-width:100%;}

@media all and (min-width: 800px) {
        .beschreibung_L {max-width:50%;}
         }



.beschreibung_R {padding-left:0%;}

@media all and (min-width: 800px) {
        .beschreibung_R {padding-left:50%;}
         }










.padding_editorialdesignbox_L {
         padding-left: 20%;
         padding-right:20px;
         padding-top:10px;
}

@media all and (max-width: 1300px) {
        .padding_editorialdesignbox_L
        {padding-left: 20px; padding-right:20px;padding-top:0px; }
}


.padding_editorialdesignbox_R {
         padding-left: 20px;
         padding-right:20px;
         padding-top:10px;
}

@media all and (max-width: 1300px) {
        .padding_editorialdesignbox_R
        {padding-left: 20px; padding-right:20px;padding-top:0px; }
}



.right  {text-align:right;}

/* ===================== lines ========================= */

hr {
        background-color: #666;
        color: #666;
        border: #666;
        height: 1px;
        align: center;
        width: 100%;
}


.solidline_thick {
        background-color: #000000;
        color: #000000;
        border: #000000;
        height: 3px;
        align: center;
        width: 100%;
}

.dottedline,
.dottedline_adresshead
        {
        border :none;
        border-top: 1px dotted  #666;
        background-color: #FFFFFF;
        height: 1px;
        width: 100%;
}

.dottedline_adresshead
        {
        margin-top:0px;
}


.solidline_none
        {
        border :none;
        border-top: 1px solid  #FFFFFF;
        background-color: #FFFFFF;
        height: 0px;
        width: 100%;
}


@media all and (max-width: 810px) {.dottedline_hiding {display:none;}}





.verticalLine,
.verticalLine_white
         {
         margin-left: auto;
         margin-right: auto;
         width: 0.0em;
         height:50px;
         background-color:#FFFFFF;
         }


.verticalLine        { border-left: 1px solid #000000;}
.verticalLine_white  { border-left: 1px solid #FFFFFF;}

@media all and (min-width: 1000px) {
        .verticalLine,
        .verticalLine_white
                     {height:100px;}
}





.verticalLineShort
         {
         margin-left: auto;
         margin-right: auto;
         width: 0.0em;
         height:50px;
         background-color:#FFFFFF;
         border-left: 1px solid #000000;
         }

@media all and (max-width: 1000px) {
        .verticalLineShort
                     {height:30px;}
}









.arrowdown_docked {
  border-right: 1px solid #133645;
  border-bottom: 1px solid #133645;
  margin-left: auto;
  margin-right: auto;
  margin-top: -58px;
  margin-bottom: 10px;
  width: 50px;
  height:50px;
  transform: rotate(45deg);
}



.arrowdown {
  border-right: 1px solid #133645;
  border-bottom: 1px solid #133645;
  margin-left: auto;
  margin-right: auto;
  width: 50px;
  height:50px;
  transform: rotate(45deg);
}










/* =====================  ========================= */

.icon1 {
        height: 25px;
        width: auto;
}


.icon2 {
        height: 35px;
        width: auto;
}


/* ===================== colors ========================= */

.color_white     { color: #FFFFFF;  }
.color_lightgrey  { color: #EFEFEF; }
.color_midgrey     { color: #AFAFAF; }
.color_textgrey     { color: #6F6F6F; }
.color_black     { color: #000000; }
.color_gold     { color: #C9B319; }



.bugrey     { color: #6F6F6F; margin-top:0px; margin-bottom:40px;}

.black     {color:#000000; }
.darkgrey  {color:#5F5F5F; }
.midgrey   {color:#9F9F9F; }
.gold      {color:#CEAD16;}
.gold_CC   {color:#d6860d;}
.softgrey  {color:#CFCFCF; }
.white     {color:#FFFFFF;}

.creme {color:#ffdfb5;}
.dimmedblue {color:#5f7382;}



/*  ------------------ distancer  ------------------------------------- */

.zero   {font-family: 'Roboto', sans-serif;  font-size: 0.1%; color: none; line-height:0.1%;}

.gap5    {border-left: 0px solid; height: 5px; width: 0px;}
.gap10   {border-left: 0px solid; height: 10px; width: 0px;}
.gap20   {border-left: 0px solid; height: 20px; width: 0px;}
.gap40   {border-left: 0px solid; height: 40px; width: 0px;}
.gap60   {border-left: 0px solid; height: 60px; width: 0px;}
.gap80   {border-left: 0px solid; height: 80px; width: 0px;}
.gap100  {border-left: 0px solid; height: 100px; width: 0px;}


/* -------------- In und out unterschiedlicher Contents ---------------- */

/* Mid screens - schaltet bei Tablets aus: */
@media all and (max-width: 960px) {
        .displaynone_mid {
                display:none;
                }
}


/* Small screens - schaltet bei kleineren aus - bei größeren an: */
@media all and (max-width: 561px) {
        .displaynone {
                display:none;
                }
}



/*  ... schaltet bei kleineren ein
                 bei größeren  aus*/
@media all and (min-width: 560px) {
        .displaymob {
                display:none;
                }
}


/* Hyphens - schalten bei Mobiles aus:
@media all and (max-width: 860px) {
p,
.p_white,
.p_white_wide,
.p_gold,
.p_grey,
.p_padding,
.p_blank,
.anlauf,
.anlauf_hell
        {-moz-hyphens: none;
         -o-hyphens: none;
         -webkit-hyphens: none;
         -ms-hyphens: none;
         hyphens: none;
         }
}

                           */

.center {
       text-align:center;
}




@keyframes fadein{
        from{
        opacity:0;}to{opacity:1;}}
        @-moz-keyframes fadein{from{opacity:0;}to{opacity:1;}}
        @-webkit-keyframes fadein{from{opacity:0;}to{opacity:1;}}
        @-o-keyframes fadein{from{opacity:0;}to{opacity:1;}}