﻿@charset "utf-8";

/**
 * Theme Name:     Furggler KG/Sas
 * Theme URI:      www.furggler.it
 * Description:    Sand und Schotter
 * Author:         Pircher Stefan
 * Author URI:     www.ps-design.it
 * Version:        1.0
 */

/* ============================
   > CONTENTS
   ==================
		> BODY, HTML
*/

/* ============================
   > BODY, HTML
   ================== */

body, html, input, button, textarea, select {
		font-family:var(--ikv_font_regular); font-size:18px;
		line-height:26px; color:var(--ikv_text_dark);
}

/* media-queries */


/* ============================
   > CSS-VARIABLES
   ================== */

:root {
		/* farbwerte */
		--furg_body:#ededed;
		--furg_blue:#009ad9;
		--furg_black:#000;
		--furg_white:#fff;
		/* schriften */
		--furg_font_light:'Roboto-Light', Arial, Helvetica, sans-serif;
		--furg_font_regular:'Roboto-Regular', Arial, Helvetica, sans-serif;
		--furg_font_medium:'Roboto-Medium', Arial, Helvetica, sans-serif;
}

/* ============================
   > FONT-EMBEDS
   ================== */

@font-face {
		font-family:'Roboto-Light';
		src:url('fonts/Roboto-Light.woff2') format('woff2');
}
@font-face {
		font-family:'Roboto-Regular';
		src:url('fonts/Roboto-Regular.woff2') format('woff2');
}
@font-face {
		font-family:'Roboto-Medium';
		src:url('fonts/Roboto-Medium.woff2') format('woff2');
}

/* ============================
   > PRELOADER
   ================== */

#preloader {
		position:fixed; z-index:1000;
		top:0; left:0; width:100%; height:100%;
}
#preloader .loader-section {
		position:fixed; z-index:1000;
		width:100%; height:50%;
		background-color:var(--furg_blue);
		-webkit-transform:translateX(0);
		-ms-transform:translateX(0);
		transform:translateX(0);
}
#preloader .logo, #preloader #loader {
		position:absolute; z-index:1001;
		transform:translate(-50%, -50%);
		top:50%; left:50%;
}
#preloader .logo {
		width:201px; height:53px; margin-top:-80px; display:none;
		background:url('images/furggler.svg') no-repeat center;
}
#preloader #loader {
		width:48px; height:48px; background-size:48px 48px;
		background:url('images/loading.svg') no-repeat center;
}
#preloader .loader-section.section-top { top:0; }
#preloader .loader-section.section-bottom { bottom:0; }

/* fully-loaded */
.loaded #preloader .loader-section.section-top {
		-webkit-transform:translateY(-100%);
				-ms-transform:translateY(-100%);
						transform:translateY(-100%);

		-webkit-transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
						transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #preloader .loader-section.section-bottom {
		-webkit-transform:translateY(100%);
				-ms-transform:translateY(100%);
						transform:translateY(100%);

		-webkit-transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
				transition:all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
}
.loaded #preloader #loader,
.loaded #preloader .logo {
		opacity:0;
		-webkit-transition:all 0.3s ease-out;
						transition:all 0.3s ease-out;
}
.loaded #preloader {
		visibility:hidden;
		-webkit-transition:all 0.3s 1s ease-out;
						transition:all 0.3s 1s ease-out;
}

/* js-turned-off */
.no-js #preloader {
		display:none;
}

/* ============================
   > FLEXBOX
   ================== */

.flex {
		display:-webkit-flex;
		display:-ms-flexbox;
		display:flex;
}

/* ============================
   > H/V CENTERING
   ================== */

.halign { left:50%; transform:translateX(-50%); }
.hvalign { top:50%; left:50%; transform:translate(-50%,-50%); }
.valign { top:50%; transform:translateY(-50%); }

/* ============================
   > HEADLINES
   ================== */

h1, h2 {
		font-family:var(--ikv_font_medium);
		line-height:111%; hyphens:auto;
		color:var(--ikv_text_dark);
}
h1 {
		font-size:36px;
		margin:0 0 24px;
}
h2 {
		font-size:22px;
		margin:0 0 10px;
}
body strong {
		font-family:var(--ikv_font_medium);
}

/* media-queries */
@media screen and (max-width: 480px) {
	
}

/* ============================
   > SECTIONS
   ================== */

section#top {
		background:var(--furg_white);
		display:flex; align-items:center;
		justify-content:center;
		height:100vh;
}
section#bottom {
		background:var(--furg_blue);
		display:flex; align-items:center;
		justify-content:center;
		height:100vh;
}
section#top img,
section#bottom img {
		max-width:100%;
		height:auto;
}

/* media-queries */
@media screen and (max-width: 480px) {
		section#top {
				/*background:var(--furg_white);*/
		}
}



