﻿.tab-wrapper{
    max-width: 100%;
    margin: 0 auto;
}
.tab-triger{}
.tab-triger ul{
    margin:0;
    padding:0;
    list-style:none;
    display:flex;}
.tab-triger ul li{
    margin-right:3px;}
.tab-triger ul li label {
        position: relative;
        display: block;
        padding: 8px 15px;
        cursor: pointer;
        min-width: 100px;
        background: #e6e6e6;
        border-radius: 8px 8px 0 0;
        text-align: center;
        list-style:none;}
.tab-triger ul li:nth-child(1) label {
            background: #e6e6e6;}
.tab-triger ul li:nth-child(2) label {
        background: #f0f0f0;}
.tab-container-wrap {
    margin-top: -16px;}
.tab-container-wrap input{
        position:absolute;
        width:0;
        height:0;
        margin:0;
        z-index:-100;
        top:-10000px;
        display:none;}
.tab-container-wrap input:checked + .tab-content-box {
            display:block;}
.tab-content-box {
            background: #f0f0f0;
            padding: 20px;
            display: none;}
.tab-content-box:nth-of-type(1) {
                background: #e6e6e6;}
.tab-content-box:nth-of-type(2) {
                background: #f0f0f0;}
.tab-content-box h2 {margin: 0 0 20px;}


@media (max-width: 480px){
    .tab-content-box{
        width:383px;
    }

    .tab-content-box h2{
        font-size:25px;
    }

}

@media (max-width: 412px) {

    .tab-wrapper{
        overflow-x:scroll;
    }
    .tab-content-box {
        width: 383px;
    }

        .tab-content-box h2 {
            font-size: 25px;
        }
}