﻿
.page {
    position: relative;
    max-width: 100%;
    /* margin: 0 auto; */
    padding: 0 9px 10px;
    background: #999999;
    border-radius: 10px;
    margin-top: 50px;
}

.headingtop {
    margin-top: 0px;
    font-size: 24px;
    padding: 5px;
}
/**/
/* main styles */
/**/
.pcss3t {
    margin: 0;
    padding: 0;
    border: 0;
    outline: none;
    font-size: 0;
    text-align: left;
}

    .pcss3t > input {
        position: absolute;
        left: -9999px;
    }

    .pcss3t > label {
        position: relative;
        display: inline-block;
        margin: 0;
        padding: 0;
        border: 0;
        outline: none;
        cursor: pointer;
        transition: all 0.1s;
        -o-transition: all 0.1s;
        -ms-transition: all 0.1s;
        -moz-transition: all 0.1s;
        -webkit-transition: all 0.1s;
    }

        .pcss3t > label i {
            display: block;
            float: left;
            margin: 16px 8px 0 -2px;
            padding: 0;
            border: 0;
            outline: none;
            font-family: FontAwesome;
            font-style: normal;
            font-size: 17px;
        }

    .pcss3t > input:checked + label {
        cursor: default;
    }

    .pcss3t > ul {
        list-style: none;
        position: relative;
        display: block;
        overflow: hidden;
        margin: 0;
        padding: 0;
        border: 0;
        outline: none;
        font-size: 13px;
    }

        .pcss3t > ul > li {
            position: absolute;
            width: 100%;
            overflow: auto;
            padding: 17px 15px 12px;
            box-sizing: border-box;
            -moz-box-sizing: border-box;
            opacity: 0;
            /*transition: all 0.5s;
            -o-transition: all 0.5s;
            -ms-transition: all 0.5s;
            -moz-transition: all 0.5s;
            -webkit-transition: all 0.5s;*/
        }

    .pcss3t > .tab-content-first:checked ~ ul .tab-content-first,
    .pcss3t > .tab-content-2:checked ~ ul .tab-content-2,
    .pcss3t > .tab-content-last:checked ~ ul .tab-content-last {
        z-index: 1;
        top: 0;
        left: 0;
        opacity: 1;
        -webkit-transform: scale(1,1);
        -webkit-transform: rotate(0deg);
    }


/*----------------------------------------------------------------------------*/
/*                                 EXTENSIONS                                 */
/*----------------------------------------------------------------------------*/

/**/
/* auto height */
/**/

.pcss3t-height-auto > ul {
    height: auto !important;
}

    .pcss3t-height-auto > ul > li {
        position: static;
        display: none;
        height: auto !important;
    }

.pcss3t-height-auto > .tab-content-first:checked ~ ul .tab-content-first,
.pcss3t-height-auto > .tab-content-2:checked ~ ul .tab-content-2,
.pcss3t-height-auto > .tab-content-last:checked ~ ul .tab-content-last {
    display: block;
}



/**/
/* steps */
/**/
.pcss3t-steps > label {
    cursor: default;
}




/*----------------------------------------------------------------------------*/
/*                                   LAYOUTS                                  */
/*----------------------------------------------------------------------------*/

/**/
/* top right */
/**/
.pcss3t-layout-top-right {
    text-align: right;
}


/**/
/* top center */
/**/
.pcss3t-layout-top-center {
    text-align: center;
}


/**/
/* top combi */
/**/
.pcss3t > .right {
    float: right;
}




/*----------------------------------------------------------------------------*/
/*                               RESPONSIVENESS                               */
/*----------------------------------------------------------------------------*/

/**/
/* pad */
/**/


@media screen and (max-width: 980px) {
}


/**/
/* phone */
/**/
@media screen and (max-width: 767px) {
    .pcss3t > label {
        display: block;
    }

    .pcss3t > .right {
        float: none;
    }
}



/*----------------------------------------------------------------------------*/
/*                                   THEMES                                   */
/*----------------------------------------------------------------------------*/

/**/
/* default */
/**/
.pcss3t > label {
    padding: 0 20px;
    background: #e5e5e5;
    font-size: 13px;
    line-height: 34px;
}

    .pcss3t > label:hover {
        background: #f2f2f2;
    }

.pcss3t > input:checked + label {
    background: #fff;
}

.pcss3t > ul {
    background: #fff;
    text-align: left;
}

.pcss3t-steps > label:hover {
    background: #e5e5e5;
}


/**/
/* theme 1 */
/**/
.pcss3t-theme-1 > label {
    margin: 0 5px 5px 0;
    border-radius: 5px;
    background: #fff;
    box-shadow: 0 2px rgba(0,0,0,0.2);
    color: #808080;
    opacity: 0.8;
}

    .pcss3t-theme-1 > label:hover {
        background: #fff;
        opacity: 1;
    }

.pcss3t-theme-1 > input:checked + label {
    margin-bottom: 0;
    padding-bottom: 5px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    color: #2b82d9;
    opacity: 1;
}

.pcss3t-theme-1 > ul {
    border-radius: 5px;
    box-shadow: 0 3px rgba(0,0,0,0.2);
}

.pcss3t-theme-1 > .tab-content-first:checked ~ ul {
    border-top-left-radius: 0;
}

@media screen and (max-width: 767px) {
    .pcss3t-theme-1 > label {
        margin-right: 0;
    }

    .pcss3t-theme-1 > input:checked + label {
        margin-bottom: 5px;
        padding-bottom: 0;
        border-radius: 5px;
    }

    .pcss3t-theme-1 > .tab-content-first:checked ~ ul {
        border-top-left-radius: 5px;
    }
}



/*----------------------------------------------------------------------------*/
/*                               CUSTOMIZATION                                */
/*----------------------------------------------------------------------------*/

/**/
/* height */
/**/
.pcss3t > ul,
.pcss3t > ul > li {
    height: 610px;
}
