.center{
    text-align:center; 
    margin:auto; 
    padding:10px;
}
.headcolor{
    color:#fff; 
    background-color:#1bb0ca ;
}
/*.sarch{*/
/*    text-align:center; */
/*    margin:auto; */
/*    font-size:25px;*/
    
/*}*/
.left{
    text-align:right !important;
    /*margin:auto; 
    font-size:20px;*/
}
.right{
    text-align:left; 
    margin:auto; 
    font-size:20px;
}
.btn1{
    text-align:center; 
    font-size:18px;
    color: #000000;
    padding-left:30px;
    padding-right:30px;
    padding-top:10px;
    padding-bottom:10px;
}
body, html {
    /*height: 100%;*/
    text-transform: capitalize;
}


.nav-cust{
    
    color:greenyellow !important;
    padding-left: 10px !important;
    padding-right: 20px !important;
}

/* The hero image */
.hero-image {
   
  /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
  background-image: linear-gradient(rgba(0, 0, 0, 0.7), rgba(0, 0, 0, 0.7)), url("../images/sehgo-mart.jpg");

  /* Set a specific height */
  /*height: 100%;*/
 

  /* Position and center the image to scale nicely on all screens */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  /*position: relative;*/
}

/* Place text in the middle of the image */
.hero-text {
  text-align: center;
  position: relative;
  margin: auto;
 
  /*top: 50%;*/
  /*left: 50%;*/
  width: 100%;
  /*padding-top: 30px;*/
  /*padding-bottom: 10px;*/
  /*transform: translate(-50%, -50%);*/
  color: white;
}
.cap{text-transform: capitalize;
 
}



.section2 {
    /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
    background: linear-gradient(rgba(233, 160, 160, 0.5), rgba(240, 221, 112, 0.5));
  
    /* Set a specific height */
    height: 50%;
    
  
    /* Position and center the image to scale nicely on all screens */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
  }

.section-text2 {
    text-align: center;
    /*position: absolute;*/
    margin: auto;
    /*height: 75%;*/
    width: 100%;
   
    padding: 20px;
    transform: translate(-50%, -50%);
    color: black;
}

.section3 {
    /* Use "linear-gradient" to add a darken background effect to the image (photographer.jpg). This will make the text easier to read */
    background: linear-gradient(rgba(99, 235, 140, 0.5), rgba(112, 148, 240, 0.5));
  
    /* Set a specific height */
    /*height: 90%;*/
   padding-top:7px;
   padding-bottom:7px;
  
    /* Position and center the image to scale nicely on all screens */
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*position: relative;*/
  }

.section-text3 {
    text-align: center;
    /*position: absolute;*/
    width: 98%;
    border: 1px solid black;
    margin:auto;
    left: 1%;
    top:3%;
    padding: 10px;
   
    color: black;
}

.example{
    margin-bottom:8px;
}

 /*Style the search field */
form.example input[type=number] {
  padding: 10px;
  font-size: 17px;
  border: 1px solid grey;
  /*float: left;*/
  max-width: 50%;
  background: #f1f1f1;
  border-radius:4px;
  /*margin-left:37%;*/
}

/* Style the submit button */
form.example button {
  /*float: left;*/
  /*width: 50px;*/
  padding: 10px;
  margin-left:-5px;
  
  background: #05001f;
  color: white;
  font-size: 17px;
  border: 1px solid grey;
  border-left: none; /* Prevent double borders */
  cursor: pointer;
  border-radius:4px;
}

form.example button:hover {
  background: #0b7dda;
}

/* Clear floats */
form.example::after {
  content: "";
  clear: both;
  display: table;
}

/*@font-face {*/
/*  font-family: Clip;*/
/*  src: url("https://acupoftee.github.io/fonts/Clip.ttf");*/
/*}*/

.try {
  background-color: yellow;
  background-image: linear-gradient(335deg, black 23px, transparent 23px),
    linear-gradient(155deg, black 23px, transparent 23px),
    linear-gradient(335deg, black 23px, transparent 23px),
    linear-gradient(155deg, black 23px, transparent 23px);
  background-size: 58px 58px;
  background-position: 0px 2px, 4px 35px, 29px 31px, 34px 6px;
}

.sign {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50%;
  height: 50%;
  background-image: radial-gradient(
    ellipse 50% 35% at 50% 50%,
    #6b1839,
    transparent
  );
  transform: translate(-50%, -50%);
  letter-spacing: 3;
  left: 50%;
  top: 10%;
  font-family: "Clip";
  text-transform: uppercase;
  font-size: 3em;
  color: #ffe6ff;
  text-shadow: 0 0 0.6rem #ffe6ff, 0 0 1.5rem #ff65bd,
    -0.2rem 0.1rem 1rem #ff65bd, 0.2rem 0.1rem 1rem #ff65bd,
    0 -0.5rem 2rem #ff2483, 0 0.5rem 3rem #ff2483;
  animation: shine 2s forwards, flicker 3s infinite;
}

@keyframes blink {
  0%,
  22%,
  36%,
  75% {
    color: #ffe6ff;
    text-shadow: 0 0 0.6rem #ffe6ff, 0 0 1.5rem #ff65bd,
      -0.2rem 0.1rem 1rem #ff65bd, 0.2rem 0.1rem 1rem #ff65bd,
      0 -0.5rem 2rem #ff2483, 0 0.5rem 3rem #ff2483;
  }
  28%,
  33% {
    color: #ff65bd;
    text-shadow: none;
  }
  82%,
  97% {
    color: #ff2483;
    text-shadow: none;
  }
}

.flicker {
  animation: shine 2s forwards, blink 3s 2s infinite;
}

.fast-flicker {
  animation: shine 2s forwards, blink 10s 1s infinite;
}

@keyframes shine {
  0% {
    color: #6b1839;
    text-shadow: none;
  }
  100% {
    color: #ffe6ff;
    text-shadow: 0 0 0.6rem #ffe6ff, 0 0 1.5rem #ff65bd,
      -0.2rem 0.1rem 1rem #ff65bd, 0.2rem 0.1rem 1rem #ff65bd,
      0 -0.5rem 2rem #ff2483, 0 0.5rem 3rem #ff2483;
  }
}

@keyframes flicker {
  from {
    opacity: 1;
  }

  4% {
    opacity: 0.9;
  }

  6% {
    opacity: 0.85;
  }

  8% {
    opacity: 0.95;
  }

  10% {
    opacity: 0.9;
  }

  11% {
    opacity: 0.922;
  }

  12% {
    opacity: 0.9;
  }

  14% {
    opacity: 0.95;
  }

  16% {
    opacity: 0.98;
  }

  17% {
    opacity: 0.9;
  }

  19% {
    opacity: 0.93;
  }

  20% {
    opacity: 0.99;
  }

  24% {
    opacity: 1;
  }

  26% {
    opacity: 0.94;
  }

  28% {
    opacity: 0.98;
  }

  37% {
    opacity: 0.93;
  }

  38% {
    opacity: 0.5;
  }

  39% {
    opacity: 0.96;
  }

  42% {
    opacity: 1;
  }

  44% {
    opacity: 0.97;
  }

  46% {
    opacity: 0.94;
  }

  56% {
    opacity: 0.9;
  }

  58% {
    opacity: 0.9;
  }

  60% {
    opacity: 0.99;
  }

  68% {
    opacity: 1;
  }

  70% {
    opacity: 0.9;
  }

  72% {
    opacity: 0.95;
  }

  93% {
    opacity: 0.93;
  }

  95% {
    opacity: 0.95;
  }

  97% {
    opacity: 0.93;
  }

  to {
    opacity: 1;
  }
}
