/* ----------------------------------------------- General */
:root {
  --body-font-size:16px;
  --body-font-color:#555555;
  --font1:"Montserrat", sans-serif;
/*  --font2:'Open+Sans', sans-serif;*/
  --font2:"Montserrat", sans-serif;
  --white:#FFF;
  --white50:rgb(255 255 255 /50%);
  --black:#000;
  --black10:rgb(0 0 0 /10%);
  --black20:rgb(0 0 0 /20%);
  --black50:rgb(0 0 0 /50%);
  --yellow: rgb(250, 187, 5);
  --green:#21a126;
  --brand-red:#CB2E34;
  --brand-grey:#9DA0A4;
  --brand-blu:#088ECE;
  --brand-blu-hover:#39BFFF;
  --brand-lightgrey:#f9f9f9;
  --brand-superlightgrey:#f9f9f9;
}

.bb{
  border-bottom:1px solid var(--lightgrey);
}
.bt{
  border-top:1px solid var(--lightgrey);
}
.font1{
  font-family: var(--font1) !important;
}
.font2{
  font-family: var(--font2);
}
.green{
  color: var(--green);
}
.blu{
  color: var(--brand-blu);
}
.white{
  color: var(--white);
}
.yellow{
  color: var(--yellow);
}

ul.nobullets{
  margin: 0;
  padding: 0;
}
ul.nobullets li{
  list-style: none;
  font-size: 14px;
  line-height: 1.4em;
  padding-top: 2px;
}
ul.nobullets li i{
  font-size: 8px;
  margin-top: -4px;
}

ul.nobullets.check2 li{
  background: url(../img/advocacy/check2.png)no-repeat;
  background-size: 25px;
  padding: 2px 0px 20px 40px;
}




a.cta-standard:link,
a.cta-standard:visited,
button.cta-standard{
  background:var(--brand-blu);
  color: var(--white);
  font-weight: 500;
  padding: 15px 30px;
  border-radius:30px;
  display: block;
  width: max-content;
  transition: all 0.3s ease;
  border:none;
  line-height: 1em;
}

a.cta-standard i, button.cta-standard i{
  color: var(--white);
  margin-right: 5px;
}

a.cta-standard:before{
  content: initial;
}
a.cta-standard:hover, button.cta-standard:hover{
  background:var(--brand-blu-hover);
  color: #fff;
  padding: 15px 40px;
}

ul.nobullets{
  margin: 0;
  padding: 0;
}
ul.nobullets li{
  list-style: none;
  font-size: 14px;
  line-height: 1.4em;
  padding-top: 2px;
}
ul.nobullets li i{
  font-size: 8px;
  margin-top: -4px;
}


html{
  position:relative;
}

body, *{
	font-family: var(--font2);
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "slnt" 0;
	color: var(--body-font-color);
  font-size: 17px;
}

main{
  padding-top: 77px;
}

h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6{
 font-family: var(--font1);
 font-weight: 900;
 font-style: normal;
}

h1,.h1{
  font-size: 60px;
}


a:link,
a:visited{
  color: var(--brand-blu);
  transition: all 0.3s ease-in-out;
  text-decoration: none;
}

a:hover{
  color: var(--body-font-color);
  text-transform: none;
}
.crcle{
  position: absolute;
  z-index: 2;
  border-radius: 50%;
  display: block;
  overflow: hidden;
  transform: translatey(0px);
  
}
.crcle.c1{
  top:200px;
  left:10%;
  animation: float 6s ease-in-out infinite;
}
.crcle.c2{
  top:200px;
  left:85%;
  animation: float 6s ease-in-out infinite;
}
.crcle.c3{
  top:350px;
  left:78%;
  animation: float2 6s ease-in-out infinite;
}
.crcle.c4{
  top:500;
  left:50%;
  animation: float 2s ease-in-out infinite;
}

.crcleStandard{
  border-radius: 50%;
  display: block;
  overflow: hidden;
  width: 150px;
}


@keyframes float {
  0% {
    box-shadow: 0 0px 15px 0px rgba(2 120 182 /15%);
    transform: translatey(0px);
  }
  50% {
    box-shadow: 0 0px 15px 0px rgba(2 120 182 /20%);
    transform: translatey(-20px);
  }
  100% {
    box-shadow: 0 0px 20px 0px rgba(2 120 182 /35%);
    transform: translatey(0px);
  }
}

