/*------- Hero ------- */
/*-------------------
      Base Sizes
--------------------*/
/* This is the single variable that controls them all */
/* The size of page text  */
/*-------------------
     Transitions
--------------------*/
@media (max-width: 767.98px) {
    .featured-hero-title {
        font-size: 2rem;
    }
}

.intro-arrow-box {
    width: 100%;
    border: 4px solid #cce5ff;
    border-radius: 0.5em;
    background: #203248 url(../png/list-panel86cn.png) top center no-repeat;
}

@media (min-width: 768px) {
    .intro-arrow-box:before, .intro-arrow-box:after {
        top: 50%;
        border: solid transparent;
        content: " ";
        height: 0;
        width: 0;
        position: absolute;
        pointer-events: none;
    }

    .intro-arrow-box:before {
        border-color: rgba(194, 225, 245, 0);
        border-left-color: #cce5ff;
        border-width: 33px;
        margin-top: -33px;
        left: 100%;
    }

    .intro-arrow-box:after {
        border-color: rgba(0, 191, 254, 0);
        border-left-color: #203248;
        border-width: 30px;
        margin-top: -30px;
        right: 0;
        margin-right: -56px;
    }
}

/*------- Extron Control ------- */
.flexible-five-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

    .flexible-five-grid .grid {
        max-width: 100%;
        position: relative;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        width: 20%;
        overflow: hidden;
    }

        .flexible-five-grid .grid.after {
            display: block;
            content: ' ';
            height: 0px;
            clear: both;
            overflow: hidden;
            visibility: hidden;
        }

        .flexible-five-grid .grid .content {
            width: 100%;
            height: 80px;
            padding-right: 1.5em;
        }

@media (max-width: 991.98px) {
    .flexible-five-grid .grid .content {
        width: 33.3333%;
        height: inherit;
    }
}

.flexible-five-grid .grid .extra-content {
    padding-right: 1.5em;
}

@media (max-width: 767.98px) {
    .flexible-five-grid .grid .extra-content {
        height: inherit;
    }
}

.flexible-five-grid .grid:last-child .content, .flexible-five-grid .grid:last-child .extra-content {
    padding-right: 0;
}

@media (max-width: 991.98px) {
    .flexible-five-grid .grid {
        width: 33.3333%;
    }
}

@media (max-width: 767.98px) {
    .flexible-five-grid .grid {
        display: table;
        table-layout: fixed;
        width: 100%;
        margin-bottom: 0;
        padding-left: 1em;
    }

        .flexible-five-grid .grid* {
            display: table-cell;
            width: 100%;
        }
}

.flexible-five-grid .title-system {
    text-transform: uppercase;
    font-size: 1.3em;
    margin-bottom: .5em;
}

@media (max-width: 767.98px) {
    .flexible-five-grid .title-system {
        font-size: .85rem;
    }
}

.flexible-five-grid .title-year {
    font-size: 3em;
    font-weight: 100;
}

@media (max-width: 767.98px) {
    .flexible-five-grid .title-year {
        font-size: 2em;
    }
}

.flexible-five-grid .title-prod {
    font-size: 1.1rem;
}

@media (max-width: 767.98px) {
    .flexible-five-grid .title-prod {
        font-size: 1rem;
    }
}

.flexible-five-grid p {
    color: #616573 !important;
    font-size: .9rem;
    line-height: 1.5;
}

.flexible-five-grid .bar.horizontal {
    position: relative;
    height: .5em;
    margin: .75em 0 1.25em;
}

    .flexible-five-grid .bar.horizontal .icon-control_timeline {
        position: absolute;
        font-size: 1.5em;
        left: 18%;
        top: -100%;
    }

@media (max-width: 767.98px) {
    .flexible-five-grid .bar.horizontal {
        display: none;
    }
}

.flexible-five-grid .graph-1 .bar.horizontal {
    background-color: #6E748C;
}

.flexible-five-grid .graph-1 .bar.vertical {
    border-left-color: #6E748C;
}

.flexible-five-grid .graph-1 .title-system, .flexible-five-grid .graph-1 .title-year, .flexible-five-grid .graph-1 .icon-control_timeline .path1:before {
    color: #6E748C;
}

