.SliderGeneralWebsiteBox { position: absolute; top: 0; right: 0; height: 100vh; width: 35%; box-shadow: 0 0 7px black ; padding: 50px 30px 30px ; z-index: 200 ; }














.StudioImageBox { height: 150px; overflow: hidden;  cursor: pointer;  display: flex; justify-content: center; align-items: center; }
.StudioImage { width: 110%;  }

.StudioImageBox2 {  height: 100px; overflow: hidden;  cursor: pointer; }
.StudioImage2 { height: 100%;  }


.StudioBase { position: fixed; right: 0 ; top: 0; width: 250px; background-color: rgb(255, 255, 255) ; display: flex; flex-direction: column; align-items: center; box-shadow:  0 0 7px rgba(0, 0, 0, 0.5 ); padding: 2rem 0 1rem; transition-duration: 0.2s;  
}
.StudioClose { height: 0vh; padding: 0rem ; opacity: 0 ; z-index: -8;  }
.StudioOpen { height: 100vh; z-index: 8 ; }



.StudioToolbarButton2Box { float: left; width: 100%; }


.StudioBarTitleBtn { float: left; width: 100%; display: flex; align-items: center; justify-content: left; flex-direction: row; padding: 0.7rem 0.7rem 1rem ; margin: 0 0 0.7rem;  box-shadow:  0 -2px 4px rgba(0, 0, 0, 0.1 );
}
.StudioBarBtn { float: left; width: 90%; display: flex; align-items: center; justify-content: left; flex-direction: row; padding: 0.9rem 1rem 0.9rem ;  margin: 0 0 0.1.5rem; background-color: rgba(0, 0, 0, 0); 
}

.StudioBarTrayBase { float: left;  width: 100%; background-color: rgba(231, 18, 18, 0) ;  transition-duration: 0.2s; padding: 0 0 1rem ;  margin: 0 0 3rem; display: flex; justify-content: center; align-items: center; flex-direction: column; 
}
.StudioBarTrayOpen { height: fit-content; }
.StudioBarTrayClose { display: none; }





.StudioBarBtnIconBox { height: 15px ; width: 30px; display: flex; justify-content: right ; }
.StudioBarBtnIcon { height: 100%; }
.StudioBarBtnName { width: 100%; text-align: left; margin: 0.2rem 0 0.2rem ; padding-left: 1rem;  }
.StudioBarBtnNameTitle { width: 100%; text-align: left; font-size: 1.2rem ; margin: 0.2rem 0 0.2rem ; padding-left: 1rem; font-weight: 600 ; }


.StudioPopUpBase { position: absolute; top: 0; right: 0; width: 100%; box-shadow:  0 0 7px rgba(0, 0, 0, 0.3 ); border-radius: 5px; overflow: hidden; overflow-y: scroll; z-index: 1; transition-duration: 0.1s; background-color: white; }
.StudioPopUpClose { height: 0vh;  }
.StudioPopUpOpen { height: 100vh; padding: 5rem 1rem 5rem; }











@media screen and ( max-width: 2500px ) {
}

@media screen and ( max-width: 2000px ) {
}

@media screen and ( max-width: 1700px ) {
}

@media screen and ( max-width: 1200px ) {
    .SliderGeneralWebsiteBox { width: 50%;  }
}

@media screen and ( max-width: 800px ) {
    .SliderGeneralWebsiteBox { width: 90%;  }
}

@media screen and ( max-width: 500px ) {
}