@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700&display=swap");

:root {
  --green: #16a085;
  --black: #444;
  --light-color: #777;
  --box-shadow: 0.5rem 0.5rem 0 rgba(22, 160, 133, 0.2);
  --text-shadow: 0.4rem 0.4rem 0 rgba(0, 0, 0, 0.2);
  --border: 0.2rem solid red;
}

* {
  font-family: "Poppins", sans-serif;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  outline: none;
  border: none;
  text-transform: capitalize;
  transition: all 0.2s ease-out;
  text-decoration: none;
}

html {
  font-size: 62.5%;
  overflow-x: hidden;
  scroll-padding-top: 7rem;
  scroll-behavior: smooth;
}

section {
  padding: 2rem 9%;
}

section:nth-child(even) {
  background-image: url("mother.jpeg");
}

.zzzz {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.com/svgjs' width='1440' height='560' preserveAspectRatio='none' viewBox='0 0 1440 560'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1024%26quot%3b)' fill='none'%3e%3crect width='1440' height='560' x='0' y='0' fill='rgba(249%2c 249%2c 249%2c 1)'%3e%3c/rect%3e%3cpath d='M185.98799152640353 78.9203900742082L89.62715021942775-58.69715336634238-47.990393221122844 37.66368794063341 48.370448085852956 175.281231381184z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M-75.97316260778051 58.30360012210114L44.87592384911298 175.00620635921257 161.57853008622442 54.157119902319074 40.729443629330916-62.54548633479235z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M101.14435569428869-68.03309788588594L-51.11535252786848 2.966770086551577 19.884515444569033 155.22647830870875 172.1442236667262 84.22661033627124z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M1419.935%2c200.302C1462.43%2c201.139%2c1507.3%2c191.404%2c1530.179%2c155.584C1554.594%2c117.359%2c1555.324%2c65.976%2c1529.584%2c28.63C1506.368%2c-5.053%2c1460.692%2c-7.889%2c1419.935%2c-4.366C1386.122%2c-1.443%2c1357.56%2c16.806%2c1338.843%2c45.117C1317.465%2c77.452%2c1299.011%2c117.031%2c1316.963%2c151.386C1335.825%2c187.483%2c1379.215%2c199.5%2c1419.935%2c200.302' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M1257.7742121398169 94.59109614015009L1406.1094077401167 173.46231868817966 1484.9806302881461 25.127123087879923 1336.6454346878465-53.74409946014967z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1502.6347614719373 113.86203930660156L1447.9393115231348-44.985081394083664 1289.0921908224498 9.710368554718713 1343.787640771252 168.55748925540394z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M182.88007055600175 540.3822747766854L101.43205435461712 393.44616397726696-45.504056444801364 474.8941801786516 35.94395975658327 621.83029097807z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M49.09200621560334 635.8123736380502L173.94033689580553 523.3984317697619 61.52639502751733 398.5501010895598-63.321935652684864 510.964042957848z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float1'%3e%3c/path%3e%3cpath d='M-125.11 498.43 a175.54 175.54 0 1 0 351.08 0 a175.54 175.54 0 1 0 -351.08 0z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1288.79 412.53 a3.74 3.74 0 1 0 7.48 0 a3.74 3.74 0 1 0 -7.48 0z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float2'%3e%3c/path%3e%3cpath d='M1400.934%2c614.841C1432.447%2c614.55%2c1456.42%2c589.335%2c1471.182%2c561.492C1484.905%2c535.61%2c1486.639%2c505.266%2c1472.687%2c479.507C1458.025%2c452.438%2c1431.659%2c433.721%2c1400.934%2c431.793C1366.398%2c429.625%2c1328.437%2c439.127%2c1311.676%2c469.401C1295.255%2c499.062%2c1310.665%2c533.917%2c1328.398%2c562.812C1345.079%2c589.993%2c1369.043%2c615.136%2c1400.934%2c614.841' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float3'%3e%3c/path%3e%3cpath d='M1219.95 481.38 a141.43 141.43 0 1 0 282.86 0 a141.43 141.43 0 1 0 -282.86 0z' fill='rgba(233%2c 5%2c 5%2c 0.4)' class='triangle-float1'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1024'%3e%3crect width='1440' height='560' fill='white'%3e%3c/rect%3e%3c/mask%3e%3cstyle%3e %40keyframes float1 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-10px%2c 0)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float1 %7b animation: float1 5s infinite%3b %7d %40keyframes float2 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(-5px%2c -5px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float2 %7b animation: float2 4s infinite%3b %7d %40keyframes float3 %7b 0%25%7btransform: translate(0%2c 0)%7d 50%25%7btransform: translate(0%2c -10px)%7d 100%25%7btransform: translate(0%2c 0)%7d %7d .triangle-float3 %7b animation: float3 6s infinite%3b %7d %3c/style%3e%3c/defs%3e%3c/svg%3e");
  background-size: contain;
}

