@import url('https://db.onlinewebfonts.com/c/1c45e28f8e86cc89876f003b953cc3e9?family=SF+Pro+Text');
@import url('https://fonts.googleapis.com/css?family=Inter');
@import url('https://db.onlinewebfonts.com/c/7615af7a9f681395bf515be718f1bf9c?family=SofiaPro');
@import url('https://fonts.googleapis.com/css2?family=ABeeZee');


html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,
sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,
footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video {
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
}

a.linkyellow1 {
  color: #FFB400;
  text-decoration: none;
}

body {
  font-size: 14px;
  font-weight: 400;
  background: #1E191C;
  color: #fff;
}

header a.signbtn {
  border-radius: 3px;
background: #323232;
color: #fff;
padding: 5px 8px;
font-size: 16px;
font-weight: 600;
font-family: 'SofiaPro';
}

#main h1 {
font-family: 'Inter';
font-size: 64px;
font-style: normal;
font-weight: 600;
line-height: 68px; /* 106.25% */
letter-spacing: -4.16px;
}



#main h1 span {
  background: linear-gradient(90deg, #FFB400 0%, #FF8B00 55.53%);
background-clip: text;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}

.headingtxt {
  position: absolute;
  top: 30%;
  left: 0;
}

#main h6 {
font-family: 'SF Pro Text';
font-size: 20px;
font-weight: 400;
}

#main a.probtn {
font-size: 16px;
font-weight: 600;
border-radius: 3px;
background: #323232;
padding: 16px 30px;
color: #fff;
font-family: 'SofiaPro';
}

.yellowtext {
  color: #FF9800;
}

/************ Login Page ******************/

.welcard {
  border-top-right-radius: 20px;
  border-top-left-radius: 20px;
  border: 1px solid #43403E;
  background: #272223;
}

.googlecard {
  border-bottom-right-radius: 20px;
  border-bottom-left-radius: 20px;
  border-top: 0px solid #43403E;
  border-left: 1px solid #43403E;
  border-right: 1px solid #43403E;
  border-bottom: 1px solid #43403E;
  background: #272223;
}


.welcard input.form-control {
  border-radius: 5px;
border: 1px solid #454343;
background: #211F1E;
backdrop-filter: blur(10px);
}

.form-control::placeholder {
  color: #696867;
font-family: 'Inter';
}

.loginbtn {
  border-radius: 5px;
background: #FFF;
backdrop-filter: blur(10px);
color: #141517;
font-size: 16px;
font-weight: 600;
width: 100%;
display: block;
padding: 5px;
text-align: center;
}

.googlebtn {
  border-radius: 5px;
  background: #383433;
backdrop-filter: blur(10px);
color: #fff;
font-family: 'ABeeZee';
font-size: 14px;
font-weight: 600;
width: 100%;
display: block;
padding: 5px;
text-align: center;
}


footer .line {
 border-top: 1px solid #323232;
}

footer a.nav-link {
  color: #969696;
font-family: 'SF Pro Text';
font-size: 14px;
font-weight: 400;
letter-spacing: -0.91px;
padding: 10px 25px 10px 0px;
}

footer a:hover.nav-link, #main a:hover.probtn, header a:hover.signbtn  {
  color: #FFB400;
}

.fntgrey{

color: #969696;
    padding: 0px 25px 0px 0px;
     position: relative;
    top: 10px;
}

footer a.nav-link1 {
  color: #969696;
font-family: 'SF Pro Text';
font-size: 14px;
font-weight: 400;
letter-spacing: -0.91px;
padding-right:  0px;
}

footer a.nav-link i {
  font-size: 20px;
}



/******************* shop vyldcard Page css *************************/

#shopvyldcard {
  margin-top: 200px;
}

#shopvyldcard h1 {
  font-size: 64px;
  letter-spacing: -6.5%;
}
#shopvyldcard h2, #faqs h2 {
  font-size: 40px;
 
 }

 #shopvyldcard h6 {
  font-size: 20px;
 }

a.regbtn {
  font-size: 16px;
  font-weight: 600;
  border-radius: 3px;
  background: #272223;
  padding: 16px 30px;
  border: 1px solid #43403E;
  color: #fff;
  font-family: 'SofiaPro';
  }

#shopvyldcard p{
  font-family: 'SF Pro Text';

}

.f20 {
  font-size: 20px;
}
.f16 {
  font-size: 16px;
}

#shopvyldcard .vyldcard{
  position: relative;
}

#shopvyldcard .mboncard{
position: absolute;
top: 20%;
left: 32%;
}

#shopvyldcard .card {
  background-color: #272223;
  border-radius: 0;
  text-align: center;
  padding: 100px 60px;
}


#shopvyldcard .card img {
  display: block;
  margin: 0 auto ; /* Center the image horizontally and add margin below */
  max-width: 100%;
}

.greybox {
  background-color: #969696;
  color: #fff;
  padding: 50px 30px 50px 40px;
  position: relative;
  top: -202px;
}

