/* CLEARFIX */



.cf:before,

.cf:after {

    content: " ";

    display: table;

}



.cf:after {

    clear: both;

}



.cf {

    *zoom: 1;

}



.sf{

	width:50px;

	padding-left:1em;

}



/* ALL */



@keyframes click {	

	0%   {background-color: #d5ebf500;}

	50%  {background-color: #d5ebf5FF;}

	100% {background-color: #d5ebf500;}

}





.row{

	-webkit-box-sizing: border-box;

	-moz-box-sizing: border-box;

	box-sizing: border-box;

	float:right;

	cursor:pointer;

	padding: 0 1.0em 0 0;

	display: flex;

    align-items: center;

    justify-content: center;

}

.row .is-active{

 	border-radius:50%;

	animation: click 300ms;

}







.hamburger{

	

}

.hamburger:hover{

  cursor: pointer;

}

.hamburger:hover .line{

	box-shadow: var(--shadow_1);

}



.hamburger .line{

  width: 50px;

  height: 5px;



  /*background-color: #ecf0f1;*/



  display: block;

  margin: 8px auto;

  border-radius: 25%;

  -webkit-transition: all 0.3s ease-in-out;

  -o-transition: all 0.3s ease-in-out;

  transition: all 0.3s ease-in-out;

  box-shadow: var(--shadow_2);

}



.hamburger .line_1{

	/*

	background-color: var(--color_scheme_1_light-Secondary);

	*/

}

.hamburger .line_2{

	/*

	background-color: var(--color_scheme_1_light-Secondary);

	*/

}

.hamburger .line_3{

	/*

	background-color: var(--color_scheme_1_light-Secondary);

	*/

}



.is-visible{

	display:block!important;

}

.is-hidden{

	display:none!important;

}



/* HAMBURGER ID #1 */



#hamburger-1.is-active .line:nth-child(2){

  opacity: 0;

}

#hamburger-1.is-active .line:nth-child(1){

  -webkit-transform: translateY(13px) rotate(45deg);

  -ms-transform: translateY(13px) rotate(45deg);

  -o-transform: translateY(13px) rotate(45deg);

  transform: translateY(13px) rotate(45deg);

}

#hamburger-1.is-active .line:nth-child(3){

  -webkit-transform: translateY(-13px) rotate(-45deg);

  -ms-transform: translateY(-13px) rotate(-45deg);

  -o-transform: translateY(-13px) rotate(-45deg);

  transform: translateY(-13px) rotate(-45deg);

}



/* ROTAR - mobile menu links annimation */



@keyframes rotation {

from {

  transform: rotateY(90deg) rotateZ(10deg);

  opacity: 0;

}

to {

  transform: rotateY(0deg) rotateZ(0deg);

  opacity: 1;

}

}



.nav_m{

	opacity:0;

}

.rotar_delay_1 {

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 0ms;

}



.rotar_delay_2{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 100ms;

}

.rotar_delay_3{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 200ms;

}

.rotar_delay_4{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 400ms;

}

.rotar_delay_5{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 600ms;

}

.rotar_delay_6{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 800ms;

}

.rotar_delay_7{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 1000ms;

}

.rotar_delay_8{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 1200ms;

}

.rotar_delay_9{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 1400ms;

}

.rotar_delay_10{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 1600ms;

}

.rotar_delay_11{

	transform-origin: right;

	animation: rotation 1500ms;

	animation-fill-mode: forwards;

	animation-delay: 1800ms;

}



@keyframes fall {

from {

  transform: translate(0,-100px);

  opacity: 0;

}

to {

  transform: translate(0,0);

  opacity: 1;

}

}



.navigation_toggle{

	position:absolute;

	box-sizing:border-box;

	z-index: 999;

	min-width:150px;

	width: 33%;

	margin-top:0.4em;



	float:right;

	right:0px;

	

	background:#20272E;

	height: 100vh;

	padding: 1em;

}



.page_line_nav{

	position:absolute;

	box-sizing:border-box;

	z-index: 999;

	min-width:150px;

	width: 33%;

	height:0.5em;

	top:3em;

	float:right;

	right:0px;

}





.nav_mobile{

	margin-top: 1em;

}



.nav_mobile li a{

	color:white;

	text-decoration:none;

	display: block;

	padding: .5em;

	font-size: 1.3em;

	text-align: right;

	

	white-space: nowrap;

	

		

	font-family:arial;

	/* 

    font-variant:small-caps;

	*/

	text-transform: uppercase;

	font-size:large;

	font-weight:800;

	

	

}



.nav_mobile li a:hover{

	font-weight:1200;

	color:var(--clr3);

	transition: all ease-in-out 0.6s;

}



.nav_mobile_current{

	color:var(--clr3)!important;

}

.nav_mobile_current:after {

    border-right: solid 6px var(--clr4)!important;

	content: '';

	display: block;

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	animation: fall 1500ms;

	animation-fill-mode: forwards;

	}



/* For mobile only */

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

	.navigation_desktop ul {

		display:none;

	}

}



/* For desktop only */

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

  



}