/* ----------------------------------------------------WEB VIEW-------------------------------- */
@media screen and (min-width: 800px){
    body{
        background-color: black;
    }

    /*Gallery Container*/
    #index-gallery-t, #index-gallery-h, #index-gallery-w,#index-gallery-all {
        padding-top: 2%;
        padding-bottom: 5%;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: auto;
        grid-gap: 20px;
        grid-template:
        "img1 img2 img3 img4"
        "img5 img6 img7 img8"
        "img9 img10 img11 img12"
        "img13 img14 img15 img16"
        "img17 img18 img19 img20"
        "img21 img22 img23 img24"
        "img25 img26 img27 img28"
        "img29 img30 img31 img32"
        "img33 img34 img35 img36"
        "img37 img38 img39 img40"
        "img41 img42 img43 img44"
        "img45 img46 img47 img48"
        "img49 img50 img51 img52"
        "img53 img54 img55 img56"
        "img57 img58 img59 img60"
        "img61 img62 img63 img64"
        "img65 img66 img67 img68"
        "img69 img70 img71 img72"
        "img73 img74 img75 img76"
        "img77 img78 img79 img80"
        "img81 img82 img83 img84"
        "img85 img86 img87 img88"
        "img89 img90 img91 img92"
        "img93 img94 img95 img96"
        "img97 img98 img99 img100"
        "img101 img102 img103 img104"
        "img105 img106 img107 img108"
        "img109 img110 img111 img112"
        "img113 img114 img115 img116"
        "img117 img118 img119 img120"
        "img121 img122 img123 img124"
        "img125 img126 img127 img128"
        "img129 img130 img131 img132"
        "img133 img134 img135 img136"
        "img137 img138 img139 img140"
        "img141 img142 img143 img144"
        "img145 img146 img147 img148"
        "img149 img150 img151 img152"
        "img153 img154 img155 img156"
        "img157 img158 img159 img160"
        "img161 img162 img163 img164"
        "img165 img166 . ."
            ;
    }

    #index-gallery-t .tile-gallery-img, #index-gallery-h .hardwood-gallery-img, #index-gallery-w .woodfloor-gallery-img, #index-gallery-all .all-gallery-img{
        width: 200px;
        height: 200px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        cursor: pointer;
    }


    /* Gallery image styling*/
    .tile-gallery-img div , .hardwood-gallery-img div, .woodfloor-gallery-img div , .all-gallery-img div{
        width: 100%;
        height: 100%;
        background-color: black;
        opacity: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .tile-gallery-img a , .hardwood-gallery-img a , .woodfloor-gallery-img a, .all-gallery-img a{
        font-size: 10px;
        color: white;
        text-decoration: none;
        text-transform: uppercase;
    }
    .tile-gallery-img div:hover, .hardwood-gallery-img div:hover, .woodfloor-gallery-img div:hover, .all-gallery-img div:hover{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
    }

    /* Popup window when clicked*/
    .img-window{
        margin-top: 5%;
        width: 100vw;
        height: 100vh;
        background-color: rgba(0,0,0,0.7);
        position: fixed;
        top: 0;
        left: 0;
        cursor: pointer;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 100;
        -webkit-animation-name: fadeIn;
        -webkit-animation-duration: 5s;
        animation-name: fadeIn;
    }
    .img-window img{
        max-height: 80vh;
        max-width: 80vw;
        -webkit-animation-name: fadeIn;
        -webkit-animation-duration: 5s;
        animation-name: fadeIn;
    }

    @-webkit-keyframes fadeIn {
        0% {opacity: 0;}
        20% {opacity: 1;}
    }
    @keyframes fadeIn {
        0% {opacity: 0;}
        20% {opacity: 1;}
    }
    

    /* Button Next */
    .img-btn-next{
        display: block;
        padding: 0px 20px;
        border-radius: 50%;
        background-color: white;
        position: fixed;
        top: 68vh;
        z-index: 500;
        color: black;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 50px;
    }
    .img-btn-next:hover {
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(1.08);
    }
    .img-btn-next:active{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(0.95);
        color: rgb(85, 109, 189);
    }

    /* Button Prev */
    .img-btn-prev {
        display: block;
        padding: 0px 20px;
        border-radius: 50%;
        background-color: white;
        position: fixed;
        top: 68vh;
        z-index: 500;
        color: black;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 50px;
    }
    .img-btn-prev:hover {
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(1.08);
    }
    .img-btn-prev:active{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(0.95);
        color: rgb(85, 109, 189);
    }

}

