/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    #landing, #slideshow, #slideshow li, .sy-box {
        background-size: cover !important;
        background-position: 70% 50%;
    }
    body > header{padding: 0px;padding-left: 15px;}
    header > nav{display: none;}
    div.flex-box {display: block;    margin-top: 0px !important;}
    div.ba-sub { margin-top:15px !important;}
    div.ib-item{width: 100%;}
    div.ib-3-item{width: 100%;text-align: center;}
    div.ib-4-item{max-width: 100%;padding: 15px;}
    section > header{padding: 15px;margin-top: 6px;}
    h1{font-size: 1.3em;text-align: center;}
    section > header i{font-size: 50px;}
    .app-item > footer, .document-item > footer{display: block}
    .app-item > footer a, .document-item > footer a{display: block;text-align: center;padding: 15px;font-size:0.9em !important;}
    #user-control{width: 50px;height: 50px;}
    .slide-0{left: 0px; right: 0px; width: 100%;text-align: center;}
    .slide-0 h1{font-size: 100px;}
    .slide-0 h2{font-size: 150%;margin-left:15px;margin-right:15px;}
    .c-orange{ font-size:5em !important;margin-top:0px !important;text-transform: uppercase;}
    .slide-landing { padding-left:20px;}
    .landing-title  { border-right: none !important;border-bottom: 7px solid rgb(204, 204, 204);margin-bottom: 15px !important; }
    .c-subtitle {font-size: 1.5em !important;}
    .kpis-list{ overflow: auto;margin-left: 5px;margin-right: 5px;}
    .stat .eoy-closing{ font-size:40px;}
    .dashboard-url {display:none !important;}
    .k-tabstrip .k-tabstrip-items .k-link { font-size:0.7em !important;}
    .sy-pager {display:none !important;}
    #dashboard-filtering-tabs .k-item{margin:0px !important;}
    .filtering-tabs .k-state-active {
        border-bottom: 3px solid #ed7525;
    }
    .demo-section{ margin:0px !important;}
    .landing-sub-title {margin:15px;}
    .company-info {margin-bottom:45px;}
    nav.mb ul li a i {
        margin-right:15px;
    }
    .filtering-tabs .k-item {
        font: 16px Arial,sans-serif;
    }
    .kpis-list div {
        border: none !important;
    }
    .kpi-container {
        margin: 0px;
        margin-top:15px;
        width: 100%;
    }
    .social-networks {display:none;}
    .yearfiltering-tabs { z-index:1;}
    .kpi-container h2 {
        margin-top: 5px;
    }
    #user-control{display: none;}
    #nav-handler{display: block;}
    div.ib-5-item {width: 100%;padding: 15px;}
    .portal-main {margin-top:-6px;}
    div.vertical-nav-container {
        margin-right: 0px;
    }
    section > div.content-100 {padding: 0px;}
    #modal-app-title{text-align: center;margin-top: 20px;font-size: 1.4em;}
    a.orange-bt{display: block;position: fixed;
        bottom: 0px;
        width: 100%;
        padding: 15px;}
    .ba-icon { display:none;}
    .fz-0{ margin-bottom:40px;}
    .dashboard-bt{display: none;}
    .mb-dashboard-bt{display: block;}
    div.vertical-nav-container h3 { margin-top: 0px;}
    div.ib-item {margin:inherit; padding:15px !important;margin-bottom: 0px;}
    .ib-item-img{margin-bottom: 15px; }
} 

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
    body > header{padding: 0px;padding-left: 15px;}
    header > nav{display: none;}
    section > header{padding: 15px;}
    h1{font-size: 1.3em;}
    section > header i{font-size: 50px;}
    .app-item > footer, .document-item > footer{display: block}
    .app-item > footer a, .document-item > footer a{display: block;text-align: center;padding: 15px;}
    #user-control{width: 50px;height: 50px;}
    .slide-0{left: 0px; right: 0px; width: 100%;text-align: center;}
    .slide-0 h1{font-size: 100px;}
    .slide-0 h2{font-size: 30px;}
    #user-control{display: none;}
    #nav-handler{display: block;}
    
    div.ib-3-item{width: 50%;text-align: center;}
    div.flex-box {display: block;margin-top:15px}
    div.ib-item{width: 100%;}
    div.ib-4-item{max-width: 100%;padding: 15px;}
    div.ib-5-item {width: 100%;padding: 15px;}
    div.vertical-nav-container {margin-right: 0px;}
    section > div.content-100 {padding: 0px;}
    #modal-app-title{text-align: center;}
    a.orange-bt{display: block;margin-top: 30px;}
    .dashboard-bt{display: none;}
    .mb-dashboard-bt{display: block;}
} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
    div.ib-item{width: 50%;}
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
    body > header{padding:15px 30px;}
    header > nav{display: block;}
    section > header{padding: 30px;}
    h1{font-size: 3em;}
    section > header i{font-size: 100px;}
    .app-item > footer{display: flex}
    .app-item > footer a{text-align: left;padding: 0px;}
    #user-control{width: auto;height: auto;padding: 16px 19.25px;}
    .slide-0 h1{font-size:200px;}
    .slide-0 h2{font-size:36px;}
    #user-control{display: block;}
    #nav-handler{display: none;}
    
    div.ib-3-item{width: 25%;}
    div.flex-box {display: flex;}
    div.ib-item{width: 22%;}
    div.ib-4-item{max-width: 400px;padding: 15px;}

    div.ib-5-item {/*width: 50%;*/padding: 30px;}
    div.vertical-nav-container {margin-right: 30px;width: 230px;}
    section > div.content-100 {padding: 30px;}
    #modal-app-title{text-align: left;}
    a.orange-bt{display: inline-block;margin-top: 0px;    margin-left: 30px;}
    .dashboard-bt{display: block;}
    .mb-dashboard-bt{display: none;}
} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {}