@import url('https://fonts.googleapis.com/css2?family=Caudex&family=Caveat+Brush&family=Caveat:wght@400;500;600&family=Chelsea+Market&family=Poppins:ital,wght@0,200;0,600;1,400&family=Questrial&family=Quicksand&display=swap');

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border:0;
 
}


.upp {
  width: 100%;
  height: 100vh;
  font-family: Poppins, sans-serif;
  padding: 0 5%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
  background-color: transparent;
  
}
.container-fluid .logo img{
  width: 50px;
  height: 50px;
  filter: invert(1);  
}

.navbar {
  background-color: #333633;
  border-style: solid none solid none ;
   /** border-color: #b34141 #fdfdfd #489182 #fdfdfd;**/
   border-color: #0e1215 #0e1215 #8a2d00 #0e1215;
    background-color: #0e1215;
    padding: 0 2% ;
    position: fixed;
    width: 100%;
    align-items: center;
    font-family: Poppins, sans-serif;
    z-index: 3;
}

#MYNAV ul li a{
  color: #fee6da;
  font-weight: bold;
  margin-left: 40px;
  vertical-align: middle;
}

#MYNAV ul li a:hover{
    color: #fcb18c;
    text-transform: uppercase;
    width:120x;
    transition: 0.5s;
    font-size: 15px;
    border-bottom: 4px solid #910404;
    vertical-align: middle;
    
}

.active {
  text-transform: uppercase;
  border-bottom: 4px solid #910404;
  color:black;
}

.navbar-toggler , .navbar-toggler-icon {
  background-color: #df861d;
}


#LogIn-btn {  
  width:fit-content; 
  background-color: #fd6969;
  border-radius: 10px;
  font-family: 'Questrial', sans-serif;
  border: 1px solid #212121;
 
}

#LogIn-btn a{
   text-decoration: none;
   color: black;
}

#LogIn-btn:hover {
color: black;
text-transform: uppercase;
width:auto;
transition: 0.25s;
background-color: #f09e6e;
font-weight: bold;
}


#Storename {
  text-align: center;  
}

#Storename .col-12 h1 {
  font-family: 'Chelsea Market', cursive;
  font-size: 70px;
  font-weight: bold;
  color: #ffffff;
  text-shadow: 3px 3px 8px #1a0505;
  transition: 0.5s;
  background-color: transparent;
  letter-spacing: 1px;
 
}

#Storename .col-12 h1:hover {
  -webkit-text-stroke: 1px #fffffe;
  text-transform:uppercase;
  letter-spacing: 1px;
}

#Storename .col-12 h2 {
  font-family: 'Caveat', cursive;
  text-shadow: 3px 3px 8px black;
  font-size:25px;
  color: #ffffff;  
}

#Storename a {
  text-decoration: none;
  color: white;
  font-size:medium;
  border: 2px solid crimson;
  padding: 10px 30px;
  border-radius: 50px;
  margin-top: 20px;
  box-shadow: 5px 5px 5px #424242;

}

#Storename a:hover {
  color: white;
  background-color: crimson; 
  text-transform: uppercase;
}

.backvid {
  position: fixed;
  right: 0;
  bottom:0;
  z-index: -2; 
  max-height: 100%;
  top:0;
  margin:0;
  left:0;
  width: 100%;
}

@media (max-aspect-ratio: 16/9) {
  .backvid {
      width: auto;
      height: 100%;
  }
}
/**
  #feat1 , #features2 {
      width: auto;
      height: 100%;
  }
}
  **/
body {
  background-color: #0e1215;
  position: relative; 
  background-image: url(bb2\ \(1\).jpg);
  background-size:contain;

}




#feat1 h1{
  font-weight: bold;
  font-family: 'Chelsea Market', cursive;
  font-size: 45px;
  letter-spacing: 0.5rem;
  color: #FDF0B8;
  /*background-color: #c9570b;**/
  background-color: #8d3800;
  text-shadow: 3px 3px 8px rgb(10, 10, 10);
  width: 100%;
  text-align: center;
  margin-bottom: 0px;
}

