/* Desktops and laptops ----------- */
 @media only screen {
    /* Styles */
     #deckListBox {
         width:300px;
         border-radius: 2px;
         height:150px 
    }
     option {
         background: white;
    }
     option:nth-child(odd) {
         background: #F0F0FE;
    }
     #deck_form {
         position:absolute;
         margin:auto;
         left:5%;
         right:0%;
         width: 400px;
    }
     #deck_submit {
         float: right;
    }
     #current_slide_show {
         position:absolute;
         width:330px;
         margin:auto;
         left:0%;
         right:0%;
         vertical-align: middle;
    }
     #slide_showCtrls_font {
         font-size: 40px;
    }
     #navBar_show {
         position:absolute;
         width:150px;
         height:50px;
         margin:auto;
         text-align: center;
         padding: 0px;
         left:0%;
         right:0%;
         z-index: 20;
         margin-top:320px;
    }
     #prev_slide_show {
         margin-left:20px;
         padding: 0px;
         width: 0px;
         height:0px;
         border: 0px;
         margin-left: -20px;
    }
     #next_slide_show {
         margin-left:20px;
         padding: 0px;
         width: 0px;
         height:0px;
         border: 0px;
         margin-left: 150px;
    }
     .cover {
         position:absolute;
         width:320px;
         height:320px;
         margin:auto;
         display: block;
         padding: 0px;
         z-index: 10;
         border-radius: 12px;
         border: solid;
    }
     .cover-mg {
         position:absolute;
         width:300px;
         height:340px;
         margin:auto;
         display: block;
         padding: 0px;
         z-index: 5;
         left:0%;
         right:0%;
         border: 0px;
    }
     .cover-bg {
         position:absolute;
         width:280px;
         height:360px;
         margin:auto;
         display: block;
         padding: 0px;
         z-index: 2;
         left:0%;
         right:0%;
         border: 0px;
    }
     .deck-search-box {
         border: 1px solid #ccc;
         border-radius: 4px;
         display: inline-block;
         padding: 6px 12px;
         width: 300px;
    }
     .search-label {
         display: inline-block;
         color: #AAAAAA;
         width: 250px;
         border: 0px;
         border-radius: 4px;
         outline-width: 0;
    }
     .icon_row {
         vertical-align: top;
    }
     .icon_cell {
         padding-left: 150px;
         padding-top:30px;
    }
     .icon_namebox {
         padding-top: 30px;
    }
     .deck-spacing {
         padding-left:50px;
    }
     .deck-table {
         margin:auto;
         left:0%;
         right:0%;
    }
     .slider-spacing {
         padding-left: 135px;
    }
     .list-item {
         border: hidden;
         border-radius: 6px;
         background-color: #EEEEEE;
         width:80px;
         height: 70px;
    }
     .list-item-icon {
         margin-top: 8%;
         border-radius: 4px;
         width: 40px;
         height:40px;
    }
     #public_font {
         font-size:22px;
    }
     #public_mode {
         width: 100px;
         border: 0px;
         outline: none;
         background-color:#FFFFFF 
    }
     #autoPlay_mode {
         width: 130px;
         border: 0px;
         outline: none;
         text-align: left;
         background-color:#FFFFFF;
    }
     #deck_add_font {
         font-size: 20px;
    }
     #deck_delete_font {
         font-size: 22px 
    }
     #deckListContainer {
         position:absolute;
         margin:auto;
         left:50px;
         right:0%;
         width:350px;
    }
     #crudBar_deck {
         position:relative;
         margin:auto;
         left:30px;
         right:0%;
         width:350px;
         top:350px;
    }
     #Dedit_mode {
         margin-left:25px;
         padding: 0px;
         width: 40px;
         height:40px;
         border: 0px;
         background-color:#FFFFFF;
    }
     #Dpresent_mode {
         margin-left:20px;
         padding: 0px;
         width: 40px;
         height:40px;
         border: 0px;
         background-color:#FFFFFF;
    }
     #Dcreate_mode {
         margin-left:20px;
         padding: 0px;
         width: 40px;
         height:40px;
         border: 0px;
         background-color:#FFFFFF;
    }
     #Dclone_mode {
         margin-left:20px;
         padding: 0px;
         width: 40px;
         height:40px;
         border: 0px;
         background-color:#FFFFFF 
    }
     #Ddelete_mode {
         margin-left:20px;
         padding: 0px;
         width: 40px;
         height:40px;
         border: 0px;
         background-color:#FFFFFF 
    }
    /*** Scroll bar styles **/
     .flexcroll{
         overflow:scroll;
         overflow-x:hidden;
    }
     .flexcroll{
         scrollbar-face-color: #367CD2;
         scrollbar-shadow-color: #FFFFFF;
         scrollbar-highlight-color: #FFFFFF;
         scrollbar-3dlight-color: #FFFFFF;
         scrollbar-darkshadow-color: #FFFFFF;
         scrollbar-track-color: #FFFFFF;
         scrollbar-arrow-color: #FFFFFF;
    }
    /* Let's get this party started */
     .flexcroll::-webkit-scrollbar {
         width: 12px;
    }
    /* Track */
     .flexcroll::-webkit-scrollbar-track {
         -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
         -webkit-border-radius: 10px;
         border-radius: 10px;
    }
    /* Handle */
     .flexcroll::-webkit-scrollbar-thumb {
         -webkit-border-radius: 10px;
         border-radius: 10px;
         background: rgba(200,200,200,0.8);
         -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
    }
    
    .deckType {
        font-size: 13px;
        color: var(--mdc-theme-on-secondary);
        width: 150px;
        text-align: left;
    }
    
    .deckCardTitle {
        font-size: 24px;
        font-family: sans-serif;
        font-weight: bold;
        color: var(--mdc-theme-on-secondary)
    }
    
    #expanded_deckcontent {
        display: block;
    }
    
}
