﻿/* Platform specific stylings */
.platform-container { }

    /* Platform tabs */
    .platform-container > ul.nav-tabs { display: flex; position: relative; z-index: 1; }
        .platform-container > ul.nav-tabs > li { flex-grow: 1; background-color: #98af3e; border-top: 1px solid white; }
            .platform-container > ul.nav-tabs > li:not(:first-of-type) { border-left: 1px solid white; }
            .platform-container > ul.nav-tabs > li.active { background-color: #5d5c5d;; }
            .platform-container > ul.nav-tabs > li > a { background-color: transparent; border-radius: 0; padding: 0; margin: 0; border: 0; text-align: center; display: block; width: 100%; font-style: italic; padding: 10px 0; text-transform: uppercase; color: white; }
            .platform-container > ul.nav-tabs > li.active > a:hover, .platform-container > ul.nav-tabs > li.active > a:active, .platform-container > ul.nav-tabs > li.active > a:focus,
            .platform-container > ul.nav-tabs > li.active > a { color: white; background-color: #5d5c5d; border: 0; }
                .platform-container > ul.nav-tabs > li.active > a:before { content: ''; position: absolute; width: 20px; left: calc(50% - 10px); bottom: -20px; height: 20px; border-top: 10px solid #5d5c5d; border-left: 10px solid transparent; border-right: 10px solid transparent; }

    /* Platform tab content */
    .platform-container > .tab-content { display: flex; position: relative; z-index: 0; }

/* Panel */

/* Panel with sliding circle */
/*.panel-group .panel { border-radius: 0; }
.panel { border-radius: 0; position: relative; }
    .panel .panel-heading { padding: 0; border-radius: 0; color: #3c3b3c; line-height: 20px; background-color: white; text-transform: uppercase; position: relative; }
        .panel .panel-heading .panel-title { }
            .panel .panel-heading .panel-title a { padding: 10px 50px 10px 10px; font-family: 'Titillium Web'; font-weight: 700; position: relative; width: 100%; display: block; height: 100%; display: block; }
                .panel .panel-heading .panel-title a:hover { text-decoration: none; }
                .panel .panel-heading .panel-title a:after { position: absolute; content: ''; height: 16px; width: 30px; right: 10px; top: calc(50% - 8px); background-color: #98af3e; border: 1px solid #98af3e; border-radius: 15px; transition: all .2s linear; }
                .panel .panel-heading .panel-title a:before { content: ''; z-index: 2; background-color: white; height: 12px; width: 12px; position: absolute; top: calc(50% - 6px); right: 26px; border-radius: 12px; transition: all .1s linear; }
                .panel .panel-heading .panel-title a.collapsed:before { right: 12px; border-radius: 12px; }
                .panel .panel-heading .panel-title a.collapsed:after { background-color: #5d5c5d; border-color: #5d5c5d; z-index: 1; }
    .panel .panel-body { border-top: 0; }
        .panel .panel-body > p { margin: 0; }
    .panel .panel-footer { }*/

/* Panel with +/- */
.panel-group .panel { border-radius: 0; }
.panel { border-radius: 0; position: relative; }
    .panel .panel-heading { padding: 0; border-radius: 0; color: #3c3b3c; line-height: 20px; background-color: white; text-transform: uppercase; position: relative; }
        .panel .panel-heading .panel-title { }
            .panel .panel-heading .panel-title a { padding: 10px 50px 10px 10px; font-family: 'Titillium Web'; font-weight: 700; position: relative; width: 100%; display: block; height: 100%; display: block; }
                .panel .panel-heading .panel-title a:hover { text-decoration: none; }
                .panel .panel-heading .panel-title a:after { position: absolute; content: '-'; font-size: 32px; line-height: 32px; font-weight: 400; height: 100%; width: 30px; right: 0; top: 0; text-align: center; }
                .panel .panel-heading .panel-title a.collapsed:after { content: '+'; z-index: 1; }
    .panel .panel-body { border-top: 0; }
        .panel .panel-body > p { margin: 0; }
    .panel .panel-footer { }

/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */

/* TYPOGRAPHY */
/**umb_name:tabbed-content-text*/
.tabbed-content-text { font-weight: 500; font-family: 'Titillium Web', sans-serif; font-size: 1.313em; /* 36 pt, 48 px */ letter-spacing: .01em; line-height: 100%; }
/**umb_name:image-viewer-text*/
.image-viewer-text { font-weight: 600; font-family: 'Titillium Web', sans-serif; font-size: 1.5em; /* 36 pt, 48 px */ letter-spacing: .01em; line-height: 100%; }

/* CUSTOM TABLE */
.feature table { width: 100%; height: 100%; }
    .feature table tr { }
        .feature table tr:not(:last-of-type) { border-bottom: 3px solid #f3f3f3; }
        .feature table tr td { padding: 20px; text-align: center; text-transform: uppercase; }
            .feature table tr td:not(:last-of-type) { border-right: 3px solid #f3f3f3; }
            .feature table tr td img { }

@media (min-width: 524px) and (max-width:767px) {
    .feature .container { padding: 0; }
    .feature table tr { display: inline; }
        .feature table tr td { float: left; display: block; width: 50%; min-height: 180px; border-right: none !important; border-bottom: 3px solid #f3f3f3; padding: 20px 0 0; }
    .feature table img { height: auto; }
}

@media(max-width:523px) {
    .feature .container { padding: 0; }
    .feature table tr { display: inline; }
        .feature table tr td { float: left; display: block; width: 100%; min-height: 180px; border-right: none !important; border-bottom: 3px solid #f3f3f3; padding: 20px 0 0; }
    .feature table img { height: auto; }
}