.line {
  border-top: 5px dashed var(--black);
}

.risk {
  text-align: center;
  padding-bottom: 2rem;
  text-shadow: var(--text-shadow);
  text-transform: uppercase;
  color: var(--black);
  font-size: 2rem;
  letter-spacing: 0.4rem;
}

.risk span {
  text-transform: uppercase;
  color: red;
}

.heading {
  margin-top: 60px;
  text-align: center;
  padding-bottom: 2rem;
  text-shadow: var(--text-shadow);
  text-transform: uppercase;
  color: var(--black);
  font-size: 5rem;
  letter-spacing: 0.4rem;
}

.heading span {
  text-transform: uppercase;
  color: red;
}

.btn {
  display: inline-block;
  margin-top: 1rem;
  padding: 0.5rem;
  padding-left: 1rem;
  border: var(--border);
  border-radius: 0.5rem;
  box-shadow: var(--box-shadow);
  color: red;
  cursor: pointer;
  font-size: 1.7rem;
  background: #fff;
}

.btn span {
  padding: 0.7rem 1rem;
  border-radius: 0.5rem;
  background: red;
  color: #fff;
  margin-left: 0.5rem;
}

.btn:hover {
  background: red;
  color: #fff;
}

.btn:hover span {
  color: red;
  background: #fff;
  margin-left: 1rem;
}

.header {
  padding: 2rem 9%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff;
}

.header .logo {
  font-size: 2.5rem;
  color: var(--black);
}

.header .logo i {
  color: red;
}

.header .navbar a {
  font-size: 1.7rem;
  color: var(--light-color);
  margin-left: 2rem;
}

.header .navbar a:hover {
  color: red;
}

.dropdown {
  overflow: hidden;
  float: right;
}

.dropdown .dropbtn {
  float: right;
  font-size: 16px;
  border: none;
  outline: none;
  color: var(--light-color);
  padding-left: 20px;
  background-color: inherit;
  font-family: inherit;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #ffffff;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
  text-align: left;
}

.dropdown:hover .dropdown-content {
  display: block;
}

#menu-btn {
  font-size: 2.5rem;
  border-radius: 0.5rem;
  background: #eee;
  color: red;
  padding: 1rem 1.5rem;
  cursor: pointer;
  display: none;
}

.home {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1.5rem;
  padding-top: 10rem;
 
}

.home .image {
  flex: 1 1 45rem;
}

.home .image img {
  width: 100%;
}

.home .content {
  flex: 1 1 45rem;
}

.home .content h3 {
  font-size: 4.5rem;
  color: var(--black);
  line-height: 1.8;
  text-shadow: var(--text-shadow);
}

.home .content p {
  font-size: 1.7rem;
  color: var(--light-color);
  line-height: 1.8;
  padding: 1rem 0;
}

.icons-container {
  display: grid;
  gap: 2rem;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.icons-container .icons {
  border: var(--border);
  box-shadow: var(--box-shadow);
  border-radius: 0.5rem;
  text-align: center;
  padding: 2.5rem;
}

.icons-container .icons i {
  font-size: 4.5rem;
  color: red;
  padding-bottom: 0.7rem;
}

.icons-container .icons h3 {
  font-size: 4.5rem;
  color: var(--black);
  padding: 0.5rem 0;
  text-shadow: var(--text-shadow);
}

.icons-container .icons p {
  font-size: 1.7rem;
  color: var(--light-color);
}

.services .box-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(27rem, 1fr));
  gap: 2rem;
}

.services .box-container .box {
  background: #fff;
  border-radius: 0.5rem;
  box-shadow: var(--box-shadow);
  border: var(--border);
  padding: 2.5rem;
}

.services .box-container .box i {
  color: red;
  font-size: 5rem;
  padding-bottom: 0.5rem;
}

.services .box-container .box h3 {
  color: var(--black);
  font-size: 2.5rem;
  padding: 1rem 0;
}

.services .box-container .box p {
  color: var(--light-color);
  font-size: 1.4rem;
  line-height: 2;
}

