@media (min-width: 390px) {
    
    /* Header */
    .navbar-toolbar button {padding: 0 12px;}
    .navbar-toolbar button span.line > span {width:34px;}
    .navbar-toolbar button.search-toggler i {width:34px;}
    
    /* Index */
    .indexgrid .grid-item {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width:50%; }
    .indexgrid .grid-item:nth-child(3) {border-left: solid 1px rgba(255, 255, 255, 0.15);}
    .indexgrid .grid-item:nth-child(5) {border-left: solid 1px rgba(255, 255, 255, 0.15);}
    .indexgrid .grid-item:nth-child(7) {border-left: solid 1px rgba(255, 255, 255, 0.15);}
    .indexgrid .grid-item a {-webkit-box-pack:center; -ms-flex-pack:center; justify-content: center; -ms-flex-direction: column; flex-direction: column; font-size: 18px; padding:15px 10px 15px 10px; height: 115px; line-height:1.2}
    .indexgrid .grid-item a br {display: block;}
    .indexgrid .grid-item a i.icon {display: none;}
    .indexgrid .grid-item a i.fas {font-size: 28px; margin: 5px auto 15px; width: auto;}
    
    .indexgrid .grid-item.wide {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width:100%;}
    .indexgrid .grid-item.wide a {-webkit-box-pack:center; -ms-flex-pack:center; justify-content: center; -ms-flex-direction: row; flex-direction: row; height: auto; padding:17px 10px 17px 10px;}
    .indexgrid .grid-item.wide a i.fas {margin: 0 15px 0 0;}
    
    /* New Vendors */
    #newvendors .row > div {margin-bottom:10px; padding-left: 5px; padding-right:5px;}
    #newvendors .row a {-webkit-box-pack: center; -ms-flex-pack:center; justify-content: center; padding-left: 5px; padding-right: 5px; text-align: center; height: 75px;}
    #newvendors .row a i {display: none;}
    
    /* Cats */
    .singlecat .row > div {margin-bottom:10px; padding-left: 5px; padding-right:5px;}
    .singlecat .row a {-webkit-box-pack: center; -ms-flex-pack:center; justify-content: center; padding-left: 5px; padding-right: 5px; text-align: center; height: 75px;}
    .singlecat .row a i {display: none;}
    
    /* Locations */
    button#dropdownlocation {max-width: 300px;}
    #locationlist {max-width: 300px;}
    
}

@media (min-width: 576px) {
    .modal.lto .modal-dialog {max-width: 800px; width: auto;}
    
    #splash > div img {width:265px;}
    #splash > div span {font-size: 22px; width:300px; margin-top:30px;padding-top:15px;}
    
    /* Header */
    header .sitetitle.smallscreen {display: none;}
    header .sitetitle.largescreen {display: block;}
    .navbar-toolbar button span.line > span {width:36px;}
    .navbar-toolbar button.search-toggler i {width:36px;}
    
    /* Footer */
    footer {font-size: 12px;}
    
    /* Index */
    .logo {padding: 20px 0px;}
    .logo a img {/*width:215px;*/ width:175px;}
    .indexgrid .grid-item a br {display: none;}
    
    /* Inside Pages */
    a#historyback.end {bottom:65px;}
    .pagetitle h1 {font-size: 20px;}
    
    .toplinks .col-12 {margin-bottom: 15px; padding-left: 15px; padding-right: 15px;}
    .toplinks .card-body a {-ms-flex-direction: column; flex-direction: column; padding: 0px 15px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 135px;}
    .toplinks .card-body a i.fas {font-size: 32px; margin: 0 auto 15px; width: auto;}
    .toplinks .card-body a i.icon {display: none;}
    .toplinks .card-body a h5 {font-size: 20px;}
    
    /* Vendors */
    ul.vendors {padding: 0 30px 0 0;}
    
    /* Business */
    #business-buttons {-webkit-flex-flow:row wrap;-moz-flex-flow: row wrap;-ms-flex-flow: row wrap;flex-flow: row wrap; }
    #business-buttons a.btn {width:auto;}
    
    /* Locations */
    #locationlist > div {max-height:400px;}
    
    /* LTO */
    .ltoinfo > .links a.btn {width:auto; margin: 5px 5px;}
    
     /** Form Pages **/
    .formContainer .form-group.half {width:48%;}
    .formContainer .form-group.half.left {margin-right:4%;}
    
}

@media (min-width: 768px) {
    
    /* Index 
    .indexgrid .grid-item {-ms-flex: 0 0 33.333333%; flex: 0 0 33.333333%; max-width:33.333333%;}
    .indexgrid .grid-item:nth-child(4) {border-left: solid 1px rgba(255, 255, 255, 0.15);}
    .indexgrid .grid-item:nth-child(5) {border-left:none;}
    .indexgrid .grid-item:nth-child(6) {border-left: solid 1px rgba(255, 255, 255, 0.15);}
    .indexgrid .grid-item:nth-child(7) {border-left: solid 1px rgba(255, 255, 255, 0.15);}*/
    .indexgrid .grid-item a {font-size: 22px; height:132px;}
    .indexgrid .grid-item a i.fas {font-size: 32px; margin: 10px auto 15px;}
    
    .indexgrid .grid-item.wide a {height:auto;}
    
    /* National Educator Discounts */
    .nationallinks .grid .item {-ms-flex:0 0 20%; flex: 0 0 20%; max-width:20%; }
}

@media (min-width: 992px) {
    /* National Educator Discounts */
    .nationallinks .grid .item {-ms-flex:0 0 16.666667%; flex: 0 0 16.666667%; max-width:16.666667%; }
    
}

@media (min-width: 1024px) {
    /* INdex */
    .indexgrid .grid-item a {font-size: 26px;}
    .indexgrid .grid-item a i.fas {font-size: 36px; margin: 10px auto 25px;}
}

@media (max-height: 667px) and (orientation: landscape) { 
    /* Vendors */
     #alpha > div > span > a {font-size:12px;margin: 0px 0px 0px 0px;}
}

@media (max-width:667px) and (max-height:375px) {
    /* Vendors */
    #alpha {}
    #alpha > div > span > a {font-size:11px;margin: 0px 0px 0px 0px;}
}

@media (max-width: 390px) {
    /* National Educator Discounts */
    .nationallinks .grid .item {padding-left: 5px; padding-right: 5px;}
    .nationallinks a.card .card-title {font-size: 15px;}
    
}

@media (max-width:389px) {
    /* New Vendors */
    #newvendors .row > div {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    
    /* Cats */
    .singlecat .row > div {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    
    /* National Educator Discounts */
    .nationallinks .grid .item {-ms-flex: 0 0 50%; flex: 0 0 50%; max-width: 50%;}
    
    /* Search */
    #resultsgrid .row > div {-ms-flex: 0 0 100%; flex: 0 0 100%; max-width: 100%;}
    
}
@media (max-width: 360px) {
    /* Header */
    .navbar-toolbar button span.line > span {width: 32px;}
    .navbar-toolbar button.search-toggler i {width: 32px;}
    header a.navbar-brand {font-size: 13px;}
    
    /* Category */
    #alpha > div span a {font-size: 13px;}
}

html.ie .ltoImage img.img-fluid {width:100% !important;}
html.ie select::-ms-expand {display: none;}

html.webapp body.iphoneX footer .container-fluid {padding-bottom: 20px;}
html.webapp body.iphoneXR footer .container-fluid {padding-bottom: 20px;}
html.webapp body.iphone12 footer .container-fluid {padding-bottom: 20px;}