@import url("https://fonts.googleapis.com/css2?family=Manrope");

.container {
  /* background-color: black; */
  margin: auto
}

.blogtitle {
  margin-top: 50px;
  text-align: center;
  font-size: 40px;
  font-weight: 900;
  width: 500px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.blogpic_main {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: auto;
  width: 80%;
  margin-bottom: 40px;
}

.blogpic {
  width: 100%;
  height: 100%;
}

.publish {
  background-color: #050713;
  height: 90px;
  width: 35%;
  margin-top: -50px;
  border-radius: 10px;
  margin-left: 50%;
  display: flex;
  justify-content: space-around;
  align-items: center;
  padding: 12px;
  /* z-index: 2; */
}

.publish>img {
  border-radius: 50%;
  /* width: 60%; */
  height: 100%;
}

.publish_text {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  /* background-color: white; */
  /* margin-left: -2%; */
  /* align-items: center; */
  color: white;
}

.publish_text>h5 {
  font-family: Manrope;
  font-size: 10px;
  font-weight: 400;
}

.publish_text>h3 {
  font-family: Manrope;
  font-size: 14px;
  font-weight: 400;
}

.publish_join {
  background-color: #3CB043;
  color: white;
  padding: 8px;
  align-items: center;
  display: flex;
  justify-content: center;
  border-radius: 20px;
}

#title_bt {
  margin-top: 25px;
  font-family: Manrope;
  font-size: 14px;
  font-weight: 400;
  line-height: 12px;
  letter-spacing: 0.5px;
  text-align: center;

}

#connects {
  margin-top: -20px;
  width: 97px;
}

#blogpic {
  text-align: center;
  width: 90%;
  height: 80%;
  margin-left: 7%;
  /* margin: auto; */
  /* margin-left: 80px; */
  border-radius: 6px;
}

.blogtext {
  margin-left: auto;
  margin-right: auto;
  width: 900px;
}

.blogppic2 {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  width: 734px;
}


.group-4865887 {
  align-items: flex-start;
  align-self: flex-end;
  display: flex;
  flex-direction: column;

  /* margin-right: -79px; */
  margin-top: 100px;
  /* min-height: 424px; */
  /* width: 95%; */
  /* background-color: red; */
}

.overlap-group-container-1 {
  align-items: flex-start;
  display: flex;
  height: 333px;
  width: 100%;
}

.overlap-group1-2 {
  align-items: center;
  background-color: var(--white);
  border-radius: 10px;
  box-shadow: 0px 4px 4px #0000000a;
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  min-height: 333px;
  width: 304px;
}

.app-store-awards-hon {
  letter-spacing: 0;
  margin-right: 7px;
  margin-top: 7px;
  min-height: 38px;
  width: 267px;
}

.flex-row-2 {
  align-items: flex-end;
  display: flex;
  margin-right: 2px;
  margin-top: 42px;
  min-width: 272px;
}

.group-4865852 {
  align-items: flex-start;
  display: flex;
  height: 19px;
  min-width: 209px;
}

.text {
  letter-spacing: 0;
  margin-left: 5px;
  min-height: 19px;
  min-width: 5px;
  text-align: center;
}

.date {
  letter-spacing: 0;
  min-height: 19px;
  min-width: 112px;
  text-align: center;
}

.address {
  letter-spacing: 0;
  margin-left: 5px;
  min-height: 19px;
  min-width: 76px;
  text-align: center;
}

.vuesaxoutlinearchive-add-1 {
  height: 20px;
  margin-left: 43px;
  width: 20px;
}

.unsplash-1 {
  height: 174px;
  width: 304px;
}

.apple-developer {
  align-self: flex-start;
  letter-spacing: 0;
  margin-left: 15px;
  margin-top: 13px;
  min-height: 16px;
}

.overlap-group2-2 {
  align-items: flex-start;
  background-color: var(--white);
  border-radius: 10px;
  box-shadow: 0px 4px 4px #0000000a;
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  min-height: 333px;
  padding: 0 15px;
  width: 304px;
}

.apple-developer-10 {
  color: #8B8B8B;
  font-family: Manrope;
  font-size: 12px;
  font-weight: 600;
  line-height: 16px;
  letter-spacing: 0em;
  text-align: left;
  margin-top: 10px;
}

