/*
Theme Name: RealGreen Award 2025
Version: 1.0
Template: kalium
Text Domain: kalium
*/

/* Theme customization starts here
-------------------------------------------------------------- */


/* --- ALLGEMEIN --- */

/* source-sans-3-regular - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/source-sans-3-v19-latin-regular.eot'); /* IE9 Compat Modes */
  src: url('fonts/source-sans-3-v19-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/source-sans-3-v19-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/source-sans-3-v19-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/source-sans-3-v19-latin-regular.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/source-sans-3-v19-latin-regular.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

/* source-sans-3-900 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 900;
  src: url('fonts/source-sans-3-v19-latin-900.eot'); /* IE9 Compat Modes */
  src: url('fonts/source-sans-3-v19-latin-900.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/source-sans-3-v19-latin-900.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('fonts/source-sans-3-v19-latin-900.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
       url('fonts/source-sans-3-v19-latin-900.ttf') format('truetype'), /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
       url('fonts/source-sans-3-v19-latin-900.svg#SourceSans3') format('svg'); /* Legacy iOS */
}

html, body {
    min-height: 100% !important;
    height: 100%;
}

body {
    text-align: left;
    margin: 0px;
    padding: 0px;
}

body, p, a {
    font-family: 'Source Sans Pro', sans-serif;
    font-weight: 900;
    font-size: 18px;
    color: #333333;
}

/* --- HAUPTINHALTE --- */

#seitenraender {
    text-align: center;
}

#seitenraender {
    position: relative;
    width: 100%;
    height: 100%;
    padding: 0px;
}

#seite {
    width: 100vw;
    height: 100%;
    margin: 0 auto;
    padding: 0px 0px 0px 0px;
}

#main {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center; 
    height: 85vh;
}

#seitenraender img.logo-img {
    position: absolute;
    width: 10vw;
    height: auto;
    top: 4vh;
    left: 2vw;
}

#main img {
    max-width: 50vw;
    height: auto;
    max-height: 70vh;
}
  
.gruen {
    color: #b3c135;
    padding-left: 6px;
    padding-right: 6px;
}


/* --- FOOTER --- */

#unten {
    position: relative;
    width: 100%;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    height: 15vh;
}



/* --- RETINA ----------------------------------------------------------------------------------------------------- */

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { 
   /* Retina-specific stuff here */

}



/* --- RESPONSIVE ------------------------------------------------------------------------------------------------- */


@media only screen and (min-width: 2501px) {

}

@media only screen and (min-width: 2201px) and (max-width: 2600px) {

}

@media only screen and (min-width: 1601px) and (max-width: 2200px) {

}

@media only screen and (min-width: 1401px) and (max-width: 1600px) {

}

@media only screen and (min-width: 1261px) and (max-width: 1400px) {

}



/* ==============================================================================================================================
/*
/* 	#Desktop Notebook	<= 1260
/* 
/* =========================================================================================================================== */

@media only screen and (max-width: 1260px) {

}


/* ==============================================================================================================================
/*
/* 	#Browserfenster kleiner	<= 1200
/* 
/* =========================================================================================================================== */

@media only screen and (max-width: 1200px) {

}


/* ==============================================================================================================================
/*
/* 	#Tablet (Portrait) & Mobile	<= 1000			OR Smartphone (Landscape)
/* 
/* =========================================================================================================================== */

@media only screen and (max-width: 1000px), only screen and (max-device-width: 844px) and (orientation: landscape) {

    #seitenraender img.logo-img {
        width: 16vw;
    }

    #main img {
         max-width: 80vw;
    }
  
}


/* ==============================================================================================================================
/*
/* 	#Mobile (Landscape)	<= 740																			#Mobile (Portrait)	< 480
/* 
/* =========================================================================================================================== */

@media only screen and (max-device-width: 740px) and (orientation: landscape) {

}


/* ==============================================================================================================================
/*
/* 	#Mobile (Portrait)	<= 540																			#Mobile (Portrait)	< 480
/* 
/* =========================================================================================================================== */

@media only screen and (max-width: 540px) {

    #main {
  	height: 85vh;
  	height: 60vh;
    }
  
    #main img {
  	margin-top: 15vh;
    }
  
    #unten {
  	height: 15vh;
    }
  
    #unten p {
  	padding-left: 20px;
  	padding-right: 20px;
    }
  
    #seitenraender img.logo-img {
        width: 20vw;
    }

    #main img {
        max-width: 90vw;
    }
  
}


@media only screen and (max-width: 375px) {

}


@media only screen and (max-width: 320px) {

}