@media screen and (min-width: 600px) {
	.outer-menu {
		display: none
	}
}

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

	.flex-center {display: flex;align-items: center;justify-content: center;}
	* {box-sizing: border-box;}
	a,a:visited,a:hover,a:active {color: inherit;text-decoration: none;}



	.outer-menu {
	  position: fixed;
	  top: 10vh;
	  left: 0;
	  z-index: 1;
	}
	.outer-menu .checkbox-toggle {
	  position: absolute;
	  top: 0;
	  left: 0;
	  z-index: 2;
	  cursor: pointer;
	  width: 60px;
	  height: 60px;
	  opacity: 0;
	}
	.outer-menu .checkbox-toggle:checked + .hamburger > div {
	  transform: rotate(135deg);
	}
	.outer-menu .checkbox-toggle:checked + .hamburger > div:before,
	.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
	  top: 0;
	  transform: rotate(90deg);
	}
	.outer-menu .checkbox-toggle:checked + .hamburger > div:after {
	  opacity: 0;
	}
	.outer-menu .checkbox-toggle:checked ~ .menu {
	  pointer-events: auto;
	  visibility: visible;
	}
	.outer-menu .checkbox-toggle:checked ~ .menu > div {
	  transform: scale(1);
	  transition-duration: 0.75s;
	}
	.outer-menu .checkbox-toggle:checked ~ .menu > div > div {
	  opacity: 1;
	  transition: opacity 0.4s ease 0.4s;
	}
	.outer-menu .checkbox-toggle:hover + .hamburger {
	  box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.1);
	}
	.outer-menu .checkbox-toggle:checked:hover + .hamburger > div {
	  transform: rotate(225deg);
	}
	.outer-menu .hamburger {
	  position: absolute;
	  top: 0;
	  left: 0;
	  z-index: 1;
	  width: 60px;
	  height: 60px;
	  padding: 0.5em 1em;
	  
	  /*background: rgba(33, 150, 243, 0.75);*/
	  background: rgba(33, 37, 41, 0.75);
	  
	  border-radius: 0 0.12em 0.12em 0;
	  cursor: pointer;
	  transition: box-shadow 0.4s ease;
	  -webkit-backface-visibility: hidden;
			  backface-visibility: hidden;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.outer-menu .hamburger > div {
	  position: relative;
	  flex: none;
	  width: 100%;
	  height: 2px;
	  background: #fff;
	  transition: all 0.4s ease;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.outer-menu .hamburger > div:before,
	.outer-menu .hamburger > div:after {
	  content: '';
	  position: absolute;
	  z-index: 1;
	  top: -10px;
	  left: 0;
	  width: 100%;
	  height: 2px;
	  background: inherit;
	  transition: all 0.4s ease;
	}
	.outer-menu .hamburger > div:after {
	  top: 10px;
	}
	.outer-menu .menu {
	  position: fixed;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100%;
	  pointer-events: none;
	  visibility: hidden;
	  overflow: hidden;
	  -webkit-backface-visibility: hidden;
			  backface-visibility: hidden;
	  outline: 1px solid transparent;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.outer-menu .menu > div {
	  width: 200vw;
	  height: 200vw;
	  color: #fff;
	  background: rgba(0, 0, 0, 0.97);
	  border-radius: 50%;
	  transition: all 0.4s ease;
	  flex: none;
	  transform: scale(0);
	  -webkit-backface-visibility: hidden;
			  backface-visibility: hidden;
	  overflow: hidden;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.outer-menu .menu > div > div {
	  text-align: center;
	  max-width: 90vw;
	  max-height: 100vh;
	  opacity: 0;
	  transition: opacity 0.4s ease;
	  overflow-y: auto;
	  flex: none;
	  display: flex;
	  align-items: center;
	  justify-content: center;
	}
	.outer-menu .menu > div > div > ul {
	  list-style: none;
	  padding: 0 1em;
	  margin: 0;
	  display: block;
	  max-height: 100vh;
	}
	.outer-menu .menu > div > div > ul > li {
	  padding: 0;
	  margin: 1em;
	  font-size: 24px;
	  display: block;
	}
	.outer-menu .menu > div > div > ul > li > a {
	  position: relative;
	  display: inline;
	  cursor: pointer;
	  transition: color 0.4s ease;
	}
	.outer-menu .menu > div > div > ul > li > a:hover {
	  color: #e5e5e5;
	}
	.outer-menu .menu > div > div > ul > li > a:hover:after {
	  width: 100%;
	}
	.outer-menu .menu > div > div > ul > li > a:after {
	  content: '';
	  position: absolute;
	  z-index: 1;
	  bottom: -0.15em;
	  left: 0;
	  width: 0;
	  height: 2px;
	  background: #e5e5e5;
	  transition: width 0.4s ease;
	}
	
	#sub_text {display:none;}
}	
	
#sub_text{
	font-size:14px;
	font-weight:bold;
}


img {
  width: 100%;
  height: 100%;
}

.bg-black {
  background: #000;
}

body {
  background-color: #666;
}

.text-info { 
	display: none;
} 	


.iconic {color: #fff;}
.iconic:hover{color: orange;}