.tabmenu {  width: 100%; margin-bottom:40px;  max-width: 100%;   width:90%; margin:0 auto; position:relative}
.tabmenu_menu {  display: flex;  flex-wrap: wrap; width:600px;
position: absolute; left:49%; top:30px ; z-index: 9 }

.tabmenu_menu-item {  flex: 1;    padding: 10px;  font-size: 25px;  font-weight: 400;  text-transform: uppercase;
  text-align: center;  color: #888;  box-shadow: 0 2px 0 transparent;  -webkit-user-select: none;     -moz-user-select: none;      -ms-user-select: none;
     user-select: none;  cursor: pointer;  transition: 0.3s; border-radius:50px;}
.tabmenu_content {  padding: 0px 0 0 0;  margin:0 auto;}
.tabmenu_content-item {  height: 0;  overflow: hidden;  line-height: 1.4;  opacity: 0;  transform: translateY(80px);
  visibility: hidden;  transition: 0.5s; }
.tabmenu_menu .tabmenu_menu-item span{ padding:0 5px 15px 5px; }
.tabmenu input[id=tab1]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab1] {
 color: #1d222f; font-weight:600; background:#CBD95D }
.tabmenu input[id=tab1]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab1] span {border-bottom:0px solid #222; padding:0 5px 15px 5px;}
.tabmenu input[id=tab1]:checked ~ .tabmenu_content .tabmenu_content-item[data-tab=tab1] {
  height: auto;  opacity: 1;  transform: translateY(0);  visibility: visible;}
.tabmenu input[id=tab2]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab2] {
   color: #1d222f;  font-weight:600; background:#CBD95D }
   .tabmenu input[id=tab2]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab2] span {border-bottom:0px solid #222; padding:0 5px 15px 5px;}
.tabmenu input[id=tab2]:checked ~ .tabmenu_content .tabmenu_content-item[data-tab=tab2] {
  height: auto;  opacity: 1;  transform: translateY(0);  visibility: visible;}
.tabmenu input[id=tab3]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab3] {
    color: #1d222f;  font-weight:600; background:#CBD95D }
.tabmenu input[id=tab3]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab3] span {border-bottom:0px solid #222; padding:0 5px 15px 5px;}    
.tabmenu input[id=tab3]:checked ~ .tabmenu_content .tabmenu_content-item[data-tab=tab3] {
  height: auto;  opacity: 1;  transform: translateY(0);  visibility: visible;}
.tabmenu input[id=tab4]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab4] {
    color: #1d222f;  font-weight:600; background:#CBD95D }
.tabmenu input[id=tab4]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab4] span {border-bottom:0px solid #222; padding:0 5px 15px 5px;}    
.tabmenu input[id=tab4]:checked ~ .tabmenu_content .tabmenu_content-item[data-tab=tab4] {
  height: auto;  opacity: 1;  transform: translateY(0);  visibility: visible;}
  .tabmenu input[id=tab5]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab5] {
    color: #1d222f;  font-weight:600; background:#CBD95D }
.tabmenu input[id=tab5]:checked ~ .tabmenu_menu .tabmenu_menu-item[for=tab5] span {border-bottom:0px solid #222; padding:0 5px 15px 5px;}    
.tabmenu input[id=tab5]:checked ~ .tabmenu_content .tabmenu_content-item[data-tab=tab5] {
  height: auto;  opacity: 1;  transform: translateY(0);  visibility: visible;}


/*---------------------------------------
  MOBILE RESPONSIVE              
-----------------------------------------*/
@media (max-width: 1023px) {
.tabmenu {  margin-bottom:0px;  width:90%; margin:0 auto}	
.tabmenu_content {  padding: 30px 0 0 0; width:100%; }	
.tabmenu_menu {  display: flex;  flex-wrap: wrap; width:96%; position: relative; left:0; top:0px ; z-index: 9 }
.tabmenu_menu-item {    padding: 2px 1px;  font-size: 13px;  font-weight: 500;   }
.tabmenu_content-item {   transform: translateY(20px);}
}
@media (max-width: 768px) {
}
@media (max-width: 640px) {
}
@media (max-width: 480px) {
}
@media (max-width: 320px) {
}