.apple-developer-2 {
  letter-spacing: 0;
  margin-top: 13px;
  min-height: 16px;
}

.unsplashcssv-e-zac-hv-q {
  align-self: center;
  height: 174px;
  width: 225px;
}

.app-store-awards-hon-2 {
  letter-spacing: 0;
  margin-top: 7px;
  min-height: 38px;
  width: 267px;
}

.cardcontent {
  margin-left: 10px;
  margin-right: 10px;
}

.flex-row-8 {
  align-items: center;
  display: flex;
  margin-top: 43px;
  min-width: 263px;
}

.vuesaxoutlinearchive-add-3 {
  height: 1px;
  margin-bottom: 0.5px;
  margin-left: 53px;
  width: 1px;
}

.overlap-group3-2 {
  align-items: flex-start;
  background-color: var(--white);
  border-radius: 10px;
  box-shadow: 0px 4px 4px #0000000d;
  display: flex;
  flex-direction: column;
  min-height: 333px;
  width: 304px;
  margin: 10px;
}

.flex-row-7 {
  align-items: flex-end;
  align-self: center;
  display: flex;
  margin-right: 5px;
  margin-top: 30px;
  margin-bottom: 23px;
  min-width: 275px;
  color: #8B8B8B;
}

.vuesaxoutlinearchive-add-2 {
  height: 20px;
  margin-left: 52px;
  width: 20px;
}

.app-store-awards-hon-1 {
  font-family: Manrope;
  font-size: 14px;
  font-weight: 700;
  line-height: 19px;
  letter-spacing: 0em;
  text-align: left;
  color: #383838;
  margin-top: 10px;
}

.apple-developer-1 {
  letter-spacing: 0;
  margin-left: 12px;
  margin-top: 13px;
  min-height: 16px;
}

.overlap-group-5 {
  background-color: var(--white);
  border-radius: 10px;
  box-shadow: 0px 4px 4px #0000000d;
  display: flex;
  flex-direction: column;
  margin-left: 20px;
  min-height: 333px;
  width: 304px;
}

.flex-row-6 {
  /* align-items: flex-end; */
  display: flex;
  width: 100%;
  align-items: center;
  /* padding-top: 20px; */
  /* background-color:blue; */
  justify-content: space-between;
}

.title-2 {
  align-items: center;
  display: flex;
  height: 41px;
  min-width: 393px;
}

.rectangle-3 {
  background-color: var(--cardinal);
  height: 36px;
  margin-top: 1px;
  width: 4px;
}

.you-might-be-interested-in {
  letter-spacing: 0;
  margin-left: 8px;
  min-height: 41px;
  min-width: 379px;
}

.action {
  align-items: center;
  display: flex;
}

.group-4865338 {
  /* align-items: flex-end; */
  display: flex;
  height: 40px;
}

.btn-next2 {
  position: absolute;
  right: 3px;
}

.overlap-group-3 {
  height: 60px;
  margin-top: -14px;
  position: relative;
  width: 120px;
  flex-direction: column;
  justify-content: flex-end
}

.fa-circle-arrow-left {
  z-index: 100;
  font-size: 40px;
  color: #3CB043;
  cursor: pointer;
}

.fa-circle-arrow-right {
  z-index: 150;
  font-size: 40px;
  color: #3CB043;
  cursor: pointer;
}


.navigation-2 {
  height: 24px;
  left: 18px;
  position: absolute;
  top: 22px;
  transform: rotate(180deg);
  width: 24px;
}

