/* Demo Code: */
body {
	font-family: 'Open Sans', arial, sans-serif;


}
.button-78 {
  align-items: center;
  appearance: none;
  background-clip: padding-box;
  background-color: initial;
  background-image: none;
  border-style: none;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  flex-direction: row;
  flex-shrink: 0;
  font-family: Eina01,sans-serif;
  font-size: 16px;
  font-weight: 800;
  justify-content: center;
  line-height: 6px;
  margin: 0;
  min-height: 46px;
  outline: none;
  overflow: visible;
  padding: 9px 16px;
  pointer-events: auto;
  position: relative;
  text-align: center;
  text-decoration: none;
  text-transform: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  vertical-align: middle;
  width: auto;
  word-break: keep-all;
  z-index: 0;
}

@media (min-width: 768px) {
  .button-78 {
    padding: 19px 32px;
  }
}

.button-78:before,
.button-78:after {
  border-radius: 80px;
}

.button-78:before {
  background-image: linear-gradient(92.83deg, #ff7426 0, #f93a13 100%);
  content: "";
  display: block;
  height: 100%;
  left: 0;
  overflow: hidden;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -2;
}

.button-78:after {
  background-color: initial;
  background-image: linear-gradient(#541a0f 0, #0c0d0d 100%);
  bottom: 4px;
  content: "";
  display: block;
  left: 4px;
  overflow: hidden;
  position: absolute;
  right: 4px;
  top: 4px;
  transition: all 100ms ease-out;
  z-index: -1;
}

.button-78:hover:not(:disabled):before {
  background: linear-gradient(92.83deg, rgb(255, 116, 38) 0%, rgb(249, 58, 19) 100%);
}

.button-78:hover:not(:disabled):after {
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  transition-timing-function: ease-in;
  opacity: 0;
}

.button-78:active:not(:disabled) {
  color: #ccc;
}

.button-78:active:not(:disabled):before {
  background-image: linear-gradient(0deg, rgba(0, 0, 0, .2), rgba(0, 0, 0, .2)), linear-gradient(92.83deg, #ff7426 0, #f93a13 100%);
}

.button-78:active:not(:disabled):after {
  background-image: linear-gradient(#541a0f 0, #0c0d0d 100%);
  bottom: 4px;
  left: 4px;
  right: 4px;
  top: 4px;
}

.button-78:disabled {
  cursor: default;
  opacity: .24;
}
.logotext{
    display: inline-block;
    color: rgb(64, 65, 66) !important;
    vertical-align:middle;
    line-height: 0px;
    margin-left: 8px;
}

iframe body{
  background-color: #00B4CC !important;
}
.btn:focus, .btn:active, button:focus, button:active {
  outline: none !important;
  box-shadow: none !important;
}

#image-gallery .modal-footer{
  display: block;
}

.thumb{
  margin-top: 15px;
  margin-bottom: 15px;
}


.slider{
    /* border-top-left-radius: 200px;
    border-top-right-radius: 200px; */
    /* background: rgb(223, 225, 235);
    border-radius: 50px;
    box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px; */
    border-radius: 10px;
    /* box-shadow: 2px 2px 2px #bebebe; */
      /* background: #e0e0e0; */
      /* box-shadow: 15px 15px 30px #bebebe,
                 -15px -15px 30px #ffffff; */
                 height: 650px;
             

}

.news{

    border-bottom-left-radius: 0px !important;
    border-bottom-right-radius: 0px !important;
    border-top-right-radius: 10px !important;
    border-top-left-radius: 10px !important;
      background: #e0e0e0;
      /* box-shadow: 15px 15px 30px #bebebe,
                 -15px -15px 30px #ffffff; */
}
.card1 {
    /* float: left; */
    
    margin:20px;
    width: 180px;
    height: 220px;
    overflow: visible;
    cursor: pointer;
    position: relative;
    
  }
  
  .card1::before, .content {
    border-radius: 5px;
    box-shadow: 0px 0px 5px 1px #00000022;
    transition: transform 300ms, box-shadow 200ms;
    border: 1px solid grey;
  }
  
  .card1::before {
    position: absolute;
    content: ' ';
    display: block;
    width: 100%;
    height: 100%;
    background-color: #f35353;
   
    transform: rotateZ(5deg);
  }
  
  .description {
    width: 100%;
    text-align: center;
    margin-top: 20px;
  }
  
  .info {
    color: #00000066;
  }
  
  .price::before {
    content: '';
  }
  
  .price {
    font-weight: bold;
    color: #ee9933;
  }
  
  .description p {
    margin-bottom: 10px;
  }
  
  .card1 .content {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: white;
    padding: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    transform: rotateZ(-2deg);
  }
  
  .content .img {
    width: 150px;
    height: fit-content;
  }
  
  .card1:hover::before, .card1:hover .content {
    transform: rotateZ(0deg);
  }
  
  .card1:active::before, .card1:active .content {
    box-shadow: none;
  }

  .social-buttons {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #f2f2f2;
    /* box-shadow: 0px 0px 15px #00000027; */
    padding: 15px 10px;
    border-radius: 10px;
    position: relative;
    top: 6;
    margin-bottom: 10px;
    /* background: #e0e0e0; */
    box-shadow: 2px 2px 2px #bebebe;
  }
  
  .social-button {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    margin: 0 10px;
    background-color: #fff;
    box-shadow: 0px 0px 4px #00000027;
    transition: 0.3s;
  }
  
  .social-button:hover {
    background-color: #f2f2f2;
    box-shadow: 0px 0px 6px 3px #00000027;
  }
  
  .social-buttons svg {
    transition: 0.3s;
    height: 20px;
  }
  
  .facebook {
    background-color: #3b5998;
  }
  
  .facebook svg {
    fill: #f2f2f2;
  }
  
  .facebook:hover svg {
    fill: #3b5998;
  }
  
  .github {
    background-color: #333;
  }
  
  .github svg {
    width: 25px;
    height: 25px;
    fill: #f2f2f2;
  }
  
  .github:hover svg {
    fill: #333;
  }
  
  .linkedin {
    background-color: #0077b5;
  }
  
  .linkedin svg {
    fill: #f2f2f2;
  }
  
  .linkedin:hover svg {
    fill: #0077b5;
  }
  
  .instagram {
    background-color: #c13584;
  }
  
  .instagram svg {
    fill: #f2f2f2;
  }
  
  .instagram:hover svg {
    fill: #c13584;
  }
  
  .lines {
    display: grid;
    grid-template-columns: minmax(50px, 1fr) auto minmax(50px, 1fr);
    align-items: center;
    text-align: center;
    gap: 10px;
  }

  .lines::before, .lines:after {
    content: '';
    border-top: 6px double;
    /* color: #f79696; */
  }

  .sideimg{
        border-radius: 8px;
        height: 200px;
        width: 100%;
     
  }

  .boximg{
    height: 200px;
  }
  .boxb{
    
    /* border-radius: 8px; */
    background-color: #f1efef;
    /* box-shadow: 0px 0px 6px 3px #00000027; */
   
    padding: 0;
  
    
  }

  .boxtitle{
   
           font-size: 1.6em;
           color: #F88E03;
           margin-left: 20px;
          
           font-weight: 900;
           text-align: left;
        
  }

  .anime{
    /* transform: scale(2.65); */
    transform: translate(0%, 0%);
  }

  .boxtitle span{
    /* border-bottom: 2px solid rgb(218, 105, 0); */
    
  }

  /* .boxtitle::before{
    content: '';
    border-left: 6px solid #c77100;
    margin-right: 10px;  
    height: 2px;
    width: 5px;
      } */
 

  .boxtagline span{
    padding-top: 20px;
    margin-top: 10px;
    border-bottom: 2px dashed rgb(110, 2, 10, .4);
    padding-bottom: 10px;

    

  }
  .boxtagline{
   
    font-weight:bold;
    font-size: 1.1rem;
    margin-left: 20px;
    color:rgba(100, 148, 237, 0.904);
           margin-bottom: 20px;
  }

  .boxdesc{

  /* margin-left: 10px; */
    /* text-align: justify; */

  }

.one, .two, .three{
  inset: 20px;
  display: flex;
  color: #0077b5;
  height: 200px;
  width: 190px;
  margin: 10px 5px 10px 0px;
  border: 2px dashed rebeccapurple;
  border-radius: 8px;
  justify-content: center;
 align-content: center;
 align-items: center;
}

.one h1{
  display: flex;
 justify-content: center;
 align-content: center;
 align-items: center;
 font-size: 8.5em;

}
.two h1{
  display: flex;
 justify-content: center;
 align-content: center;
 align-items: center;
 font-size: 8.5em;

}
.three h1{
  display: flex;
 justify-content: center;
 align-content: center;
 align-items: center;
 font-size: 8.5em;

}

.section-head h2 {
  position: relative;
  color: #000;
  font-size: 22x;
  padding: 0 0 20px 0;
  margin: 10px 0;
  font-weight: 500;

}
.section-head h2:before {
  width: 45px;
  height: 8px;
  /* border-radius: 8px; */
  background: #018849;
  display: inline-block;
  border-radius: 8px;
  position: absolute;
  content: "";
  left: 25px;
  bottom: 8px;
  margin-left: -22px;
}

.section-head h2:after {
  width: 250px;
  height: 3px;
  background: #018849;
  display: inline-block;
  position: absolute;
  content: "";
  left: 53px;
  bottom: 10px;
  
}
.cut{
  clip-path: polygon(0 0, 0 0%, 90% 100%, 100% 100%, 100% 0);
   background-color: #ffffff;
  margin: 0px !important;
  padding: 0px !important; 


 
}
.cut2{
  clip-path: polygon(0 0, 0 110%, 100% 0%, 100% 100%, 100% 0);
   background-color: #ffffff;
  margin: 0px !important;
  
  padding: 0px !important; 
 
}
.cut3{
  clip-path: polygon(0 0, 0 0%, 90% 100%, 100% 100%, 100% 0);
   background-color: #f5dcdc;
  margin: 0px !important;
  padding: 0px !important; 
 
}

/* .cut div:before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  border-top: 180px solid #ffffff;
  border-left: 180px solid red;
  box-shadow: 0px 15px 10px -15px #aaa9a9; 
  box-shadow: -15px 0px 10px -15px #aaa9a9;  
  width: 0;
} */


/* CSS */
.button-18 {
  align-items: center;
  background-color: #ff8800;
  border: 0;
  /* display: flex; */
  /* position: absolute; */
  /* right: 0; */
  /* margin-right: 10px; */
  /* border-radius: 100px; */
  box-sizing: border-box;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-family: -apple-system, system-ui, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Ubuntu, Oxygen, "Oxygen Sans", Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  justify-content: center;
  line-height: 20px;
  max-width: 480px;
  min-height: 40px;
  min-width: 0px;
  overflow: hidden;
  padding: 0px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  touch-action: manipulation;
  transition: background-color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s;
  user-select: none;
  -webkit-user-select: none;
  vertical-align: middle;

}
.asd{
  display: inline-flex;
  margin: 0;
  position: absolute;
  right: 0;
  margin-right: 10px;
  /* flex-direction: row; */

}
.button-19 {
  align-items: center;
  background-color: #ff8800;
  border: 0;
  display: flex;
  /* position: absolute; */
  /* right: 0; */
  float: right;
  margin-right: 10px;
  /* border-radius: 100px; */
  box-sizing: border-box;
  color: #ffffff;
  cursor: pointer;
  display: inline-flex;
  font-family: -apple-system, system-ui, system-ui, "Segoe UI", Roboto, "Helvetica Neue", "Fira Sans", Ubuntu, Oxygen, "Oxygen Sans", Cantarell, "Droid Sans", "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Lucida Grande", Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 600;
  justify-content: center;
  line-height: 20px;
  max-width: 480px;
  min-height: 40px;
  min-width: 0px;
  overflow: hidden;
  padding: 0px;
  padding-left: 10px;
  padding-right: 10px;
  text-align: center;
  touch-action: manipulation;
  transition: background-color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, box-shadow 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s, color 0.167s cubic-bezier(0.4, 0, 0.2, 1) 0s;
  user-select: none;
  -webkit-user-select: none;
  vertical-align: middle;

}

.button-18 a:hover,
.button-18 a:focus { 
  background-color: #a2a507;
  color: #ffffff;
}
.button-18:hover,
.button-18:focus { 
  background-color: #a2a507;
  color: #ffffff;
}

.button-18 a:active {
  background: #09223b;
  color: rgb(255, 255, 255, .7);
}
.button-19 a:hover,
.button-19 a:focus{ 
  text-decoration: none;
  background-color: #a2a507;
  color: #ffffff;
}

.button-19:hover{
  background-color: #a2a507;
  color: #ffffff;
}


.button-18 a:active {
  background: #09223b;
  color: rgb(255, 255, 255, .7);
}

/* .button-18:disabled { 
  cursor: not-allowed;
  background: rgba(0, 0, 0, .08);
  color: rgba(0, 0, 0, .3);
}   */

.search {
  width: 100%;
  /* position: relative; */
  display: inline-flex;
  /* right: 0; */
  /* margin-right: 10px; */
}

.searchTerm {
  width: 100%;
  /* border: 3px solid #00B4CC; */
  border: 0;
  border-right: none;
  padding: 5px;
  height: 40px;
  /* border-radius: 5px 0 0 5px; */
  outline: none;
  color: #9DBFAF;
}

.searchTerm:focus{
  color: #00B4CC;
}

.searchButton {
  width: 40px;
  height: 40px;
  /* border: 1px solid #00B4CC; */
  border: 0;
  background: #00B4CC;
  text-align: center;
  color: #fff;
  /* border-radius: 0 5px 5px 0; */
  cursor: pointer;
  font-size: 20px;
}

/*Resize the wrap to see the search bar change!*/
.wrap{
  width: 100%;
  /* height: 100%; */
  margin: 0;

  /* position: absolute; */
  /* top: 50%; */
  /* left: 50%; */
  /* transform: translate(-50%, -50%); */
}

.marq{
  /* height: 65vh; */
  background-color: #ffffff;
  border: 1px solid grey;
  border-radius: 8px;
  padding: 10px;
}



.marq a h5{
  margin-bottom: 10px;
  color: #AF2E2B;
  font-weight: bold;
  text-align: center;
}

.marq a{
  color: #3b3939;
  font-size:medium;
  font-weight: 400;
  text-align: justify;
}

.marqq{
  /* height: 100%; */
  /* padding: 20px; */
  line-height: 23px;
  height: 58vh;
  background-color: #e4e4e4 !important;
  border-radius: 4px;
 
}

.marqq li{
  /* border: 1px dashed rgb(163, 159, 159); */
  box-shadow: 2px 2px 1px rgb(110, 2, 10, .4);
  padding: 5px;
  list-style: none;
  background-color: #ffffff;
  margin: 10px;
}
.mbutton{
  border: 0;
  background-color: #029402;
  color: #ffffff;
  border-radius: 3px;
  display: flex;
  flex-direction: row;
  align-items: end;
  justify-content: end;
  margin-top: 10px;
  font-size: 12px;
  /* font-weight: 800; */
  padding: 4px 12px;
  text-align: center;
  margin-left: auto;
  /* margin-right: auto; */
}
.mbutton:hover{
  background-color: #e00000;
}

.ccc{
  display: flex;
  margin-left: auto;
  margin-right: auto;
/* margin-top: 30px; */
}

.accordion-button{
  background-color: #e00000;
  color: white;
  padding: 10px;
}
pre{
  font-weight: bold;
}


/* .panelsStayOpen-headingOne1{
  background-color: #a2a507 !important;
} */

.accordion-button:not(.collapsed){
  background-color:#e00000 ;
  color: white;
}


/* for editorial page*/



/*for contact page*/

.contact3 {
  font-family: "Montserrat", sans-serif;
  color: #8d97ad;
  font-weight: 300;
}

.contact3 h1,
.contact3 h2,
.contact3 h3,
.contact3 h4,
.contact3 h5,
.contact3 h6 {
  color: #3e4555;
}

.contact3 .font-weight-medium {
  font-weight: 500;
}

.contact3 .card-shadow {
  -webkit-box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
  box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
}

.contact3 .btn-danger-gradiant {
  background: #ff4d7e;
  background: -webkit-linear-gradient(legacy-direction(to right), #ff4d7e 0%, #ff6a5b 100%);
  background: -webkit-gradient(linear, left top, right top, from(#ff4d7e), to(#ff6a5b));
  background: -webkit-linear-gradient(left, #ff4d7e 0%, #ff6a5b 100%);
  background: -o-linear-gradient(left, #ff4d7e 0%, #ff6a5b 100%);
  background: linear-gradient(to right, #ff4d7e 0%, #ff6a5b 100%);
}

.contact3 .btn-danger-gradiant:hover {
  background: #ff6a5b;
  background: -webkit-linear-gradient(legacy-direction(to right), #ff6a5b 0%, #ff4d7e 100%);
  background: -webkit-gradient(linear, left top, right top, from(#ff6a5b), to(#ff4d7e));
  background: -webkit-linear-gradient(left, #ff6a5b 0%, #ff4d7e 100%);
  background: -o-linear-gradient(left, #ff6a5b 0%, #ff4d7e 100%);
  background: linear-gradient(to right, #ff6a5b 0%, #ff4d7e 100%);
}

.loginbox{
  border: 10px solid;
  width: 100%;
  padding: 20px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
 
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  border-image: linear-gradient(45deg, rgb(0,143,104), rgb(250,224,66)) 1;

}
.logintext{
  font-weight: bold;
  color: #e00000;
  font-family:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  text-decoration:wavy;
  /* text-transform: capitalize; */
  text-transform: uppercase;
  letter-spacing: 6px;
}

.formbox{
  /* width: 600px; */
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  

}

.loginb{
  display: flex;
  margin-left: auto;
  margin-right: auto; align-items: center;
  justify-content: center;
}

#myBtn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 30px;
  z-index: 99;
  font-size: 18px;
  border: none;
  outline: none;
  background-color: red;
  color: white;
  cursor: pointer;
  padding: 15px;
  border-radius: 4px;
}

#myBtn:hover {
  background-color: #555;
}


/* For Kamdhenu Starts here*/
/* before adding the photo to the div with the "card-photo" class, in the css clear the styles for .card-photo and remove .card-photo::before and .card-photo::after, then set the desired styles for .card- photo. */

.card{
  /* width: 100px;
  height: 100px; */
  display: flex;
  /* margin: 20px; */
  margin-right: 10px;
  align-items: center;
  align-content: center;
  text-align: center;
  /* box-shadow: 4px 4px 0px #017e2b; */
  /* border: 2px solid rgb(0, 167, 64); */
  float: right;
  border: none;
  
}

.card-photo img{
  display: flex;
  border: none;
  /* margin: 0 auto; */
  /* border-radius: 50%; */
  /* overflow: hidden; */
  /* position: relative; */
  align-items: center;
  align-content: center;
  text-align: center;
 
  width: 100px !important;
  height: 100px !important;
/* margin-top: 10px; */

 
 
 
 
}

.card-title{
  text-align: center;
  line-height: 0%;
  padding: 10px;

}

.cow{
  transform: scaleX(-1);
  vertical-align: middle;
  /* margin-bottom: 20px; */
}




.flexbox {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  width: 100%;
  flex-wrap: wrap;
  padding: 10px;
  cursor: pointer;
}

.flexcard {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 160px;
  align-items: baseline;
  height: 140px;
  border-radius: 20px;
}

.flexcardNumber {
  width: 80%;
  display: flex;
  justify-content: center;
  align-items: center;
  /* height: 80px; */
  margin: 12px 0px;
  border-radius: 0px 50px 50px 0px;
  font-family: 'Jost', sans-serif;
  color: rgb(0, 88, 19);
  /* text-shadow: 0px 3px 5px rgb(139, 138, 138); */
  font-weight: 700;
  font-size: 20px;
  position: relative;
}

.flexcardTitle {
  font-family: 'Jost', sans-serif;
  /* text-transform: uppercase; */
  font-size: 18px;
  /* font-weight: 500; */
  text-align: center;
  color: #016628;
}

.flexcardText {
  font-family: 'Jost', sans-serif;
  text-align: center;
  font-weight: 300;
  padding: 20px;
}

/* .flexcardNumber:before {
  content: '';
  width: 34px;
  height: 90px;
  position: absolute;
  left: -33px;
  top: 0px;
  border-radius: 50px 0px 0px 50px;
  z-index: -1;

} */

/* .flexcardNumber:after {
  content: '';
  width: 25px;
  height: 40px;
  position: absolute;
  left: -25px;
  bottom: -40px;
  border-radius: 50px 0px 0px 50px;
  z-index: -1;
} */

.flex {
  display: flex;
  justify-content: center;
  width: 100%;
margin: auto;
  /* margin: 10px auto; */
}

img.flexcardimgItem {

  width: 60px;
  
  /* height: 60px; */
}

/* GREEN CARD */

.flexcardGreen {
  background: #fffbfb;
  box-shadow: 4px -2px 1px #23db6a;
  /* background: #f9fbfa;
  box-shadow: 4px -2px 1px #AED2BC; */
}
.flexbox :hover {
  transform: scale(1.05);
}

.flexcardNumberGreen {
  background: #ffffff;
  background: -webkit-linear-gradient(right, #FCFCFC, #80f5ad);
  background: -moz-linear-gradient(right, #FCFCFC, #AED2BC);
  background: linear-gradient(to left, #FCFCFC, #32fa7f);
  box-shadow: 0px 2px 2px #6f8d7b;
}

.flexcardNumberGreen:before {
  /* background: #3b6e4e; */
}

.flexcardNumberGreen:after {
  /* background: #95b7a2; */
}

/* BLUE CARD */

.flexcardBlue {
  background: #f7ffff;
 box-shadow: 4px -2px 1px #00b5bb;
}

.flexcardNumberBlue {
  background: #FDFFFE;
  background: -webkit-linear-gradient(right, #FDFFFE, #92E8EB);
  background: -moz-linear-gradient(right, #FDFFFE, #92E8EB);
  background: linear-gradient(to left, #FDFFFE, #92E8EB);
  box-shadow: 0px 2px 2px #6f8d7b;
}

.flexcardNumberBlue:before {
  background: #92E8EB;
}

.flexcardNumberBlue:after {
  background: #71bdbf;
}

/* ORANGE CARD */
.flexcardcolor {
  background: #fdf8f3;
 box-shadow: 4px -2px 1px #ccbe00;
}
.flexcardNumbercolor {
  background: #FDFFFE;
  /* background: -webkit-linear-gradient(right, #FDFFFE, #F68404);
  background: -moz-linear-gradient(right, #FDFFFE, #F68404); */
  background: linear-gradient(to left, #FDFFFE, #f3e411);
  box-shadow: 0px 2px 2px #6f8d7b;
}
.flexcardOrange {
  background: #fdf8f3;
 box-shadow: 4px -2px 1px #F68404;
}

.flexcardNumberOrange {
  background: #FDFFFE;
  background: -webkit-linear-gradient(right, #FDFFFE, #F68404);
  background: -moz-linear-gradient(right, #FDFFFE, #F68404);
  background: linear-gradient(to left, #FDFFFE, #F68404);
  box-shadow: 0px 2px 2px #6f8d7b;
}

.flexcardNumberOrange:before {
  background: #F68404;
}

.flexcardNumberOrange:after {
  background: #d06f02;
}

/* PİNK CARD */

.flexcardPink {
  background: #fffafd;
  position: relative;
    box-shadow: 2px 2px 1px #F34EAE ;
    border-radius: 20px 20px 0px 20px;
}
.flexcardPink:before {
    content: '';
    width: 0px;
    height: 50px;
    /* background: red; */
    position: absolute;
    bottom: 0;
    right: 0;
    border-left: 100px solid transparent;
    border-bottom: 90px solid #F34EAE;
}
.flexcardNumberPink {
  background: #FDFFFE;
  background: -webkit-linear-gradient(right, #FDFFFE, #F34EAE);
  background: -moz-linear-gradient(right, #FDFFFE, #F34EAE);
  background: linear-gradient(to left, #FDFFFE, #F34EAE);
  box-shadow: 0px 2px 2px #F34EAE;
}

.flexcardNumberPink:before {
  background: #F34EAE;
}

.flexcardNumberPink:after {
  background: #d24095;
}

/* RESPONSİVE */

@media only screen and (max-width: 800px) {

  .flexcard {
    width: 35%;
    margin-top: 20px;
  }

  img.flexcardimgItem {
    width: 30%;
  }

}

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

  .flexcard {
    width: 70%;
  }


}



.cookieCard {
  width: 260px;
  height: 342px;
  background: linear-gradient(to right,rgb(217, 250, 245),rgb(192, 209, 218));
  /* background: linear-gradient(to right,rgb(137, 104, 255),rgb(175, 152, 255)); */
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: 5px;
  border-radius: 8px;
  padding: 20px;
  position: relative;
  overflow: hidden;
  margin: 20px 0;
}

.cookieCard::before {
  width: 450px;
  height: 350px;
  content: "";
  background: linear-gradient(to right,rgba(174, 225, 248, 3.849),rgba(166, 233, 224, 3.863));
  position: absolute;
  z-index: 1;
  border-radius: 100%;
  right: -45%;
  top: -25%;
}

.cookieHeading {
  font-size: 1.2em;
  font-weight: 600;
  height: 70px;
  color: rgb(1, 121, 177);
  z-index: 2;
  /* border-bottom: 1px dashed rgb(34, 34, 34); */
}

.cookieDescription {
  font-size: 16px;
  /* font-size: 0.9em; */
  color: rgb(54, 54, 54);
  z-index: 2;
  margin-top: 10px;
  height: 300px;
  text-align: justify;
}

.cookieDescription a {
  color: rgb(241, 241, 241);
}

.acceptButton {
  padding: 11px 20px;
  background-color: #03afce;
  transition-duration: .2s;
  border: none;
  color: rgb(241, 241, 241);
  cursor: pointer;
  font-weight: 600;
  border-radius: 15px;
  z-index: 2;
}

.acceptButton:hover {
  background-color: #714aff;
  transition-duration: .2s;
}

/*pop up button*/

.openBtn {
  display: flex;
  justify-content: left;
}
.openButton {
  border: none;
  border-radius: 5px;
  background-color: #1c87c9;
  color: white;
  padding: 14px 20px;
  cursor: pointer;
  position: fixed;
}
.loginPopup {
  position: relative;
  text-align: center;
  width: 100%;
  z-index: 9999999999;
}
.formPopup {
  display: none;
  position: fixed;
  text-align: justify;
  left: 50%;
  top: 25%;
  width: 50%;
  transform: translate(-50%, 5%);
  border: 3px solid #999999;
  z-index: 999999;
}
.formContainer {
  /* max-width: 300px; */
  padding: 20px;
  background-color: #fff;
}
.formContainer input[type=text],
.formContainer input[type=password] {
  width: 100%;
  padding: 15px;
  margin: 5px 0 20px 0;
  border: none;
  background: #eee;
}
.formContainer input[type=text]:focus,
.formContainer input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}
.formContainer .btn {
  padding: 12px 20px;
  border: none;
  background-color: #8ebf42;
  color: #fff;
  cursor: pointer;
  width: 100%;
  margin-bottom: 15px;
  opacity: 0.8;
}
.formContainer .cancel {
  background-color: #cc0000;
}
.formContainer .btn:hover,
.openButton:hover {
  opacity: 1;
}