/*------------------------------------------------------ PHONE VIEW ------------------------------------------------------ */
@media screen and (max-width: 799px){

    body{
        background-color: black;
    }

    /*Gallery Container*/
    #index-gallery-t, #index-gallery-h, #index-gallery-w,  #index-gallery-all{
        position: relative;
        padding-top: 5%;
        padding-bottom: 20%;
        display: grid;
        grid-template-columns: 1fr 1fr 1fr 1fr;
        grid-template-rows: auto;
        grid-gap: 15px;
        grid-template:
            
             "img1 img2"
            "img3 img4"
            "img5 img6"
            "img7 img8"
            "img9 img10"
            "img11 img12"
            "img13 img14"
            "img15 img16"
            "img17 img18"
            "img19 img20"
            "img21 img22"
            "img23 img24"
            "img25 img26"
            "img27 img28"
            "img29 img30"
            "img31 img32"
            "img33 img34"
            "img35 img36"
            "img37 img38"
            "img39 img40"
            "img41 img42"
            "img43 img44"
            "img45 img46"
            "img47 img48"
            "img49 img50"
            "img51 img52"
            "img53 img54"
            "img55 img56"
            "img57 img58"
            "img59 img60"
            "img61 img62"
            "img63 img64"
            "img65 img66"
            "img67 img68"
            "img69 img70"
            "img71 img72"
            "img73 img74"
            "img75 img76"
            "img77 img78"
            "img79 img80"
            "img81 img82"
            "img83 img84"
            "img85 img86"
            "img87 img88"
            "img89 img90"
            "img91 img92"
            "img93 img94"
            "img95 img96"
            "img97 img98"
            "img99 img100"
            "img101 img102"
            "img103 img104"
            "img105 img106"
            "img107 img108"
            "img109 img110"
            "img111 img112"
            "img113 img114"
            "img115 img116"
            "img117 img118"
            "img119 img120"
            "img121 img122"
            "img123 img124"
            "img125 img126"
            "img127 img128"
            "img129 img130"
            "img131 img132"
            "img133 img134"
            "img135 img136"
            "img137 img138"
            "img139 img140"
            "img141 img142"
            "img143 img144"
            "img145 img146"
            "img147 img148"
            "img149 img150"
            "img151 img152"
            "img153 img154"
            "img155 img156"
            "img157 img158"
            "img159 img160"
            "img161 img162"
            "img163 img164"
            "img165 img166"
            ;
    }

    #index-gallery-t .tile-gallery-img, #index-gallery-h .hardwood-gallery-img, #index-gallery-w .woodfloor-gallery-img , #index-gallery-all .all-gallery-img{
        width: 120px;
        height: 120px;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        cursor: pointer;
    }


    /* Gallery image styling*/
    .tile-gallery-img div , .hardwood-gallery-img div, .woodfloor-gallery-img div, .all-gallery-img div{
        width: 100%;
        height: 100%;
        background-color: black;
        opacity: 0;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .tile-gallery-img a , .hardwood-gallery-img a , .woodfloor-gallery-img a, .all-gallery-img a{
        font-size: 10px;
        color: white;
        text-decoration: none;
        text-transform: uppercase;
    }
    .tile-gallery-img div:hover, .hardwood-gallery-img div:hover, .woodfloor-gallery-img div:hover, .all-gallery-img div:hover{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
    }

    /* Popup window when clicked*/
    .img-window{
        margin-top: 5%;
        width: 137vw;
        height: 130vh;
        background-color: rgba(0,0,0,0.7);
        position: fixed;
        top: 0px;
        left: 0px;
        cursor: pointer;
        display: flex;
        /* justify-content: center; */
        align-items: center;
        z-index: 100;
        -webkit-animation-name: fadeIn;
        -webkit-animation-duration: 5s;
        animation-name: fadeIn;
    }
    .img-window img{
        max-height: 75vh;
        max-width: 75vw;
        margin-left: 9%;
        margin-top: -25vh;
        justify-content: center;
        -webkit-animation-name: fadeIn;
        -webkit-animation-duration: 5s;
        animation-name: fadeIn;
    }

    @-webkit-keyframes fadeIn {
        0% {opacity: 0;}
        20% {opacity: 1;}
    }
    @keyframes fadeIn {
        0% {opacity: 0;}
        20% {opacity: 1;}
    }

    /* Button Next */
    .img-btn-next{
        display: block;
        margin-right: 15px;
        padding: 0px 15px;
        border-radius: 50%;
        background-color: white;
        position: fixed;
        top: 50vh;
        z-index: 500;
        color: black;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 50px;
        -webkit-tap-highlight-color: transparent;
    }
    .img-btn-next:hover {
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(1.08);
    }
    .img-btn-next:active{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(0.95);
        color: rgb(85, 109, 189);
    }

    /* Button Prev */
    .img-btn-prev {
        display: block;
        margin-left: 15px;
        padding: 0px 15px;
        border-radius: 50%;
        background-color: white;
        position: fixed;
        top: 50vh;
        z-index: 500;
        color: black;
        cursor: pointer;
        text-transform: uppercase;
        font-size: 50px;
        -webkit-tap-highlight-color: transparent;
    }
    .img-btn-prev:hover {
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(1.08);
    }
    .img-btn-prev:active{
        opacity: 0.7;
        transition: all ease-in-out 100ms;
        transform: scale(0.95);
        color: rgb(85, 109, 189);
    }
}




/* Library Wrapper */
.wrapper-gallery{
    margin:0 20vw;
    margin-left: 16%;
    margin-right: 14%;
} 





 /* --------------------------------------------------Tile Images--------------------------------------*/

