/*********************resposive*********************************/
.mainBannerTop {position: relative;}
.bannerTextTop {position: absolute; left: 0%; display: flex; width: 98%; max-width: 1000px; top: 0; height: 100%; display: flex; align-items: center;  z-index: 999;} 
.bannerTextInner {  background: rgb(39 222 191 / 55%);  padding: 4rem 2rem 2rem; border-radius: 0 .8rem .8rem 0;}
.bannerTextInner h2 { color: #fff;font-size: 3.5rem; line-height: 2.9rem;}
.bannerTextInner p{ color: #fff; font-size: 1.5rem; }
a.buttonGreen , .buttonGreen { background: #27debf; color: #fff; border: 1px solid #fff; border-radius: 1.25rem; padding-left: 1.875rem; padding-right: 1.875rem; margin: 0 0.62rem;}
a.buttonGreen:hover , .buttonGreen:hover, a.buttonGreen.active , .buttonGreen.active { background:#fff;  color: #27debf;  border-color:#27debf;}
.bannerButtons {width: 100%; text-align: center; }
.publishBtn .btnLgPrimary  {margin: 0 auto !important; } 
.SliderLeft {width: 100%; height: 100%; display: flex; }
.textContainer  .hometier2 h3 { font-size: 3.5rem;}
.textContainer * {text-align: center; }
.textContainer h2 , .textContainer h3 , .textContainer p { color: #7f7f7f;}
.textContainer h2 , .textContainer  .hometier2 h2{ font-size: 2rem; }
.textContainer p {font-size: 1.3rem;text-align: left;}


.brandAgencyText h3{text-align: left;}
.brandAgency h2 {
  color: #27debf;
  text-align: center;
  font-size: 2.5rem;
}
.requestDemoHead a{color: #27debf;}

.hometier1 h4{color:  #27debf}
.hometier1 i{color:#27debf ;}
.tierHead{color:#27debf ;}
.hometier2{text-align: center;}
.hometier2 h3{color: #27debf ;}
.hometier3{text-align: center;align-items: center;}
.registerbtn{width: 25%; color: #fff;background-color: #000; border-radius: 0.5rem;}
.brandAgency h2{color:#27debf;text-align: center;}
.brandAgencyText{margin-bottom: 1.25rem;}
.requestDemoHead{ text-align: center;
                    max-width: 21.37rem;
                    margin: 0 auto;
                }
.requestDemoForn input, .requestDemoForn  select{border-radius: 0.37rem; 
                                                border-color: #27debf ;
                                                }
.Submitbtn {
            margin-top: 1.25rem;
            text-align: center;
           }
.creatorText{text-align: center;}
.creatorText h1{
                color: #27debf ;font-size: 4rem;                font-weight: 700;
            }
.applyGoogleIcon {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                 }
/* img.appleIcon {
                width: auto;
              } 
img.googleIcon {
    width: auto;
} */
.creatorIcon {
    margin: .5rem;
    max-width: 10.25rem;
    width: 100%;
    object-fit: fill;
}
.registerButton {
    padding: .6rem 2.81rem;
    border-radius: 0.43rem;
    background-color: #27debf;
    color: #fff;
}
.textContainer{display: flex!important;
                justify-content: center;
                align-items: center;
                height: 100%;
              }
.creatorTier3{
                display: flex;
                align-items: center;
             }
.creatorTier3Text{width: 70%;}
.creatorTier3Text h1{color:#27debf ;}
.textColor p, .textColor h3{color: #7f7f7f;}
.brandAgencyText h3{margin-bottom: 0;}
.borderShaddow{box-shadow:0 0 0.8rem 0.1rem #96969661;
               padding: 2.5rem 2.5rem;
              }
.mainHeadText h1{color:#27debf ;}
.brandAgencyTeir1{height: 100%;
                  display: flex;
                  justify-content: center;
                  text-align: center;
                  align-items: center;
                 }
.brandAgencyTeir1 h2{color:#27debf ;}
.requestDemobtn button{ padding: 0.62rem 2.43rem;
                        border-radius: 1.25rem;
                        color: #27debf !important;
                        background-color: transparent !important;
                        border-color: #27debf !important;
                      }
.requestDemobtn button:hover{
                                background-color:#27debf ;
                            }
.sucessBrandAagencybtn{
                            padding: 0.62rem 2.43rem;
                            border-radius: 1.25rem;
                            color: #fff;
                            background-color: #27debf !important;
                            border-color: #27debf !important;
                      }
.footerItm h5 { color: #27debf; font-size: 1.1rem; margin-bottom: .5rem;}
.subscribebtn{    border-radius: 1rem;
    padding: 0.25rem 1.37rem;
    margin-top: 0.62rem;}
.footerInput{border-radius: 1.43rem;
    padding: 0.62rem 1.16rem;}
.footerInput::placeholder{color:#27debf; opacity: 1;}
footer.mainFooter {
    background-color: #f5f5f5;
}
.borderBottom{ border-bottom-style: solid;border-color: #d1d2d4;}
.footerIcons{background-color: #73777f;
            display: inline-block;
            width: 1.81rem;
            height: 1.68rem;
            border-radius: 2.87rem;
            line-height: 1.93rem;
            margin: 0.18rem;
            }
.footerIcons i{
                color: #fff;
              }
              .subFooter {
                padding: 1rem 0;
            }
.footerText{color: #868991;}
.creatorHeading{    width: 100%;
    max-width: auto;
    margin: 0 auto;}
.navBarRasooc{background-color: #27debf;}
.navBarLinks li{background-color: #27debf;}
.navBarLinks a{color: #fff !important;}
.LoginNavBtn{color: #fff f !important;;
    background-color: #27debf !important;
    border-color: #fff  !important;}
.LoginNavBtn:hover{background-color:#27debf ; border-color: #fff; }
.requestDemoNavBtn{background-color: #fff !important;border-color: #fff !important;color:#27debf !important ;}
.requestDemoNavBtn:hover{background-color: #fff;color:#27debf ; border-color:#fff;}
.mainIndexIcon{display: flex;
    width: 5.75rem;
    height: 5.62rem;
    background-color: #4ccdb4;
    border-radius: 2.81rem;
    justify-content: center;
    align-items: center;
    margin: 0 auto;}
/* .IntroItems i {
    font-size: 3.5rem;
    margin-bottom: 0rem;
    color: #fff;
} */
.mainIndexIcon i{
    font-size: 3.5rem;
    margin-bottom: 0rem;
    color: #fff;
}
.HowitworkItm {    min-height: 16.93rem;    padding: 2rem 2rem;    height: 100%;}

.advtise .card {
    margin: 2rem 0;
    height: 100%;
    max-height: 400px;
    padding: 1rem;
    box-shadow: 0px 1px 0.8rem -0.1rem rgb(0 0 0 / 15%);
}

.HeroItm{height: calc(100vh - 73px);}
.IntroItems {
  text-align: center;
}
.IntroItems i {
  font-size: 4rem;
  margin-bottom: 1rem;
}
.footerItm h5 {  color: #27debf;  font-size: 1.1rem;}
.rasoocHelpsYou h2 {  margin-bottom: 3rem;}
.footerItm {  margin-bottom: 1rem;}
.hero2 .HeroItm {
  height: calc(100vh);
}
.hero2 .HeroItm img{height: 100%; object-fit: cover;}
.hero2 {  margin: 6rem 0;}
.advtise .card {  margin: 2rem 0;  height: 100%;  max-height: 400px;  padding: 1rem; box-shadow: 0px 1px 0.8rem -0.1rem rgb(0 0 0 / 15%);}
.rasoocHelpsYou h2 {  font-size: 2.5rem;}
.HowitworkItm h4 {  font-size: 1.7rem;}
.HowitworkItm p {  font-size: 1rem;  text-align: left!important;}
.advtise p {  font-size: 1.2rem;}
.navBarRasooc a.nav-link { font-size: 1.05rem;}
.footerItm p, .footerItm ul li {  font-size: 1rem;}
p.footerText { margin-top: .3rem;}
.switchIcons.border img {  display: block;  margin: 1rem auto;}
.bannerTextTop {position: absolute; left: 0%; display: flex; width: 98%; max-width:50%; top: -50%;bottom: -50%; height:fit-content; display: flex; align-items: center;  z-index: 999; margin: auto;} 
.HeroItm img {  height: 100%;  object-fit: cover;object-position: bottom left;}
.bannerTextInner h2 { color: #fff; font-size: 3rem;line-height: 2.9rem; margin-bottom: 0;object-position: left;}
.advtise h1 {    color: #71748d;  }
.indexHeader .btn:focus{box-shadow: none;}
.creatorBtnIcon h3{color: inherit;} 
.logoMaign {    max-width: 200px!important;    display: block;    width: 100%;}
.howRasoocWorks .HeroItm img {  object-fit: contain;}
  @media (min-width: 1850px) {
    .bannerTextInner h2 {    font-size: 3.3rem;      line-height: 55px;   }
    
  }
  @media (min-width: 1440px) and (max-width: 1149px) {
    .bannerTextInner h2 {     font-size: 2.5rem;    }
    
  }
  /* = 1281px to higher resolution desktops*/

  @media (min-width: 1200px) and (max-width: 1439px){    .bannerTextInner h2 {     font-size: 2.1rem;    }
    
  } 
@media (min-width: 1200px) {
  
  .hero2 .HeroItm img {    object-position: center;}
  .HeroItm img {    object-position: left center;}
  
}

@media screen and (max-width: 1025px) {
.hero2 .HeroItm {  height: auto;  width: 100%;padding-top: 100%; position: relative;}
.creatorIcon {  max-width: 11.25rem;}
.bannerTextInner h2 { font-size: 2.5rem;  line-height: 1.2;  }
.hero .HeroItm img {   object-position: right top;}
.creatorText h1 {   font-size: 2rem;  }
.hero2 .HeroItm img { object-position: center; position: absolute; left: 0;top: 0;}

}

@media screen and (max-width: 991px) {
.bannerTextTop { position: static; width: 100%; max-width: 100%; height: 100%;}
.bannerTextInner {background: #fff; padding: 1rem 1rem 1rem; border-radius: 0 .8rem .8rem 0; margin-bottom: 2rem;}
.bannerTextInner p { color: #71748d; font-size: 1.7rem;}
.bannerTextInner h2 { /* position: static; */  color: #27debf;  font-size: 2.5rem; margin-bottom: 0; line-height: 1.2; object-position: left;}
.topbtnRes{border-color: #27debf !important;} 
.hero2 .HeroItm { position: relative;   width: 100%; padding-top: 100%;   height: auto;} 
.hero .HeroItm {height: auto; width: 100%;padding-top: 100%;position: relative;}
.advtise .creatorIcon {margin: .5rem; width: 49%!important;   object-fit: fill;}
.hero .HeroItm img{position: absolute;top: 0; left: 0;}
}


@media  (max-width: 767px) {
  
    .navbar-brand{padding: 0;}
    /* .HeroItm {    height: calc(100vh - 35px);} */
    .hero .HeroItm {height: auto; width: 100%;padding-top: 100%;position: relative;}
    .HeroItm img {     object-position: bottom center;position:absolute;top: 0;}
    .bannerTextInner h2 {    color: #27debf;   font-size: 1.5rem;    margin-bottom: 0;    line-height: 1.2;    object-position: left;}  
     .bannerTextTop { position: static; width: 100%;  max-width: 100%;height: 100%;}
    .bannerTextInner {   background: #fff;     padding: 1rem 1rem 1rem;    border-radius: 0}
    .bannerTextInner p {    font-size: 1.2rem;}
    .bannerButtons {    display: flex; justify-content: center;}
    .rasoocHelpsYou h2 {    font-size: 2.5rem;    line-height: 1.1;}
    .HowitworkItm {     padding: 2rem 2rem;    height: auto!important;    margin-bottom: 1.5rem;}
    .HowitworkItm .shadow {    box-shadow: 0 .2rem .5rem rgba(0,0,0,.15)!important;}
    .hero2 {    margin: 0rem 0;}
    .advtise .creatorIcon {margin: .5rem; width: 49%!important;   object-fit: fill;}
    .advtise .card { margin: 2rem 0; height: auto; max-height: 400px;  padding: 1rem;}
    .textContainer .hometier2 h3 {    font-size: 2.5rem;}
    .hero2 .HeroItm { position: relative;    width: 100%;    height: auto;}
    .footerItm h5 {     margin-bottom: .3rem;}
    section.hero2 .textContainer {    padding: 0!important; }
    .creatorTier3 { display: flex; align-items: normal!important; flex-direction: column;}
    .borderShaddow {  padding: 2.5rem 1rem!important;}
    .brandAgency   p { font-size: 1rem;  }
    .applyGoogleIcon  .creatorIcon {     width: 49%;  }
    .hero2 .registerButton {    margin-bottom: 2rem;}
    .creatorTier3Text {    width: 100%!important;}
    .topbtnRes{border-color: #27debf !important;}
    .switchIcons.border img {  max-height: 121px;   min-width: 121px;  }
    .logoMaign { max-width: 176px!important; }
  }