﻿.small-box h2 {
    font-size: 25px;
    font-weight: bold;
    margin: 0 0 10px 0;
    white-space: nowrap;
    padding: 0;
    text-align: center;
}

.small-box > .small-box-header {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: rgba(0, 0, 0, 0.1);
    text-decoration: none;
}

.table-wrapper {
    max-height: 400px;
    overflow: auto;
    display:inline-block;
}

/*.gridElements {
    display: grid;
    grid-template-columns: repeat(8, 1fr);
    grid-gap: 10px;
    grid-auto-rows: 100px;
    grid-template-areas: 
        "a a c d e f g h"
        "i j k l m n o p" 
        "q r s t u v w x"
        "a b c d e f g h";
}
    */

@media (max-height:1024px) and (max-width:768px) and (orientation:portrait) {
    .alignBox {
        bottom: 20px;
    }
    .flexHeader {
        display: flex;
        flex-wrap: nowrap;
    }
    .lookupBox {
        width:360px;
    }
    .lookupBoxLabel {
        padding-left:2px !important
    }
}



@media (max-width:1024px) and (orientation:landscape)  {
    .contentSection {
        margin-left: 0px;
    }
    .flexHeader {
        display: flex;
        flex-wrap: nowrap;
        
    }
    .spaceBoxes {
        margin-bottom: 35px !important;
    }
    .alignBox {
        bottom: 20px;
    }
}


@media (max-width:667px) and (orientation:landscape) {
    .reservationBox {
        margin-bottom:20px;
    }
    .spaceBoxes {
        display: block;
        padding-left: 40px;
    }
    .flexHeader {
        display: flex;
        flex-wrap: nowrap;
        justify-content:space-between
    }
    h1 {
        margin-left:15px !important;
    }

    /*.bg-green.a, .bg-green, .bg-green.h2, .bg-navy, .bg-navy.a, .bg-aqua, .bg-aqua.a {
        width: 50%;
    }
     .bg-yellow, .bg-yellow.a, .bg-red, .bg-red.a {
        width:50%;
        float:right;
    }*/

    .bg-yellow {
        bottom:20px;
    }
}

@media (max-width:812px) and (orientation:landscape) {
    .alignBox {
        bottom: 20px;
    }

    .lookupBox {
        left: 15px;
        padding-right: 35px;
        bottom: 2px
    }

    .selectBoxWidth {
        width: 129px;
        
    }

    .lookupBoxHeader {
        padding-bottom: 7px;
        padding-top: 7px;
    }

    .lookupTitle {
        padding-left: 10px;
    }

    .lookupBoxBody {
        padding-bottom: 9px;
        padding-top: 9px;
    }
    .flexHeader {
        display: flex;
        flex-wrap: nowrap;
    }
    h1 {
        margin-left: 15px !important;
    }
}



@media (max-width:412px) and (orientation:portrait) {
    .bg-green.a, .bg-green, .bg-green.h2, .bg-navy, .bg-navy.a, .bg-aqua, .bg-aqua.a, .bg-yellow, .bg-yellow.a, .bg-red, .bg-red.a {
       width:100% !important;
       height:100% !important;
       margin-right:0px;

    }
  .bg-green {
      margin-bottom:35px;
  }
  .bg-aqua {
      margin-bottom:0px;
  }
    .spaceBoxes {
        display:block;
        padding-left:40px;
    }
   
    .lookupBox {
        margin-top:10px;
    }
    h1 {
        margin-left:15px !important
    }

   
   
}