.flexible-five-grid .graph-2 .bar.horizontal {
    background-color: #CB3A4A;
}

.flexible-five-grid .graph-2 .bar.vertical {
    border-left-color: #CB3A4A;
}

.flexible-five-grid .graph-2 .title-system, .flexible-five-grid .graph-2 .title-year, .flexible-five-grid .graph-2 .icon-control_timeline .path1:before {
    color: #CB3A4A;
}

.flexible-five-grid .graph-3 .bar.horizontal {
    background-color: #14807B;
}

.flexible-five-grid .graph-3 .bar.vertical {
    border-left-color: #14807B;
}

.flexible-five-grid .graph-3 .title-system, .flexible-five-grid .graph-3 .title-year, .flexible-five-grid .graph-3 .icon-control_timeline .path1:before {
    color: #14807B;
}

.flexible-five-grid .graph-4 .bar.horizontal {
    background-color: #80628B;
}

.flexible-five-grid .graph-4 .bar.vertical {
    border-left-color: #80628B;
}

.flexible-five-grid .graph-4 .title-system, .flexible-five-grid .graph-4 .title-year, .flexible-five-grid .graph-4 .icon-control_timeline .path1:before {
    color: #80628B;
}

.flexible-five-grid .graph-5 .bar.horizontal {
    background-color: #A66608;
}

.flexible-five-grid .graph-5 .bar.vertical {
    border-left-color: #A66608;
}

.flexible-five-grid .graph-5 .title-system, .flexible-five-grid .graph-5 .title-year, .flexible-five-grid .graph-5 .icon-control_timeline .path1:before {
    color: #A66608;
}

.flexible-five-grid .bar.vertical {
    display: none;
}

@media (max-width: 767.98px) {
    .flexible-five-grid .bar.vertical {
        position: relative;
        display: table-cell;
        width: 20px;
        border-left: 5px solid;
    }

        .flexible-five-grid .bar.vertical .icon-control_timeline {
            position: absolute;
            font-size: 1.5em;
            left: -15px;
            top: 10%;
        }
}

.flexible-five-grid .bar.vertical.after {
    display: block;
    content: ' ';
    height: 0px;
    clear: both;
    overflow: hidden;
    visibility: hidden;
}

@media (max-width: 767.98px) {
    .flexible-five-grid {
        display: block;
    }
}

/*------- Puthon Advantage ------- */
#python-advantages [class*="icon-"] {
    font-size: 5.1em;
    color: #4484CF;
}

ul.list-checked {
    position: relative;
    list-style-type: none;
    margin-left: 2.14286em;
    padding-left: 0;
}

    ul.list-checked li i {
        left: -1.5em;
        position: absolute;
        color: #2BB673;
        padding-right: 4px;
        margin-top: 5px;
    }

@media (min-width: 75em) {
    #python-advantages .media-heading {
        margin-top: .5em;
    }
}

/*------- Complete Solution ------- */
.cs-bg {
    background: #f0f2f6;
}

.complete-solution {
    background-image: url(../png/complete-solutionu1xk.png);
    background-repeat: no-repeat;
    background-position: center center;
}

    .complete-solution .complete-solution-spacer {
        width: 80px;
        height: 150px;
        float: right;
    }

        .complete-solution .complete-solution-spacer.top {
            width: 120px;
            height: 250px;
        }

@media (max-width: 1349.98px) {
    .complete-solution .complete-solution-spacer.top {
        height: 350px;
    }
}

.complete-solution .complete-solution-spacer.left {
    float: left;
}

@media (max-width: 1199.98px) {
    .complete-solution .complete-solution-spacer {
        display: none;
    }
}

@media (max-width: 1199.98px) {
    .complete-solution {
        background: none;
    }
}

/*------- dark ------- */
.mod-block {
    background-color: #202d3f;
    border-color: #202d3f;
    border-radius: 3px;
    color: #eee;
    -webkit-box-shadow: 7px 7px 10px 0px rgba(0, 0, 0, 0.1);
    box-shadow: 7px 7px 10px 0px rgba(0, 0, 0, 0.1);
}

.cards .card .card-body a:not(.card-link):hover, .card .card-body a:not(.card-link):hover, .card .list-group-item a:hover {
    color: #fff !important;
}