#index-gallery-t .img1{
    grid-area: img1;
    background-image: url("imgs/img/thumbs/Tiles/img1.jpeg");
}
#index-gallery-t .img2{
    grid-area: img2;
    background-image: url("imgs/img/thumbs/Tiles/img2.jpeg");
}
#index-gallery-t .img3{
    grid-area: img3;
    background-image: url("imgs/img/thumbs/Tiles/img3.jpeg");
}
#index-gallery-t .img4{
    grid-area: img4;
    background-image: url("imgs/img/thumbs/Tiles/img4.jpeg");
}
#index-gallery-t .img5{
    grid-area: img5;
    background-image: url("imgs/img/thumbs/Tiles/img5.jpeg");
}
#index-gallery-t .img6{
    grid-area: img6;
    background-image: url("imgs/img/thumbs/Tiles/img6.jpeg");
}
#index-gallery-t .img7{
    grid-area: img7;
    background-image: url("imgs/img/thumbs/Tiles/img7.jpeg");
}
#index-gallery-t .img8{
    grid-area: img8;
    background-image: url("imgs/img/thumbs/Tiles/img8.jpeg");
}
#index-gallery-t .img9{
    grid-area: img9;
    background-image: url("imgs/img/thumbs/Tiles/img9.jpeg");
}
#index-gallery-t .img10{
    grid-area: img10;
    background-image: url("imgs/img/thumbs/Tiles/img10.jpeg");
}
#index-gallery-t .img11{
    grid-area: img11;
    background-image: url("imgs/img/thumbs/Tiles/img11.jpeg");
}
#index-gallery-t .img12{
    grid-area: img12;
    background-image: url("imgs/img/thumbs/Tiles/img12.jpeg");
}
#index-gallery-t .img13{
    grid-area: img13;
    background-image: url("imgs/img/thumbs/Tiles/img13.jpeg");
}
#index-gallery-t .img14{
    grid-area: img14;
    background-image: url("imgs/img/thumbs/Tiles/img14.jpeg");
}
#index-gallery-t .img15{
    grid-area: img15;
    background-image: url("imgs/img/thumbs/Tiles/img15.jpeg");
}
#index-gallery-t .img16{
    grid-area: img16;
    background-image: url("imgs/img/thumbs/Tiles/img16.jpeg");
}
#index-gallery-t .img17{
    grid-area: img17;
    background-image: url("imgs/img/thumbs/Tiles/img17.jpeg");
}
#index-gallery-t .img18{
    grid-area: img18;
    background-image: url("imgs/img/thumbs/Tiles/img18.jpeg");
}
#index-gallery-t .img19{
    grid-area: img19;
    background-image: url("imgs/img/thumbs/Tiles/img19.jpeg");
}
#index-gallery-t .img20{
    grid-area: img20;
    background-image: url("imgs/img/thumbs/Tiles/img20.jpeg");
}
#index-gallery-t .img21{
    grid-area: img21;
    background-image: url("imgs/img/thumbs/Tiles/img21.jpeg");
}
#index-gallery-t .img22{
    grid-area: img22;
    background-image: url("imgs/img/thumbs/Tiles/img22.jpeg");
}
#index-gallery-t .img23{
    grid-area: img23;
    background-image: url("imgs/img/thumbs/Tiles/img23.jpeg");
}
#index-gallery-t .img24{
    grid-area: img24;
    background-image: url("imgs/img/thumbs/Tiles/img24.jpeg");
}
#index-gallery-t .img25{
    grid-area: img25;
    background-image: url("imgs/img/thumbs/Tiles/img25.jpeg");
}
#index-gallery-t .img26{
    grid-area: img26;
    background-image: url("imgs/img/thumbs/Tiles/img26.jpeg");
}
#index-gallery-t .img27{
    grid-area: img27;
    background-image: url("imgs/img/thumbs/Tiles/img27.jpeg");
}
#index-gallery-t .img28{
    grid-area: img28;
    background-image: url("imgs/img/thumbs/Tiles/img28.jpeg");
}
#index-gallery-t .img29{
    grid-area: img29;
    background-image: url("imgs/img/thumbs/Tiles/img29.jpeg");
}
#index-gallery-t .img30{
    grid-area: img30;
    background-image: url("imgs/img/thumbs/Tiles/img30.jpeg");
}
#index-gallery-t .img31{
    grid-area: img31;
    background-image: url("imgs/img/thumbs/Tiles/img31.jpeg");
}
#index-gallery-t .img32{
    grid-area: img32;
    background-image: url("imgs/img/thumbs/Tiles/img32.jpeg");
}
#index-gallery-t .img33{
    grid-area: img33;
    background-image: url("imgs/img/thumbs/Tiles/img33.jpeg");
}
#index-gallery-t .img34{
    grid-area: img34;
    background-image: url("imgs/img/thumbs/Tiles/img34.jpeg");
}
#index-gallery-t .img35{
    grid-area: img35;
    background-image: url("imgs/img/thumbs/Tiles/img35.jpeg");
}
#index-gallery-t .img36{
    grid-area: img36;
    background-image: url("imgs/img/thumbs/Tiles/img36.jpeg");
}
#index-gallery-t .img37{
    grid-area: img37;
    background-image: url("imgs/img/thumbs/Tiles/img37.jpeg");
}
#index-gallery-t .img38{
    grid-area: img38;
    background-image: url("imgs/img/thumbs/Tiles/img38.jpeg");
}
#index-gallery-t .img39{
    grid-area: img39;
    background-image: url("imgs/img/thumbs/Tiles/img39.jpeg");
}
#index-gallery-t .img40{
    grid-area: img40;
    background-image: url("imgs/img/thumbs/Tiles/img40.jpeg");
}
#index-gallery-t .img41{
    grid-area: img41;
    background-image: url("imgs/img/thumbs/Tiles/img41.jpeg");
}
#index-gallery-t .img42{
    grid-area: img42;
    background-image: url("imgs/img/thumbs/Tiles/img42.jpeg");
}
#index-gallery-t .img43{
    grid-area: img43;
    background-image: url("imgs/img/thumbs/Tiles/img43.jpeg");
}
#index-gallery-t .img44{
    grid-area: img44;
    background-image: url("imgs/img/thumbs/Tiles/img44.jpeg");
}
#index-gallery-t .img45{
    grid-area: img45;
    background-image: url("imgs/img/thumbs/Tiles/img45.jpeg");
}
#index-gallery-t .img46{
    grid-area: img46;
    background-image: url("imgs/img/thumbs/Tiles/img46.jpeg");
}
#index-gallery-t .img47{
    grid-area: img47;
    background-image: url("imgs/img/thumbs/Tiles/img47.jpeg");
}
#index-gallery-t .img48{
    grid-area: img48;
    background-image: url("imgs/img/thumbs/Tiles/img48.jpeg");
}
#index-gallery-t .img49{
    grid-area: img49;
    background-image: url("imgs/img/thumbs/Tiles/img49.jpeg");
}
#index-gallery-t .img50{
    grid-area: img50;
    background-image: url("imgs/img/thumbs/Tiles/img50.jpeg");
}
#index-gallery-t .img51{
    grid-area: img51;
    background-image: url("imgs/img/thumbs/Tiles/img51.jpeg");
}
#index-gallery-t .img52{
    grid-area: img52;
    background-image: url("imgs/img/thumbs/Tiles/img52.jpeg");
}
#index-gallery-t .img53{
    grid-area: img53;
    background-image: url("imgs/img/thumbs/Tiles/img53.jpeg");
}
#index-gallery-t .img54{
    grid-area: img54;
    background-image: url("imgs/img/thumbs/Tiles/img54.jpeg");
}
#index-gallery-t .img55{
    grid-area: img55;
    background-image: url("imgs/img/thumbs/Tiles/img55.jpeg");
}
#index-gallery-t .img56{
    grid-area: img56;
    background-image: url("imgs/img/thumbs/Tiles/img56.jpeg");
}
#index-gallery-t .img57{
    grid-area: img57;
    background-image: url("imgs/img/thumbs/Tiles/img57.jpeg");
}
#index-gallery-t .img58{
    grid-area: img58;
    background-image: url("imgs/img/thumbs/Tiles/img58.jpeg");
}
#index-gallery-t .img59{
    grid-area: img59;
    background-image: url("imgs/img/thumbs/Tiles/img59.jpeg");
}
#index-gallery-t .img60{
    grid-area: img60;
    background-image: url("imgs/img/thumbs/Tiles/img60.jpeg");
}
#index-gallery-t .img61{
    grid-area: img61;
    background-image: url("imgs/img/thumbs/Tiles/img61.jpeg");
}
#index-gallery-t .img62{
    grid-area: img62;
    background-image: url("imgs/img/thumbs/Tiles/img62.jpeg");
}
#index-gallery-t .img63{
    grid-area: img63;
    background-image: url("imgs/img/thumbs/Tiles/img63.jpeg");
}
#index-gallery-t .img64{
    grid-area: img64;
    background-image: url("imgs/img/thumbs/Tiles/img64.jpeg");
}
#index-gallery-t .img65{
    grid-area: img65;
    background-image: url("imgs/img/thumbs/Tiles/img65.jpeg");
}
#index-gallery-t .img66{
    grid-area: img66;
    background-image: url("imgs/img/thumbs/Tiles/img66.jpeg");
}
#index-gallery-t .img67{
    grid-area: img67;
    background-image: url("imgs/img/thumbs/Tiles/img67.jpeg");
}
#index-gallery-t .img68{
    grid-area: img68;
    background-image: url("imgs/img/thumbs/Tiles/img68.jpeg");
}
#index-gallery-t .img69{
    grid-area: img69;
    background-image: url("imgs/img/thumbs/Tiles/img69.jpg");
}
#index-gallery-t .img70{
    grid-area: img70;
    background-image: url("imgs/img/thumbs/Tiles/img70.jpeg");
}
#index-gallery-t .img71{
    grid-area: img71;
    background-image: url("imgs/img/thumbs/Tiles/img71.jpeg");
}
#index-gallery-t .img72{
    grid-area: img72;
    background-image: url("imgs/img/thumbs/Tiles/img72.jpg");
}
#index-gallery-t .img73{
    grid-area: img73;
    background-image: url("imgs/img/thumbs/Tiles/img73.jpg");
}
#index-gallery-t .img74{
    grid-area: img74;
    background-image: url("imgs/img/thumbs/Tiles/img74.jpg");
}
#index-gallery-t .img75{
    grid-area: img75;
    background-image: url("imgs/img/thumbs/Tiles/img75.jpg");
}
#index-gallery-t .img76{
    grid-area: img76;
    background-image: url("imgs/img/thumbs/Tiles/img76.jpg");
}
#index-gallery-t .img77{
    grid-area: img77;
    background-image: url("imgs/img/thumbs/Tiles/img77.jpeg");
}
#index-gallery-t .img78{
    grid-area: img78;
    background-image: url("imgs/img/thumbs/Tiles/img78.jpg");
}
#index-gallery-t .img79{
    grid-area: img79;
    background-image: url("imgs/img/thumbs/Tiles/img79.jpg");
}
#index-gallery-t .img80{
    grid-area: img80;
    background-image: url("imgs/img/thumbs/Tiles/img80.jpg");
}
#index-gallery-t .img81{
    grid-area: img81;
    background-image: url("imgs/img/thumbs/Tiles/img81.jpeg");
}
#index-gallery-t .img82{
    grid-area: img82;
    background-image: url("imgs/img/thumbs/Tiles/img82.jpeg");
}
#index-gallery-t .img83{
    grid-area: img83;
    background-image: url("imgs/img/thumbs/Tiles/img83.jpeg");
}
#index-gallery-t .img84{
    grid-area: img84;
    background-image: url("imgs/img/thumbs/Tiles/img84.jpeg");
}