@media (min-width:1600px) and (orientation:landscape) {

    #stat-boxes {
        margin: 0 0 45px -55px;
        display: flex;
        flex-flow: row nowrap;
        justify-content: space-between;
    }

    .bg-green.a, .bg-green, .bg-green.h2, .bg-navy, .bg-navy.a, .bg-aqua, .bg-aqua.a, .bg-yellow, .bg-yellow.a, .bg-red, .bg-red.a {
        width: 125%;
        height: 115%;
        margin-right: 40%
    }

    .badge {
        width: 100%;
    }

    .whenSmall {
        display: none;
    }

    .spaceBoxes {
        display: flex;
        justify-content: space-around;
        justify-content: flex-start;
        align-items: stretch;
        padding-left: 7px;
        padding-bottom: 20px;
        margin-bottom: 35px !important;
    }

    .small-box-footer {
        top: 40px;
    }

    .small-box h2 {
        font-size: 40px !important;
        padding-top: 35px;
    }

    .box {
        border-top: 2px solid #0076B6 !important;
    }

    .percent-red {
        width: 80% !important;
        background-color: red !important;
    }

    .flexHeader {
        display: flex;
        flex-wrap: nowrap;
    }

    .contentSection {
        margin-left: 0px;
    }

    aside.section {
        margin-left: 0px;
    }

    .lookupBox {
        left: 35px;
        padding-right: 35px;
        bottom: 2px
    }

    .selectBoxWidth {
        width: 129px;
    }

    .lookupBoxHeader {
        padding-bottom: 7px;
        padding-top: 7px;
    }

    .lookupTitle {
        padding-left: 10px;
    }

    .lookupBoxBody {
        padding-bottom: 9px;
        padding-top: 9px;
    }

    .reservationBox {
        /*right: 5px;*/
        left:6px;
    }

    .textExpressBox {
        left: 66px;
    }

    .bounceRateBox {
        left: 127px;
    }

    /*.onlineReturnsBox {
        left: 170px;
    }*/

    .rentalsBox {
        left: 120px;
    }

    .pickupDatesBox {
        width: 252.281px
    }

    .pickupDatesTable {
        margin-left: 6px;
        width: 248px;
    }

    .reservationsGraphBox {
        right: 72px;
        width: 400px;
    }

    .reservationsTable {
        margin-left: 9px;
        width: 390px;
    }

    .deliveryBox {
        left: 3px;
        padding: 0px;
        width: 400px
    }

    .deliveryTable {
        margin-left: 7px;
        width: 394px
    }

    .pullingStatusBox {
        width: 252.281px;
        left: 80px;
        position: relative;
            margin:0px !important
    }

    .pullingStatusTable {
        margin-left: 6px;
        width: 248px;
    }

    .secondRow {
        position: relative;
        display:flex;
        justify-content:space-between;
        justify-content:flex-start;
        margin-bottom:30px;
            
    }

    .roomCountsBox {
        width: 400px;
        right: 75px;
    }

    .roomCountsTable {
        margin-left: 9px;
        width: 391px;
    }

    .dailyCountsBox {
        width: 400px;
    }

    .dailyCountsTable {
        margin-left: 6px;
        width: 394px;
        border-collapse:collapse;
    }

    .dailyCountsTable tr:nth-child(n +9) {
        display:none;
    }
 

    .autoAccessBox {
        width: 252.281px;
        left: 75px;
        position: relative;
    }

    .autoAccessBoxBody {
        width: 252.281px;
    }

    .autoAccessTable {
        margin-left: 6px;
        width: 246.281px;
    }
}
/*#0076B6*/

/*------------------------------ Lookup Page----------------------------*/

.panelPosition {
    margin-top:10px;
}

.list-group {
    margin-bottom:2px !important;
}
ul {
    margin-top:2px !important;
}

/*------------------------------ Internet Orders----------------------------*/

@media (min-width:1600px) and (orientation:landscape) {
    .searchButton {
        margin-right: 35px;
        margin-top: 10px;
        padding-right: 15px;
        padding-left: 15px;
        margin-left:5px;
    }
}

.searchButton {
    float:left!important;
    margin-top: 10px;
    padding-right: 15px;
    padding-left: 15px;
}
.InumberInput {
    margin-left:9px;
}

/*------------------------------ Reservation----------------------------*/

.resultsHeading {
    /*text-align:center;*/
    font-size:larger;
    border-top:none !important;
    margin-left:9px;
}



@media (min-width:1600px) and (orientation:landscape) {
    .searchButtonRes {
        margin-top: 15px;
        /*margin-right: 20px;*/
        margin-left:5px;
    }
    .putSpace {
        display: none;
    }
   
}
.searchButtonRes {
    float:left!important;
    margin-top: 15px;
    /*margin-right: 20px;*/
}

@media (max-width:1024px) and (orientation:landscape) {
    .positionLabel {
        margin-right: 13px;
    }

    .positionLabel2 {
        margin-right: 2px;
    }
    .putSpace {
        display: none;
    }
}

@media (max-width:768px) and (orientation:portrait) {
    .positionLabel2 {
        margin-left: 10px;
    }
    .positionLabel1 {
        margin-left:8px;
        margin-bottom:9px;
    }
    .putSpace {
        display: none;
    }
  
}

@media (max-width:375px) and (max-height:667px) and (orientation:portrait) {
    .positionLabel {
        margin-left:10px;
        margin-right:10px;
    }
    .putSpace {
        display: none;
    }
}

@media (max-width:667px) and (orientation:landscape) {
    .positionLabel {
        margin-right:12px;
    }
    .putSpace {
        display: none;
    }
}
@media (max-width:375px) and (orientation:portrait) {
    .positionLabel {
        margin-right:10px;
        margin-left:10px;
    }
    .putSpace {
        display:none;
    }
}

@media (max-width:812px) and (orientation:landscape) {
    .putSpace {
        display:block;
        margin-top:5px;
    }
    positionLabel2 {
        margin-top:10px;
    }
}

/*---------------------ReservationStatsPage------------------------------*/

