/**
* Theme Name: Liber Brands + Design, Andreas Wastian, yootheme Child
* Description: This is a child theme of yootheme.
* Author: <a href="https://www.liber.at/">Andreas Wastian</a>
* Template: yootheme
* Version: 1.0.0
*/



/* Webfont: Libesk-Black */
@font-face {
    font-family: 'LiberBlack';
    src: url('fonts/Libesk-Heavy.woff2') format('woff2'), /* Modern Browsers */
         url('fonts/Libesk-Heavy.woff') format('woff'); /* Modern Browsers */
    font-style: normal;
    font-weight: normal;
    font-feature-settings: "kern" 1, "onum" 1, "pnum" 1, "ss01" 1;
}

/* Webfont: Libesk-Extrabold */
@font-face {
    font-family: 'LiberBold';
    src: url('fonts/Libesk-ExtraBold.woff2') format('woff2'); /* Modern Browsers */
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

/* Webfont: Libesk-Regular */
@font-face {
    font-family: 'LiberRegular';
    src: url('fonts/libeskregular-webfont.woff2') format('woff2'), /* Modern Browsers */
         url('fonts/libeskregular-webfont.woff') format('woff'); /* Modern Browsers */
             font-style: normal;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

/* Webfont: Libesk-Thin */
@font-face {
    font-family: 'LiberThin';
    src: url('fonts/libeskextralight-webfont.woff2') format('woff2'), /* Modern Browsers */
         url('fonts/libeskextralight-webfont.woff') format('woff'); /* Modern Browsers */
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}


/* Webfont: Default Liber Serif */
@font-face {
    font-family: 'LiberSerif';
    src: url('fonts/libaserif_regular-webfont.woff2') format('woff2'), /* Modern Browsers */
         url('fonts/libaserif_regular-webfont.woff') format('woff'); /* Modern Browsers */
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    text-rendering: optimizeLegibility;
}

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

html {font-size: 0.86em !important;}

}



/* NAV Start important Carlos Line-Effect Menue Hover */
.uk-nav-primary a, .uk-nav-primary a:visited { border-bottom: 1px solid rgba(255, 255, 255, 0.1);  display: block;  -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.uk-nav-primary a:hover { border-bottom: 1px solid rgba(73, 73, 73, 0.1);   -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }

.uk-nav-primary li a { padding: 0px 0px; position: relative; }
.uk-nav-primary li a:hover { color: #000;}
.uk-nav-primary li a:before { content: ""; position: absolute; width: 100%; height: 2px; bottom: 0; left: -50%; background-color: #000; visibility: hidden;  -webkit-transform: scaleX(0); transform: scaleX(0); -webkit-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.uk-nav-primary li a:hover:before { visibility: visible;  -webkit-transform: scaleX(1);  transform: scaleX(1); }

/* NAV End important Carlos Line-Effect */


/* Message Start oben rechts Carlos  */
.messagetop { display: flex; text-align: right; background:#F9F9F8; color:#999; position: absolute; top: -473px; left: 0; width: 100%; height: 473px;
padding: 43px 0 20px 0; transition: top 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94); overflow: hidden; box-sizing: border-box; z-index:986; }

.messagetop h2 { font-family:LiberThin, sans-serif; font-size: 22px;  color:#282726; text-align: left; line-height: 1.4;}

#toggle { appearance:none;  cursor:pointer; float:right; z-index: -1; position: absolute; right: 5000px;}

#toggle + label {  font-family: LiberBlack, sans-serif; display: none; position:absolute; right:0; cursor:pointer; background: rgba(0,0,0,0.0);
width: 47px; border-radius: 0px 0px 0px 2px; padding: 0px 0px 4px 0px; color: #000; line-height:28px; font-size:29px; text-align:center; margin:0px 0px 0px 0px; transition:all 300ms ease; z-index:1;}

#toggle + label:after { content:"+" }

#toggle + label:hover { background: rgba(255,255,255,1); color:#000;}

.container { text-align:right; transition: margin 300ms cubic-bezier(0.17, 0.04, 0.03, 0.94);  /*padding:5em 3em;*/}

#toggle:checked ~ .messagetop { top: 0; border-bottom: 0px solid #F60;}

#toggle:checked ~ .container {   margin-top: 473px;}

#toggle:checked + label {  background:#F60; color:#fff; }

#toggle:checked + label:after { content:"\2013"; color:#fff;}

 .messagetop a[href^="tel:"]::before { content: "\260E"; font-family: LiberBlack, sans-serif; margin-right: 0.5em; font-size:1.07em;}
 .messagetop a:hover[href^="tel:"]::before {content: "\260F"; }

 .messagetop a[href^="mailto:"]:after {content: "\E119"; font-family: LiberBlack, sans-serif;margin-left: 0.5em; font-size:1.07em;}
 .messagetop a:hover[href^="mailto:"]:after {content: "\E122"; } 

@media only screen and (max-width: 640px) {
	
    .messagetop h2 {font-size: 18px; }
}

@media only screen and (min-width: 560px) {
    
    #toggle + label { display: block;}   
}


@media only screen and (min-width: 960px) {
	    
    .messagetop h2 {font-size: 25px; }
}


/* Message Ende oben rechts Carlos  */