#index-gallery-t .img85{
    grid-area: img85;
    background-image: url("imgs/img/thumbs/Tiles/img85.jpeg");
}

#index-gallery-t .img86{
    grid-area: img86;
    background-image: url("imgs/img/thumbs/Tiles/img86.jpeg");
}

#index-gallery-t .img87{
    grid-area: img87;
    background-image: url("imgs/img/thumbs/Tiles/img87.jpeg");
}

#index-gallery-t .img88{
    grid-area: img88;
    background-image: url("imgs/img/thumbs/Tiles/img88.jpeg");
}

#index-gallery-t .img89{
    grid-area: img89;
    background-image: url("imgs/img/thumbs/Tiles/img89.jpg");
}

#index-gallery-t .img90{
    grid-area: img90;
    background-image: url("imgs/img/thumbs/Tiles/img90.jpg");
}

#index-gallery-t .img91{
    grid-area: img91;
    background-image: url("imgs/img/thumbs/Tiles/img91.jpg");
}

#index-gallery-t .img92{
    grid-area: img92;
    background-image: url("imgs/img/thumbs/Tiles/img92.jpeg");
}

#index-gallery-t .img93{
    grid-area: img93;
    background-image: url("imgs/img/thumbs/Tiles/img93.jpeg");
}

#index-gallery-t .img94{
    grid-area: img94;
    background-image: url("imgs/img/thumbs/Tiles/img94.jpeg");
}