@media (min-width:1600px) and (orientation:landscape) {
    .reservationBoxRS {
        /*right: 65px !important;*/
        
    }

    .reservationsGraphBoxRS {
       
    }
    .reservationsTableRS {
        
    }

    .spaceBoxesRS {
        display:flex !important;
        justify-content:flex-start !important;
        left:55px;
    }
    .bounceRateBoxRS {
        /*left:54px !important;*/
    }
    .pickupDatesPosition {
        left:13px !important;
    }
    .pullingStatusPosition {
        right:13px;
    }
    .resTermGraphPosition {
        
    }
    .bounceRateGraphPosition {
        
    }

    .roomCountsPosition {
        left: 120px;
    }
        
    .resPosition {
        left:31px;
    }
    
    .moveRow{
        margin-left:40px!important;
    }

    .dailyCountsPosition {
        width:430px;
       
    }
    .spaceRow {
        left:15px;
    }
    .moveRentalsBox {
        /*left:32.5%;*/
    }
    .autoAccessBoxR {
        left:7px !important;
    }
    .moveOnlineReturnsBox {
        /*left:29% !important;*/
    }
}



@media(min-width:1025px) and (max-width:1366px) and (orientation:landscape) {
    .reservationBoxRS {
        top:20px;
    }
}


@media (min-width:413px) and (max-width:767px) {
    .reservationBoxRS {
        right: 0px !important;
        margin-bottom:20px;
    }
}

@media (max-width:646px) and (orientation:portrait) {
    .reservationBoxRS {
        right: 0px !important;
        
    }

    .bounceRateBoxRS {
        left: 0px !important;
        right:6px !important;
           
    }
    .forSmall {
        font-size:22px !important;
    }
    .alignBoxRS {
        /*right:6px !important;*/
        /*right:17px!important;*/
    }

    .pickupDatesPosition {
        left:0px;
    }
    .pullingStatusPosition {
        right:0px;
    }

    .resTermGraphPosition {
        margin-bottom:20px;
    }
    .bounceRateGraphPosition {
        margin-bottom: 20px;
    }

    .roomCountsPosition {
        margin-bottom: 10px;
    }

    .canvasjs-chart-canvas {
        right:0px !important
    }
    .moveCharts {
        margin-top:168px;
    }
    .moveRentalsBox {
        left:0px;
        bottom:4px;
    }
    .moveOnlineReturnsBox {
        left: 0px !important;
    }
    .spaceRow {
        left:0px !important
    }
}

@media (max-width:667px) and (orientation:landscape) {
    .reservationBoxRS {
        right: 0px !important;
    }

    .bounceRateBoxRS {
        left: 0px !important;
        right: 6px !important;
    }

    .forSmall {
        font-size: 22px !important;
    }

    /*.alignBoxRS {
        right: 6px !important
    }*/

    .pickupDatesPosition {
        left: 0px;
    }

    .pullingStatusPosition {
        right: 0px;
    }

    .resTermGraphPosition {
        margin-bottom: 20px;
    }

    .bounceRateGraphPosition {
        margin-bottom: 20px;
    }

    .roomCountsPosition {
        margin-bottom: 10px;
    }

    .canvasjs-chart-canvas {
        right: 0px !important
    }

    /*.moveCharts {
        margin-top: 168px;
    }*/

    .moveRentalsBox {
        left:0px;
        bottom: 4px;
    }
    .moveOnlineReturnsBox {
        top:20px !important;
        left:0px !important;
    }
}

@media (min-width:1367px) and (max-width:1599px)  {
    .reservationBoxRS {
        right: 0px !important;
        top: 19px;
    }
}




@media (min-width:770px) and (max-width:774px) {
    .reservationBoxRS {
        right: 0px !important;
        top:19px;
    }

}

@media (min-width:768px) and (orientation:portrait) {
    .reservationBoxRS {
        right: 0px !important;
    }

    .bounceRateBoxRS {
        left: 0px !important;
        right: 6px !important;
    }

    .forSmall {
        font-size: 22px !important;
    }

    .alignBoxRS {
        right: 6px !important
    }

    .pickupDatesPosition {
        left: 0px;
    }

    .pullingStatusPosition {
        right: 0px;
    }

    .resTermGraphPosition {
        margin-bottom: 20px;
    }

    .bounceRateGraphPosition {
        margin-bottom: 20px;
    }

    .roomCountsPosition {
        margin-bottom: 10px;
    }

    .canvasjs-chart-canvas {
        right: 0px !important
    }

    .moveCharts {
        margin-top: 35px;
    }

    .moveRentalsBox {
        /*left: 148px!important;*/
        top:20px;
    }

    .moveOnlineReturnsBox {
        top: 20px !important;
        left: 0px !important;
    }

    .autoAccessBoxR {
        top:20px !important
    }
}

@media (max-width:736px) and (orientation:landscape) {
    .canvasjs-chart-canvas {
        right: 0px !important;
        left: 0px !important
    }

    .moveCharts {
        top:170px!important;
        margin-bottom:187px!important;
    }
    .reservationBoxRS {
        margin-bottom:20px!important
    }
    
}


@media (width:1024px) and (orientation:landscape) {
    .moveRentalsBox {
              
    }
    .moveOnlineReturnsBox {
        /*left:4%;*/
        right:2.3%;
    }
}

.top-buffer {
     margin-top: 20px;
}