/********** Accordian ********************/
#faqs {
  margin-top: -200px;
}


.accordion-flush .accordion-item .accordion-button, .accordion-flush .accordion-item .accordion-button.collapsed {
  background: #1E191C;
  color: #fff;
  padding: 6px 0px;
  font-size: 16px;
}


.accordion-item {
  border-bottom: 1px dotted #454343 !important;
  border-top: 1px dotted #454343 !important; 
  color: #fff;
  background-color: #1E191C;
}


.accordion-collapse {
    border: 0;
}

.accordion-button:focus {
    box-shadow: none;
    border: none;
}
.accordion-button:not(.collapsed) {
    background: none;
    color: #fff;
}
.accordion-body {
    padding: 10px 0px  15px 0px;
    font-size: 14px;
  
}
.accordion-button::after {
    width: auto;
    height: auto;
    content: "+";
    font-size: 30px;
    background-image: none;
    font-weight: 100;
    color: #BCBCBC;
    transform: translateY(-4px);
}
.accordion-button:not(.collapsed)::after {
    width: auto;
    height: auto;
    background-image: none;
    content: "-";
    font-size: 38px;
    transform: translate(-5px, -4px);
    transform: rotate(0deg);
}


/******************* End of shop vyldcard Page css *************************/
#uploadesigncard {
  color: #fff;
}

#uploadesigncard h2 {
 font-size: 40px;
 letter-spacing: -6.5%;
}

.yellowtext2 {
  color: #FFB400;
  font-size: 23px;
}

#uploadesigncard .card {
  background-color: #272223;
  border-radius: 0;
  border: 1px solid #454343;
  border-right:0;
  color: #fff;
  height: 360px;
}

#uploadesigncard .card2 {
  background-color: #272223;
  border-radius: 0;
  border: 1px solid #454343;
  color: #fff;
  height: 360px;

}


#uploadesigncard .card h6 {
  font-size: 18px;
}

.f18 {
  font-size: 18px;
}
.f14 {
  font-size: 14px;
}
.f12 {
  font-size: 12px;
}

#uploadesigncard .card i {
  font-size: 45px;
}

#logindetails a {
  color: #fff;
}

.cart {
  position: relative;
  display: block;
  width: 28px;
  height: 28px;
}



.crtxt {
  position: relative;
  top: -17px;
    left: 33px;
}

#help img {
  position: relative;
  top: 13px;
    left: 0px;
}

.cart .count {
  position: absolute;
  top: -5px;
  right: 0;
  z-index: 2;
  font-size: 11px;
  border-radius: 50%;
  background: white;
  width: 16px;
  height: 16px;
  line-height: 16px;
  display: block;
  text-align: center;
  color: #000;

}

.vldcard {
  position: relative;
}

.likeicon {
  position: absolute;
  top: -10px;
  right: -9px;
}

.namewifi {
  position: absolute;
  bottom: 28px;
  right: 37px;
}

.photowifi {
  position: absolute;
  bottom: 28px;
  left: 17px;
}

.namewifi img{
  vertical-align: inherit;
}

.uplodbtn {
  padding: 60px 0px 0px 40px;
}

.fylowtxt {
  color: #FFB400;
}





@media (max-width: 575.98px) and (max-width: 767px) { 

    header a.signbtn {
      margin-left: 125px;
    }

    #main h1 {
      font-size: 58px;
      text-align: center;   
      }

      #main h6 {
        font-size: 17px;  
      }

      .linksicons {
        margin-left: 220px;
      }

      footer a.nav-link {
         padding-right: 20px;
      }

      .dispnone {
        display: none;
      }


/***********Shop Page *************/

#shopvyldcard h1 {
  font-size: 39px;}

  #shopvyldcard h2, #faqs h2 {
    font-size: 33px;
}

#shopvyldcard .mboncard {
  left: 19%;
}

.f20 {
  font-size: 16px;
}

.mbmtp {
  margin-top: 195px !important;
}

.greybox {
   top: 0;
}

#faqs {
  margin-top: 30px; 
}

.accordion-item {
  font-size: 13px;
}

#faqs .accordion-item h2, .accordion-flush .accordion-item .accordion-button, .accordion-flush .accordion-item .accordion-button.collapsed {
  font-size: 13px;
}

.accordion-button::after, .accordion-button:not(.collapsed)::after {
  font-size: 18px;}

/***********Upload design page ***************/

#logindetails a {
  padding: 0;
}

#uploadesigncard .card {
  border: 1px solid #454343;
  border-bottom:0;
 
}



  }

  @media screen and (min-width : 768px) and (max-width : 991px){

    
    #main h1 {
      font-size: 50px;   
      }

      #main h6 {
        width: 60%;
        font-size: 17px;
      }

      .headingtxt {
        top: 10%; 
    }

    .dispnone img {
      margin-top: 160px;
    }


  }