#index-gallery-t .img95{
    grid-area: img95;
    background-image: url("imgs/img/thumbs/Tiles/img95.jpeg");
}

#index-gallery-t .img96{
    grid-area: img96;
    background-image: url("imgs/img/thumbs/Tiles/img96.jpeg");
}

#index-gallery-t .img97{
    grid-area: img97;
    background-image: url("imgs/img/thumbs/Tiles/img97.jpg");
}

#index-gallery-t .img98{
    grid-area: img98;
    background-image: url("imgs/img/thumbs/Tiles/img98.jpeg");
}

#index-gallery-t .img99{
    grid-area: img99;
    background-image: url("imgs/img/thumbs/Tiles/img99.jpeg");
}

#index-gallery-t .img100{
    grid-area: img100;
    background-image: url("imgs/img/thumbs/Tiles/img100.jpg");
}
#index-gallery-t .img101{
    grid-area: img101;
    background-image: url("imgs/img/thumbs/Tiles/img101.jpg");
}

#index-gallery-t .img102{
    grid-area: img102;
    background-image: url("imgs/img/thumbs/Tiles/img102.jpg");
}

#index-gallery-t .img103{
    grid-area: img103;
    background-image: url("imgs/img/thumbs/Tiles/img103.jpg");
}

#index-gallery-t .img104{
    grid-area: img104;
    background-image: url("imgs/img/thumbs/Tiles/img104.jpg");
}

#index-gallery-t .img105{
    grid-area: img105;
    background-image: url("imgs/img/thumbs/Tiles/img105.jpg");
}

#index-gallery-t .img106{
    grid-area: img106;
    background-image: url("imgs/img/thumbs/Tiles/img106.jpg");
}

#index-gallery-t .img107{
    grid-area: img107;
    background-image: url("imgs/img/thumbs/Tiles/img107.jpg");
}

#index-gallery-t .img108{
    grid-area: img108;
    background-image: url("imgs/img/thumbs/Tiles/img108.jpg");
}

#index-gallery-t .img109{
    grid-area: img109;
    background-image: url("imgs/img/thumbs/Tiles/img109.jpg");
}

#index-gallery-t .img110{
    grid-area: img110;
    background-image: url("imgs/img/thumbs/Tiles/img110.jpg");
}
#index-gallery-t .img111{ grid-area: img111; background-image: url("imgs/img/thumbs/Tiles/img111.jpg"); }
#index-gallery-t .img112{ grid-area: img112; background-image: url("imgs/img/thumbs/Tiles/img112.jpg"); }
#index-gallery-t .img113{ grid-area: img113; background-image: url("imgs/img/thumbs/Tiles/img113.jpg"); }
#index-gallery-t .img114{ grid-area: img114; background-image: url("imgs/img/thumbs/Tiles/img114.jpg"); }
#index-gallery-t .img115{ grid-area: img115; background-image: url("imgs/img/thumbs/Tiles/img115.jpg"); }
#index-gallery-t .img116{ grid-area: img116; background-image: url("imgs/img/thumbs/Tiles/img116.jpg"); }
#index-gallery-t .img117{ grid-area: img117; background-image: url("imgs/img/thumbs/Tiles/img117.jpg"); }
#index-gallery-t .img118{ grid-area: img118; background-image: url("imgs/img/thumbs/Tiles/img118.jpg"); }
#index-gallery-t .img119{ grid-area: img119; background-image: url("imgs/img/thumbs/Tiles/img119.jpg"); }
#index-gallery-t .img120{ grid-area: img120; background-image: url("imgs/img/thumbs/Tiles/img120.jpg"); }
#index-gallery-t .img121{ grid-area: img121; background-image: url("imgs/img/thumbs/Tiles/img121.jpg"); }
#index-gallery-t .img122{ grid-area: img122; background-image: url("imgs/img/thumbs/Tiles/img122.jpg"); }
#index-gallery-t .img123{ grid-area: img123; background-image: url("imgs/img/thumbs/Tiles/img123.jpg"); }
#index-gallery-t .img124{ grid-area: img124; background-image: url("imgs/img/thumbs/Tiles/img124.jpg"); }
#index-gallery-t .img125{ grid-area: img125; background-image: url("imgs/img/thumbs/Tiles/img125.jpg"); }
#index-gallery-t .img126{ grid-area: img126; background-image: url("imgs/img/thumbs/Tiles/img126.jpg"); }
#index-gallery-t .img127{ grid-area: img127; background-image: url("imgs/img/thumbs/Tiles/img127.jpg"); }
#index-gallery-t .img128{ grid-area: img128; background-image: url("imgs/img/thumbs/Tiles/img128.jpg"); }
#index-gallery-t .img129{ grid-area: img129; background-image: url("imgs/img/thumbs/Tiles/img129.jpg"); }
#index-gallery-t .img130{ grid-area: img130; background-image: url("imgs/img/thumbs/Tiles/img130.jpg"); }
#index-gallery-t .img131{ grid-area: img131; background-image: url("imgs/img/thumbs/Tiles/img131.jpg"); }
#index-gallery-t .img132{ grid-area: img132; background-image: url("imgs/img/thumbs/Tiles/img132.jpg"); }
#index-gallery-t .img133{ grid-area: img133; background-image: url("imgs/img/thumbs/Tiles/img133.jpg"); }
#index-gallery-t .img134{ grid-area: img134; background-image: url("imgs/img/thumbs/Tiles/img134.jpg"); }
#index-gallery-t .img135{ grid-area: img135; background-image: url("imgs/img/thumbs/Tiles/img135.jpg"); }
#index-gallery-t .img136{ grid-area: img136; background-image: url("imgs/img/thumbs/Tiles/img136.jpg"); }
#index-gallery-t .img137{ grid-area: img137; background-image: url("imgs/img/thumbs/Tiles/img137.jpg"); }
#index-gallery-t .img138{ grid-area: img138; background-image: url("imgs/img/thumbs/Tiles/img138.jpg"); }
#index-gallery-t .img139{ grid-area: img139; background-image: url("imgs/img/thumbs/Tiles/img139.jpg"); }
#index-gallery-t .img140{ grid-area: img140; background-image: url("imgs/img/thumbs/Tiles/img140.jpg"); }
#index-gallery-t .img141{ grid-area: img141; background-image: url("imgs/img/thumbs/Tiles/img141.jpg"); }
#index-gallery-t .img142{ grid-area: img142; background-image: url("imgs/img/thumbs/Tiles/img142.jpg"); }
#index-gallery-t .img143{ grid-area: img143; background-image: url("imgs/img/thumbs/Tiles/img143.jpg"); }
#index-gallery-t .img144{ grid-area: img144; background-image: url("imgs/img/thumbs/Tiles/img144.jpg"); }
#index-gallery-t .img145{ grid-area: img145; background-image: url("imgs/img/thumbs/Tiles/img145.jpg"); }
#index-gallery-t .img146{ grid-area: img146; background-image: url("imgs/img/thumbs/Tiles/img146.jpg"); }
#index-gallery-t .img147{ grid-area: img147; background-image: url("imgs/img/thumbs/Tiles/img147.jpg"); }
#index-gallery-t .img148{ grid-area: img148; background-image: url("imgs/img/thumbs/Tiles/img148.jpg"); }
#index-gallery-t .img149{ grid-area: img149; background-image: url("imgs/img/thumbs/Tiles/img149.jpg"); }
#index-gallery-t .img150{ grid-area: img150; background-image: url("imgs/img/thumbs/Tiles/img150.jpg"); }
#index-gallery-t .img151{ grid-area: img151; background-image: url("imgs/img/thumbs/Tiles/img151.jpg"); }
#index-gallery-t .img152{ grid-area: img152; background-image: url("imgs/img/thumbs/Tiles/img152.jpg"); }
#index-gallery-t .img153{ grid-area: img153; background-image: url("imgs/img/thumbs/Tiles/img153.jpg"); }
#index-gallery-t .img154{ grid-area: img154; background-image: url("imgs/img/thumbs/Tiles/img154.jpg"); }
#index-gallery-t .img155{ grid-area: img155; background-image: url("imgs/img/thumbs/Tiles/img155.jpg"); }
#index-gallery-t .img156{ grid-area: img156; background-image: url("imgs/img/thumbs/Tiles/img156.jpg"); }
#index-gallery-t .img157{ grid-area: img157; background-image: url("imgs/img/thumbs/Tiles/img157.jpg"); }
#index-gallery-t .img158{ grid-area: img158; background-image: url("imgs/img/thumbs/Tiles/img158.jpg"); }
#index-gallery-t .img159{ grid-area: img159; background-image: url("imgs/img/thumbs/Tiles/img159.jpg"); }
#index-gallery-t .img160{ grid-area: img160; background-image: url("imgs/img/thumbs/Tiles/img160.jpg"); }
#index-gallery-t .img161{ grid-area: img161; background-image: url("imgs/img/thumbs/Tiles/img161.jpg"); }
#index-gallery-t .img162{ grid-area: img162; background-image: url("imgs/img/thumbs/Tiles/img162.jpg"); }
#index-gallery-t .img163{ grid-area: img163; background-image: url("imgs/img/thumbs/Tiles/img163.jpg"); }
#index-gallery-t .img164{ grid-area: img164; background-image: url("imgs/img/thumbs/Tiles/img164.jpg"); }
#index-gallery-t .img165{ grid-area: img165; background-image: url("imgs/img/thumbs/Tiles/img165.jpg"); }
#index-gallery-t .img166{ grid-area: img166; background-image: url("imgs/img/thumbs/Tiles/img166.jpg"); }