.about {
  background-image: url(https://c4.wallpaperflare.com/wallpaper/765/958/389/colorful-abstract-design-background-wallpaper-preview.jpg);
  background-size: cover;
}

.about .row {
  display: flex;
  justify-content: space-between;
  /* flex-wrap: wrap; */
}

.about .row .image img {
  width: 50vh;
  height: 50vh;
  border-radius: 50%;
}
.about .row .image img:hover {
  cursor: pointer;
  border-color: green;
  border-width: 15px;
  border-style: outset;
}
.about .row .image h2 {
  font-size: 60px;
  padding-left: 100px;
  color: green;
}
.about .row .content img {
  width: 50vh;
  height: 50vh;
  border-radius: 50%;
}
.about .row .content h2 {
  font-size: 60px;
  padding-left: 90px;
  color: red;
}
.about .row .content img:hover {
  cursor: pointer;
  border-color: red;
  border-width: 15px;
  border-style: outset;
}
/* .about .row .image img {
  width: 100%;
}

.about .row .content {
  flex: 1 1 45rem;
}

.about .row .content h3 {
  color: var(--black);
  text-shadow: var(--text-shadow);
  font-size: 4rem;
  line-height: 1.8;
} */

/* .about .row .content p {
  color: var(--light-color);
  padding: 1rem 0;
  font-size: 1.5rem;
  line-height: 1.8;
} */

.doctors .box-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
  gap: 2rem;
}

.doctors .box-container .box {
  text-align: center;
  background: #fff;
  border-radius: 0.5rem;
  border: var(--border);
  box-shadow: var(--box-shadow);
  padding: 2rem;
}

.doctors .box-container .box img {
  height: 20rem;
  border: var(--border);
  border-radius: 0.5rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}

.doctors .box-container .box h3 {
  color: var(--black);
  font-size: 2.5rem;
}

.doctors .box-container .box span {
  color: red;
  font-size: 1.5rem;
}

.doctors .box-container .box .share {
  padding-top: 2rem;
}

.doctors .box-container .box .share a {
  height: 5rem;
  width: 5rem;
  line-height: 4.5rem;
  font-size: 2rem;
  color: red;
  border-radius: 0.5rem;
  border: var(--border);
  margin: 0.3rem;
}

.doctors .box-container .box .share a:hover {
  background: red;
  color: #fff;
  box-shadow: var(--box-shadow);
}
.book {
  background-image: url(https://c4.wallpaperflare.com/wallpaper/765/958/389/colorful-abstract-design-background-wallpaper-preview.jpg);
  background-size: cover;
}
.book .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
}

.book .row .image {
  flex: 1 1 45rem;
}

.book .row .image img {
  width: 100%;
}

.book .row form {
  flex: 1 1 45rem;
  background: #fff;
  border: var(--border);
  box-shadow: var(--box-shadow);
  text-align: center;
  padding: 2rem;
  border-radius: 0.5rem;
}

.book .row form h3 {
  color: var(--black);
  padding-bottom: 1rem;
  font-size: 3rem;
}

.book .row form .box {
  width: 100%;
  margin: 0.7rem 0;
  border-radius: 0.5rem;
  border: var(--border);
  font-size: 1.6rem;
  color: var(--black);
  text-transform: none;
  padding: 1rem;
}

.book .row form .btn {
  padding: 1rem 4rem;
}

.review .box-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(27rem, 1fr));
  gap: 2rem;
}

.review .box-container .box {
  border: var(--border);
  box-shadow: var(--box-shadow);
  border-radius: 0.5rem;
  padding: 2.5rem;
  background: #fff;
  text-align: center;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.review .box-container .box img {
  height: 10rem;
  width: 10rem;
  border-radius: 50%;
  object-fit: cover;
  border: 0.5rem solid #fff;
}

.review .box-container .box h3 {
  color: #fff;
  font-size: 2.2rem;
  padding: 0.5rem 0;
}

.review .box-container .box .stars i {
  color: #fff;
  font-size: 1.5rem;
}

.review .box-container .box .text {
  color: var(--light-color);
  line-height: 1.8;
  font-size: 1.6rem;
  padding-top: 4rem;
}

.review .box-container .box::before {
  content: "";
  position: absolute;
  top: -4rem;
  left: 50%;
  transform: translateX(-50%);
  background: red;
  border-bottom-left-radius: 50%;
  border-bottom-right-radius: 50%;
  height: 25rem;
  width: 120%;
  z-index: -1;
}

.blogs .box-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(30rem, 1fr));
  gap: 2rem;
}

.blogs .box-container .box {
  border: var(--border);
  box-shadow: var(--box-shadow);
  border-radius: 0.5rem;
  padding: 2rem;
}

.blogs .box-container .box .image {
  height: 20rem;
  overflow: hidden;
  border-radius: 0.5rem;
}

.blogs .box-container .box .image img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}

.blogs .box-container .box:hover .image img {
  transform: scale(1.2);
}