@keyframes float2 {
  0% {
    box-shadow: 0 0px 15px 0px rgba(2 120 182 /15%);
    transform: translatey(-20px);
  }
  50% {
    box-shadow: 0 0px 15px 0px rgba(2 120 182 /20%);
    transform: translatey(0px);
  }
  100% {
    box-shadow: 0 0px 20px 0px rgba(2 120 182 /35%);
    transform: translatey(-20px);
  }
}



#top_nav.top_nav {
    padding: 15px 0px;
    background: transparent;
    transition: all 0.2s ease-in-out;
    background: var(--white);
    position: fixed;
    top: 0;
    left:0;
    z-index: 100;
    width: 100%;
}

.top_nav .logo-Nur-Digital-Marketing {
    width: 130px;
}


.hero.blugrad{
  background: #2563a7;
/*  background: #0d8fcf;*/
/*  background: linear-gradient(180deg, rgba(13,143,207,1) 0%, rgba(255,255,255,1) 100%);*/
  padding-top: 100px;
}


.hero h1, .hero .h1{
  line-height: 1em;
}

.hero p.lead{
  font-size: 30px;
  font-weight: 400;
  line-height: 1.1em;
}

.talentsFaces{
  border-radius: 80px;
  margin-top: -50px;
}




.linkedinpostWrap{
  position: relative;
}
.linkedinpostWrap .linkedinpost{
  position: absolute;
  z-index: 2;
  width: 300px;
  height: auto;
  overflow: hidden;
  border-radius: 8px;
  box-shadow: 0 0 25px rgb(0 0 0 / 20%);
  bottom:-100px;
  left:-50px;
}

.targetPersonas{
  background: url(../img/advocacy/blurred.png)no-repeat top center;
}

.targetPersonas .card{
  border-radius: 30px;
  border: 0;
}

#owlShowcase{

}

.landingTarget .card{
  border-radius: 30px;
  border:0;
}

.landingTarget .card h5{
  font-family: var(--font2);
  font-size: 50px;
  line-height: 1em;
}


.landingTarget .card.brand{
  background-image: linear-gradient(135deg, #dff2ff 10%, #cbd3ff 100%);
}
.landingTarget .card.brand h5{
  color:#7faac9;
}

.landingTarget .card.contactGen{
  background-image: linear-gradient(135deg, #dff0f4 10%, #ebf9d7 100%);
}
.landingTarget .card.contactGen h5{
  color:#a0c6d0;
}

.landingTarget .card.engagement{
  background-image: linear-gradient(135deg, #eaf8d9 10%, #f8d8df 100%);
}
.landingTarget .card.engagement h5{
  color:#bcd0a0;
}

.landingTarget .card.dataAnalysis{
  background-image: linear-gradient(135deg, #f8dadf 10%, #ffefcb 100%);
}
.landingTarget .card.dataAnalysis h5{
  color:#d8a9a9;
}

.evidence{
  color: var(--white);
  background: var(--brand-blu);
  padding:5px 15px;
  border-radius: 4px;
}


.desktopLinks a{
  margin-right: 20px;
  line-height: 2.7em;
}
.desktopLinks a:last-child{
  margin-right: 0;
}

.desktopLinks a.selected{
  border-bottom: 1px dashed var(--brand-blu);
}


.evidence{
  color: var(--white);
  background: linear-gradient(-45deg, #ff928a, #0092ff, #ffc107, #ff5722);
  background-size: 400% 400%;
  animation: gradient 8s ease infinite;
  display: inline- block;
  width: max-content;
}


#testimonial{
  background: #1d1f3a;
}


@keyframes gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}


#owlRatingShowcase  .card .rating i{
  color: var(--yellow);
}
#owlRatingShowcase  .card .feedback{
  font-size: 13px;
  color: var(--brand-grey);
}





@media (max-width: 768px) {

  h1{
    font-size: 50px;
  }

  .hero.blugrad p.lead{
    font-size: 18px;
  }

  #advant h4{
    font-size: 25px;
    font-weight: 300;
  }

  #advant img{
    width: 70px;
  }

  .talentsFaces{
    margin-top: 50px;
    border-radius: 20px;
  }

  .linkedinpostWrap .linkedinpost {
    position: absolute;
    z-index: 2;
    width: 200px;
    height: auto;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 0 25px rgb(0 0 0 / 20%);
    left: 20px;
    bottom:-110px;
  }


  h3.h1.trustTitle{
    font-size: 28px;
  }

}