@import url('https://fonts.googleapis.com/css2?family=Parkinsans:wght@300..800&family=Philosopher:ital,wght@0,400;0,700;1,400;1,700&display=swap');

html {

  scroll-behavior: smooth;

}



:root {

  --primary-color: #EF8952;

  --secondary-color:#5F89AB;

  --light-black:#FFFFFF4D;

  --heading-font:"Philosopher", sans-serif;

  --body-font: "Parkinsans", sans-serif;

  --body-font-size: 17px;

}

body {font-family: var(--body-font);color: rgb(255, 255, 255);background-color: #202228;}

p{font-size: 17px;font-weight: 400;line-height: 30px;color: #ffffff;}

.font-500{font-weight: 500;}

.container { max-width: 1300px;}

section {padding-top: 70px;padding-bottom: 70px;}

.font-16{font-size: 16px;font-weight: 400;line-height: 26px;}

.mt-20{margin-top: 20px;}

.mb-20{margin-bottom: 20px}

.mt-30{margin-top: 30px;}

.mb-30{margin-bottom: 30px}

.section-heading h3{font-weight: 700;font-size: 40px;font-family: var(--heading-font);color: #FFFFFF;}

.section-heading h3 span{color: var(--primary-color);}

.section-heading p{font-weight: 400;font-size: 17px;line-height: 30px;color: #BCBCBC;}

.heading-topic{color: var(--primary-color);border-left: 3px solid var(--primary-color);padding-left: 10px;font-size: 28px; font-weight: 500;}

.font-semibold{font-weight: 600 !important;}

ul li{list-style: none;}

.theme-btn {font-size: 17px; font-weight: 500;   padding: 12px 22px 12px 48px;border-radius: 8px;cursor: pointer;background-image: url(../images/paw\ 1.svg);background-repeat: no-repeat;background-position: 18px center; background-size:auto;text-decoration: none;border: 1px solid;}

.theme-btn.orange{background-color:var(--primary-color);color: white;border-color: #FA70701A;}

.theme-btn.blue{background-color: var(--secondary-color);color: white;border-color: #5F89AB1A;}

.theme-btn.grey{background-color: #FFFFFF4D;color: #ffffff;border-color: #FA70701A;}

.theme-btn.light-white{background-color: #FFFFFF4D;color: #000000;border-color: #FA70701A;background-image: url(../images/paw-black.svg);}

/* ------------------------------------------------------------- */

/* header css start */

.header-top-inner{padding: 5px 0;}

.header-top-left{gap: 40px;}

.header-top-para{font-size: 15px;font-weight: 400;color: #FFFFFF;}

.header-item a{font-size: 16px;font-weight: 500;color: #FFFFFF;    padding: 28px 21px !important;border-bottom: 3px solid transparent;}

.header-item a:hover,.header-item a.active{border-bottom: 3px solid var(--primary-color);color: var(--primary-color) !important;}

.header-mid-container{background-color: #FFFFFF33;border-radius: 10px;}

.header{position: absolute;top: 0;width: 100%;z-index: 99;}

.sticky-nav {position: fixed;top: 0;left: 0;width: 100%;background-color: #FFFFFF33 !important;z-index: 999;transition: all 0.3s ease;border-radius: 0;backdrop-filter: blur(27px);    margin-top: 0 !important;}



/* header css end */

/* banner section start */

.banner-section{background-image: url(../images/bannerimg.webp);background-repeat: no-repeat;background-position: center;background-size: cover;

  /* padding-top: 295px;padding-bottom: 250px; */

  height: 100vh;

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding: 0;

}

.banner-heading{font-family: var(--heading-font);font-size: 75px;font-weight: 700;color: #FFFFFF;}



.banner-content {max-width: 747px;margin-top: 76px;

}

.banner-para{font-size: var(--body-font-size);font-weight: 500;line-height: 30px;color: #FFFFFF;}

.banner-btns{gap: 14px;margin-top: 50px;}

/* banner section end */

/* about section start */

.read-more-sec{margin-top: 60px;}

.about-left{padding: 0 50px;}

.about-left img{width: 100%;}

/* about section end */

/* how help-section start */

.how-help-section { position: relative; background-image: url(../images/how-help-bg.webp); background-repeat: no-repeat; background-position: center top;

 background-size: cover;padding-top: 60px;padding-bottom: 250px;z-index: 0; 

}

.how-help-section::before { content: ""; position: absolute; inset: 0;  background-color: #00000099;  z-index: 1;}

.how-help-section > * {position: relative;z-index: 2; }

.dog-common-card{position: relative;z-index: 0;    display: flex; align-items: center; justify-content: center; flex-direction: column;height: 100%;

}

.dog-image{position: relative;z-index: 0;border-radius: 15px;overflow: hidden;box-shadow: 0px 4px 12px 0px #00000026;    width: 100%;height: 100%;}

.dog-image::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 22.61%, rgba(0, 0, 0, 0.66) 69.69%, rgba(0, 0, 0, 0.8) 98.83%);

   z-index: 1;}

.dog-image img {width: 100%;height: 100%;object-fit: cover;}

.comon-card-content { position: absolute; bottom: 10px; padding: 20px 38px;}

.how-help-card-heading{font-size: 30px;font-weight: 700;color: #FFFFFF;text-transform: uppercase;}

.how-help-card-para{font-size: 16px;font-weight: 500;line-height: 26px;color: #FFFFFF;}

.how-help-card-container {    margin-top: -210px;}

   /* how help-section end */

   /* why friend section start */

.why-list-icon{width: 77px;height: 77px;border-radius: 12px;background-color: #36383E;display: flex;align-items: center;justify-content: center;flex: 0 0 77px;}

.why-list-content h4{font-size: 22px;font-weight: 700;color: #FFFFFF;margin-bottom: 6px;font-family: var(--heading-font);}

.why-list-content p{font-size: 16px;font-weight: 400;line-height: 26px;color: #BCBCBC;}

.why-friend-list{gap: 20px;}

.why-friend-list-main{margin-top: 40px;}

.why-friend-right img{border-radius: 20px;}

.why-friend-small-img{position: absolute;bottom:20px;    left: -30px;}

.arrow-img-design{ position: absolute;top: 56px;left: -27px;}



.why-friend-right img{border-radius: 20px;}

   /* why friend section end */

   /* successs story section start */

.success-story-spotlight{max-width: 576px;}

.success-story-right{background-color: var(--primary-color);height: 100%;    padding: 60px;display: flex;align-items: center;}

.success-story-left{height: 100%;}

.success-story-left img{width: 100%;height: 100%; object-fit: cover;}

.success-story-top-content h3{font-size: 45px;font-weight: 700;color: #FFFFFF;font-family: var(--heading-font);}

.success-story-top-content{border-bottom: 2px solid #FFFFFF4D;padding-bottom: 35px;margin-bottom: 35px;}

   /* successs story section end */

   /* join section start */

.join-us-sec{background-image: url(../images/joinus.webp);background-repeat: no-repeat;background-position: center top;background-size: cover;position: relative;padding-top: 90px;padding-bottom: 100px;}

.join-us-sec::before{content: "";position: absolute;inset: 0;background-color: #000000BA;z-index: 4;}

.join-us-sec > *{position: relative;z-index: 5;}

.big-heading h3{font-size: 45px;font-weight: 700;color: #FFFFFF;font-family: var(--heading-font);}

.big-heading h3 span{color: var(--primary-color);display: block;}

.big-heading p{font-size: 16px;font-weight: 400;line-height: 26px;color: #FFFFFF;}

.join-us-icon{font-size: 18px;font-weight: 600;line-height: 30px;color: #FFFFFF;}

.join-us-data{font-size: 16px;font-weight: 500;}

.join-us-items{border-right: 1px solid #D9D9D94D;padding-right: 40px;padding-left: 30px;}

.join-us-items:first-child{padding-left: 0;} 

.join-us-items:last-child{border-right: none;}

.join-us-main{margin-top: 40px;}

.big-heading{max-width: 605px;}

   /* our story page start */

.our-story-abot-2-para{font-size: 22px;font-weight: 500;line-height: 26px;color: #FFFFFF;}

.about2-left{padding: 0 70px;}

.dog-paw-icon{width: 24px !important;}

.our-vission-section { position: relative; background-image: url(../images/vission.webp); background-repeat: no-repeat; background-position: center top;background-size: cover;padding-top: 100px;padding-bottom: 100px;z-index: 0; 

   }

.our-vission-section::before { content: ""; position: absolute; inset: 0;  background-color: #00000099;  z-index: 1;}

.our-vission-section > * {position: relative;z-index: 2; }

.team-common-card{position: relative;z-index: 0;    display: flex; align-items: center; justify-content: center; flex-direction: column;cursor: pointer;}

.dog-card-hover{position: relative;z-index: 0;    display: flex; align-items: center; justify-content: center; flex-direction: column;cursor: pointer;}

.team-image{position: relative;z-index: 0;border-radius: 20px;overflow: hidden;box-shadow: 0px 4px 12px 0px #00000026;    width: 100%;height: 100%;}

.team-image::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, 0) 27.74%, rgba(0, 0, 0, 0.66) 71.35%, rgba(0, 0, 0, 0.8) 98.83%);



     z-index: 1;}

.team-image img {width: 100%;height: 100%;object-fit: cover;}

.team-card-content { position: absolute; bottom: 10px; padding: 20px 22px;}

.dog-card-hover-content{ position: absolute; bottom: 10px; padding: 20px 22px;}

.team-heading{font-size: 24px;font-weight: 700;color: #FFFFFF;font-family: var(--heading-font);}

.team-desc{font-size: 15px;font-weight: 400;line-height: 26px;color: #DEDEDE;}
.team-new-des-main{display: none;height: 200px; overflow-y: scroll;scrollbar-color: #888 #202228;}
.team-para{font-size: 15px;font-weight: 500;line-height: 26px;color: #ffffff;margin-bottom: 0;}

.team-common-card:hover .team-image::before {background: #000000BF;}

.team-common-card:hover .team-heading{color: var(--primary-color);  animation: fadeInUp 0.4s ease forwards;}

.team-common-card:hover .team-desc{animation: fadeInUp 0.4s ease forwards;}


.team-common-card:hover .team-para{animation: fadeInUp 0.4s ease forwards;}

/* dog card hover */

.dog-card-hover:hover .dog-image::before {background: #000000BF;}

.dog-card-hover:hover .team-heading{color: var(--primary-color);  animation: fadeInUp 0.4s ease forwards;}

.dog-card-hover:hover .team-desc{display: block;  animation: fadeInUp 0.4s ease forwards;}

.dog-card-hover:hover .team-para{animation: fadeInUp 0.4s ease forwards;}

.load-more-section{ max-width: 735px; margin: auto;margin-top: 40px;}

.load-more-btns{gap: 14px;}

.load-more-inner{    border-top: 2px solid #4C4C4C;padding-top: 25px;}

/* success story page start */

.success-heading{font-size: 30px;font-weight: 700;color: #FFFFFF;font-family: var(--heading-font);border-left: 3px solid var(--primary-color);padding-left: 17px;}

.success-para{font-size: 16px;font-weight: 400;line-height: 26px;color: #BCBCBC;}

.success-para span img{width: 18px;}

.success-right{    padding-left: 30px;}

.success-right-2{padding-right: 30px;}

.success-title{font-size: 20px;font-weight: 700;color: #FFFFFF;font-family: var(--heading-font);}

.success-story-inner{padding-bottom: 70px;}

.success-story-2{background-color: #000000;}

.success-left img{border-radius: 20px;}

/* contact-page start */

.section-heading-contact h3{font-size: 30px;font-weight: 700;font-family: var(--heading-font);line-height: 45px;}

.contact-list{border-radius: 20px;text-align: center;padding:20px;height: 100%;    display: flex;flex-direction: column;align-items: center;justify-content: center;}

.contact-icon{margin-bottom: 15px;}

.contact-list-title{font-size: 17px;font-weight: 400;text-transform: uppercase;}

.contact-list-desc{font-size: 17px;font-weight: 400;line-height: 26px;color: #000229;margin-top: 7px;}

.contact-list.blue{background-color: #D8EDFF;color: #507DA1;}

.contact-list.orange{background-color: #FFEADF;color: #E4804B;}

.contact-form-section{background-color: #3B3B3B;border-radius: 20px;padding: 40px;}

.contact-form .form-control{background-color: #202228;border: none;border-radius: 10px;padding: 17px 20px;color: #BCBCBC;font-size: 16px;font-weight: 400;  margin-bottom: 20px;}

.contact-form .form-control:focus{box-shadow: none;border: none;}

.contact-form .form-control::placeholder{color: #BCBCBC;}

.contact-left-heading h5{font-size: 24px;font-weight: 500;}

.map-layout{border-radius: 20px; height: 100%;}

.map-layout iframe{width: 100%;height: 100%;border-radius: 20px;}

.available-adoption{background-color: #000000;}

.adoption-heading h3{font-size: 45px;font-weight: 700;color: var(--primary-color);font-family: var(--heading-font);}

@keyframes fadeInUp {

    from {

      transform: translateY(20px);

      opacity: 0;

    }

    to {

      transform: translateY(0);

      opacity: 1;

    }

  }

.banner-content-new{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 100%;}

.banner-content-inner{    max-width: 750px;}

#dog-posts .dog-image{height: 508px;}







/* footer style*/

footer{

  padding-top: 70px;

  background-color: #000000;

  color: #ffffff;

}

.footer-item h5{

  font-size: 20px;

  font-weight: 700;

  font-family: var(--heading-font);

}

.footer-content h5{

  font-size: 21px;

  font-weight: 700;

  color: #ffffff;font-family: var(--heading-font);

}

.footer-links{

  list-style: none;

  padding-left: 0;

}

.footer-links li a{

  font-size: 16px;

  font-weight: 500;

  line-height: 40px;

  color: #DCDCDC;

  text-decoration: none;

}

.footer-links span{margin-right: 7px;}

.footer-content p{font-size: 15px;font-weight: 400;line-height: 24px;color: #ffffff;max-width: 339px;}

.subscribe {background-color: #fff;border-radius: 12px;display: flex;padding: 17px;align-items: center;justify-content: space-between;height: 75px;max-width: 404px;}

.subscribe input{border: none;background-color: transparent;font-size: 16px;font-weight: 400;color: #000000;}

.subscribe input:focus{border: none;outline: none;}

.subscribe .btn-subscribe{font-size: 16px;border: none;background: transparent;font-weight: 600;color:#000000;}

.right-contact a{font-size: 16px;font-weight: 700; text-decoration: NONE;color: rgb(255, 255, 255);}

.subscribe-top {font-size: 16px;font-weight: 600;color: #ffffff !important;    margin-bottom: 12px;}

.right-contact span{font-size: 14px;font-weight: 400;}

.footer-item-content {gap: 45px;}

.footer-bottom {border-top: 1px solid #FFFFFF1A;  padding-top: 30px;padding-bottom: 30px;margin-top: 30px;}

.footer-bottom p{font-size: 16px;font-weight: 500;color: rgb(255, 255, 255);}

.footer-bottom-content{display: flex;}

/* footer end */



.subscribe form{ width: 100%;display: flex;align-items: center;justify-content: space-between;}





  /* 23june */

.addopt-container-left{background-color: var(--primary-color);    display: flex;justify-content: end;padding: 60px 60px 60px 10px;height: 100%;    align-items: center;}

.addopt-container-right{background-color: #3B3B3B;    display: flex;justify-content: start;padding: 60px 10px 60px 60px;height: 100%;    align-items: center;}

.new-addopt-heading h3{font-size: 35px;font-weight: 700;color: #fff;font-family: var(--heading-font);}

.new-addopt-heading p{font-size: 17px;font-weight: 400;color: #fff;line-height: 30px;}

.new-addopt-container-inner-left{max-width: 585px;}

.new-addopt-container-inner-right{max-width: 585px;}

.new-addopt-container-inner-right .new-addopt-heading p{color: #BCBCBC;}

.team-image {height: 508px;}

.available-adoption .dog-common-card .dog-image{height: 429px;}

.how-help-card-container .dog-common-card .dog-image{height: 429px;}

 



 /* new page design */

.donation-directly-card{

  border-radius: 20px;

    text-align: center;

    padding: 28px;

    height: 100%;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    background-color: #36383E;

    position: relative;

    padding-top: 54px;

}

.donation-directly-icon{    width: 80px;

    height: 80px;

    background-color: var(--primary-color);

    display: flex;

    align-items: center;

    justify-content: center;

    border-radius: 50%;

      position: absolute;

    top: -40px;}

  .donation-directly-icon img{width: 32px;}

  .donation-directly-content p{    font-size: 20px;

    font-weight: 500;}

    .donation-directly-card-top{margin-top: 80px;}

    .why-friend-small-img img{width: 304px; height: 354px; object-fit: cover;}

    .choose-list-option .form-check .form-check-input{

      width: 40px;

    height: 40px;

    background-color: #36383e;

    border: none;

    border-radius: 7px;

    }

    .choose-list-option .form-check .form-check-input:checked{

      background-color: var(--primary-color);

    }

    .choose-list-option .form-check .form-check-input:focus{

      box-shadow: none;

    }

    .choose-list-option .form-check-input:checked[type=checkbox] {background-size: 30px;}

    .choose-your-impact-sec .why-friend-small-img {

    position: absolute;

    bottom: 51px;

    left: -30px;

}

.secure-donation-card{display: flex;align-items:center;gap: 14px; border-right: 1px solid #36383e;padding-right: 10px;    padding-right: 11px;}

.secure-donation-content h4{font-size: 17px;

    font-weight: 400;

    line-height: 25px;}

    .secure-conation-image img{width: 40px;height: 40px;}

  .secure-donation-sec{background-color: #000000;}

  .theme-btn-a{color: var(--primary-color);text-decoration: none;}



.entry-content{

  margin-top:100px;

}

.dog-common-card:hover .dog-card-hover-content .team-new-des-main{display:block;}
.page-id-14 .team-desc{    height: 150px;
    overflow-y: scroll;    scrollbar-color: #888 #202228;}