@charset "UTF-8";


/*===================================================*/
label[for*="tab1"] {
    background: #008cd6;
}
/*.tab_item[for*="tab1"] {
    background: #008cd6;
    opacity: 0.5;
}
.tab_item[for*="tab2"] {
    background: #22ac38;
    opacity: 1;
}*/

.tab_container {
  padding-bottom: 1em;
  background-color: #fff;
  /*border:1px solid #37beb0;*/
  margin: 0 auto;
  }
.tab_container .tab2 {
    margin-left: 1%;
}
.tab_item {
    border-radius:10px 10px 0 0; 
}
.tab_item {
  /*width: calc(100%/2);*/
  width: 49.5%;
  padding: 5px 15px 10px 15px;
  background-color: #ececec;
  text-align: center;
  color: #fff ;
  display: block;
  float: left;
  text-align: center;
  font-weight: bold;
  transition: all 0.2s ease;
}
.tab_item:hover {
  opacity: 0.75;
}
input[name="tab_item"] {
  display: none;
}
.tab_content {
  display: none;
  padding: 1em 1em 0;
  clear: both;
  overflow: hidden;
}
#tab1:checked ~ #tab1_content,
#tab2:checked ~ #tab2_content,
#tab3:checked ~ #tab3_content,
#tab4:checked ~ #tab4_content {
  display: block;
  
}
/*.tab_container input:checked + .tab_item {
  background-color: #22ac38 ;
  color: #fff;
}*/
.tab_container input:nth-child(1) + .tab_item {
	background: #008cd6;
	opacity: 0.3;
}
.tab_container input:nth-child(1):checked + .tab_item {
	background: #008cd6;
	opacity: 1;
}
.tab_container input:nth-child(3) + .tab_item {
	background: #22ac38;
	opacity: 0.3;
}
.tab_container input:nth-child(3):checked + .tab_item {
	background: #22ac38;
	opacity: 1;
}

#tab1_content {
    border-left: 5px solid #008cd6;
    border-right: 5px solid #008cd6;
    border-bottom:  5px solid #008cd6;
    border-top: 15px solid #008cd6;
}
#tab2_content {
    border-left: 5px solid #22ac38;
    border-right: 5px solid #22ac38;
    border-bottom:  5px solid #22ac38;
    border-top: 15px solid #22ac38;
}


.tab_container .tab_item:nth-child(1) {
    background: #008cd6;
}
.tab_container .tab_item:nth-child(2) {
    background: #22ac38;
}

.tab_item h3 {
    color: #fff;
}