.overlap-group-container-1 {
  flex-direction: row;
  display: flex;
  overflow-x: scroll;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.overlap-group-container-1::-webkit-scrollbar {
  display: none;
}



.ellipse-1-1 {
  height: 100px;
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(180deg);
  width: 100px;
}

.navigation-3 {
  height: 24px;
  width: 24px;
}



.vl {
  border-left: 4px solid green;
  height: 36px;
  padding-left: 13px;
}

.rec_topics {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
  background-color: #383838;
  border-radius: 50px;
  width: max-content;
  color: aliceblue;
  margin: 2%;
}

/* */

.blog_small_text {
  width: 400px;
  font-style: italic;
}

.searchbtn {

  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 10px;
  color: #FAFAFA;
  width: 83px;
  height: 43px;
  /* margin-left: -86px; */
  margin-top: 12px;
  background: #3CB043;
  box-shadow: 0px 4px 10px rgba(191, 30, 46, 0.24);
  border-radius: 4px;

}

.commtitle {
  font-family: Manrope;
  font-size: 16px;
  font-weight: 600;
  line-height: 22px;
  letter-spacing: 0em;
  text-align: left;
  margin-top: 13px;
}

.jumbotron {
  background: #FAFAFA;
  border-radius: 4px;
  padding: 30px;

  max-width: 100%;
  /* width: 100%; */
}




.blogppic2mob {
  display: none;
}


#sear {
  display: none;
}

#listenmob {
  display: none;
}

#mob_blog_pic {
  display: none;
}

#bstart {
  /* width:  900px; */
  /* background-color: blue; */
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 80%;
  margin-bottom: 20px;
  /* margin-top: -90px; */
}

#htip {
  margin-left: 15%;
}

#conv {
  width: 900px;
  margin-left: auto;
  margin-right: auto;
}


@media screen and (max-width: 1024px) {
  .publish {
    height: 80px;
    width: 60%;
    margin-top: -40px;
    margin-left: 0px;
    /* z-index: 2; */
  }
}

/*Moblie View*/



@media screen and (max-width: 768px) {
  .publish {
    height: 60px;
    width: 70%;
    margin-top: -30px;
    margin-left: 0px;
    padding: 10px 10px 10px 0px;
    /* z-index: 2; */
  }

  .publish>img {
    border-radius: 50%;
    /* width: 60%; */
    height: 100%;
  }

  /* .rec_topics{
    display: none;
  }
   */
  .publish_text {
    /* align-items: center; */
    margin-top: 8px;
    color: white;
  }

  .publish_text>h5 {
    font-family: Manrope;
    font-size: 10px;
    font-weight: 400;
  }

  .publish_text>h3 {
    font-family: Manrope;
    font-size: 14px;
    font-weight: 400;
  }

  .publish_join {
    background-color: #BF1E2E;
    color: white;
    padding: 12px;
    font-size: 12px;
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: 12px;
  }

  .action {
    display: none;
  }

  .right_head {
    display: flex;
  }

  .logostyle {
    width: 118px;
  }

  #profile_style {
    width: 63px;
  }

  .container {
    overflow-x: hidden;
    max-width: 768px;
  }

  #nav1 {
    display: none;
  }

  #navmenu {
    display: block;
  }

  #sear {
    display: block;
  }

  .blogtitle {
    width: 386px;
  }

  #blogpic {
    display: none;
  }

  #listenmob {
    display: block;
  }

  #mob_blog_pic {
    display: block;
  }

  #bstart {
    width: 355px;
    margin-top: 10px;
  }

  #liste {
    display: none;
  }

  .blogtext {
    width: 358px;
  }

  #htip {
    margin-left: 10px;
  }

  #conv {
    width: 348px;
  }

  .blogppic2 {
    display: none;
  }

  .blogppic2mob {
    display: flex;
    margin: auto;
    background-color: blue;
    width: fit-content;
  }
}

@media screen and (max-width: 450px) {
  .publish {
    height: 60px;
    width: 80%;
    margin-top: -30px;
    margin-left: 0px;
    padding: 8px 8px 8px 0px;
    /* z-index: 2; */
  }

  .rec_topics {
    display: none;
  }

  .publish>img {
    border-radius: 50%;
    /* width: 60%; */
    height: 100%;
  }

  .publish_text {
    /* align-items: center; */
    margin-top: 5px;
    color: white;
  }

  .publish_text>h5 {
    font-family: Manrope;
    font-size: 8px;
    font-weight: 400;
  }

  .publish_text>h3 {
    font-family: Manrope;
    font-size: 10px;
    font-weight: 400;
  }

  .publish_join {
    background-color: #BF1E2E;
    color: white;
    padding: 6px;
    font-size: 12px;
    align-items: center;
    display: flex;
    justify-content: center;
    border-radius: 10px;
  }

}