/* =================================================================
   Arabian Servers — Responsive overrides
   ================================================================= */

@media (max-width: 979px) {
    #wrapper {
        width: auto;
        max-width: 100%;
        padding: 0 16px;
    }
    
    .grid-12, .grid-6, .grid-4, .grid-3,
    .span12, .span6, .span4, .span3 {
        float: none !important;
        width: 100% !important;
        margin-left: 0 !important;
    }
    
    .row-fluid [class*="span"] {
        width: 100% !important;
        margin-left: 0 !important;
    }
    
    #nav .container > .main-nav {
        display: none;
    }
    
    #responsive-nav-trigger {
        display: block !important;
    }
}

@media (max-width: 767px) {
    body {
        padding: 0 !important;
    }
    
    #wrapper {
        padding: 0 10px;
        border-radius: 0;
    }
    
    .table-bordered {
        overflow-x: auto;
        display: block;
        -webkit-overflow-scrolling: touch;
    }
    
    h2 { font-size: 18px; }
    h3 { font-size: 15px; }
    
    .brand-logo { width: 42px !important; height: 42px !important; }
    .brand-name { font-size: 20px !important; }
    .brand-subtitle { display: none; }
}

@media (max-width: 480px) {
    .btn { 
        display: block;
        width: 100%;
        margin-bottom: 6px;
    }
    
    .btn-group .btn {
        display: inline-block;
        width: auto;
    }
}