/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : Oct 8, 2020, 12:06:36 PM
    Author     : sions
*/
:root {
  --main-font: 'Ysabeau Infant';
  --color-pathline-background: #333;
  --color-pathline-color: white;
  --color-header-background: var(--color-dark-black);
  --color-header-text: var(--color-white);
  --color-header-link: var(--color-white);
  --color-background: var(--color-dark-white);
  --color-text: var(--color-black);
  --color-text-link: var(--color-black);
  --color-text-strong: var(--color-black);
  --color-copyright-background: var(--color-dark-black);
  --color-copyright-text: var(--color-white);
  --color-copyright-link: var(--color-green);
  --color-footer-background: var(--color-black);
  --color-footer-text: var(--color-white);
  --color-footer-link: var(--color-dark-white);
  
  --color-green: #95C22B;
  --color-dark-green: #676e67;
  --color-dark-black: rgb(0, 0, 0);
  --color-black: #343b33;
  --color-dark-black: #19250d;
  --color-light-black: #666;
  --color-dark-gray: #A1A1A1;
  --color-light-gray: #CBCBCB;
  --color-dark-white: #f6fff1;
  --color-white: #ffffff;
  --color-blue: #334049;
  --color-blue-transparent: rgba(44, 48, 48, 0.92);
  --color-light-blue: #687177;
  --color-orange: #F9B343;
  --color-gold: #E7B549;
  --color-yellow: #FFFF00;
}

@keyframes showing {
 0%{
  display:block;
  opacity:0;
 }
 100% {
  opacity:1;
 }
}
@-webkit-keyframes bounce-center { 
            0%, 20%, 50%, 80%, 100% {-webkit-transform: translateX(-50%) translateY(0);} 
            40% {-webkit-transform: translateX(-50%) translateY(-30px);} 
            60% {-webkit-transform: translateX(-50%) translateY(-15px);} 
}
@keyframes expand{
   0%{height:0px}
   100%{height:100%} 
}
@-webkit-keyframes expand{
    0%{height:0px}
    100%{height:100%}
}
@keyframes xexpand{
   0%{width:0px}
   100%{width:100%} 
}
@-webkit-keyframes xexpand{
    0%{width:0px}
    100%{width:100%}
}
@keyframes xexpand-custom{
   0%{width:0px}
   100%{width:calc( 100% - 42px )} 
}
@-webkit-keyframes xexpand-custom{
    0%{width:0px}
    100%{width:calc( 100% - 42px )}
}
@keyframes yexpand{
   0%{ height:0px; opacity:0; }
   100%{ height:100%; opacity:1; } 
}
@-webkit-keyframes yexpand{
    0%{ height:0px; opacity:0; }
    100%{ height:100%; opacity:0; }
}
@keyframes fading{
   0%{opacity:0}
   100%{opacity:1} 
}
@-webkit-keyframes fading{
    0%{opacity:0}
    100%{opacity:1}
}
@keyframes bounce-center { 
            0%, 20%, 50%, 80%, 100% {transform: translateX(-50%) translateY(0);} 
            40% {transform: translateX(-50%) translateY(-30px);} 
            60% {transform: translateX(-50%) translateY(-15px);} 
}

@-webkit-keyframes bounce-left { 
            0%, 20%, 50%, 80%, 100% {transform: translateX(0);} 
            40% {transform: translateX(30px);} 
            60% {transform: translateX(15px);} 
}
@keyframes bounce-left { 
            0%, 20%, 50%, 80%, 100% {transform: translateX(0);} 
            40% {transform: translateX(30px);} 
            60% {transform: translateX(15px);} 
}

@-webkit-keyframes skew-center { 
            0% {transform: translateX(-50%) skew(0deg);} 
            100% {transform: translateX(-50%) skew(-45deg);}  
}
@keyframes skew-center { 
            0% {transform: translateX(-50%) skew(0deg);} 
            100% {transform: translateX(-50%) skew(-45deg);} 
}

@-webkit-keyframes rotate { 
            0% {transform: rotate(0deg);} 
            100% {transform: rotate(360deg);} 
}
@keyframes rotate { 
            0% {transform: rotate(0deg);} 
            100% {transform: rotate(360deg);} 
} 