#feat img {
  width: 100px;
  height: 100px;
 
}

#feat h4 {
  margin-bottom: 15px;
  font-size: 15px;
  font-weight: bold;
  font-family: 'Quicksand', sans-serif;
}

#feat p {
  font-size: 12px;
  margin-left : 10px ;
  margin-right: 10px;
}

/** AFTER WHY US **/

.row .col-md-6 .lef {
  font-family:'Caudex', serif;
  font-size: 20px;
  text-align: center;
  color: /**#801c0a**/ white;
  font-weight: bolder;
  padding-top: 10px ;
  justify-content: center;
  text-shadow: 2px 3px 2px black;
}

.row .col-md-6 .lef #emphh {
  letter-spacing: 6px;
  font-size: larger; 
}

.row .col-md-6 .ryt {
  font-family:'Caudex', serif;
  font-size: 15px; 
  padding-top: 10px ;
  text-align: center;
  color:  white;
  text-shadow: 2px 3px 2px black;

}

#cols img {
  filter: invert(1);
  
}

.container .row .col h6 {
  margin-bottom: 15px;
  font-size: 16px;
  font-weight: bolder;
  font-family:'Quicksand', sans-serif;
  color:#fac4a0;
  text-shadow: 2px 2px 2px black;
}




/**HOW IT WORKS**/
.feature2-row1 , .feature2-row2 {
  width: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-around;
  flex-wrap: wrap;
     /** border: 1px solid rgb(156, 41, 41); **/

}

.feature2-col1 {
  font-weight: bold;
  font-family: 'Chelsea Market', cursive;
  font-size: 45px;
  letter-spacing: 0.5rem;
  color: #FDF0B8;
  background-color: #8d3800;
  text-shadow: 3px 3px 8px rgb(10, 10, 10);
  width: 100%;
  text-align: center;
  padding-top: 3px;
}

#feature2-row2 .col {
  flex-basis: 20%;
  text-align: center;
  /**Color: #801c0a; **/
  /** background-color: #fdde51; **/
 /** background-image: linear-gradient(#FBE794, #FCA697, #f19252);**/
 color: black;
}

#feature2-row2 .col img{
  width: 100px;
  padding: 15px 2px;
}

#feature2-row2 .col h4{
  margin-bottom: 15px;
  font-size: 15px;
  font-weight: bold;
  font-family: 'Poppins';
  letter-spacing: 0.5px;
}

#feature2-row2 .col p{
  font-size: 12px;
  margin: 0 5px;
}



/**CUST REVIEWS**/
.reviewss {
  margin: 0px 0px;
  
}

.reviewss h1{
  padding-bottom: 0;
  padding-top: 2px;
  margin-bottom: 0px;
  text-transform: uppercase;
  font-weight: bold;
  font-family: 'Chelsea Market', cursive;
  font-size: 35px;
  letter-spacing: 0.5rem;
  /**background-color: #FDF0B8;
  color: #9D1E08; **/
  text-shadow: 3px 3px 8px #1b1715;
  width: 100%;
  text-align: center;
  color: #FDF0B8;
  background-color: /**#B80D0D**/ #8d3800;
}

.reviewss h1::after {
  content: '';
  background: #ff9800;
   display: block;
   height: 3px;
   width: 170px;
   margin: 20px auto 5px;
}

.reviewss .row{
  margin-top: 20px 0;
}

.col-md-3 {
  margin: 40px 0px;

}

.user-prof{ 
  padding: 70px 10px 10px;
  background-color: #efefef ;
  height: 100%;
}

.user-prof img  {
  position: absolute;
  margin-top: -100px;
  align-content: center;
  border: 10px solid white;
  height: 100px;
  width: 100px;
  border-radius: 50%;
}

.user {
  width: 120px;
  height: 120px;
  border-radius: 50%;
}

.user-prof h3 {
  font-size: 20px;
  margin-top: 15px;
  color:#ff9800;

}

.user-prof:hover {
  box-shadow: 0 0 15px 5px rgb(238, 167, 75);
  cursor: pointer;
}

