.top-nav {
	height:100%;
	margin:0 auto;
	max-width:900px;;
	}
.header-flex{
	display:flex;
	justify-content: space-between;
	height:100%;
	
	}
	
.header-flex #logo{
     height:100%;
	width:auto;
	}

.rvw-nav-btn {
	font-size:2em;
	cursor:pointer;
	color:var(--col-orange);
	min-width:120px;
	} 

.rvw-nav-btn:hover {
	color:var(--col-white);
	}

.porto-btn{
	background-color:var(--col-orange);
	padding:7px 20px;
	border:var(--col-white) solid 2px;
	border-radius:8px;
	color:var(--col-white);
	font-weight:800;
	}

.porto-btn:hover{
	background-color:var(--col-white);
	border:var(--col-orange) solid 2px;
	color:var(--col-orange);
	}


.overlay {
	  height: 100%;
	  width: 0;
	  position: fixed;
	  z-index: 1;
	  top: 0;
	  left: 0;
	  background-color: rgba(69, 71, 56, 0.9);
	  overflow-x: hidden;
	  transition: 0.5s;
	}

.overlay-content {
	position: relative;
	top: 10%;
	max-width: 100%;
	text-align: center;
	margin-top: 30px;
	}

.overlay a {
	padding: 8px;
	text-decoration: none;
	font-size: 2.5em;
	color:var(--col-orange);
	display: block;
	transition: 0.3s;
	}  

.overlay .active {  
	color:var(--col-white);
	background-color:var(--col-orange);
	}

.overlay .active::before { 
	content:">> ";
	color: var(--col-white);
	}


.overlay a:hover, .overlay a:focus {
	color:var(--col-white);
	background-color:var(--col-orange);
	}

.overlay .closebtn {
	position: absolute;
	top: 20px;
	right: 45px;
	font-size: 60px; 
	color:var(--col-orange);
	}

.overlay .closebtn:hover{
	background:transparent;
	color:var(--col-white);
	}

	.menu-header {
	color:var(--col-dark);
	} 

.menu-header:hover {
	color:var(--col-white);
	}

/* -------- achtkant Menu  --------  */  
.achtkant-hamb {
	padding:8px;
	min-width:60px;
	height:20px;
	margin-right: 0.3em;
	background-image:url('li-arrow-down.png');
	background-repeat: no-repeat;
	background-size:75%;
	background-position:5px 5px;
	}

.achtkant-menu{
	background:var(--col-light);
	text-align:center;
	max-width:100%;	
	position:relative;
	padding:10px;
	border-top-left-radius:20px;
	border-top-right-radius:20px;
	border-bottom-right-radius:20px;
	border-bottom-left-radius:20px;
	}

.achtkant-menu .menu-txt{
	font-size:1.25em;
	}		

.achtkant-nav{
	position:absolute;
	text-align:left;
	top:100%;
	left:0;	
	background:var(--col-light);
	width:100%;
	display:none;
	}	

.achtkant-nav ul {
	margin:0;
	padding:10px;
	list-style:none; 
	position:absolute;
	left:50px;
	width:50%;
	background:var(--col-dark);
	}

.achtkant-nav li {
	padding-left:10px;
	}

.achtkant-nav li:hover {
	background:var(--col-orange);
	color:var(--col-white);
	}	

.achtkant-nav a {
	color:var(--col-white);
	text-decoration:none;
	font-size:1.1rem;
	line-height: 2.5em;
	text-transform:uppercase;
	}

.achtkant-nav-toggle{
	display:none;
	}

.achtkant-nav-toggle-label span:hover{
	cursor:pointer; 
	}	

.achtkant-nav-toggle:checked ~ .achtkant-nav {
	display:block;
	}
/* -------- SCROLL BARS  --------  */

::-webkit-scrollbar {
	width: 20px;
	}

/* Track */
::-webkit-scrollbar-track {
	box-shadow: inset 0 0 5px var(--col-med); 
	border-radius: 10px;
	}

/* Handle */
::-webkit-scrollbar-thumb {
	background: var(--col-darkest); 
	border-radius: 10px;
	border:1px solid var(--col-orange);
	}

/* Handle on hover */
	::-webkit-scrollbar-thumb:hover {
	 background:var(--col-dark);
	}
/* -------- End SCROLL BARS  --------  */