@media screen and (max-width:1400px) {
    .topTen .rightPath {
        right: -13px;
    }
    .benefitContent .rightPath {
        min-width: 220px;
        min-height: 213px;
        top: 456px;
        right: -92px;
    }
    .benefitContent .rightPathv4 {
        min-width: 170px;
        min-height: 217px;
        top: 1078px;
        right: -107px;
    }
    .nav{
    flex-wrap: wrap;
    flex-direction: column;
    /* width: ; */
    }
}
@media screen and (max-width:1340px) {
    .roadMap .arrow {
        margin-right: 0px;
    }
    .roadmapPath {
        right: 0px;
    }
    .faqPath {
        left:0px;
    }
    .heroBanner .vermText {
        right: -9%;
    }

}

@media screen and (max-width: 1215px) {
    header nav a {
        padding: 0 20px;
        white-space: nowrap;
    }

    .heroBanner .familyText {
        font-size: 160px;
    }

    .heroBanner .vermText {
        max-width: 400px;
        top: 195px;
    }

    .intro .pinkBall {
        right: 0;
    }
    .whyNFT .rightBox{padding-left:120px; }

    /******* Benefit Page *******/
    .topTen .rightPath {
        min-width: 116px;
        min-height: 217px;
        bottom: -150px;
        right: 0px;
    }
    .benefitContent .insideDiv{padding-right: 6%;}
    .roadMap .container{min-height: 1390px;}



}
@media screen and (max-width:1150px) {
    .heroBanner .familyText {
        font-size: 116px;
    }
     .heroBanner .vermText {
        right: 2%;
    }
    .whyNFT .rightBox {
    padding-left: 49px;
    }

    /******* My NFT Page *******/
    .teamBox{width: 24%;}
    .benefitContent .insideDiv {
        padding-right:15%;
    }
    .benefitContent .rightPath {
        min-width: 220px;
        min-height: 213px;
        top: 456px;
        right: -92px;
    }
    .benefitContent .rightPathv4 {
        min-width: 170px;
        min-height: 217px;
        top: 1078px;
        right: -107px;
    }

}
/*Ipad Pro*/
@media screen and (max-width: 1024px) {
    .navbar-brand {
        margin: 0 20px 0 0;
    }

    .heroBanner .familyText {
        font-size: 145px;
    }
    .heroBanner .vermText {
        max-width: 325px;
        right: -21%;
    }
    .heroBanner .insideSec{background-position:right 20px;}

     /******* My NFT Page *******/
     .teamBox{width: 24%;}
     .roadMap .container{min-height: 1544px;}
    
     /* hyperlink  */
     .Hyperlink-Card img{
        padding-bottom: 23px;
        max-width: 356px;
     }
}

/*mobile Menu*/
@media screen and (max-width:991px) {
    .heroBanner .familyText {
        font-size: 108px;
    }
    .productDiv .imageDiv {
    min-width: 278px;
    max-width: 289px;
    }

    header {
        padding-top: 0px;
    }

    .navbar-brand {
        margin: 10px auto 0 auto;
        max-width: 147px;
    }

    .navbar-toggler {
        position: absolute;
        left: 15px;
        top: 35px;
    }

    .navbar-collapse {
        background: rgba(248, 210, 47, 0.9);
        position: absolute;
        left: 0;
        top: 0;
        z-index: 9;
        width: 50%;
        padding: 15px 0 40px 0;
    }

    header .navbar-collapse .closeBtn {
        margin-bottom: 30px;
        display: block;
    }

    header nav {
        font-size: 20px;
    }

    header nav a {
        color: #fff;
        padding: 25px 15px 0px 30px;
        display: block;
    }

    header nav a:hover {
        color: #fff;
    }

    .socialDiv {
        margin-top: 100%;
    }

    .socialDiv ul {
        justify-content: space-between;
        padding: 10px;
    }

    .socialDiv ul li {
        max-width: 30px;
    }

    .socialDiv a img {
        filter: brightness(0) invert(1);
    }
    .whyNFT .rightBox {
        padding-left: 56px;
    }
    .faqPath{
        width: 120px;
    }
    /******* Benefit Page *******/
    .productDiv .action{margin-top: 40px;}
    .topTen .rightPath {
        min-width: 105px;
        min-height: 197px;
        bottom: -180px;
    }
    .productDiv .action {
        margin-top:40px;
    }
    .productDiv .action  .btns {
        font-size: 16px;
        padding: 5px 10px 0px 10px;
        min-width: 133px;
    }
     /******* My NFT Page *******/
     .teamSec .flexDiv {
        margin-top: 0px;
        flex-wrap: wrap;
    }
     .teamBox{width:50%; padding-bottom: 40px; margin: 0; padding:2%;}
     .teamBox img{width: 100%;}
}