/* ---------------------------------Hardwood Images --------------------------*/

/* #index-gallery-h .img1{
    grid-area: img1;
    background-image: url("imgs/img/thumbs/Hardwood/img1.jpg");
}
#index-gallery-h .img2{
    grid-area: img2;
    background-image: url("imgs/img/thumbs/Hardwood/img2.jpg");
}
#index-gallery-h .img3{
    grid-area: img3;
    background-image: url("imgs/img/thumbs/Hardwood/img3.jpg");
}
#index-gallery-h .img4{
    grid-area: img4;
    background-image: url("imgs/img/thumbs/Hardwood/img4.jpg");
}
#index-gallery-h .img5{
    grid-area: img5;
    background-image: url("imgs/img/thumbs/Hardwood/img5.jpg");
}
#index-gallery-h .img6{
    grid-area: img6;
    background-image: url("imgs/img/thumbs/Hardwood/img6.jpg");
}
#index-gallery-h .img7{
    grid-area: img7;
    background-image: url("imgs/img/thumbs/Hardwood/img7.jpg");
}
#index-gallery-h .img8{
    grid-area: img8;
    background-image: url("imgs/img/thumbs/Hardwood/img8.jpg");
}
#index-gallery-h .img9{
    grid-area: img9;
    background-image: url("imgs/img/thumbs/Hardwood/img9.jpg");
}
#index-gallery-h .img10{
    grid-area: img10;
    background-image: url("imgs/img/thumbs/Hardwood/img10.jpg");
}
#index-gallery-h .img11{
    grid-area: img11;
    background-image: url("imgs/img/thumbs/Hardwood/img11.jpg");
}
#index-gallery-h .img12{
    grid-area: img12;
    background-image: url("imgs/img/thumbs/Hardwood/img12.jpg");
}
#index-gallery-h .img13{
    grid-area: img13;
    background-image: url("imgs/img/thumbs/Hardwood/img13.jpg");
}
#index-gallery-h .img14{
    grid-area: img14;
    background-image: url("imgs/img/thumbs/Hardwood/img14.jpg");
}
#index-gallery-h .img15{
    grid-area: img15;
    background-image: url("imgs/img/thumbs/Hardwood/img15.jpg");
}
#index-gallery-h .img16{
    grid-area: img16;
    background-image: url("imgs/img/thumbs/Hardwood/img16.jpg");
}
#index-gallery-h .img17{
    grid-area: img17;
    background-image: url("imgs/img/thumbs/Hardwood/img17.jpg");
}
#index-gallery-h .img18{
    grid-area: img18;
    background-image: url("imgs/img/thumbs/Hardwood/img18.jpg");
}

#index-gallery-h .img19{
    grid-area: img19;
    background-image: url("imgs/img/thumbs/Hardwood/img19.jpg");
}

#index-gallery-h .img20{
    grid-area: img20;
    background-image: url("imgs/img/thumbs/Hardwood/img20.jpg");
} */


