@font-face {
    font-family: 'Century_Gothic_Italic';
    src: url('../fonts/CenturyGothic-Italic.woff2') format('woff2'),
        url('../fonts/CenturyGothic-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'Century_Gothic_BI';
    src: url('../fonts/CenturyGothic-BoldItalic.woff2') format('woff2'),
        url('../fonts/CenturyGothic-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'Century_Gothic_Bold';
    src: url('../fonts/CenturyGothic-Bold.woff2') format('woff2'),
        url('../fonts/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'Century_Gothic_Regular';
    src: url('../fonts/CenturyGothic.woff2') format('woff2'),
        url('../fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
  }

  @font-face {
    font-family: 'Gotham';
    src: url('../fonts/Gotham-Book.woff') format('woff'), url('../fonts/Gotham-Book.woff2') format('woff2'), url('../fonts/Gotham-Book.ttf') format('truetype');
    font-weight: normal;
  }
  
  @font-face {
    font-family: 'GothamBold';
    src: url('../fonts/Gotham-Bold.otf') format('otf'), url('../fonts/GothamBold.ttf') format('truetype');
    font-weight: normal;
  }
  
  *{margin:0;padding:0; outline: none}
  html{ height: 100%;}
  img{width:100%;height:auto}
  a{text-decoration: none;}
  body{margin:0;padding:0; height: 100%; font-family: 'Gotham'; font-size:14px; color:#000;overflow-x:hidden; background: url("../images/top-bg.jpg") 0 0 no-repeat; background-size: 55%;}
  input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #005f96 !important;
    font-size: 3.4375000000000004vw;
  }
  input::-moz-placeholder { /* Firefox 19+ */
    color: #005f96 !important;
    font-size: 3.4375000000000004vw;
  }
  input:-ms-input-placeholder { /* IE 10+ */
    color: #005f96 !important;
    font-size: 3.4375000000000004vw;
  }
  input:-moz-placeholder { /* Firefox 18- */
    color: #005f96 !important;
    font-size: 3.4375000000000004vw;
  }
  .wrapper{
    width: 100%;
    position: relative;
    height: 100%;
  }
  .container{ width: 100%; max-width: 1023px; margin: 0 auto; position: relative; height: 100%;}
  /* .landingImg img{ height:100vh; width: auto} */
  
  .overlay{ width: 100%; height: 100vh; position: fixed; background-color: #000; opacity: 0.86; z-index: 1;}
  
  .logo{ float: right; margin: 20px 20px 0 0; max-width: 160px}
  
  .btn{ background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3vw; display: inline-block; letter-spacing: 0.1rem; font-family: 'Gotham'; padding: 10px 22px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); border-radius: 50px; -webkit-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
    -moz-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
    box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);}
  .startBtn{ margin-top: 3.125vw;}
  .arrow-icon{ background: url("../images/arrow-icon.png") 0 0 no-repeat; width: 11px; height: 8px; display: inline-block; margin: 0 0 0 5px; }
  .section1{  text-align: center; width: 100%; height: 70vh;
    display: flex;
    align-items: center;}
  .section1 .title{
    font-family: 'Gotham';
    font-size: 5.625vw;
    color: #005ca6;
    margin-bottom: 40px;
  }
  .welcomeImg{
    margin: 10px 20px 20px 20px;
  }
  
  .bottomSec{
    /* background: url("../images/bottom-bg.png") 0 bottom no-repeat; */
    background: url("../images/bottom-left-bg.jpg") left bottom no-repeat, url("../images/bottom-right-bg.jpg") right bottom no-repeat;
    width: 100%;
    background-size: 30%;
    height: 200px;
    display: flex;
    align-items: center;
    position: absolute;
    bottom: 0;
    z-index: -1;
  }
  .bottomSec .middleSec{
    max-width: 165px;
    margin: 0 auto;
  }
  
  .section2{ display: inline-block; width: 100%; }
  .otherDetails{ display: none;}
  /* .otherDetails.active{ margin-top: 0; visibility: visible} */
  .registrationContainer{ 
    width: 72%; 
    margin: 6.375vw auto 0 auto; 
    background: url("../images/form-top-bg.png") left top no-repeat, url("../images/form-bottom-bg.png") left bottom no-repeat;
    background-size: 100%;
    padding: 6.375vw;
  }
  .registrationContainer h2, .contentBox h2{
    font-size: 5.625vw;
    text-align: center;
    letter-spacing: 0.5rem;
    background: -webkit-linear-gradient(#4cabd8, #005f96);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .registrationContainer .formCont, .registrationContainer .formField, .registrationContainer .formCont input{ width: 100%;}
  .registrationContainer .formCont{ margin-top:3.8125vw}
  .registrationContainer .formField{ margin-bottom: 4.0625vw;}
  .registrationContainer .formCont input{ border: none; background: #eeeeee; padding: 15px 20px; border-radius: 50px; box-sizing: border-box; font-size: 3.4375000000000004vw;}
  .loginBtn{ width: 100%; margin-top: 10px}
  
  .section3{display: inline-block; width: 100%; }
  .points{ display: none; position: absolute; top: 22.22222222222222vw; right: 0; background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3vw; letter-spacing: 0.1rem; font-family: 'Gotham'; padding: 10px 22px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); border-top-left-radius:50px; border-bottom-left-radius:50px; -webkit-box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%) ;
    box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%) ;}
  .barndName{ position: absolute;  top: 10px; left: 10px; width: 110px; display: none}
  .surveyQuestContainer{ width: 90%; margin: 20px auto 0 auto}

  .surveyQuestContainer .questWrapper .questCont p{ font-weight: bold; font-size: 3.888888888888889vw;}
  .surveyQuestContainer .questWrapper .questCont ul{ margin: 10px 0 0 0;}
  .surveyQuestContainer .questWrapper .questCont ul li{ list-style: none; background: #eeeeee; margin-bottom: 1.9444444444444444vw; border-radius: 50px; padding: 2.166667vw 5.555555555555555vw; color: #949494; font-size: 3.888888888888889vw;}
  .surveyQuestContainer .questWrapper .questCont ul li.active{ background-color: #005ca6; color: #fff}
  .paginationWrapper{ width: 100%; height: 1.3888888888888888vw; background: #cdcdcd; border: 5px solid #eeeeee; border-radius: 20px; position: relative; margin-top: 5.555555555555555vw;}
  .paginationWrapper ul{ display: flex;
    justify-content: space-around;
    position: relative;
    top: 50%;
    transform: translateY(-50%); }
  .paginationWrapper ul li{
    list-style: none;
    width: 6.666666666666667vw;
    height: 6.666666666666667vw;
    color: #fff;
    font-size: 3.888888888888889vw;
    background-color: #c8c8c8;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    -webkit-box-shadow: 0px 4px 6px 0px rgb(0 0 0 / 0.40);
  -moz-box-shadow: 0px 4px 6px 0px rgb(0 0 0 / 0.40);
  box-shadow:0px 4px 6px 0px rgb(0 0 0 / 0.40);
  }
  .paginationWrapper ul li.active{ background-color: #005ca6;}
  
  .section4{display: inline-block; width: 100%;}
  .thankyouWrapper{ width:90%; margin: 4.5vw auto 0 auto}
  .thankyouWrapper .thankyouImg{ width: 80%; margin: 0 auto}
  .thankyouWrapper .info1{ text-align:center; margin-top: 4vw; background: -webkit-linear-gradient(#4cabd8, #005f96);  -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 4vw;}
  .thankyouWrapper .info1 span{ font-size:5.666666666666667vw; font-weight: bold}
  .thankyouWrapper .info2{ font-size: 3.3333333333333335vw; background: -webkit-linear-gradient(#4cabd8, #005f96);  -webkit-background-clip: text; -webkit-text-fill-color: transparent; text-align: center; margin-top:4.777778vw}
  .thankyouWrapper .logoCont{ width: 40%; margin: 4.166666666666666vw auto 0 auto}
  .participateBtn{display: inline-block;
    width: 60%;
    text-align: center; position: relative; left: 50%; transform: translateX(-50%); margin: 4.166666666666666vw auto 0 auto}
  
  
    /* Social Wall CSS - START */
    .messageSec{display: inline-block; width: 100%;}
    .messageSec h2{
      font-size: 5.625vw;
      text-align: center;
      letter-spacing: 0.5rem;
      background: -webkit-linear-gradient(#4cabd8, #005f96);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .messageContainer{ width: 80%; margin: 30px auto 0 auto; text-align: center}
    .messageCarousel{background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3.75vw; display: inline-block; letter-spacing: 0.1rem; font-family: 'Gotham'; padding:10px 25px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); border-radius:30px; -webkit-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
      -moz-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
      box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15); width: 100%; height: 190px; box-sizing: border-box;}
  .messageCarousel p{ list-style: none; text-transform: uppercase; width: 100%; height: 100%; font-size: 3.888888888888889vw; letter-spacing: 0.2rem; text-align: center}
  .messageCarousel{ margin-top: 50px; display: flex; align-items: center }
  .slick-next, .slick-next:hover, .slick-next:focus{ background: url(../images/right-arrow.png) 0 0 no-repeat;
    width: 40px;
    height: 40px;
    background-size: 100%;
    right: -18px;
    text-indent: -999999px;}
  .slick-prev, .slick-prev:hover, .slick-prev:focus{ background: url(../images/left-arrow.png) 0 0 no-repeat;
  width: 40px;
  height: 40px;
  background-size: 100%;
  left: -18px;
  text-indent: -999999px; z-index: 1;}
  .socialStartBtn{ margin-top: 3.125vw;}
  
  .thankyouSec{display: inline-block; width: 100%;}
  .thankyouSec .thankyouWrapper{ margin: 29.5vw auto 0 auto}
    /* Social Wall CSS - END */
  
    /* Knowledge Center CSS - START */
  
    .categorySec{display: inline-block; width: 100%;}
    .categorySec h2{
      font-size: 5.625vw;
      text-align: center;
      letter-spacing: 0.5rem;
      background: -webkit-linear-gradient(#4cabd8, #005f96);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .categoryWrapper  {
      width: 80%; margin: 30px auto 0 auto; text-align: center
    }
    .categoryCont ul{
    display: flex;
      flex-direction: column;
      width: 80%;
      margin: 30px auto 0 auto;
  }
    .categoryCont ul li{background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3.75vw; display: inline-block; letter-spacing: 0.1rem; font-family: 'Gotham'; padding: 15px 22px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); border-radius: 50px; 
      -webkit-box-shadow: -5px 10px 10px -1px rgba(0,0,0,0.5);
  -moz-box-shadow: -5px 10px 10px -1px rgba(0,0,0,0.5);
  box-shadow: -5px 10px 10px -1px rgba(0,0,0,0.5); display: flex; justify-content: space-between; margin: 10px 0}
  
  
  .back{ display: none; position: absolute; top: 12.222222vw; left: 0; background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3vw; letter-spacing: 0.1rem; font-family: 'Gotham'; padding: 10px 22px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); border-top-right-radius:50px; border-bottom-right-radius:50px; -webkit-box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%) ;
    box-shadow: 0px 0px 18px 0px rgb(0 0 0 / 15%) ; z-index: 100;}
  
  
    .videosSec{display: inline-block; width: 100%;}
    .videosSec h2{
      font-size: 5.625vw;
      text-align: center;
      letter-spacing: 0.5rem;
      background: -webkit-linear-gradient(#4cabd8, #005f96);
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
    }
    .videosWrapper{ width: 80%; margin: 30px auto 0 auto; text-align: center}
    .videosCont{ width: 100%; display: inline-block}
   .videosCont ul{ width: 100%; box-sizing: border-box; display: inline-block}
    .videosCont ul li.roundabout-in-focus{cursor: default;}
    .videosCont ul li{ position:relative;list-style: none; margin-bottom: 20px;}
    .videosCont ul li span{margin: 5px 0; display: block}
    .videosCont ul li{ border: 1px solid #000}
    .videosCont ul li img{ display: inherit}
    .videosCont ul li img:last-child {position:absolute;left:50%;top:50%;width:25%;transform: translate(-50%,-50%);}
    .videosCont ul{ margin: 5vw auto 0 auto}
    .videosCont .videos video{width: 100%}
    .videosCont .videos{ margin-top: 30px;}
    .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf {background-color: #005f96; border: 2px solid #fff; color: #fff; font-size: 3.5vw; display: inline-block; letter-spacing: 0.1rem; font-family: 'Gotham'; padding:12px 16px; background: rgb(131,58,180);  background: linear-gradient(90deg, rgba(131,58,180,1) 0%, rgba(76,171,216,1) 0%, rgba(0,95,150,1) 100%); margin: 0 2.7777777777777777vw; border-radius: 22px; -webkit-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
      -moz-box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);
      box-shadow: 0px 0px 24px 4px rgba(0,0,0,0.15);}
  
  .videoOverlay, .pdfOverlay, .alertOverlay{ width: 100%; height: 100vh; position: fixed; background-color: #000; opacity: 0.86; z-index: 280; left: 0; top:0; display: none}
  .videoLightbox, .pdfLightbox, .alertLightbox{ background: #fff;
    width: 90%;
    border-radius: 20px;
    padding: 20px;
    position: fixed;
    z-index: 281;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    box-sizing: border-box;
  text-align: center; display: none}

  .pdfLightbox {height: 90%;padding: 10px;}
  .pdfBox {height: 85%;}
  .pdfBox iframe {height: 90%;border: 0;width: 100%;}
  .videoLightbox video{ width: 100%; margin: 20px 0;}
  .alertLightbox .js-score p:last-child span {font-size: 4vw;font-weight: bold;text-align: center;background: -webkit-linear-gradient(#4cabd8, #005f96);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
  .closebutton, .pdf-closebutton, .alert-closebutton { float: right;}
  
  .pdfSec{display: inline-block; width: 100%;}
  .pdfSec h2{
    font-size: 5.625vw;
    text-align: center;
    letter-spacing: 0.5rem;
    background: -webkit-linear-gradient(#4cabd8, #005f96);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .pdfWrapper{ width: 80%; margin: 30px auto 0 auto;}
  .pdfCont{ display: flex; justify-content: space-between; flex-wrap: wrap; border-radius: 10px; padding: 5px; margin-top: 20px;}
  .pdfCont .pdfImg{ width: 48%;
    max-width: 300px;
    margin-bottom: 30px;
    text-align: center;
    border: 1px solid #000;
    box-sizing: border-box;
    padding-bottom: 10px;
}
  .pdfCont .pdfImg .btn{padding: 7px 15px; margin-top: 5px; box-shadow: 0px 0px 8px 1px rgb(0 0 0 / 15%); -webkit-box-shadow: 0px 0px 8px 1px rgb(0 0 0 / 15%);
    -moz-box-shadow: 0px 0px 8px 1px rgb(0 0 0 / 15%);
    box-shadow: 0px 0px 8px 1px rgb(0 0 0 / 15%);}
  .pdfCont .pdfImg a{ display: block}
  
  .linksSec{display: inline-block; width: 100%;}
  .linksSec h2{
    font-size: 5.625vw;
    text-align: center;
    letter-spacing: 0.5rem;
    background: -webkit-linear-gradient(#4cabd8, #005f96);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }
  .linksWrapper{ width: 80%; margin: 30px auto 0 auto;}
  .linksCont{display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    background-color: #f0f0f0;
    border-radius: 10px;
    padding: 5px;
    margin-top: 20px;
    height: 45vh;
    overflow: scroll;
    padding: 20px;
    box-sizing: border-box;}
  .linksCont ul li{  margin: 10px 0 10px 10px; color: #0c80c1; font-size: 3.888888888888889vw }
  .linksCont ul li a{ text-decoration: underline; color: #0c80c1; }
  
  
  
  
    /* Knowledge Center CSS - END */
  
    .section5{display: inline-block; width: 100%;}
    .section5Cont{ width: 90%; margin: 0 auto 0 auto}
    .contentBox { margin: 10px 0; text-align: center; padding: 10px; box-sizing: border-box;}
    .contentBox img{ width: 50%; max-width: 300px;}
  .section5Cont .imgCont{ max-width: 460px; margin: 10px auto; width: 80%; border: 1px solid #000}
  .section5 .buttonWrapper{ text-align: center; margin-top: 20px;}

  
  @media screen and (min-aspect-ratio: 13/9){  
  .messagewapper{width:100%;height:100%;position:fixed;left:0;top:0;bottom:0;right:0;margin:auto;text-align:center;z-index:1000;display:block;background-color:#1776aa}
  .messagewapper .box{width:300px;height:245px;position:absolute;left:0;bottom:0;right:0;top:0;margin:auto}
  .messagewapper .box .logo{width:250px;height:auto;margin:0px auto 5px auto}
  .messagewapper .box h2{color:#1776aa;font-size:28px;text-align:center;color:#fff; padding-top: 10px;}
  .wrapper{ display: none}
  .knowledgeCenter .wrapper{ display: block}
  }
      
      
  @media screen and (max-aspect-ratio: 13/9){
   .messagewapper{display:none;}
   .wrapper{ display: block}
  .knowledgeCenter .wrapper{ display: block}
  
  }
  
  @media screen and (min-width: 768px){
  .logo{ max-width: 300px;}
  /* .section1{ padding: 170px 0 0 0} */
  
  .welcomeImg{ margin: 10px auto 20px auto;
    max-width: 720px;}
   .btn{ padding: 10px 35px}
  
   .registrationContainer{ 
     width: 62%;
     margin: 8.375vw auto 0 auto;
     padding: 6.375vw;
  }
  .registrationContainer h2,  .contentBox h2{
    font-size: 3.625vw;
  }
  .registrationContainer .formCont{
    margin-top: 3.8125vw;
  }
  .registrationContainer .formField{
    margin-bottom: 3.0625vw;
  }
  .registrationContainer .formCont input{
    font-size: 2.4375vw;
  }
  
  input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    font-size: 2.4375vw;
  }
  input::-moz-placeholder { /* Firefox 19+ */
    font-size: 2.4375vw;
  }
  input:-ms-input-placeholder { /* IE 10+ */
    font-size: 2.4375vw;
  }
  input:-moz-placeholder { /* Firefox 18- */
    font-size: 2.4375vw;
  }
  .loginBtn{ font-size: 2.75vw}
  .barndName{ width: 160px}
  .points{ top: 18.222222vw; font-size: 2.75vw}
  .surveyContainer h2{ font-size: 3.625vw;}
  .surveyContainer .brands{ width: 70%; margin: 2vw auto 0 auto}
  .surveyContainer .brands li{ width: 40%; }
  .surveyQuestContainer .questWrapper .questCont p, .surveyQuestContainer .questWrapper .questCont ul li, .paginationWrapper ul li{ font-size: 2.5vw}
   
  
  .surveyQuestContainer{ margin: 30px auto 0 auto}
  .surveyQuestContainer .questWrapper .questCont ul li{padding: 3.166667vw 5.555555555555555vw;}
  
  .thankyouWrapper{ width: 70%}
  .thankyouWrapper .info1{ font-size: 3.555556vw}
  .thankyouWrapper .info1 span{ font-size: 4.666667vw}
  .thankyouWrapper .info2{ font-size: 2.333333vw}
  
  /* Social Wall CSS - START */
  .messageCarousel{ height: 350px; padding: 20px 82px}
  .slick-next, .slick-prev, .slick-next:hover, .slick-next:focus, .slick-prev:hover, .slick-prev:focus{ width: 60px; height: 60px;}
  /* Social Wall CSS - END */
  
  .videosWrapper{ width: 70%}
  .categoryCont ul li{padding: 30px 22px; margin: 15px 0}
  .pdfWrapper{ width: 90%}
  .linksCont ul li{margin:10px 0 10px 50px}
  .videosCont ul{margin: 4vw auto 0 auto}
  .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf { font-size:4vw}
  .section5Cont .downloadIcon, .section5Cont .downloadIcon-pdf, .section5Cont .mailIcon, .section5Cont .mailIcon-pdf{ font-size: 3vw;}
  .pdfCont .pdfImg .btn{padding: 7px 25px; font-size:1.4rem;}
  .videosCont ul li span{ font-size: 1.4rem;}
  .bottomSec .middleSec{ max-width: 250px}
  .bottomSec{ background-size: 20%; height:280px}
  .thankyouWrapper{margin: 0 auto}
  .thankyouWrapper .info1{margin-top: 2vw}
  .thankyouWrapper .info2{ margin-top: 1.777778vw}
  .thankyouWrapper .logoCont{ margin: 2.166667vw auto 0 auto;}
  .participateBtn{ font-size: 2vw;}
  }
  
  
      /* @media screen and (max-width: 480px), screen and (min-height: 700px) { */
  @media screen and (max-width: 768px) and (min-height: 1024px){
    .welcomeImg{ max-width: 620px}
    /* .section1{ padding: 80px 0 0 0;} */
    /* .bottomSec{ height: 420px} */
    .bottomSec .middleSec{ max-width: 245px;}
    .section1 .title{ font-size: 4.625vw}
  
    .surveyQuestContainer .questWrapper .questCont p{ font-size: 2.888889vw}
    .paginationWrapper ul li{ width: 6vw; height: 6vw; font-size: 2.888889vw}
  
    .thankyouWrapper{ margin: 0 auto}
    .thankyouWrapper .thankyouImg{ width: 70%}
    .thankyouWrapper .info1{ margin-top: 3vw}
    .thankyouWrapper .logoCont{ margin: 2.166667vw auto 0 auto}
    .thankyouWrapper .info1{ font-size: 3vw}
    .participateBtn{ margin: 3vw auto 0 auto; font-size:2.5vw}
    .surveyQuestContainer .questWrapper .questCont ul{ margin: 3.555556vw 0 0 0;}
    .surveyQuestContainer .questWrapper .questCont ul li{font-size: 2.888889vw; padding: 2vw 5.555555555555555vw}

    .section5Cont .imgCont{max-width: 450px;}
    
  
  }
  
  @media screen and (max-width: 540px) and (min-width: 539px){
    /* .section1{ padding: 70px 0 0 0} */
    .welcomeImg{ margin: 10px auto 20px auto; max-width: 450px}
    .section1 .title{ font-size: 4.625vw}
    .bottomSec{ background-size: 22%}
  
    .registrationContainer{
      width: 62%;
    }
    .registrationContainer h2,  .contentBox h2{
      font-size: 3.625vw;
    }
    .registrationContainer .formCont{
      margin-top: 4.8125vw;
    }
    .registrationContainer .formField{
      margin-bottom: 3.0625vw;
    }
    .registrationContainer .formCont input{
      font-size: 2.4375vw
    }
  
    input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
      font-size: 2.4375vw;
    }
    input::-moz-placeholder { /* Firefox 19+ */
      font-size: 2.4375vw;
    }
    input:-ms-input-placeholder { /* IE 10+ */
      font-size: 2.4375vw;
    }
    input:-moz-placeholder { /* Firefox 18- */
      font-size: 2.4375vw;
    }
    .loginBtn{ font-size: 2.75vw}
  
    .surveyContainer h2{
      font-size: 3.625vw;
    }
    .surveyContainer .brands{ width: 70%;}
    .surveyContainer .brands li{ width: 40%}
  
    .surveyQuestContainer{margin: 80px auto 0 auto;}
    .surveyQuestContainer .questWrapper .questCont ul li{padding: 3.166667vw 5.555555555555555vw; font-size: 2.888889vw}
  
    .thankyouWrapper .thankyouImg{ width: 60%}
    .thankyouWrapper .logoCont{width: 30%;}
    .thankyouWrapper .info1{ font-size:4vw; }
    .thankyouWrapper .info1 span{ font-size: 4.666667vw; margin-top: 3vw}
    .thankyouWrapper .info2{ font-size: 3vw}
    .thankyouWrapper .logoCont{ margin:1.166667vw auto 0 auto; }
    .thankyouWrapper{margin: 4.5vw auto 0 auto}
    .participateBtn{ font-size: 2.75vw}
  
    .points{ top: 17.222222vw; font-size: 2.75vw}
    .paginationWrapper ul li{ font-size: 2.888889vw}
  
    .messageCarousel{ padding: 30px 42px; height: 250px}
    .pdfWrapper{ width: 60%}
    .videosCont ul{ margin:4vw auto 0 auto}
    .section5Cont .imgCont{max-width: 290px;}
  .pdfCont .pdfImg .btn{padding: 7px 25px; font-size:2.5vw;}

  }
  @media screen and (max-width: 320px){
    /* .section1{
      padding: 50px 0 0 0;
    } */
    .loginBtn{ font-size: 3vw}
  
    .surveyQuestContainer{margin: 55px auto 0 auto;}
    .barndName{ width: 110px;}
    .points{ top: 25.222222vw; font-size: 3vw}
  
    .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf{padding: 11px 12px}
    .pdfWrapper{ margin: 12px auto 0 auto}

    .section5Cont .imgCont{ max-width: 180px;}
    .bottomSec .middleSec {max-width: 135px}
  }
  
  @media screen and (min-width: 1024px){
    .welcomeImg{ max-width: 900px}
    
  
    /* Desktop - START */
  .container{ max-width: 100%;}
  .knowledgeCenter{ background-size: 15%;}
  .logo{ max-width: 170px}
  
  .bottomSec{ background-size: 8%; position: fixed;}
  .section2, .categorySec, .videosSec, .pdfSec, .linksSec, .thankyouSec{
    display: inline-block;
      width: 600px;
      position: relative;
      left: 50%;
      transform: translateX(-50%);
  }
  .registrationContainer{ margin: 120px auto 0 auto;}
  h2{ font-size: 30px !important; }
  h2 br{ display: none}
  .registrationContainer .formCont input{ font-size: 20px}
  
  input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
    color: #005f96 !important;
    font-size: 20px;
  }
  input::-moz-placeholder { /* Firefox 19+ */
    color: #005f96 !important;
    font-size: 20px;
  }
  input:-ms-input-placeholder { /* IE 10+ */
    color: #005f96 !important;
    font-size: 20px;
  }
  input:-moz-placeholder { /* Firefox 18- */
    color: #005f96 !important;
    font-size: 20px;
  }
  .btn{ font-size: 18px; cursor: pointer}
  .bottomSec{ height: 180px; position: relative;}
  .bottomSec .middleSec{max-width: 145px;}
  
  .categoryWrapper{ margin: 140px auto 0 auto;}
  .categoryCont ul{ width: 50%;}
  .categoryCont ul li{ font-size: 1.75vw; cursor: pointer; padding: 16px 22px; margin: 10px 0;}
  .back{ font-size: 1.5vw; cursor: pointer; top: 30px;}
  .videosWrapper{ width: 90%; margin: 140px auto 0 auto;}
  .videosCont{ min-height: 40vh;}
  .videosCont ul{ margin:20px auto 0 auto; width:100% }
  .videoLightbox{ max-width: 500px; height: 650px;}
  .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf{ font-size: 1.5vw}
  .closebutton{ cursor: pointer;}
  .pdfWrapper, .linksWrapper{margin: 100px auto 0 auto;}
  .linksCont ul li{ font-size: 20px; margin: 20px 0 20px 50px}
  .thankyouSec .thankyouWrapper{ margin: 220px auto 0 auto; min-height: 40vh}
  
  /* Desktop - END */
  
    }
    
  
    @media screen and (min-width: 1280px){
      .welcomeImg{ max-width: 900px}
    
  
      /* Desktop - START */
    .container{ max-width: 100%;}
    .knowledgeCenter{ background-size: 15%;}
    .bottomSec{ background-size: 4%; position: absolute;}
    .section2, .categorySec, .videosSec, .pdfSec, .linksSec, .thankyouSec{
      display: inline-block;
        width: 890px;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
    }
    h2{ font-size: 30px !important; }
    h2 br{ display: none}
    .registrationContainer .formCont{margin-top: 40px;}
    .registrationContainer .formCont input{ font-size: 20px}
    .registrationContainer .formField{ margin-bottom: 20px;}
    input::-webkit-input-placeholder { /* Chrome/Opera/Safari */
      color: #005f96 !important;
      font-size: 20px;
    }
    input::-moz-placeholder { /* Firefox 19+ */
      color: #005f96 !important;
      font-size: 20px;
    }
    input:-ms-input-placeholder { /* IE 10+ */
      color: #005f96 !important;
      font-size: 20px;
    }
    input:-moz-placeholder { /* Firefox 18- */
      color: #005f96 !important;
      font-size: 20px;
    }
    .btn{ font-size: 20px; cursor: pointer}
    .bottomSec{ height: 250px;}
    .bottomSec .middleSec{max-width: 215px;}
    /* .pdfCont .pdfImg{ max-width: 170px;} */
    .categoryWrapper{ margin: 140px auto 0 auto;}
    .categoryCont ul{ width: 50%;}
    .categoryCont ul li{ font-size: 1.75vw; cursor: pointer;}
    .back{ font-size: 1.5vw; cursor: pointer; top: 30px;}
    .videosWrapper{ width: 60%; margin: 140px auto 0 auto;}
    .videosCont ul{ margin:30px auto 0 auto; width: 100% }
    .videoLightbox{ max-width: 500px; height: 650px;}
    .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf{ font-size: 1vw}
    .downloadIcon, .downloadIcon-pdf, .mailIcon, .mailIcon-pdf{
        margin:0 2vw;
    }
    .closebutton{ cursor: pointer;}
    .pdfWrapper, .linksWrapper{margin: 140px auto 0 auto;}
    .linksCont ul li{ font-size: 30px; margin: 20px 0 20px 50px}
    .thankyouSec .thankyouWrapper{ margin: 220px auto 0 auto}
    
    /* Desktop - END */
    }
  
    @media screen and (min-width: 1600px){
  
    .bottomSec{ background-size: 8%; position: absolute;}
    }
  
    @media screen and (min-width: 1280px) and (max-height: 768px){
      .bottomSec{ position: relative;}
      .pdfCont .pdfImg{ width: 28%; max-width: 240px;}
      .linksCont ul li{ font-size: 20px;}
      .bottomSec{height: 170px}
      .bottomSec .middleSec{ max-width: 145px; }
      .thankyouWrapper .thankyouImg{ width: 60%;}
    }
  
  .loadericon{width: 80px; height:80px; position: fixed; left:0; top:0; bottom: 0; right:0; margin: auto; z-index: 1000;display:none;}
  
  .lds-ring {
    display: inline-block;
    position: relative;
    width: 80px;
    height: 80px;
  }
  .lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 64px;
    height: 64px;
    margin: 8px;
    border: 8px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #086ba4 transparent transparent transparent;
  }
  .lds-ring div:nth-child(1) {
    animation-delay: -0.45s;
  }
  .lds-ring div:nth-child(2) {
    animation-delay: -0.3s;
  }
  .lds-ring div:nth-child(3) {
    animation-delay: -0.15s;
  }
  @keyframes lds-ring {
    0% {
      transform: rotate(0deg);
    }
    100% {
      transform: rotate(360deg);
    }
  }
  
  .alert {
      z-index: 1001;
      display:none;
      position:fixed;
      left:0;right:0;
      top:0;
      background-color:#ee2727;
      box-shadow: 0px 1px 6px 0px #000;
  }
  
      .alert p {
          text-align: center;
          font-size: 1.1em;
          padding: 10px;
          color: #fff;
      }