/*mobile*/
@media screen and (max-width: 767px) {
    .desktopView {
        display: none;
    }

    .mobileView {
        display: block;
    }

    .footerBg {
        background: url(../images/footerBgMob.png) center bottom no-repeat;
        background-size: 100%;
    }

    .navbar-toggler {
        top: 32px;
    }

    .navbar-brand {
        max-width: 120px;
    }

    .heroBanner {
        background: url(../images/faqBgv2.png) center 0px no-repeat;
        background-size: 95% 94%;
    }

    .heroBanner .insideSec {
        background: none;
    }

    .heroBanner .product {
        max-width: 280px;
        /* padding-top: 80px; */
        right: 0px;
    }

    .heroBanner .familyText {
        left: -3px;
        max-width: 280px;
        bottom: 30px;
        font-size: 49px;
    }

    .heroBanner .vermText {
        max-width: 166px;
        top: 83px;
        right: -28px;
    }

    .heroBanner .action {
        margin-top:30px;
    }

    .btns {
        font-size: 17px;
        line-height: 39px;
        min-width: 134px;
    }

    .punchline {
        display: none !important;
    }

    h2 {
        font-size: 20px;
    }

    h3 {
        font-size: 20px;
    }

    h4 {
        font-size: 16px;
    }

    h5 {
        font-size: 15px;
    }

    body {
        font-size: 14px;
        line-height: 22px;
    }

    p {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 20px;
    }

    .intro {
        margin-top: 67px;
    }
    .heroBanner .action{
        left: 33%;
    }

    .intro .innerSec,
    .container {
        padding-left: 30px;
        padding-right: 30px;
    }
    .intro .brownHeading{font-size: 20px;}
    .intro .pinkBall,
    .intro .yellowBall {
        display: none;
    }
    .intro h5{font-size: 20px;}
    .intro .blueText{color:#3C3C3C;}
    .arrowBlue {
        font-size: 20px;
        color: #52d0c6;
        margin-top: -10px;
        display: inline-block;
    }
    .collapse.show + .arrowBlue .fa-chevron-down:before {
        content: "\f077";
    }
    a.arrowBlue,
    a.arrowBlue:hover,
    a.arrowBlue:focus {
        color: #52d0c6;
    }
    .aboutUs {margin-top: 99px;}
    .roadmapPath{display: none;}
    .whyNFT {
        margin-top: 40px;
    }

    .whyNFT .leftBox {
        position: inherit;
        max-width: 195px;
        margin: 0 auto;
        top: 0px;
        right: 1px;
    }

    .whyNFT .rightBox {
        width: 100%;
        float: none;
        padding: 80px 20px 30px 20px;
        margin-right: 0%;
        margin-top: -70px;
    }

    .whyNFT .brownBall {
        min-width: 127px;
        min-height: 121px;
        bottom: auto;
        right: 34%;
        /* left: -25px; */
        /* top: 30px; */
    }

    .whyNFT .greenBall {
        min-width: 85px;
        min-height: 77px;
        bottom: 24px;
        left: auto;
        right: -25px;
    }

    .roadMap {
        background: url(../images/roadmapMob.png) center 0px no-repeat;
        background-size: 100% 100%;
        margin-top: 60px;
    }

    .roadMap .container {
        padding-top: 30px;
        padding-bottom: 100px;
        min-height: auto;
    }

    .roadMap h3 {
        font-size: 20px;
    }

    .roadMap .flexDiv {
        flex-wrap: wrap;
    }

    .roadMap .list {
        width: 50%;
        padding-top: 37px;
    }

    .roadMap .date {
        font-size: 16px;
        margin-top: 0px;
        padding-bottom: 0px;
    }

    .roadMap p {
        font-size: 14px;
        padding-top: 15px;
        line-height: 20px;
        margin-bottom: 0;
    }

    .roadMap .box-a .date{
        margin-left: 20px;
    }

    .roadMap .box-a h4{
        margin-left: 20px;
    }

    .roadMap .box-a p{
        margin-left: 20px;
    }

    .roadMap .box-b {
        margin-top: 150px;
        padding-left: 15px;

    }

    .roadMap .box-b h4 br {
        display: none;
    }

    .roadMap .box-c {
        margin-top: -20px;
        padding: 0;
    }
    .roadMap .box-c .icon img{
        margin-left: -25px;
    }

    .roadMap .box-c .date{
        margin-left: 20px;
    }

    .roadMap .box-c h4{
        margin-left: 20px;
    }

    .roadMap .box-c p{
        margin-left: 20px;
    }

    .roadMap .box-d {
        margin-top: 88px;
        padding-left: 15px;

    }

    .roadMap .throughImg1 {
        top: 50px;
        max-width: 31px;
        left: 45px;
    }

    .roadMap .box-a .icon {
        width: 30px;
        top: 3px;
        left: 0px;
    }

    .roadMap .icon {
        width: 30px;
        top: 6px;
    }

    .roadMap .throughImg2 {
        top: 170px;
        max-width: 60px;
    }

    .roadMap .throughImg3 {
        bottom: 252px;
        left: auto;
        right: 60px;
        max-width: 60px;
    }

    .roadMap .throughImg4 {
        right: auto;
        left: 100px;
        max-width: 40px;
        transform: rotateY(180deg);
        bottom: 0;
    }

    .roadMap .arrow {
        margin-right: 0px;
        position: absolute;
        bottom: 250px;
        right: 0;
        max-width: 50px;
    }

    .faqSec .accordion-flush .accordion-item .accordion-button {
        padding: 0px;
        font-size: 14px;
    }

    #flush-headingOne .accordion-button::after,
    #flush-headingTwo .accordion-button::after,
    #flush-headingThree .accordion-button::after,
    #flush-headingFour .accordion-button::after,
    #flush-headingFive .accordion-button::after,
    #flush-headingSix .accordion-button::after,
    #flush-headingSeven .accordion-button::after,
    #flush-headingEight .accordion-button::after,
    #flush-headingNine .accordion-button::after,
    #flush-headingTen .accordion-button::after,
    #flush-headingEleven .accordion-button::after,
    #flush-headingTwelve .accordion-button::after,
    #flush-headingOne .accordion-button:not(.collapsed)::after,
    #flush-headingTwo .accordion-button:not(.collapsed)::after,
    #flush-headingThree .accordion-button:not(.collapsed)::after,
    #flush-headingFour .accordion-button:not(.collapsed)::after,
    #flush-headingFive .accordion-button:not(.collapsed)::after,
    #flush-headingSix .accordion-button:not(.collapsed)::after,
    #flush-headingSeven .accordion-button:not(.collapsed)::after,
    #flush-headingEight .accordion-button:not(.collapsed)::after,
    #flush-headingTen .accordion-button:not(.collapsed)::after,
    #flush-headingEleven .accordion-button:not(.collapsed)::after,
    #flush-headingTwelve .accordion-button:not(.collapsed)::after,
    #flush-headingNine .accordion-button:not(.collapsed)::after {
        width: 2rem;
        height: 2rem;
        background-size: 2rem;
    }
    .faqSec{margin-top: 0;}
    .faqSec .container {
        background: url(../images/faqBgMob.png) 0px top no-repeat;
        background-size: 100%; padding-top: 50px;
    }
    .faqPath{display: none;}
    .faqSec h2 {
        padding-bottom: 5px;
    }

    .faqSec .accordion-flush .accordion-item {
        margin-bottom: 5px;
    }

    .faqSec .accordion-body li {
        font-size: 14px;
        line-height: 20px;
    }

    .faqSec .insideSec {
        padding-bottom: 60px;
    }

    .teamSec .flexDiv {
        margin-top: 0px;
        flex-wrap: wrap;
    }

    .teamSec .container {
        padding-left: 30px;
        padding-right: 30px;
    }

    .teamBox {
        width: 46%;
    }

    .teamBox .desc {
        padding-top: 15px;
    }
    .teamBox .btns {
        padding:0 10px;
    }
    .mobBlock{display: block; padding-top: 5px;}

    .teamBox p {
        padding-top: 5px;
        font-size: 12px;
        line-height: 16px;
    }

    .scrolltoTop {
        width: 40.5px;
        height: 40.5px;
        padding-top: 5px;
    }
    .scrolltoTop img {
        max-width: 21px;
    }

    footer {
        padding: 40px 0 30px 0;
    }

    .footerLink {
        margin-top: 20px;
    }

     /******* Benefit Page *******/
     .benefitPage.headerBg{background: none;}
     .holderBenefit{background: url(../images/benefitBg.png) left 20px no-repeat; background-size: 100% 100%; margin-top: 0; padding-top:70px;}
     .holderBenefit .insideDiv{display: block;}
     .productDiv{display: block; padding: 0;}
     .holderBenefit .imageDiv {
        min-width: auto;
        order: 2;
        max-width: 200px;
        margin: 0 auto;
    }
    .holderBenefit h3{text-align: center; padding:20px 0;}
    .holderBenefit .holderText{padding: 0;}
    .holderBenefit .action{text-align: center; margin-top: 40px;}
    .topTen {padding-top:50px;}
    .topTen .btnSec {
        margin: 0px 0 20px 0;
        padding-bottom: 15px;
    }
    .topTen .btnSec .btns{padding: 5px 15px 0px 15px;font-size: 15px;}
    .topTen  .btns+.btns {margin-left: 10px;}
    .topTen .btnSec .brown2 {
        min-width: 52px;
        min-height: 57px;
        bottom: 111px;
        right: 10px;
    }
    .productDiv .imageDiv {
        min-width: auto;
        max-width: 196px;
        margin: 0 auto;
    }
    .productDiv .description{padding:30px 0 0 0px;}
    .productDiv h3{text-align: center;}
    .productDiv .action {
        margin-top: 40px;
        margin-bottom: 30px;
        text-align: center;
    }
    .topTen .redPath {
        min-width: 50px;
        min-height: 60px;
        bottom: auto;
        left: 22px;
        top: 150px;
        display: none;
    }
    .topTen .rightPath {
    min-width: 82px;
    min-height: 156px;
    top: 230px;
    right: 0px;
    bottom: auto;
    }
    .benefitContent .container{background: url(../images/benefitPath2.png) left 242px no-repeat; background-size: 100%;}
    .benefitContent .rightPath{display: none;}
    .benefitContent .rightPathv4{display: none;}
    .benefitContent .insideDiv{padding-right: 0;    padding-top: 30px;}
    .benefitContent  .brown2 {
        min-width: 65px;
        min-height: 72px;
        top: -30px;
        right: 33px;
    }
    .benefitContent .insideDiv h3 {
        padding-bottom: 20px;
        text-align: center;
    }
    /******* My NFT Page *******/
    .teamSec {
        margin-top:50px;
        padding-bottom: 0px;
    }
    .invoiceText{    top: -32px;}
    .teamBox{padding-bottom:20px;}
    .teamSec .flexDiv .teamBox:nth-child(4) p{min-height: 85px;}

    .mobBG {
        background-image: url(../images/headerPathMob.png), url(../images/headerPathMob2.png);
        background-position: left top, left bottom;
        background-repeat: no-repeat, no-repeat;
        height: 300px;
        background-size: 100%;
        height: 100%;
    }
    .modal-body .teamBox{    max-width: 380px; width: 75%;}
    .modal-body .teamBox p{font-size: 14px;}
    .modal-body .teamBox h4{font-size: 30px;}
    .modal-body .teamBox .inputText{width: 100%;}
    .modal-body .btns{margin: 18px auto 0 auto;
        display: block;}
    .modal-body .btns+.btns{margin: 18px auto 0 auto;}
    #layer2 .modal-dialog p{padding-bottom: 10px;}

    /*********** CountDown Page *********/
    .innerBg{background: none; min-height: 400px; margin: 0;}
    .conuntDown h1,
    .comingSoon h1{font-size: 70px;}
    .conuntDown h1 span,
    .comingSoon h1 span{
    font-size:30px; }
    .timer ul {
        padding: 20px 0 150px 0;
    }
    .timer ul li {
        font-size: 14px;
    }
    .timer ul li h2 {
        font-size:51px; padding-bottom: 0;
    }
    .timer ul li::after {
        font-size: 28px;
        top: 16px;
        right: 0;
    }
    .conuntDown .footerSocial img {
        max-width: 140px;
    }
    .conuntDown {
    margin-top: 240px;
    padding-bottom: 40px;
    }
    .comingSoon .footerSocial img {
        max-width: 140px;
    }
    .comingSoon {
    margin-top: 240px;
    padding-bottom: 40px;
    }

    /*********** Mint page *********/
    .vermLogo {
        max-width: 200px;
        margin-top: 100px;
    }
    .marg-top-130{margin-top: 60px;}
    .mint .contentDiv h4{font-size: 25px; padding-bottom: 10px;}
    .mint .contentDiv h5{font-size:35px;}
    .mint .contentDiv p{line-height: 30px;}
    .mint .contentDiv p b {
        font-size:16px;
    }
    .inputDiv{padding-top: 60px;}
.inputDiv .inputText{ width:240px; margin-right:5px;  }

    /******* marketPlace page********/
    .marketPlaceBg{background: url(../images/marketePlaceBgMob.png) left bottom no-repeat; background-size: 100%;}
    .marketPlace h3{font-size: 35px;}
    .marketPlace .innerBg {
        background: none;
        min-height:500px;
        padding-top: 180px;
    }
    .marketPlace .action {
        margin-top:0px;
    }

    .mint h3{font-size: 35px; color: #a0a0a0;}
    .mint .valBtn+p{font-size: 16px;}
    #header{padding-top: 0;}

/******* Roadmap carousel **********/
    .roadMap p{margin-left: 0;}
    .roadMap .box-b h4{margin-left: 0;}
    .roadMap .date{margin-left: 0;}
    .roadMap .box-d h4{margin-left: 0;}
    .roadMapCarousel.owl-carousel .owl-nav button.owl-next,
    .roadMapCarousel.owl-carousel .owl-nav button.owl-prev{width:40px; position: absolute;
        right: 0px; bottom:250px;}

/******* login page********/
     .login .innerBg{
        background: none;
        min-height: 400px;
        margin: 0;
     }
     .login .form input{
        width: 100%;
     }

     .countdownHeader .insideDiv {
        font-size: 20px;
        line-height: 25px;
        padding: 6px 10px;
        width: 100%;
        display: block;
    }
    .countdownHeader .insideDiv span{ width: 100%; display: block;
    }
    .countdownHeader .insideDiv h2{color: #fff; font-size:20px; line-height:25px;}
    #f1 {
        width:45px; 
      }
	  
	/******* home pop-up******/ 
	.logoPop {max-width: 200px;}
	#homeModal .modal-dialog p {width:100%;}
	#homeModal .modal-dialog p:last-child {padding-bottom:0px;}
	#success .modal-body .teamBox {width: 93%;}
}