.blogs .box-container .box .content {
  padding-top: 1rem;
}

.blogs .box-container .box .content .icon {
  padding: 1rem 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.blogs .box-container .box .content .icon a {
  font-size: 1.4rem;
  color: var(--light-color);
}

.blogs .box-container .box .content .icon a:hover {
  color: red;
}

.blogs .box-container .box .content .icon a i {
  padding-right: 0.5rem;
  color: red;
}

.blogs .box-container .box .content h3 {
  color: var(--black);
  font-size: 3rem;
}

.blogs .box-container .box .content p {
  color: var(--light-color);
  font-size: 1.5rem;
  line-height: 1.8;
  padding: 1rem 0;
}

.footer .box-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr));
  gap: 2rem;
}

.footer .box-container .box h3 {
  font-size: 2.5rem;
  color: var(--black);
  padding: 1rem 0;
}

.footer .box-container .box a {
  display: block;
  font-size: 1.5rem;
  color: var(--light-color);
  padding: 1rem 0;
}

.footer .box-container .box a i {
  padding-right: 0.5rem;
  color: red;
}

.footer .box-container .box a:hover i {
  padding-right: 2rem;
}

.footer .credit {
  padding: 1rem;
  padding-top: 2rem;
  margin-top: 2rem;
  text-align: center;
  font-size: 2rem;
  color: var(--light-color);
  border-top: 0.1rem solid rgba(0, 0, 0, 0.1);
}

.footer .credit span {
  color: red;
}

/* media queries  */
@media (max-width: 991px) {
  html {
    font-size: 55%;
  }

  .header {
    padding: 2rem;
  }

  section {
    padding: 2rem;
  }
}

@media (max-width: 768px) {
  #menu-btn {
    display: initial;
  }

  .header .navbar {
    position: absolute;
    top: 115%;
    right: 2rem;
    border-radius: 0.5rem;
    box-shadow: var(--box-shadow);
    width: 30rem;
    border: var(--border);
    background: #fff;
    transform: scale(0);
    opacity: 0;
    transform-origin: top right;
    transition: none;
  }

  .header .navbar.active {
    transform: scale(1);
    opacity: 1;
    transition: 0.2s ease-out;
  }

  .header .navbar a {
    font-size: 2rem;
    display: block;
    margin: 2.5rem;
  }
}

.blogs {
  background-image: url(https://c4.wallpaperflare.com/wallpaper/765/958/389/colorful-abstract-design-background-wallpaper-preview.jpg);
  background-size: cover;
}

.blogs .row .image img {
  width: 100%;
}

.blogs .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
}

.blogs .row form {
  flex: 1 1 45rem;
  background: #fff;
  border: var(--border);
  box-shadow: var(--box-shadow);
  text-align: center;
  padding: 2rem;
  border-radius: 0.5rem;
}

.blogs .row form h3 {
  color: var(--black);
  padding-bottom: 1rem;
  font-size: 3rem;
}

.blogs .row form .box {
  width: 100%;
  margin: 0.7rem 0;
  border-radius: 0.5rem;
  border: var(--border);
  font-size: 1.6rem;
  color: var(--black);
  text-transform: none;
  padding: 1rem;
}

.blogs .row form .btn {
  padding: 1rem 4rem;
}

@media (max-width: 450px) {
  html {
    font-size: 50%;
  }
}

.register {
  background-image: url(https://c4.wallpaperflare.com/wallpaper/765/958/389/colorful-abstract-design-background-wallpaper-preview.jpg);
  background-size: cover;
}

.register .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
}

.register .row .image {
  flex: 1 1 45rem;
}

.register .row .image img {
  width: 100%;
}

.register .row form {
  flex: 1 1 45rem;
  background: #fff;
  border: var(--border);
  box-shadow: rgb(255, 129, 129) 5px 5px;
  text-align: center;
  padding: 2rem;
  border-radius: 0.5rem;
}

.register .row form h3 {
  color: var(--black);
  padding-bottom: 1rem;
  font-size: 3rem;
}

.register .row form .box {
  width: 100%;
  margin: 0.7rem 0;
  border-radius: 0.5rem;
  font-size: 1.6rem;
  color: red;
  text-transform: none;
  border: 1px solid red;
  padding: 10px;
  box-shadow: 5px 5px;
}

.register .row form .btn {
  border: 1px solid;
  padding: 10px;
  box-shadow: 5px 5px;
  padding: 1rem 4rem;
}

.quality-care {
  background-image: url(https://s3.amazonaws.com/images.teladoc.com/www/2019/site/quality-care/hero-quality.jpg);
}

.quality-care .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
}