@-webkit-keyframes rotate-vertical { 
            0% {transform: translateY(-50%) rotate(0deg);} 
            100% {transform: translateY(-50%) rotate(360deg);} 
}
@keyframes rotate-vertical { 
            0% {transform: translateY(-50%) rotate(0deg);} 
            100% {transform: translateY(-50%) rotate(360deg);} 
} 
@-webkit-keyframes zooming { 
            0% {transform: scale(0.75);} 
            50% {transform: scale(1);} 
            75% {transform: scale(1.25);}
            100% {transform: scale(1);} 
}
@keyframes zooming { 
            0% {transform: scale(0.75);} 
            50% {transform: scale(1);} 
            75% {transform: scale(1.25);}
            100% {transform: scale(1);}   
} 

@-webkit-keyframes zooming-in-out-center { 
            0% {transform: translate(-50%,-50%) scale(1.5);} 
            25% {transform: translate(-50%,-50%) scale(1.25);} 
            50% {transform: translate(-50%,-50%) scale(1);} 
            75% {transform: translate(-50%,-50%) scale(1.25);}
            100% {transform: translate(-50%,-50%) scale(1.5);} 
}
@keyframes zooming-in-out-center { 
            0% {transform: translate(-50%,-50%) scale(1.5);} 
            25% {transform: translate(-50%,-50%) scale(1.25);} 
            50% {transform: translate(-50%,-50%) scale(1);} 
            75% {transform: translate(-50%,-50%) scale(1.25);}
            100% {transform: translate(-50%,-50%) scale(1.5);}   
} 

@-webkit-keyframes zooming-out-in-center { 
            0% {transform: translate(-50%,-50%) scale(1);} 
            25% {transform: translate(-50%,-50%) scale(1.25);} 
            50% {transform: translate(-50%,-50%) scale(1.5);} 
            75% {transform: translate(-50%,-50%) scale(1.25);}
            100% {transform: translate(-50%,-50%) scale(1);} 
}
@keyframes zooming-out-in-center { 
             0% {transform: translate(-50%,-50%) scale(1);} 
            25% {transform: translate(-50%,-50%) scale(1.25);} 
            50% {transform: translate(-50%,-50%) scale(1.5);} 
            75% {transform: translate(-50%,-50%) scale(1.25);}
            100% {transform: translate(-50%,-50%) scale(1);}    
} 

@keyframes shake {
  30%, 70% {
    transform: translate3d(-1px, 0, 0);
  }
  
  40%, 60% {
    transform: translate3d(2px, 0, 0);
  }

  45%, 50%, 55% {
    transform: translate3d(-4px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(4px, 0, 0);
  }
}

@font-face {
    font-family: 'Arodora Pro';
    src: url('/fonts/arodora-pro/ArodoraPro-Light.eot');
    src: url('/fonts/arodora-pro/ArodoraPro-Light.eot?#iefix') format('embedded-opentype'),
        url('/fonts/arodora-pro/ArodoraPro-Light.woff2') format('woff2'),
        url('/fonts/arodora-pro/ArodoraPro-Light.woff') format('woff'),
        url('/fonts/arodora-pro/ArodoraPro-Light.ttf') format('truetype'),
        url('/fonts/arodora-pro/ArodoraPro-Light.svg#ArodoraPro-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    /* font-display: swap; */
}

@font-face {
    font-family: 'Arodora Pro';
    src: url('/fonts/arodora-pro/ArodoraPro-LightItalic.eot');
    src: url('/fonts/arodora-pro/ArodoraPro-LightItalic.eot?#iefix') format('embedded-opentype'),
        url('/fonts/arodora-pro/ArodoraPro-LightItalic.woff2') format('woff2'),
        url('/fonts/arodora-pro/ArodoraPro-LightItalic.woff') format('woff'),
        url('/fonts/arodora-pro/ArodoraPro-LightItalic.ttf') format('truetype'),
        url('/fonts/arodora-pro/ArodoraPro-LightItalic.svg#ArodoraPro-LightItalic') format('svg');
    font-weight: 300;
    font-style: italic;
    /* font-display: swap; */
}

@font-face {
  font-family: 'Ysabeau Infant';
  src: url('/fonts/ysabeau_infant/static/YsabeauInfant-Regular.ttf');
  src: url('/fonts/ysabeau_infant/static/YsabeauInfant-Regular.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  /* font-display: swap; */
}

@font-face {
  font-family: 'Ysabeau Infant';
  src: url('/fonts/ysabeau_infant/static/YsabeauInfant-Italic.ttf');
  src: url('/fonts/ysabeau_infant/static/YsabeauInfant-Italic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  /* font-display: swap; */
}