/* ---------------------------------Wood Floor Images --------------------------*/

#index-gallery-w .img1{
    grid-area: img1;
    background-image: url("imgs/img/thumbs/Woodfloor/img1.jpg");
}
#index-gallery-w .img2{
    grid-area: img2;
    background-image: url("imgs/img/thumbs/Woodfloor/img2.jpg");
}
#index-gallery-w .img2{
    grid-area: img2;
    background-image: url("imgs/img/thumbs/Woodfloor/img2.jpg");
}
#index-gallery-w .img3{
    grid-area: img3;
    background-image: url("imgs/img/thumbs/Woodfloor/img3.jpg");
}
#index-gallery-w .img4{
    grid-area: img4;
    background-image: url("imgs/img/thumbs/Woodfloor/img4.jpg");
}
#index-gallery-w .img5{
    grid-area: img5;
    background-image: url("imgs/img/thumbs/Woodfloor/img5.jpg");
}
#index-gallery-w .img6{
    grid-area: img6;
    background-image: url("imgs/img/thumbs/Woodfloor/img6.jpg");
}
#index-gallery-w .img7{
    grid-area: img7;
    background-image: url("imgs/img/thumbs/Woodfloor/img7.jpg");
}
#index-gallery-w .img8{
    grid-area: img8;
    background-image: url("imgs/img/thumbs/Woodfloor/img8.jpg");
}
#index-gallery-w .img9{
    grid-area: img9;
    background-image: url("imgs/img/thumbs/Woodfloor/img9.jpg");
}
*#index-gallery-w .img10{
    grid-area: img10;
    background-image: url("imgs/img/thumbs/Woodfloor/img10.jpg");
} 
#index-gallery-w .img11{
    grid-area: img11;
    background-image: url("imgs/img/thumbs/Woodfloor/img11.jpg");
}
#index-gallery-w .img12{
    grid-area: img12;
    background-image: url("imgs/img/thumbs/Woodfloor/img12.jpg");
}
#index-gallery-w .img13{
    grid-area: img13;
    background-image: url("imgs/img/thumbs/Woodfloor/img13.jpg");
}
#index-gallery-w .img14{
    grid-area: img14;
    background-image: url("imgs/img/thumbs/Woodfloor/img14.jpg");
}
#index-gallery-w .img15{
    grid-area: img15;
    background-image: url("imgs/img/thumbs/Woodfloor/img15.jpg");
}
#index-gallery-w .img16{
    grid-area: img16;
    background-image: url("imgs/img/thumbs/Woodfloor/img16.jpg");
}
#index-gallery-w .img17{
    grid-area: img17;
    background-image: url("imgs/img/thumbs/Woodfloor/img17.jpg");
}
#index-gallery-w .img18{
    grid-area: img18;
    background-image: url("imgs/img/thumbs/Woodfloor/img18.jpg");
}
#index-gallery-w .img19{
    grid-area: img19;
    background-image: url("imgs/img/thumbs/Woodfloor/img19.jpg");
}
#index-gallery-w .img20{
    grid-area: img20;
    background-image: url("imgs/img/thumbs/Woodfloor/img20.jpg");
}
#index-gallery-w .img21{
    grid-area: img21;
    background-image: url("imgs/img/thumbs/Woodfloor/img21.jpg");
}
#index-gallery-w .img22{
    grid-area: img22;
    background-image: url("imgs/img/thumbs/Woodfloor/img22.jpg");
}
#index-gallery-w .img23{
    grid-area: img23;
    background-image: url("imgs/img/thumbs/Woodfloor/img23.jpg");
}
#index-gallery-w .img24{
    grid-area: img24;
    background-image: url("imgs/img/thumbs/Woodfloor/img24.jpg");
}
#index-gallery-w .img25{
    grid-area: img25;
    background-image: url("imgs/img/thumbs/Woodfloor/img25.jpg");
}
#index-gallery-w .img26{
    grid-area: img26;
    background-image: url("imgs/img/thumbs/Woodfloor/img26.jpg");
}
#index-gallery-w .img27{
    grid-area: img27;
    background-image: url("imgs/img/thumbs/Woodfloor/img27.jpg");
}
#index-gallery-w .img28{
    grid-area: img28;
    background-image: url("imgs/img/thumbs/Woodfloor/img28.jpg");
}
#index-gallery-w .img29{
    grid-area: img29;
    background-image: url("imgs/img/thumbs/Woodfloor/img29.jpg");
} 


 /* --------------------------------------------------ALL Images--------------------------------------*/

 #index-gallery-all .img1{
    grid-area: img1;
    background-image: url("imgs/img/thumbs/All/img1.jpg");
}
#index-gallery-all .img2{
    grid-area: img2;
    background-image: url("imgs/img/thumbs/All/img2.jpg");
}
#index-gallery-all .img3{
    grid-area: img3;
    background-image: url("imgs/img/thumbs/All/img3.jpg");
}
#index-gallery-all .img4{
    grid-area: img4;
    background-image: url("imgs/img/thumbs/All/img4.jpg");
}
#index-gallery-all .img5{
    grid-area: img5;
    background-image: url("imgs/img/thumbs/All/img5.jpg");
}
#index-gallery-all .img6{
    grid-area: img6;
    background-image: url("imgs/img/thumbs/All/img6.jpg");
}
#index-gallery-all .img7{
    grid-area: img7;
    background-image: url("imgs/img/thumbs/All/img7.jpg");
}
#index-gallery-all .img8{
    grid-area: img8;
    background-image: url("imgs/img/thumbs/All/img8.jpg");
}
#index-gallery-all .img9{
    grid-area: img9;
    background-image: url("imgs/img/thumbs/All/img9.jpg");
}
#index-gallery-all .img10{
    grid-area: img10;
    background-image: url("imgs/img/thumbs/All/img10.jpg");
}
#index-gallery-all .img11{
    grid-area: img11;
    background-image: url("imgs/img/thumbs/All/img11.jpg");
}
#index-gallery-all .img12{
    grid-area: img12;
    background-image: url("imgs/img/thumbs/All/img12.jpg");
}
#index-gallery-all .img13{
    grid-area: img13;
    background-image: url("imgs/img/thumbs/All/img13.jpg");
}
#index-gallery-all .img14{
    grid-area: img14;
    background-image: url("imgs/img/thumbs/All/img14.jpg");
}
#index-gallery-all .img15{
    grid-area: img15;
    background-image: url("imgs/img/thumbs/All/img15.jpg");
}
#index-gallery-all .img16{
    grid-area: img16;
    background-image: url("imgs/img/thumbs/All/img16.jpg");
}
#index-gallery-all .img17{
    grid-area: img17;
    background-image: url("imgs/img/thumbs/All/img17.jpg");
}
#index-gallery-all .img18{
    grid-area: img18;
    background-image: url("imgs/img/thumbs/All/img18.jpg");
}
#index-gallery-all .img19{
    grid-area: img19;
    background-image: url("imgs/img/thumbs/All/img19.jpg");
}
#index-gallery-all .img20{
    grid-area: img20;
    background-image: url("imgs/img/thumbs/All/img20.jpg");
}
#index-gallery-all .img21{
    grid-area: img21;
    background-image: url("imgs/img/thumbs/All/img21.jpg");
}
#index-gallery-all .img22{
    grid-area: img22;
    background-image: url("imgs/img/thumbs/All/img22.jpg");
}
#index-gallery-all .img23{
    grid-area: img23;
    background-image: url("imgs/img/thumbs/All/img23.jpg");
}
#index-gallery-all .img24{
    grid-area: img24;
    background-image: url("imgs/img/thumbs/All/img24.jpg");
}
#index-gallery-all .img25{
    grid-area: img25;
    background-image: url("imgs/img/thumbs/All/img25.jpg");
}
#index-gallery-all .img26{
    grid-area: img26;
    background-image: url("imgs/img/thumbs/All/img26.jpg");
}
#index-gallery-all .img27{
    grid-area: img27;
    background-image: url("imgs/img/thumbs/All/img27.jpg");
}
#index-gallery-all .img28{
    grid-area: img28;
    background-image: url("imgs/img/thumbs/All/img28.jpg");
}
#index-gallery-all .img29{
    grid-area: img29;
    background-image: url("imgs/img/thumbs/All/img29.jpg");
}
#index-gallery-all .img30{
    grid-area: img30;
    background-image: url("imgs/img/thumbs/All/img30.jpg");
}
#index-gallery-all .img31{
    grid-area: img31;
    background-image: url("imgs/img/thumbs/All/img31.jpg");
}
#index-gallery-all .img32{
    grid-area: img32;
    background-image: url("imgs/img/thumbs/All/img32.jpg");
}
#index-gallery-all .img33{
    grid-area: img33;
    background-image: url("imgs/img/thumbs/All/img33.jpg");
}
#index-gallery-all .img34{
    grid-area: img34;
    background-image: url("imgs/img/thumbs/All/img34.jpg");
}
#index-gallery-all .img35{
    grid-area: img35;
    background-image: url("imgs/img/thumbs/All/img35.jpg");
}
#index-gallery-all .img36{
    grid-area: img36;
    background-image: url("imgs/img/thumbs/All/img36.jpg");
}
#index-gallery-all .img37{
    grid-area: img37;
    background-image: url("imgs/img/thumbs/All/img37.jpg");
}
#index-gallery-all .img38{
    grid-area: img38;
    background-image: url("imgs/img/thumbs/All/img38.jpg");
}

