input[type=submit]{
	height: 35px;
	font-size: 16px;
	font-weight: bold;
	font-family: 'Roboto';
	text-transform: uppercase;
	color: #696666;
	background-size: 25px 50px;
	border-radius: 10px;
	border: 3px solid #F9C23C;
	cursor: pointer;
	transition: all 0.3s ease 0s;
  }
  input[type="submit"]:hover {
	  color: #fff;
	  background-color: #EAA502;
	  border-color: #EAA502;
	  -webkit-transition: all 0.3s ease;
	  -ms-transition: all 0.3s ease;
	  transition: all 0.3s ease;
  }
  input[type="submit"]:focus {
	  background-position: 2em -4em;
	  -webkit-transition: all 0.3s ease;
	  -ms-transition: all 0.3s ease;
	  transition: all 0.3s ease;
  }

  /* Webfonts */
  
  @font-face {
	  font-family: 'Open Sans';
	  font-style: normal;
	  font-weight: 700;
	  src: local('Open Sans Bold'), local('OpenSans-Bold'), url(https://themes.googleusercontent.com/static/fonts/opensans/v8/k3k702ZOKiLJc3WVjuplzHhCUOGz7vYGh680lGh-uXM.woff) format('woff');
  }
  @font-face {
	font-family: "UTM-Avo";
	src: url("https://sanpham.starglobal3d.com/managements/css/utm-avo/UTMAvo-Bold.ttf") format("truetype");
	font-weight: bold;
	font-style: bold;
  }
  
  .myAudio{
	  display:none;
  }
  
  HTML SCSSResult Skip Results Iframe
  EDIT ON
  body {
	  font-family: sans-serif;
	  background-color: #81d4fa;
	  font-weight: bold;
  }
  
  .text-box {
	  margin-left: 44vw;
	 margin-top: 42vh;
  }
  
  .btn:link,
  .btn:visited {
	  text-transform: uppercase;
	  text-decoration: none;
	  padding: 15px 40px;
	  display: inline-block;
	  border-radius: 100px;
	  transition: all .2s;
	  position: absolute;
  }
  
  .btn:hover {
	  transform: translateY(-3px);
	  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
  }
  
  .btn:active {
	  transform: translateY(-1px);
	  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  }
  
  .btn-white {
	  background-color: #fff;
	  color: #777;
  }
  
  .btn::after {
	  content: "";
	  display: inline-block;
	  height: 100%;
	  width: 100%;
	  border-radius: 100px;
	  position: absolute;
	  top: 0;
	  left: 0;
	  z-index: -1;
	  transition: all .4s;
  }
  
  .btn-white::after {
	  background-color: #fff;
  }
  
  .btn:hover::after {
	  transform: scaleX(1.4) scaleY(1.6);
	  opacity: 0;
  }
  /*
  .btn-animated {
	  animation: moveInBottom 5s ease-out;
	  animation-fill-mode: backwards;
  }
  */
  @keyframes moveInBottom {
	  0% {
		  opacity: 0;
		  transform: translateY(30px);
	  }
  
	  100% {
		  opacity: 1;
		  transform: translateY(0px);
	  }
  }
  
  
  .vertical-menu {
	  text-align: left;
	  position: absolute;
	  z-index: 10000;
	  margin-left:30px;
	  top: -150px;
	  width: 240px;
	  transition: 0.3s;
	  -webkit-transition: .3s ease-in-out;
	  transition: .3s ease-in-out;
	  display:none;
  
  }
  
  .vertical-menu a {
				  background: #00853e;
				  padding: 6px 6px 6px 25px;
				  text-decoration: none;
				  border-bottom: 1px solid #B5B5B5;
				  color: 	white	;
				  display: block;
				  transition: 0.3s;
				  font-family: 'Roboto';
				  font-size: 14pt;
  
			  }
			  
			  .vertical-menu a:hover {
				  color: #f1f1f1;
				  background-color: #f68121;
			  }
			  
  
			  
  .vertical-menu .closepanoramapopup{
	  position: absolute;
				  z-index: 100;
				  top: -15px;
				  left: -15px;
				  -webkit-transition: .3s ease-in-out;
				  transition: .3s ease-in-out;
				  display:block;
				  cursor: pointer;
  }
  
  .vertical-menu .closepanoramapopup:hover {
								  transform: scale(1.17, 1.17);
		  
			  }
  
  .overviewpopup {
	  cursor: pointer;
	  z-index:10000;
	  color: white;
	  border: 3px solid 	#f68121;
	  text-align: center;
	  position: absolute;
	  top: -200px;
	  left: 50%;
	  margin-left:-150px;
	  display:block;
	  font-family: 'Roboto';
  }
  
  .overviewpopup .overviewmyimage{
	  display:block;
	  visibility: visible;
	  width:350 !important;
	  height:100% !important;
  }
  
  .overviewpopup .closepanoramapopup{
	  position: absolute;
	  z-index: 100;
	  top: -15px;
				  left: -15px;
				  -webkit-transition: .3s ease-in-out;
				  transition: .3s ease-in-out;
				  display:block;
				  cursor: pointer;
  }
  
  .overviewpopup .closepanoramapopup:hover {
								  transform: scale(1.17, 1.17);
		  
  }
  
	  
			  
  .panoramapopup {
	  cursor: pointer;
	  z-index:10000;
	  background: #f68121;
	  color: white;
	  border: 3px solid 	#f68121;
	  text-align: center;
	  position: absolute;
	  top: 100px;
	  left: 50%;
	  margin-left:-150px;
	  display:none;
	  font-family: 'Roboto';
  
  }
  
  .panoramapopup .closepanoramapopup{
	  position: absolute;
	  z-index: 100;
	  top: -15px;
	  left: -15px;
	  -webkit-transition: .3s ease-in-out;
	  transition: .3s ease-in-out;
	  display:block;
	  cursor: pointer;
  }
  
  .panoramapopup .closepanoramapopup:hover {
								  transform: scale(1.17, 1.17);
		  
			  }
  
			  .mainpopup {
	  background: #f68121;
	  border: 3px solid 	#f68121;
  
	  
				  font-family: 'Roboto';
				  color: white;
				  text-align: left;
				  position: absolute;
				  z-index: 100;
				  top: 250px;
				  left: 50%;
				  transform: translate(-50%, 0%);
				  transition: 0.5s;
				  font-size: 11pt;
				  -webkit-transition: 2s ease-in-out;
				  transition: 2s ease-in-out;
				  display:none;
			  }
			  
  .mainpopup .closemainpopup {
				  position: absolute;
				  z-index: 100;
				  top: -12px;
				  left: -12px;
				  -webkit-transition: .3s ease-in-out;
				  transition: .3s ease-in-out;
				  display:block;
				  cursor: pointer;
  
			  }
			  
  .mainpopup .closemainpopup:hover {
								  transform: scale(1.17, 1.17);
		  
			  }
  
  .popupvideo {
	  background: #f68121;
	  border: 3px solid 	#f68121;
  
	  width:300px;
	  height:400px;
				  font-family: 'Roboto';
				  color: white;
				  text-align: left;
				  position: absolute;
				  z-index: 10000;
				  top: 15%;
				  left: 50%;
				  transform: translate(-50%, 0%);
				  transition: 0.5s;
				  font-size: 11pt;
				  -webkit-transition: 2s ease-in-out;
				  transition: 2s ease-in-out;
				  display:none;
			  }
			  
  .popupvideo .closepopupvideo {
				  position: absolute;
				  z-index: 10000;
				  top: -12px;
				  left: -12px;
				  -webkit-transition: .3s ease-in-out;
				  transition: .3s ease-in-out;
				  display:block;
				  cursor: pointer;
  
			  }
			  
  .popupvideo .closepopupvideo:hover {
								  transform: scale(1.17, 1.17);
		  
			  }
  
  .instructor {
				  font-family: 'Roboto';
				  color: white;
				  text-align: left;
				  position: absolute;
				  z-index: 100;
				  top: 200px;
				  left: 50%;
				  transform: translate(-50%, 0%);
				  transition: 0.5s;
				  width: 50%;
				  font-size: 11pt;
				  -webkit-transition: 2s ease-in-out;
				  transition: 2s ease-in-out;
				  display:none;
				  
			  }
  
  .instructor .closeinstructor {
				  position: absolute;
				  z-index: 100;
				  top: -12px;
				  left: -12px;
				  -webkit-transition: .3s ease-in-out;
				  transition: .3s ease-in-out;
				  display:block;
				  cursor: pointer;
  
			  }
			  
  .instructor .closeinstructor:hover {
								  transform: scale(1.17, 1.17);
		  
			  }
  
  .welcome {
				  font-family: 'Roboto' !important;
				  font-weight: 900;
				  height: 120px;
				  color: #00853e;
				  text-align: center;
				  position: absolute;
				  z-index: 10;
				  top: 50px;
				  left: 50%;
				  margin-left:-250px;
				  background-color: 	rgba(255, 255, 255,0.6)	;
				  padding-top: 10px;
				  width: 500px;
				  font-size: 11pt;
				  display:none;
			  }
			  
  .welcome a{
				  font-family: 'Roboto' !important;
  
	  color:#00853e !important;
  }
  
  .welcome a:hover{
	  color:#f68121 !important;
  }
  
  .welcome a:visited{
	  color:#f68121 !important;
  }
  
  .welcome a:link{
	  color:#f68121 !important;
  }
  
  .sidenav {
				  border-right: 3px solid white;
				  height: -moz-calc(100% - 60px);
				  height: -webkit-calc(100% - 60px);
				  height: calc(100% - 60px);
				  width: 0;
				  position: fixed;
				  opacity: 0.45;
				  z-index: 10;
				  top: 0px;
				  left: 0;
				  background-color: #0B4C5F !important;
				  transition: 0.5s;
				  padding-top: 20px;
				  width: 250px;
				  font-size: 11pt;
				  float:left;
				  -webkit-transition: all 0.4s ease;
				  -moz-transition: all 0.4s ease;
				  transition: all 0.4s ease;
				  overflow-y: auto;
				  overflow-x: hidden;
			  }
  
  
  .sidenav .contentMenu {
			  }
  .sidenav .sectionmenu{
  
  }
  
  .f_taskbarCategoryText:hover {
	  color: #f68121 !important;
  } 
  
  .f_taskPanelCategoryCaption:hover {
		  color: #f68121 !important;
  
  }
  .f_taskPanelTaskCaption:hover {
			  color: #f68121 !important;
  
	  
  }
  
  .f_taskCategory:hover {
				  color: #f68121 !important;
  
  }
  
  .f_taskbarCategory:hover {
					  color: #f68121 !important;
  
  }
  
  .sidenav a {
				  padding: 6px 6px 6px 32px;
				  text-decoration: none;
				  border-bottom: 1px solid #B5B5B5;
				  color: 	white;
				  display: block;
				  transition: 0.3s;
				  font-family: 'Roboto';
				  font-size: 11pt;
  
			  }
  
  .sidenav .sectionMenu .title {
				  padding: 8px 8px 8px 16px;
				  text-decoration: none;
				  color: white;
				  display: block;
				  transition: 0.3s;
				  font-family: 'Roboto';
				  font-weight: bold;
				  font-size: 13pt;
				  margin: 5px 5px;
			  }
  
  .sidenav a:hover {
				  color: #f68121;
			  }
  
  .sidenav .closebtn {
				  position: absolute;
				  top: 0;
				  right: 25px;
				  font-size: 36pt;
				  margin-left: 50px;
			  }
  
			  .sidenav .logo {
				  text-align: center;
				  padding-bottom: 0px;
				  border-bottom: 1px solid #fff;
			  }
  
			  .btnOpen {
				  font-size:30pt;
				  cursor:pointer;
				  position: absolute;
				  z-index: 1;
				  top: 70px;
				  left: 20px;
			  }
  
			  @media screen and (max-height: 450px) {
				  .sidenav {padding-top: 15px;}
				  .sidenav a {font-size: 18pt;}
				  
				  
								  
			  }
			  
			  .btn-bottom{
				  overflow-x: hidden;
				  text-align: center;
				  height: 50px;
				  width: 500px;
				  position: absolute;
				  left: 50%;
				  margin-left:-250px;
				  z-index: 10;
				  bottom: 25px;
				  padding-top: 10px;
				  font-size: 11pt;
				  cursor: pointer;
				  
  
			  }
			  .childbutton{
				  opacity: 0.7;
				  -webkit-transition: .2s ease-in-out;
				  transition: .2s ease-in-out;
  
			  }
			  .childbutton:hover {
				  transform: scale(1.2, 1.2);
				  opacity: 1.0;
			  }
			  
			  .popupinfo {
				  text-align:left;
				  width: 300;
				  position: fixed;
				  z-index: 200;
				  top: 25%;
				  left: 25%;
				  background-color: #111;
				  transition: 0.5s;
				  padding-top: 60px;
				  font-size: 11pt;
				  display: none;
			  }
  
  
			  .popupinfo a {
				  padding: 8px 0px 8px 0px;
				  text-decoration: none;
				  display: block;
				  transition: 0.3s;
				  font-family: 'Roboto';
				  border-bottom: 1px solid #B5B5B5;
			  }
			  
			  .popupinfo a:hover {
				  background-color: #888888;				
			  }
  
			  .popupinfo .sectionMenu .title {
				  padding: 8px 8px 8px 16px;
				  text-decoration: none;
				  color: #fff;
				  display: block;
				  transition: 0.3s;
				  font-family: 'Roboto';
				  margin: 5px 5px;
			  }
  
			  .popupinfo a:hover {
				  color: #f1f1f1;
			  }
  
			  .popupinfo .closebtn {
				  position: absolute;
				  top: 0;
				  right: 25px;
				  font-size: 36pt;
				  margin-left: 50px;
			  }
  
			  .popupinfo .logo {
				  text-align: center;
				  padding-bottom: 20px;
				  border-bottom: 1px solid #fff;
			  }
  
	  
  .menu_right{
	  width: 250px;
	  height: calc(100% - 40px);
	  background-color:#0B4C5F;
	  opacity: 0.45;
	  border-left: 3px solid white;
	  z-index:1;
	  position: absolute;
	  right: 0px;
	  top:0px;
	  display: block
  }			
			  
  .nut_full{
	  position:fixed;
	  right:0;
	  bottom:0;
	  z-index:10000;
	  }
	  
	  
	  @media all and (max-width: 860px) {
		  .instructor {width: 80%;}
		  .welcome {font-family: 'Roboto' !important;
				  height: 90px;
				  color: #00853e;
				  text-align: center;
				  position: absolute;
				  z-index: 10;
				  top: 50px;
				  left: 50%;
				  margin-left:-150px;
				  background-color: 	rgba(255, 255, 255,0.6)	;
				  padding-top: 0px;
				  width: 300px;
				  font-size: 11pt;
				  display:none;}
		  .welcome .title {font-weight:900;font-size: 14pt;}
		  .welcome a {font-size:11pt;}
  }
  
  .btnreservation{
	  color:#00853e;
	  font-weight:bold;
	  height: 32px;
	  position:fixed;
	  top: 42px;
	  font-family:'Roboto';
	  right:270px;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition: all 0.4s ease;
	  transition: all 0.4s ease;
	  cursor: pointer;
	  z-index:100;
  
	  
  }
  
  .btnreservation:hover{border:none;color:#f68121;}
  
  .btnreservation-close{
	  right:20px !important;
  }
	  
  .btnopenclosetaskbar{
	  cursor: pointer;
	  width: 50px;
	  height: 50px;
	  position:fixed;
	  right:210px;
	  top: 120px;
	  bottom:0;
	  z-index:111;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition: all 0.4s ease;
	  transition: all 0.4s ease;
	  background-image: url('../img/icons/closetaskpanel.png');
	  background-size:     cover;
	  background-repeat:   no-repeat;
	  background-position: center center; 
	  display: block;
  }
  
  
  .btnopenclosetaskbar.cbp-spmenu-close {
	  right:210px !important; 
	  background-image: url('../img/icons/closetaskpanel.png') !important; 
	  display: block; 
	  opacity:0.5;
  }
  
  .btnopenclosetaskbar.cbp-spmenu-open {
	  right:0px;
	  background-image: url('../img/icons/opentaskpanel.png');
	  display: block;
  }
  
  .btnopenclosetaskbar:hover{
					  transform: scale(1.2, 1.2);
					  transform-origin: left;
  
  }
  
  .f_taskbar{
	  opacity: 0.85;
	  border-left: 3px solid white;
	  background-color: #00853e !important;
	  z-index:10;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition: all 0.4s ease;
	  transition: all 0.4s ease;
  }
  
  .f_fixTaskCategories {
	  border-left: 1px solid white;
	  background-color: #00853e !important;
  }
  
  .f_taskbar.cbp-spmenu-open {
	  right:-260px !important;
	  opacity: 0.1;
  }
		  
  .btnopenclose{
	  
	  cursor: pointer;
	  width: 50px;
	  height: 50px;
	  position:fixed;
	  left:200px;
	  top: 30px;
	  bottom:0;
	  z-index:10001;
	  -webkit-transition: all 0.4s ease;
	  -moz-transition: all 0.4s ease;
	  transition: all 0.4s ease;
	  background-image: url('../img/icons/close.png');
	  background-size:     cover;
	  background-repeat:   no-repeat;
	  background-position: center center; 
	  }
	  
	  
	  
  
	  
  .btnopenclose:hover{
					  transform: scale(1.2, 1.2);
					  transform-origin: right;
  
  }
	  
	  
  
  .xoay,#cancel-fullscreen{
	  display:none;
	  }
  
  .f_dropdownMenu{
	  z-index:9999;
	  }
	  
		  .popup{
			  position: absolute;
			  background: white;
			  border: 50px solid gray;
			  z-index: 10000;
		  }
		  #background{
			  position: absolute;
			  left: 0px;
			  top: 1000px;
		  }
		  a.close{
			  text-decoration: none;
			  float: right;
		  }
  
  
  
	  
  /*.f_taskbar_full:hover{opacity:1 !important; trasition:1.5s; right:0px !important} */
  .f_pagebox_full{top:0 !important}
  
  .f_pagebox_right{}
  
  
		  
		  
  #menu {
	position: fixed;
	background-color: #222;
	height: 100%;
	z-index: 100;
	width: 280px;
	color: #bbb;
	top: 100px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	opacity: 1;
	font-family: 'Roboto';
  }
  
  #menu ul {
	list-style: none;
	margin-top: 0;
	padding: 0
  }
  
  #menu ul li { border-bottom: 1px solid #2a2a2a; }
  
  #menu>ul>li>a { border-left: 4px solid #222; }
  
  #menu ul li a {
	color: inherit;
	font-size: 16pt;
	display: block;
	padding: 8px 0 8px 7px;
	text-decoration: none;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
	font-weight: 600;
  }
  
  #menu ul a i {
	margin-right: 10px;
	font-size: 18pt;
	margin-top: 3px;
	width: 20px;
  }
  
  #menu ul a i[class*='fa-caret'] { float: right; }
  
  #menu ul a:hover,
  #menu ul a.active {
	background-color: #111;
	border-left-color: #FFCC33;
	color: #FFCC33;
  }
  
  #menu ul a:hover i:first-child { color: #FFCC33; }
  
  /* Submenu */
  
  #menu ul li a.active+ul { display: block }
  
  #menu ul li ul {
	margin-top: 0;
	display: none;
  }
  
  #menu ul li ul li { border-bottom: none; }
  
  #menu ul li ul li a { padding-left: 30px; }
  
  #menu ul li ul li a:hover { background-color: #1A1A1A; }
  
  /* /Submenu */
  
  
  /* Cuando este a la Izq, para esconderlo posicionarlo a la Izq a -width */
  
  .left { left: -280px; }
  
  .show { left: 0; }
  
  #showmenu {
	margin-left: 100%;
	position: absolute;
	top:100px;
	padding: 6px 10px 7px 10px;
	font-size: 1.3em;
	color: #FFCC33;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	transition: all 0.3s ease;
  }
  
  #container { padding: 50px; }
  
  div.ws_headerBar:hover{opacity:1 !important; trasition:1.5s;top:0px !important}
  div.map_map{position:fixed;left:20px;bottom:10px; z-index:10000;}
  div.map_map a img{margin-right:10px;}
  
  /* General styles for all menus */
  
  
  /* Orientation-dependent styles for the content of the menu */
  
  
  /* Vertical menu that slides from the left or right */
  
  .sidenav.cbp-spmenu-open {
	  left: -250px;
	  opacity:0.1;
  }
  
  .btnopenclose.cbp-spmenu-open  {
				  position: fixed;
				  font-size: 36pt;
				  margin-left: -200px;
				  background-image: url('../img/icons/open.png');
				  background-size:     cover;                      /* <------ */
	  background-repeat:   no-repeat;
	  background-position: center center; 
  }
  
  .f_pagebox  {
	  right:0 !important;
	  left:0 !important;
  }
  
  .f_pagebox.cbp-spmenu-open  {
				  transition-delay: 0.4s;
  
  }
  
  
  .popupinfo {
			  cursor: pointer;
				  width: 300px;
				  position: fixed;
				  z-index: 10;
				  top: 25%;
				  left: 25%;
				  background-color: #DDDDDD;
				  transition: 0.5s;
				  padding-top: 0px;
				  font-size: 11pt;
				  display: none;
			  }
  
			  .popupinfo .contentMenu {
				  overflow-x: hidden;
				  height: 100%;
				  font-weight: bold;
				  text-align: center;
				  color: #111;
  
			  }
  
			  .popupinfo a {
				  text-align: left;
				  padding: 0px 10px 0px 8px;
				  text-decoration: none;
				  color: #111;
				  display: block;
				  transition: 0.3s;
				  font-weight: normal;
				  font-size: 11pt;
				  font-family: Arial;
			  }
  
			  .popupinfo .sectionMenu .title {
				  padding: 8px 8px 8px 16px;
				  text-decoration: none;
				  color: #00853e;
				  display: block;
				  transition: 0.3s;
				  font-size: 16pt;
				  font-family: 'Roboto';
				  margin: 5px 5px;
			  }
  
			  .popupinfo a:hover {
				  color: #111;
			  }
  
			  .popupinfo .closebtn {
				  position: absolute;
				  top: 0;
				  right: 5px;
				  font-size: 36pt;
				  margin-left: 50px;
				  color: #00853e;
			  }
  
			  .popupinfo .logo {
				  text-align: center;
				  padding-top: 10px;
				  padding-bottom: 20px;
				  border-bottom: 1px solid #fff;
			  }
			  
  .float_element_button{
	  z-index: 9999;
	  float: left;
	  left: 20px;
	  width: 160px;
	  height: 30px;
	  padding: 10px;
	  text-align: center;
	  position: relative;
	  margin-top: 10px;
	  background: linear-gradient(90deg, #23a455 0%, #23a455 0% 42%, #23a455 0% 100%);
	  border-radius: 7px 7px 7px 7px;
  }	
  
  .float_element{
	  position: fixed;
	  top: 0;
	  left: 0;
	  bottom: 0;
	  text-align: center;
	  transition: all ease-in-out 0.2s;
	  z-index: 9997;
	  transition: all 0.5s;
	  padding: 0 15px;
	  overflow-y: auto;
	  background: rgb(255 255 255 / 29%);
  }
  
  
  .float_element_text{
	  color: #FFFFFF;
	  position: relative;
	  left: 5px;
	  font-size: 14px;
	  top: 5px;
  }
  
  .float_element_icon {
	  width: 30px;
	  position: absolute;
	  left: 5px;
	  padding: 0px;
  }
  
  
  @media only screen and (max-width: 900px) {
	  .float_element_button {
		width: 125px;
		left: 20px;
		height: 20px;
		margin-top:10px;
  
	  }
	  .float_element_text{
		  font-size: 12px;
		padding: 1px;
		left: 7px;
		top: 2px;
	  }
  
	
	.float_element_icon {
		width: 20px;
		position: absolute;
		left: 5px;
		padding: 0px;
	}
  }
  #openMenu {
	z-index: 1;
	display: block;
	text-decoration: none;
	position: fixed;
	left: 0;
	top: 65px;
	background: rgb(236,120,35);
	/*background: linear-gradient(90deg, rgba(236,120,35,1) 0%, rgba(236,120,35,1) 42%, rgba(236,120,35,1) 100%);*/
	background: linear-gradient(90deg, #23a455 0%, #23a455 0% 42%, #23a455 0% 100%);
	color: #fff;
	font-size: 24px;
	padding: 10px;
	padding-left: 5px;
	font-weight: bold;
	text-align: center;
	min-height: 38px;
	border-radius: 0 40px 40px 0px;
}

#openMenu.active span {
		animation: rotateIOpenMenu 0.2s forwards;
		display: block;
		line-height: 38px;
}

#openMenu.close span {
		animation: rotateICloseMenu 0.2s forwards;
		display: block;
		line-height: 38px;
}

.active-menu {
		animation: animationOpenMenu 0.5s forwards;
}

.close-menu {
		animation: animationCloseMenu 0.5s forwards;
}

@keyframes animationOpenMenu {
	from {
		transform: translate(-100%, 0);
	}
	to {
		transform: translate(0%, 0);
		}
	}

@keyframes animationCloseMenu {
	from {
		transform: translate(0%, 0);
	}
	to {
		transform: translate(-100%, 0);
	}
}

@keyframes rotateIOpenMenu {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(-180deg);
	}
}

@keyframes rotateICloseMenu {
	from {
		transform: rotate(180deg);
	}
	to {
		transform: rotate(0deg);
	}
}