.services .row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 2rem;
}

.services .row .image {
  flex: 1 1 45rem;
}

.services .row .image img {
  width: 100%;
}

.services .row .content {
  flex: 1 1 45rem;
}

.services .row .content h3 {
  color: var(--black);
  text-shadow: var(--text-shadow);
  font-size: 4rem;
  line-height: 1.8;
}

.services .row .content p {
  color: var(--light-color);
  padding: 1rem 0;
  font-size: 1.5rem;
  line-height: 1.8;
}

/* ADDED CSS HERE */

.img-resize {
  width: 220px;
  height: 250px;
}
.img-resize {
  width: 223px;
  height: 340px;
}
.swiper-wrapper {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
}
.swiper-wrapper-2 {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
}
.swiper-slide box h2 {
  align-items: center;
}

/* dos css */

.dos {
  padding-top: 80px;
  margin-left: 25px;
  margin-right: 25px;
  margin-top: 25px;
}
.dos h2 {
  text-align: center;
  font-size: 50px;
  color: #09a048;
  text-decoration: underline;
}
.dos .row2 {
  display: flex;
  justify-content: space-between;
}
.p12 {
  flex-basis: 47%;
}
/* .p2{
  flex-basis: 47%;
} */
.dos .row2 .p12 {
  background-color: #09a048;
  font-size: 20px;
  /* padding-left: 15px; */
  padding-top: 15px;
  padding-bottom: 15px;
  border-radius: 50px;
}
.dos .row2 .p12 .content2 p {
  opacity: 0;
}
.dos .row2 .p12 .content2 h1 {
  line-height: 35px;
}
.dos .row2 .p12 .content2:hover p {
  cursor: pointer;
  opacity: 1;
}
.dos.row2 .p12 .content2 {
  position: relative;
}
.dos .row2 .p12 .content2 h1 {
  position: absolute;
  padding-top: 70px;
}
.dos .row2 .p12 .content2:hover h1 {
  opacity: 0;
}
.dos .row2 .p12 {
  display: flex;
}
.dos .row2 .p12 .imgs2 img {
  border-radius: 50px;
  width: 30vh;
  height: 30vh;
  padding-right: 10px;
  padding-left: 10px;
}
.dos h1 {
  font-size: 30px;
}

/* .box-container{
  height: 50%;
} */

/* .box-container .box img{
  height: 60vh;
  width: 100%;
}
.box-container-2 .box img{
  height: 60vh;
  width: 100%;
} */

.blogimg {
  height: 60vh;
  width: 100%;
}
.box-container-2 {
  width: 100%;
  margin: 0 auto;
  padding-left: 20px;
  display: flex;
  justify-content: space-around;
  text-align: justify;
}
.box-container:after {
  content: "";
  display: inline-block;
  width: 100%;
}
/* .box-container-2:after {
  content: '';
  display: inline-block;
  width: 100%;
} */
.box-container {
  width: 100%;
  margin: 0 auto;
  display: flex;
  justify-content: space-around;
}
/* #blogdown{
  justify-content: space-around;

} */

.box-container-2 .outer {
  border: 2px solid red;
}
.box-container-2 .outer {
  padding: 20px;
  padding-right: 20px;
}

/* donts css */
.donts {
  padding-top: 80px;
  margin-left: 25px;
  margin-right: 25px;
  margin-top: 25px;
}
.donts h2 {
  text-align: center;
  font-size: 50px;
  color: red;
  text-decoration: underline;
}
.donts .row {
  display: flex;
  justify-content: space-between;
}
.p1 {
  flex-basis: 47%;
}
/* .p2 {
  flex-basis: 47%;
} */
.donts .row .p1 {
  background-color: #ff5c5c;
  font-size: 20px;
  padding-top: 15px;
  padding-bottom: 15px;
  border-radius: 50px;
}
.donts .row .p1 .content p {
  opacity: 0;
  color: #ffffff;
}
.donts .row .p1 .content h1 {
  line-height: 35px;
  color: #ffffff;
}
.donts .row .p1 .content:hover p {
  cursor: pointer;
  opacity: 1;
}
.donts .row .p1 .content {
  position: relative;
}
.donts .row .p1 .content h1 {
  position: absolute;
  padding-top: 70px;
}
.donts .row .p1 .content:hover h1 {
  opacity: 0;
}
.donts .row .p1 {
  display: flex;
}
.donts .row .p1 .imgs img {
  border-radius: 50px;
  width: 30vh;
  height: 30vh;
  padding-right: 10px;
  padding-left: 10px;
}
#more {
  display: none;
}
.box .content.para {
  color: black;
}
