/*
body {
  text-align: left;
  color: #424F5A; 
  background: #D7D3C8;  
}*/


.tabs2 { padding: 0; float: none; list-style: none; position: relative; margin: auto; text-align: left; }
.tabs2 li {    float: left;    display: block;}
.tabs2 input[type="radio"] {    position: absolute;    display: none;}
.tabs2 label { display: block; font-size: 95%; cursor: pointer; position: relative; -webkit-border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0; -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; color: #FFF; padding-top: 9px; padding-right: 20px; padding-bottom: 9px; padding-left: 20px; margin-right: 1px; background-color: #7fc767; }
.tabs2 label:hover { background-color: #4da030; }
.tabs2 .tab-content{ z-index: 2; display: none; overflow: hidden; width: 100%; position: absolute; top: 38px; border-top-width: 2px; border-top-style: solid; border-top-color: #4da030; left: 0px; }
.tabs2 [name="tabs2"]:checked + label { top: 0; background-color: #4da030; }
.tabs2 [name="tabs2"]:checked ~ .tab-content {    display: block;}



@media only screen and (max-width: 778px) {
  .tabs2 {
    width: 100%;
  }
  .tabs2 li {
    float: none;
    margin-top: 0px;
  }
  .tabs2 .tab-content {
    position: relative;
    display: block;
    top: 0;
  }
  .tabs2 label {
    top: 0;
    padding-top: 17px; 
  background: #4DA030;   
  }
  .tabs2 label:hover {  }
}