#index-gallery-all .img39{
    grid-area: img39;
    background-image: url("imgs/img/thumbs/All/img39.jpg");
}

#index-gallery-all .img40{
    grid-area: img40;
    background-image: url("imgs/img/thumbs/All/img40.jpg");
}
#index-gallery-all .img41{
    grid-area: img41;
    background-image: url("imgs/img/thumbs/All/img41.jpg");
}
#index-gallery-all .img42{
    grid-area: img42;
    background-image: url("imgs/img/thumbs/All/img42.jpg");
}
#index-gallery-all .img43{
    grid-area: img43;
    background-image: url("imgs/img/thumbs/All/img43.jpg");
}
#index-gallery-all .img44{
    grid-area: img44;
    background-image: url("imgs/img/thumbs/All/img44.jpg");
}
#index-gallery-all .img45{
    grid-area: img45;
    background-image: url("imgs/img/thumbs/All/img45.jpg");
}
#index-gallery-all .img46{
    grid-area: img46;
    background-image: url("imgs/img/thumbs/All/img46.jpg");
}
#index-gallery-all .img47{
    grid-area: img47;
    background-image: url("imgs/img/thumbs/All/img47.jpg");
}
#index-gallery-all .img48{
    grid-area: img48;
    background-image: url("imgs/img/thumbs/All/img48.jpg");
}
#index-gallery-all .img49{
    grid-area: img49;
    background-image: url("imgs/img/thumbs/All/img49.jpg");
}