.highlight{
z-index:3;
background-color:rgba(255,255,255,1) !important;
box-shadow:0px 0px 10px 2px rgba(57,100,195,0.399);
}
.palate{
position:absolute;
border:1px solid #ccc;
background-color:rgba(255,255,255,0.7);
}
.palate-choice{
padding-top:18px;
display:none;
width:100%;
bottom:0;
border-top:1px solid #CCC;
box-shadow:inset 0px 13px 14px -10px #CCC;
}
.palate-choice h2{
margin-top:0px;
font-weight:300;
text-align:right;
margin-bottom:5px;
text-transform:uppercase;
}
.palate-choice h6{
margin-top:0;
font-weight:300;
text-transform:uppercase;
}

.palate-choice .line-align div img{
position:relative;
top:50%;
width:100%;
height: 100%;
transform:translateY(-50%);
}
.palate-choice div{
float:left;
width:50px;
height:50px;
cursor:pointer;
overflow:hidden;
margin:0 4px 8px;
}

.palate-choice .inner .line-align div:hover{
box-shadow:0px 0px 10px 2px rgba(57,100,195,0.315);
}

.palate-title{
float:left;
margin-left:20px;
margin-right:8px;
height: 75px;
}
.select-tile_square{
    z-index: 2;
    background-size: 100%;
    width: 18%;
    height: 16.2%;
    left: 44.5333%;
    top: 24.46667%;
}
.select-tiles_mosaic{
background-size: 100%;
z-index: 1;
width: 16%;
height: 14.3%;
left: 42.9917%;
top: -1.29%;
}
.select-stone_square{
    z-index: 1;
    background-size: 100%;
    width: 14.1083%;
    height: 13.1083%;
    left: 73.2633%;
    top: 22.9667%;
}
.select-this{
text-align:center;
margin-bottom:20px;
margin-right:35px;
overflow:hidden;
height:48px;
width:300px;
float:right;
transition:height 0.5s;
border:1px solid #000;
}
.select-this:last-child{
margin-bottom:0;
}
.select-this span{
display:block;
padding:5px;
cursor:pointer;
}
.select-this span:hover{
font-weight:700;
}
.select-this > span:first-child{
margin-top:10px;
}
.select-carpet2{
    background-size: 100%;
    width: 33.625%;
    height: 30.775%;
    left: 15.50833%;
    top: 32.2%;
}
.select-stone_rectangle{
    background-size: auto 100%;
    width: 20.2517%;
    height: 10.94167%;
    left: 37.2633%;
    top: 49.3%;
}
.select-rugs{
background-size:100%;
width: 35.9033%;
height: 31.7533%;
left: 47.595%;
top: 29.3667%;
}
.select-tiles_pattern{
    background-size: auto 100%;
    width: 30.275%;
    height: 17.16667%;
    left: 56.1083%;
    top: 44.8583%;
}
.select-tiles_long{
    background-size: auto 100%;
    width: 32.425%;
    height: 26.425%;
    left: 49.5333%;
    top: 4.58333%;
}
.select-carpet{
background-size: auto 100%;
width: 38.6667%;
height: 26.9267%;
left: 12.665%;
top: 6.84%;
}

.select-rugs2{
z-index: 2;
width: 7.16667%;
height: 20.51167%;
left: 51.5267%;
top: 33.965%;
}
.select-tile_square2{
    background-size: auto 100%;
    width: 18%;
    height: 15.9%;
    left: 13.8417%;
    top: 53.575%;
}	
.select-stone{
    background-size: auto 100%;
    width: 17.7733%;
    height: 14.36%;
    left: 46.8667%;
    top: 59.1317%;
} 
.select-timber{
    background-size: auto 100%;
    width: 42.965%;
    height: 10.2667%;
    left: 7.79833%;
    top: 30.79167%;
}
.selection-left{
width:40vw;
float:left;
margin:8vh 0;
}
.selection-palate{
    position: relative;
    margin: auto;
    width: 50vw;
    height: 48vh;
    top: 5vh;
}
.selection-palate div{
cursor:pointer;
}
.selection-palate div:hover{
background-color:white;
z-index:3px !important;
box-shadow:0px 0px 10px 2px rgba(57,100,195,0.315);
}
.selection-right{
position:relative;
height:100vh;
width:60vw;
float:right;
}
.selection-wrap{
position:relative;
width:100%;
background-size:64%;
background-position:49% 72%;  
background-repeat:no-repeat;
}
.tile_square{
display:block;
}
div .line-align{
    width: 57%;
    height: auto;
}
@media(min-width:992px){
    div.inner {
        float: unset;
        width: 900px;
        margin: 0 auto;
        height: auto;
    }
    div .line-align {
        width: 61%;
        height: auto;
    }
    .selection-palate {
        position: relative;
        margin: auto;
        width: 40vw;
        height: 60vh;
        top: 12vh;   
        margin-top: -40px;
    }
}
  
@media(max-width:991px){
    div.inner {
        float: unset;
        width: 800px;
        margin: 0 auto;
        height: auto;
    } 
    div .line-align {
        width: 57%;
        height: auto;
    }   
    .selection-palate {       
        position: relative;
        margin: auto;
        width: 50vw;
        height: 60vh;
        top: 11vh;
    } 
    
}
  
  
  @media(max-width:900px){
    div.inner {
        float: unset;
        width: 750px;
        margin: 0 auto;
        height: auto;
    }  
    .selection-palate {
        position: relative;
        margin: auto;
        width: 50vw;
        height: 73vh;
        top: 9vh;
    } 
  
      
  }
  
  
@media(max-width:820px){
    div.inner {
        float: unset;
        width: 650px;
        margin: 0 auto;
        height: auto;
    }
    .selection-palate {
        position: relative;
        margin: auto;
        width: 50vw;
        height: 70vh;
        top: 9vh;
    }   

    
}
@media(max-width:767px){
    div.inner {
        float: unset;
        width: 555px;
        margin: 0 auto;
        height: auto;
    }  
    .selection-palate {
        position: relative;
        margin: auto;
        width: 67vw;
        height: 62vh;
        top: 4vh;
    }
    div .line-align {
        width: 100%;
        height: auto;
    }
    .palate-title {
        float: left;
        margin-left: 20px;
        margin-right: 8px;
        height: 75px;
        width: 100%;
    }
    .palate-choice h2 {
        margin-top: 0px;
        font-weight: 300;
        text-align: center;
        margin-bottom: 5px;
        text-transform: uppercase;
    }


}

@media(max-width:380px){
    .selection-palate {
        position: relative;
        margin: auto;
        width: 95vw;
        height: 50vh;
        top: 1vh;
    }
    div.inner {
        float: unset;
        width: 345px;
        margin: 0 auto;
        height: auto;
    }
    .palate-title {
        float: left;
        margin: auto;
        height: 75px;
        width: 100%;
    }
    div .line-align {
        width: 86%;
        height: auto;
        margin-left: 25px;
    }
  
    
}
@media(max-width:576px){
    .selection-palate {
        position: relative;
        margin: auto;
        width: 95vw;
        height: 58vh;
        top: 2vh;
    }
    div.inner {
        float: unset;
        width: 345px;
        margin: 0 auto;
        height: auto;
    }
    .palate-title {
        float: left;
        margin: auto;
        height: 75px;
        width: 100%;
    }
    div .line-align {
        width: 86%;
        height: auto;
        margin-left: 25px;
    }
   
    
}