/* Default tab style */

.tabs {
    position : relative;
    overflow : hidden;
    margin   : 0 auto;
    /*width: 100%;*/
    }

/* Nav */
.tabs nav {
    text-align : center;
    }

.tabs nav ul {
    position                : relative;
    display                 : -ms-flexbox;
    display                 : -webkit-flex;
    display                 : -moz-flex;
    display                 : -ms-flex;
    display                 : flex;
    margin                  : 0 auto;
    padding                 : 0;
    max-width               : 1200px;
    list-style              : none;
    -ms-box-orient          : horizontal;
    -ms-box-pack            : center;
    -webkit-flex-flow       : row wrap;
    -moz-flex-flow          : row wrap;
    -ms-flex-flow           : row wrap;
    flex-flow               : row wrap;
    -webkit-justify-content : center;
    -moz-justify-content    : center;
    -ms-justify-content     : center;
    justify-content         : center;
    }

.tabs nav ul li {
    position     : relative;
    z-index      : 1;
    display      : inline-block;
    margin       : 0;
    text-align   : center;
    -webkit-flex : 1;
    -moz-flex    : 1;
    -ms-flex     : 1;
    flex         : 1;
    }

.tabs nav a {
    position      : relative;
    display       : block;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
    line-height   : 2.5;
    }

.tabs nav a span {
    vertical-align : middle;
    font-size      : 0.75em;
    }

.tabs nav li.tab-current a {
    color : #FFFFFF;
    }

.tabs nav a:focus {
    outline : none;
    }

/* Content */
.content-wrap {
    position : relative;
    }

.content-wrap section {
    display    : none;
    margin     : 0 auto;
    padding    : 20px 0 0;
    max-width  : 1200px;
    text-align : center;
    }

.content-wrap section.content-current {
    display : block;
    }

.content-wrap section p {
    text-align : left;
    }

/* Fallback */
.no-js .content-wrap section {
    display        : block;
    padding-bottom : 2em;
    border-bottom  : 1px solid rgba(255, 255, 255, 0.6);
    }

/*
.no-flexbox nav ul {
	display: block;
}

.no-flexbox nav ul li {
	min-width: 15%;
	display: inline-block;
}*/

@media screen and (max-width : 58em) {
    .tabs nav a.icon span {
        display : none;
        }

    .tabs nav a:before {
        margin-right : 0;
        }
    }

/* Individual tab styles */

/*****************************/
/* Icon box */
/*****************************/

.tabs-style-iconbox nav {
    background : rgba(255, 255, 255, 0.4);
    }

.tabs-style-iconbox nav ul li a {
    overflow           : visible;
    padding            : 30px 0;
    line-height        : 1;
    -webkit-transition : color 0.2s;
    transition         : color 0.2s;
    background         : rgba(204, 204, 204, 0.2);
    color              : #222121;
    }

.tabs-style-iconbox nav ul li a i,
.tabs-style-topline nav ul li a i {
    font-size     : 30px;
    display       : block;
    margin-bottom : 5px;
    }

.tabs-style-iconbox nav ul li a {
    font-size : 18px;
    }

.tabs-style-iconbox nav ul li.tab-current {
    z-index : 100;
    }

.tabs-style-iconbox nav ul li.tab-current a::after {
    position       : absolute;
    top            : 100%;
    left           : 50%;
    margin-left    : -10px;
    width          : 0;
    height         : 0;
    border         : solid transparent;
    border-width   : 10px;
    content        : '';
    pointer-events : none;
    }

.tabs-style-iconbox nav ul li::after {
    position   : absolute;
    top        : 20%;
    right      : 0;
    z-index    : -1;
    width      : 1px;
    height     : 60%;
    background : rgba(0, 0, 0, 0.07);
    content    : '';
    }

.tabs-style-iconbox nav ul li:first-child::before,
.tabs-style-iconbox nav ul li:last-child::after {
    position   : absolute;
    top        : 20%;
    right      : 0;
    z-index    : -1;
    width      : 0;
    height     : 60%;
    background : rgba(0, 0, 0, 0.07);
    content    : '';
    }

.tabs-style-iconbox nav ul li:first-child::before {
    right : auto;
    left  : 0;
    }

.tabs-style-iconbox .icon::before {
    display : block;
    margin  : 0 0 0.25em 0;
    }

/*****************************/
/* Top Line */
/*****************************/

.tabs-style-topline {
    max-width : 1200px;
    }

.tabs-style-topline nav li {
    border : 1px solid rgba(40, 44, 42, 0.1);
    }

.tabs-style-topline nav li:not(:last-child) {
    border-right : none;
    }

.tabs-style-topline nav li.tab-current {
    border-bottom : none;
    }

.tabs-style-topline nav a {
    padding            : 20px 0;
    background         : rgba(40, 44, 42, 0.05);
    color              : #74777B;
    line-height        : 1;
    -webkit-transition : color 0.2s;
    transition         : color 0.2s;
    }

.tabs-style-topline nav li.tab-current a {
    background : none;
    }

.tabs-style-topline .icon::before {
    display : block;
    margin  : 0;
    }

.tabs-style-topline nav a span {
    text-transform : uppercase;
    letter-spacing : 1px;
    font-weight    : 700;
    font-size      : 0.5em;
    }

/*****************************/
/* Flip */
/*****************************/

.tabs-style-flip {
    max-width : 1200px;
    }

.tabs-style-flip nav a {
    padding            : 20px 0;
    color              : #74777B;
    -webkit-transition : color 0.3s;
    transition         : color 0.3s;
    }

.tabs-style-flip nav ul li a i {
    font-size    : 30px;
    margin-right : 5px;
    }

.tabs-style-flip nav a span {
    text-transform : uppercase;
    letter-spacing : 1px;
    font-weight    : 700;
    font-size      : 0.625em;
    }

.tabs-style-flip nav a::after {
    position                   : absolute;
    top                        : 0;
    left                       : 0;
    z-index                    : -1;
    width                      : 100%;
    height                     : 100%;
    background-color           : #F0F0F0;
    content                    : '';
    -webkit-transition         : -webkit-transform 0.3s, background-color 0.3s;
    transition                 : transform 0.3s, background-color 0.3s;
    -webkit-transform          : perspective(900px) rotate3d(1, 0, 0, 90deg);
    transform                  : perspective(900px) rotate3d(1, 0, 0, 90deg);
    -webkit-transform-origin   : 50% 100%;
    transform-origin           : 50% 100%;
    -webkit-perspective-origin : 50% 100%;
    perspective-origin         : 50% 100%;
    }

.tabs-style-flip nav li.tab-current a::after {
    background        : #F1F1F1;
    -webkit-transform : perspective(900px) rotate3d(1, 0, 0, 0deg);
    transform         : perspective(900px) rotate3d(1, 0, 0, 0deg);
    }

.tabs-style-flip .content-wrap {
    background : #F1F1F1;
    padding    : 0 15px 15px;
    }

/*only icon tab*/

.tabs-only-icon ul {
    border-bottom   : 1px solid #EEEEED;
    margin-bottom   : 15px;
    text-align      : left !important;
    justify-content : inherit !important;
    }

.tabs-only-icon ul li {
    width         : 55px;
    margin-bottom : -1px !important;
    -webkit-flex  : inherit !important;
    -moz-flex     : inherit !important;
    -ms-flex      : inherit !important;
    flex          : inherit !important;
    }

.tabs-only-icon ul li a {
    padding : 2px;
    }

.tabs-only-icon ul li a i {
    font-size : 18px;
    color     : #CCCCCC;
    }

.tabs-only-icon ul li.tab-current {
    background : #F6F6F6;
    }