@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

.v_tab{
    padding: 10px 50px 50px 50px;
    /* height: 900px; */
    display: flex;
    background-color: white;
}
@media (min-width: 320px) and (max-width: 600px) {
    .v_tab{
        padding: 1px 5px 5px 5px;

    }

}
/* Style the tab */
.btn_tab {
  float: left;
  width: 27%;
  /* border: 1px solid  #3C8DC5; */
  /* background-color: #f1f1f1; */
  height: fit-content;
}
/* Style the buttons inside the tab */
.btn_tab button {
  display: block;
  background-color: white;
  color: #333333;
  padding: 22px 16px;
  width: 100%;
  border: 1px solid  rgb(165, 163, 163);;
  outline: none;
  margin: 5px;
  text-align: left;
  cursor: pointer;
  transition: 0.3s;
  font-size: 18px;
  font-family: 'Roboto';
}
.content_details{
    width:75%;
    margin: 5px;
}   
/* Change background color of buttons on hover */
.btn_tab button:hover {
  background-color: rgb(141,196,61);
  color: white;
}

/* Create an active/current "tab button" class */
.btn_tab button.active {
  background-color: rgb(141,196,61);;
  color: white;
}

/* Style the tab content */
.tab_content {
  float: left;
  padding: 0px 12px;
  /* border: 1px solid #ccc; */
  /* width: 7%; */
  border-left: none;
}



.s_blog{
    display: flex;
    /* margin-right: 100px; */
    /* margin-top: 20px; */
}

.s_blogs{
    /* margin-left: 100px; */
    /* width: 80%; */
}

.s_pres{
    font-size: 24px;
    font-family: 'Roboto';
    font-weight: 400;
    line-height: 34px;
    color: #666666;
    /* padding: 25px 0px 0px 110px; */
}
.s_para1{
  
      
}
@media (min-width: 320px) and (max-width: 600px) {
    .s_para1{
    display: flex;
    justify-content: center;
     align-items: center;  
     flex-direction: column-reverse;
    }
}
.s_para1 > p{
    font-size: 18px;
    font-family: 'Roboto';
   
    font-weight: 400;
    justify-content: center;
    text-align: left;
    margin-top: 10px;
    line-height: 30px;
}
.s_pres_img{
    /* width: 20%; */
}
.s_pres_img img{
    /* width: auto; */
    border: none;
    border-radius: 0;
    box-shadow: none;
    /* padding: 25px 100px 0px 0px; */
}


.s_tres_blogs{
    /* width: 75%; */
    /* margin-left: -105px; */
}
.s_tres_img{
    /* margin-left: 100px; */
    width: 25%;
}

@media screen and (max-width:778px){
    .v_tab {
        flex-direction: column;
    }
    .btn_tab {
        float: left;
        width: 100%;
        /* border: 1px solid  #3C8DC5; */
        /* background-color: #f1f1f1; */
        height: fit-content;
      }
      .content_details{
        width:100%;
    } 
    .s_blog{
        flex-direction: column;
        /* margin-right: 100px; */
        /* margin-top: 20px; */
        text-align: center;
        justify-content: center;

    }  
    .s_tres_img{
        /* margin-left: 100px; */
        width: auto;
        justify-content: center;
    }
    .s_pres_img{
        width: auto;
        text-align: center;
        justify-content: center;
    }
}