/* @tailwind base;
@tailwind components;
@tailwind utilities; */
@import url('https://fonts.googleapis.com/css2?family=Lilita+One&display=swap');

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body{
  position: relative;
  overflow-x: hidden;
}
.body-hidden{
  
  overflow-y: hidden;
}
::-webkit-scrollbar{
  display: none;
  }
/* .sec-5{
  transition: all 0.7s;
} */
:root {
    --primary-color: #E66A2C;
    --secondary-color: #364C63;
    --accent-color: #F3B340;
  }
  ::-webkit-scrollbar{
    width: 15px;
  -webkit-box-shadow: inset 1px 1px 15px -8px rgba(0,0,0,0.66);
  -moz-box-shadow: inset 1px 1px 15px -8px rgba(0,0,0,0.66);
  box-shadow: inset 1px 1px 15px -8px rgba(0,0,0,0.66);
  }
  ::-webkit-scrollbar-thumb{
    width: 8px;
    height: 10px !important;
    background: var(--primary-color);
    border: 6px solid #ffffff;
  }
  .section-two-bg-img{
    width: 100%;
    height: 100vh;
   background-image: url('./src/img/section_two/section_2_bg_img.png');
   background-repeat: no-repeat;
   background-size: cover;
   
  }
  .font-lilita{
    font-family: 'Lilita One', cursive;
  }
 /* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 35px;
  height: 10px;
}
.nav-active{
  background: var(--primary-color);
  color: #fff;
}
/* Hide default HTML checkbox */
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}
.slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 10px;
  top: 50%;
  transform: translate(-50%,-50%);
  background-color: #fff;
  border: 1px solid var(--primary-color);
  -webkit-transition: .4s;
  transition: .4s;
}

.model-toggle-btn{
  transition: all 0.3s ease;
}
.model-toggle-btn span{
  position: relative;
  transition: all 0.3s ease;
}
.model-toggle-btn span::before{
  width: 40%;
  transition: all 0.3s ease;
}
.model-toggle-btn span.active::before{
  content: '';
  position: absolute;
  left: 0.5%;
  transition: all 0.3s ease;
}
.model-toggle-btn span.threedmodel::before{
  content: '';
  width:35% ;
  position: absolute;
  left: 64.5%;
  transition: all 0.3s ease;
}
.model-toggle-btn span.bothbtn::before{
  content: '';
  width:30% ;
  position: absolute;
  left: 37%;
  transition: all 0.3s ease;
}
.three-d-btn{
  transition: all 0.3s ease;
}

/*Toggle Button*/
/* .switch-toggle {
  float: left;
  background: #364C63;
}
.switch-toggle input {
 position: absolute;
 opacity: 0;
}
.switch-toggle input + label {
 padding: 7px;
 float:left;
 color: #fff;
 cursor: pointer;
}
.switch-toggle input:checked + label {
 background: #E66A2C;
} */

/* .full-screen-height-pc{
  height: 100vh;
}
.full-screen-height-mobile{
  height: 100vh;
} */

.full-screen-all-device{
  width: 100% !important;
  height: 100% !important;
}
.model-btn-position{
  bottom: 2% !important;
}