span{
  font-size: 12px;
  color:#1a0505;
}

blockquote {
  font-size: 12px;
  line-height: 20px;
  
}

blockquote::before {
  content: '\201F';
  font-size: 50px;
  position: relative;
  color:#ff9800;
  line-height: 20px;
  bottom: -15px;
  right: 5px;
}

blockquote::after {
  content: '\201D';
  font-size: 50px;
  position: relative;
  color:#ff9800;
  line-height: 10px;
  bottom: -15px;
  left: 5px;
}

.marquee {
  width: 100%;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  overflow: hidden;
}

.marquee .row .col-md-3{
  animation: animate 10s linear infinite;
  display: inline-flexbox;
  padding-right:5px;
}

@keyframes animate {
  100% {
      transform: translate(100%, 0);
  }
}

#banner-wrapper {
  max-width: 2560px ;
  margin: 0 0;
}

.parallax-1 {
   background:url(b2.png) fixed ;
   background-size: cover; 
  /**background-color: #0e1215;**/
  /* background-color: rgba(0, 0, 0, 0.397); */
}

.parallax-2 {
  background:url(bg3.png) repeat fixed 3%;
}

#banner-wrapper .rev-container {
  background-color: rgba(248, 126, 12, 0.274);
}

footer {
  background:url(bg3.png) repeat fixed 15%;
}

footer h1 {
  font-size:x-large;
}

#contact {
  line-height: 18px;
  font-size: 20px;
  font-family: 'Quicksand', sans-serif;
  font-weight: bold;
  letter-spacing: .5 px;
}

.col {
  font-family: Poppins, sans-serif;
}

.col p {
  color: #1b1918;
  font-family: Poppins, sans-serif;
  font-weight: 550;
}

#socmed a {
  text-decoration: none;
  color: black;
  font-size: 20px;
}

form input {
  width:100%;
  margin-bottom: 5px;
  box-sizing: border-box;
  background-color: #efefef ;
}

.contact-midcol fieldset {
  padding: 10px;
  text-align: center;
  max-width: 100%;
  line-height:2;
  background-color: #fdf0b8;
  justify-content: center;
}

.contact-midcol fieldset .form1{
  text-align: center;
  line-height: 18px;
  font-size: 15px;
  font-family: 'Quicksand', sans-serif;
  text-shadow: 3px 3px 8px #cccaca;
}

#form-but { 
      padding:10px 18px; 
      width:fit-content; 
      background-color: #fd6969;
      box-shadow: 0 5px 2px 0px #424242;
      border-radius: 10px;
      font-family: 'Questrial', sans-serif;
      text-shadow: 3px 3px 8px #d8743a;
      border: 1px solid #212121;
}

#form-but:hover {
  color: black;
  text-transform: uppercase;
  width:auto;
  transition: 0.25s;
  background-color: #f09e6e;
  font-weight: bold;
}

#Email {
  font-family: 'Questrial', sans-serif;
  font-size: small;
  text-shadow: 3px 3px 8px #d8743a;
}

#EmailAdd {
  border: none;
  border-bottom: 2px solid black;
  width: auto;

}

.list-unstyled li {
  text-decoration: none;
  font-family: Poppins, sans-serif;
  color:#000000;
  font-weight: 550;
  font-size: 10px;
}

#footcont {
  padding: 0;
}

#copyryt {
  background-color: #00000033;
  letter-spacing: 3px;
  width: 100%;
}


/**
@media (min-width: 992px) {
@media screen and (min-width: 320px) {

  html {
    height: 100%;
    width: 100%;
  }
 
  .backvid {
    background-size:cover;
    width:100%;
   }

    @media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 1) { 
    
    html {
    height: 100%;
    width: 100%;
  }
 
  .backvid {
    background-size:cover;
    width:100%;
   }
}

/* ----------- Retina Screens ----------- 
@media screen 
  and (min-device-width: 1200px) 
  and (max-device-width: 1600px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) { 
    
    html {
    height: 100%;
    width: 100%;
  }
 
  .backvid {
    background-size:cover;
    width:100%;
   }
}
  }
  **/

  

