/* MENU TOGGLE*/

#mainmenu {
  height:60px;
  z-index:15;
}

#mainmenu ul{
  display:none;
}

#mainmenu:hover label, .searchtoggle:hover, .tooltoggle:hover  {
  background-color:#2991D6;
}

label.menu-toggle {
  position:relative;
  display:block;
  cursor: pointer;
  color:white;
  padding:9px;
  height:32px;
  width:32px;
  background-image:url("../images/menu.png");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  z-index:4;
}

label.searchtoggle, label.tooltoggle{
  position:relative;
  display:block;
  cursor: pointer;
  height:50px;
  width:50px;
}

label.tooltoggle{
}

.menu-toggle:hover, label.close:hover {
  background-color:#2991D6;
}

ul.menu {
  display:flex;
  flex-direction:row;
  flex-wrap:wrap;
  flex-basis:100%;
  font-size:90%;
  justify-content:center;
}

#hidecheckbox{
  position:absolute;
  top:0;
  left:0px;
  width:100%;
  }


#hidecheckbox input, input.searchtoggle, input.tooltoggle {
  position:absolute;
  left:0;
  top:-40px;
}

img.headerlogo {
  position:absolute;
  display:block;
  right:10px;
  top:10px;
  width:60px;
  height:60px;
  border-top-left-radius:100%;
  border-top-right-radius:100%;
  padding:5px!important;
  background:#fff;
}

/* TOGGLE Default State */

#menu-toggle {
  display:none;
  position:relative;
  flex-direction:column;
  top:60px;
  left:0;
  min-height:800px;
  padding:0;
  color:#fff;
  background-color:#fff;
  z-index:20;
}

#search-toggle {	
	display:none;
  position:fixed;
  left:0;
  top:60px;
	padding:0;
	background:#fff;
	width:100%;
	z-index:50;
	border-bottom:1px solid #e5e5e5;
}
    
#search-toggle label{
  display:block;
  font-family:Open Sans, Tahoma, sans;
  padding-bottom:20px;
}

.searchtoggle img, .tooltoggle img {
	position:relative;
  z-index:50;
  padding:12px;
	height:26px;
	cursor:pointer;
}

.subtoggle {
  display:block;
  padding:10px;
  text-align:center;
  color:#000;
  background:#fff;
  z-index:20;
}


/* Toggled State */

label.close {
  cursor: pointer;
  position:relative;
  top:-60px;
  left:0;
  margin-bottom:-25px;
  width: 32px;
  height: 32px;
  padding:9px;
  opacity: 1;
  background-color:#005F7F;
}

label.close:before, label.close:after {
  cursor: pointer;
  position:absolute;
  left: 24px;
  content: '';
  height: 33px;
  width: 2px;
  background-color: #fff;
}
label.close:before {
  transform: rotate(45deg);
}
label.close:after {
  transform: rotate(-45deg);
}

#tools{
  display:none;
}

input[type=checkbox]:checked ~ #menu-toggle {
  display:flex;
}

input[type=checkbox]:checked ~ #search-toggle {
  display:block;
}

input[type=checkbox]:checked ~ #tools {
   display:block;
   position:fixed;
   top:50px;
   padding:30px 0px;
   background:#fff;
   z-index:100;
   border-bottom:3px solid #e5e5e5;
   width:calc(100% - 20px);
   text-align:center;
}

footer .item {
  flex-basis:100%;
  margin:0px;
  padding:25px;
  border-bottom:1px solid #808080;
  display:block;
}


img.logos {
  height:80px;
  width:80px;
  border-radius:80px;
  margin:10px!important;
  margin-top:0;
  border:0;
}

#copyright{
  text-align:center;
  padding:40px 20px;
  width:100%;
  color:#fff;
  font-family:Open Sans, Tahoma, sans;
  background-color:#000;
}

.SearchTitle {
	display:inline-block;
	padding:40px 10px;
	width:calc(100% - 20px);
	border:0px;
	text-align:left;
}

/************* MEDIA ********************/  
    
    @media (min-width: 480px) {
      
        #mainmenu{
          left:auto;
          margin-left:-10px;
        }
		
        label.menu-toggle, label.close {
          padding:14px;
        }
		
        .searchtoggle img, .tooltoggle img {
          padding:17px;
        } 
        
        img.headerlogo{
          top:10px;
          width:80px;
          height:80px;
          right:40px;
        }
        
        .SearchTitle{
          padding:40px;
          margin-left:20px;
          width:calc(100% - 120px);
        }
        
        label.close{
          left:30px;
        }
		
        label.close:before, label.close:after {
          left: 29px;
        }
        
        label.searchtoggle, label.tooltoggle {
          width:60px;
          height:60px;
        }
        
        input[type=checkbox]:checked ~ #tools {
          top:60px;
          padding:60px 0px;
          width:calc(100% - 80px);
          max-width:640px;
        } 
	}
	
	@media (min-width: 768px) {
        
        .order{
          order:5;
        }
        
        #hidecheckbox{
          position:relative;
          left:auto;
          max-width:100%;
        }
        
        #menu-toggle {
          display:flex;
          flex-flow:row nowrap;
          position:relative;
          min-height:60px;
          top:0;
          max-width:500px;
          background-color:transparent;
          color:#fff;
        }

        .subtoggle {
          width:auto;
          display:inline-block;
          background:transparent;
          padding:19px 0px;
        }
        
        .subtoggle:hover{
          cursor:pointer;
        }
        
        ul.menu{
          display:none;
        }
        
        #mainmenu:hover ul, .subtoggle:hover ul{
					position:absolute;
          display:flex;
          flex-direction:column;
          background:#f5f5f5;
          color:#404040;
          border:1px solid #e5e5e5;
          z-index:60;
        }
        
        .subtoggle:hover ul{
          margin-top:19px;
        }
		
        label.close{
          display:none;
        }

        img.headerlogo {
          right:40px;
        }
        
        .SearchTitle{
          padding-top:60px;
        }
        
        .right #tools {
          position:relative;
          display:block;
          max-width:none;
          width:100%;
          top:auto;
          padding:0;
          margin-top:-10px;
        }
	}
	
	@media (min-width: 1228px) {
        
        footer .item{
          flex-basis:20%;
          border-bottom:0;
          border-right:1px solid #808080;
        }
        
        #search-toggle{
          left:auto;
          margin-left:-60px;
          max-width: 1242px;
        }
        
        label.tooltoggle{
          display:none;
        }
        
        #tools, input[type=checkbox]:checked ~ #tools {
          position:relative;
          display:block;
          max-width:none;
          width:auto;
          top:auto;
          padding:0;
        }
		
		img.headerlogo{
          width:75px;
          height:75px;
          right:auto;
          margin-left:-140px;
		}
        
        .footer_part, .footer_part_right {
          float:left;
          width:95%;
          min-height:120px;
          border-right:0px;
          border-bottom:1px solid #e5e5e5;
          padding-bottom:20px;
        }
        
        .footer_part_right {
          margin-right:0px;
          border-bottom:0px;
        }
    }