/** {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*}*/
/*body {*/
/*  font-family: "Gilroy-Bold";*/
/*  margin: 0;*/
/*  scroll-snap-type: none;*/
/*}*/
@font-face {
  font-family: Gilroy-Bold;
  src: url(../font/Gilroy-Bold.ttf);
}

@font-face {
  font-family: Gilroy-Medium;
  src: url(../font/Gilroy-Medium.ttf);
}

@font-face {
  font-family: Gilroy-Regular;
  src: url(../font/Gilroy-Regular.ttf);
}

@font-face {
  font-family: Gilroy-UltraLight;
  src: url(../font/Gilroy-UltraLight.ttf);
}
a {
  text-decoration: none;
}


.wallp{
  /*background-image: url(../media/menu_wallpaper.webp);*/
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
  background-color: #000000;
  display: block;
  height: 100%;
  width: 100%;
}
/*<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<*/
.O2studio_category{
  display: none;
}
.O2studio_categoryPC  {
  position: relative;
  display: flex;  
  justify-content: space-between;
  align-items: center;
  width: 100vw;
  height: 100vh;
}
.O2studioPC {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 85%;
  width: 100%; 
  margin:  80px 70px;
}
.O2studio__itemPC {
  height: 100%;
}
@media (max-width: 960px) {
  .O2studioPC {
    flex-flow: column nowrap;
 }
  .O2studio__itemPC {
    width: 100%;
    height: 80%;
 }
}
.O2studio__itemPC {
  flex-grow: 1;
  background: #ccc;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, .5);
  transition: 0.2s all;
  cursor: pointer;
}
@media (min-width: 961px) {
  .O2studio__itemPC {
    height: 100%;
 }
}
@media (max-width: 700px){
  .O2studioPC {
    height: 75%;
    margin:  70px 40px;
  }
}
.O2studio__itemPC:hover {
  flex-grow: 2;
  box-shadow: inset 0 0 0 100vmax rgba(175, 0, 100, .7);
}
.O2studio__itemPC:hover {
  flex-grow: 2;
  box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, 0.7);
}
.O2studio__itemPC:nth-child(1) {
  background: #222 url(../media/widget_food.webp) no-repeat center center;
}
.O2studio__itemPC:nth-child(2) {
  background: #222 url(../media/widget_hookah.webp) no-repeat center center;
}
.O2studio__itemPC:nth-child(3) {
  background: #222 url(../media/widget_drink.webp) no-repeat center center;
}
.O2studio__titlePC {
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.075em;
  color: #fff;
  transition: 0.2s all;
}

/*>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>>*/
@media screen and (max-width: 400px) {
.O2studio_categoryPC{
  display: none;
}

.O2studio_category  {
  display: block;
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: hidden;
  margin-top: 0;
}


  .O2studio {
    flex-flow: column nowrap;
    display: flex;
    margin-top: 20%;
    margin-left: 10%;
    margin-right: 10%;
    height: 80%;
  }

  .O2studio__item {
    height: 50%;
    flex-grow: 1;
    background: #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    background-size: cover;
    box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, .5);
    transition: 0.2s all;
    cursor: pointer;
  }

  .O2studio__item:hover {
    flex-grow: 2;
    box-shadow: inset 0 0 0 100vmax rgba(0, 0, 0, 0.7);
  }
  .O2studio__item:nth-child(1) {
    background: #222 url(../media/widget_food.webp) no-repeat center center;
  }
  .O2studio__item:nth-child(2) {
    background: #222 url(../media/widget_hookah.webp) no-repeat center center;
  }
  .O2studio__item:nth-child(3) {
    background: #222 url(../media/widget_drink.webp) no-repeat center center;
  }
  .O2studio__title {
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.075em;
    color: #fff;
    transition: 0.2s all;
  }
}

