
@font-face {
    font-family: 'Poppins';
    src: url(../fonts/Poppins-Regular.ttf);
}
@font-face {
    font-family: 'Poppins-bold';
    src: url(../fonts/Poppins-Bold.ttf);
}
*{
    margin: 0;
    padding: 0; 
}
body{
    font-family: 'Poppins' !important;
}
header{
    padding: 0 0 35px;
    box-shadow: 1px 1px 12px #ccc;
}
.top_header{
    position: relative;
    background-color: #ffffff;
    padding: 14px 0 10px;
}
.top_nav{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 0.5rem;
}
.top_logo img{
    width:200px;
}
.top_nav_icon{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.phone_icon img{
    height: 40px;
    margin-right: 5px;
}
.email_icon img{
    width: 35px;
    margin-right: 8px;
}
.top_txt h6{
    color: #84A4D5;
    margin: 0;
    padding: 0;
}
.top_txt p{
    color: #84A4D5;
    margin: 0;
    padding: 0;
}
.top_txt p a{
    color: #84A4D5;
    text-decoration: none;
}
.prpl_btn{
    background-color: #947ab3; 
    border: 1px solid #947ab3;
    box-shadow: inset 0px 3px 6px #e3e3e3, 0px 3px 6px #e3e3e3;
    color: #fff;
    padding: 8px 34px;
    border-radius: 20px; 
    outline: none;
}
header .bg-dark {
    background-color: #84a4d5 !important;
}
.nav_width{
    width: 50%;
    margin: 0 auto;
    position: absolute !important;
    left: 0;
    right: 0;
    z-index: 99;
    box-shadow: inset 0px 3px 6px #00000029, 0px 3px 6px #00000029;
}
header .navbar-dark .navbar-nav .nav-link{
    color: #fff;
    padding: 1rem 1.5rem;
}
.xs-show{
    display: none;
}
.navbar-collapse{
    justify-content: space-evenly;
}
.main_banner{
    padding: 7rem 0 0;
    width: 100%;
    height: 100%;
}
.bby_bnr{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
}
.bby_left{
    position: relative;
}
.bby_left::before{
    content: '';
    position: absolute;
    top:20%;
    left: 0;
    width: 31px;
    height: 100%;
    background: url(../images/icon-feather-heart-blue-gradient.svg) 0 0 no-repeat;
    background-size: contain;
}
.bby_right{
    position: relative;
}
.bby_right::before{
    content: '';
    position: absolute;
    left: 0;
    top:-90px;
    width: 31px;
    height: 100%;
    background: url(../images/icon-feather-heart-purple-gradient.svg) 0 0 no-repeat;
    background-size: contain;
}
.bby_right::after{
    content: '';
    position: absolute;
    top: 100%;
    right: 5%;
    width: 31px;
    height: 100%;
    background: url(../images/icon-feather-heart-blue-gradient.svg) 0 0 no-repeat;
    background-size: contain;
}
.bby_right h1{
    color: #84A4D5;
    font-family: 'Poppins-bold';
}
.bby_right p{
    font-weight: 500;
}
.bby_right p{width: 62%;}
.bby_right p span{
    display: block;
}
.bnr_btn{
    background-color: #947ab3; 
    border: 1px solid #947ab3;
    box-shadow:0px 5px 6px #00000029;
    color: #fff;
    padding: 15px 40px;
    border-radius: 35px; 
    outline: none;
}
.adoption_widget{
    padding: 40px 0;
}
h1, h2{
    font-family: 'Poppins-bold';
}
.title h2{
    color: #84A4D5;
    margin: 1rem 0 2rem;
    text-align: center;
}
.process_container{
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}
.adoption_card{
    flex: 1 1 30%;
    background-color: #fff;
    box-shadow: 0px 8px 6px #bfbdbd;
    margin-bottom: 2.5rem;
    margin-right: 2.5rem;
}
.adoption_card a{
    text-decoration: none;
}
.adoption_card a p{
    color: #212529;
}
.mar-r0{
    margin-right: 0 !important;
}
.mar-b2{
    margin-bottom: 2rem !important;
}
.mar-b3{
    margin-bottom: 3rem !important;
}
.adoption_txt{
    padding: 25px 15px;
    text-align: center;
}
.adoption_txt h3{
    font-size: 1.3rem;
    color: #84A4D5;
}
.adoption_txt p{
    font-weight: 500;
    font-size: 15px;
}
.after_bar{
    position: relative;
}
.title.after_bar h2{
    padding: 0 0 1.2rem;
    margin: 1rem 0 4rem;
}
.after_bar h2::after{
    content: '';
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    margin: 0 auto;
    width: 125px;
    height: 4px;
    border-radius: 10px;
    background-color: #84A4D5;
}
.faq_bg{
     background: url(../images/home/adoption-decision-choiceline-bg.png) 0 -30px no-repeat;
     background-size: cover;
     width: 100%;
     height: 100%;
     padding:8rem 0 10rem;
     position: relative;
}
.faq_bg::before{
    content: '';
    width: 100%;
    height:100%;
    background:#947AB3 url(../images/choiceline-purple-bg-overlay.svg) 0 0 no-repeat;
    background-size: cover;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    opacity: 0.48; 
}
.faq_inner{
    position:relative;
}
.faq_bg h2{
    color: #fff;
    font-size: 2.8rem;
    margin: 1rem 0 2.5rem;
}
.faq_bg h2 span{
    display: block;
}
.faq_bg h3{
    color: #fff;
    font-size: 2.2rem;
    margin: 1rem 0 1.5rem;
}
.prpl_sqr_btn{
    background-color: #947AB3;
    border: 1px solid #947AB3;
    padding: 12px 24px;
    color: #fff;
    font-weight:600;
    box-shadow: 0px 3px 6px #00000029;
}
.ab-ad_widget{
    padding: 20px 0px 0;
}
.abs_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
}
.abs_img{
    margin-right: 5rem;
}
.abs_img img{ 
    height: 650px;
}
.abs_txt{
    position: relative;
    padding: 1rem 0 1rem 10rem;
}
.abs_txt:before{
    content: '';
    position: absolute;
    left: 15%;
    top: 0;
    width: 35px;
    height: 100%;
    background: url(../images/icon-feather-heart-blue-gradient.svg) 0 0 no-repeat;
    background-size: contain;
}
.abs_txt::after{
    content: '';
    position: absolute;
    right: 0;
    top: 80%;
    width: 35px;
    height: 100%;
    background: url(../images/icon-feather-heart-purple-gradient.svg) 0 0 no-repeat;
    background-size: contain;
}
.abs_txt h3{
    font-size: 2rem;
    color: #84A4D5;
    margin: 1rem 0;
}
.abs_txt h2{
    font-size: 2.5rem;
    color: #947AB3;
    margin: 0 0 1.5rem;
}
.abs_txt p{
    font-size: 1.2rem;
    font-weight: 500;
}
.abs_txt p span{
    display: block;
}
.blue_btn{
    background-color: #84A4D5;
    border: 1px solid #84A4D5;
    border-radius: 10px;
    color: #fff;
    padding: 12px 20px;
    font-family: 'Poppins';
    font-weight: 500;
    outline: none; 
    box-shadow: inset 0px 3px 6px #00000029;
}
.client_widget{
    padding: 3rem 0 2rem;
}
.title h1{
    font-size: 2.5rem;
    margin: 2rem 0 3rem;
    text-align: center;
}
.client_flex{
    display: flex;
    flex-direction: column;
}
.client_says{
    box-shadow:0px 3px 6px #00000029;
    border-radius: 61px;
    padding:5rem 6rem;
    margin-bottom: 2rem;
}
.client_says p{
    font-size: 1.2rem;
    color: #84A4D5;
    font-weight: 500;
}
.client_says h4{
    font-size: 1.2rem;
    color: #947AB3;
    font-family: 'Poppins-bold';
}
.abt_widget{
    width: 100%;
    height:100%; 
    background-color: #8a71a7;
    padding: 5rem 0;
    box-shadow: 0px 3px 6px #00000029;
}
.wyt_font{
    color: #fff !important;
}
.prpl_font{
    color: #947AB3 !important;
}
.abt_widget p{
    color: #FEFEFE;
    text-align: center;
    font-size: 1.2rem;
}
.question_widget{
    padding: 4rem 0;
}
.question_widget h4{
    margin: 1rem 0 2rem;
}
.question_widget p{
    font-size: 1.2rem;
    line-height: 0.9;
    font-weight: 500;
}
.highlight_txt{
    text-align: center;
    margin: 5rem 0;
}
footer{
    background-color: #F5F5F6;
    padding: 3rem 0;
    text-align: center;
    box-shadow: 0px 3px 6px #00000029;
}
footer h3{
    color: #84A4D5;
    font-size: 26px;
    margin: 1rem 0;
    font-weight: 600;
}
footer p{
    color: #947AB3;
    font-weight: 500;
    font-size: 1.2rem;
}
footer p a{
    color: #947AB3;
    text-decoration: none;
}
footer p span{
    display: block;
}
.sub_bnr{ 
    background:#F5F5F6 url(../images/adoption-process/adoption-process-bg.png) center center no-repeat;
    background-size: cover; 
    padding: 4rem 0;
}
.open_widget_bnr{
    background:#F5F5F6 url(../images/open-closed-adoption/open-closed-adoption-bg.png) center center no-repeat !important;
    background-size: cover !important; 
}
.open_widget_bnr .txt_widget{width: 60%;}
.txt_widget {
    width: 90%;
    margin: 0 auto;
}
.process_flex{
    display: flex;
    flex-direction: row;
    align-items: center;
    padding:2rem 0 3rem;
}
.process_img{
    flex:1 1 20%;
    position: relative;
}
.process_img::before{
    content: '';
    position: absolute;
    right: -30px;
    top: -30px;
    width: 150px;
    height: 100%; 
    z-index: -1;
}
.process_img::after{
    content: '';
    position: absolute;
    left: -36px;
    bottom: -200px;
    width: 150px;
    height: 100%; 
    z-index: -1;
}
.step1_bg::before{
    background: url(../images/adoption-process/rectangle-step-1-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
}
.step1_bg::after{
    background: url(../images/adoption-process/rectangle-step-2-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
}
.step3_bg::before{
    background: url(../images/adoption-process/rectangle-step-3-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
}
.step3_bg::after{
    background: url(../images/adoption-process/rectangle-step-4-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
    bottom: -225px;
}
.step5_bg::before{
    background: url(../images/adoption-process/rectangle-step-5-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
    left: -36px;
    right: auto;
}
.step5_bg::after{
    background: url(../images/adoption-process/rectangle-step-6-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
    right: -30px;
    bottom: -222px;
    left: auto;
}
.step7_bg::before{
    background: url(../images/adoption-process/rectangle-step-2-choiceline.svg) 0 0 no-repeat; 
    background-size: contain;
}
.step7_bg::after{
    background: url(../images/adoption-process/rectangle-step-1-choiceline.svg) 0 0 no-repeat;
    background-size: contain;
    bottom: -225px;
}
.pad-l6{
    padding-left: 6rem;
}
.pad-r6{
    padding-right: 6rem;
}
.process_txt{
    flex: 1 1 80%;
}
.process_step{
    display: flex;
    flex-direction: row;
    align-items: center;
    box-shadow: 0px 3px 6px #00000029;
    padding: 20px 30px;
    margin-bottom: 1rem;
}
.step_icon{
    width:300px;
    flex: 1 1 12%;
}
.step_txt{
    flex: 1 1 88%;
}
.step_icon h3{
    font-size: 1.4rem;
    color: #947AB3;
    font-family: 'Poppins';
    font-weight: 500;
}
.step_icon img{
    width: 60px;
    height: 60px;
}
.step_txt p span{
    color: #84A4D5;
    font-family: 'Poppins-bold';
}
.pathway_bg{
    width: 100%;
    height: 100%;
    padding: 5rem 0 8rem;
    background: url(../images/adoption-process/blue_bg.svg) 0 0 no-repeat;
    background-size: cover;
}
.prpl_bg{
    background: url(../images/open-closed-adoption/purple-bg-choiceline.svg) 0 0 no-repeat !important;
    background-size: cover;
}
.pathway_bg h2{
    font-size: 2rem;
    color: #FEFEFE;
    margin: 1rem 0 2.5rem;
    line-height: 1.4;
}
.pathway_bg h2 span{
    display: block;
}
.path_widget p{
    color: #F5F5F6;
}
.path_widget img{
    width: 25px;
}
.video_bg{
    text-align: center;
    margin-bottom: 5rem;
}
.video_bg img{
    width: 80%;
    margin: 0 auto;
}
.key_flex{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 4rem 0;
}
.key_sqr{
    width: 40%; 
    padding: 3rem 0;
    text-align: center;
    color: #fff;
    background-color: #947AB3;
    margin-bottom: 2.5rem;
}
.guide_flex{
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 4rem 0 8rem;
}
.guide_sqr{
    box-shadow: 0px 3px 6px #00000029;
    border-radius: 124px 0px 76px 0px;
    background-color: #fff;
    padding: 4rem 2rem;
    text-align: center;
    margin-right: 1.5rem;
    margin-bottom: 1.5rem;
}
.guide_sqr:last-of-type{
    margin-right: 0;
}
.guide_sqr img{
    height: 50px;
    margin-bottom: 2rem;
}
.guide_sqr h4{
    font-size: 1.4rem;
    color: #84A4D5;
    margin: 1rem 0 3rem;
}
.type_flex{
    padding: 4rem 0;
    display: flex;
    align-items: center;
}
.type_img{
    flex:1 1 50%;
}
.type_txt{
    flex:1 1 50%;
    padding-left: 5rem;
}
.types_of_adoption{ 
    box-shadow: inset 0px 3px 6px #84a4d5, 0px 5px 6px #84a4d5;
    border-radius: 12px;
    padding: 2rem;
    text-align: center;
    margin-bottom: 2rem;
}
.type_txt a {
    text-decoration: none;
}
.open_widget{
    padding:2rem 0;
    background-color:#f5f8fc;
    box-shadow: 0px 1px 6px #00000029;
}
.open_widget .title h2{
    margin: 1rem 0 0;
}
.open_features{
    padding: 4rem 0 0;
}
.adoption_prdcr{
    margin-bottom: 4rem;
}
.adoption_point{ 
    background-color: #F5F5F6;
    padding: 1.5rem 1.5rem 1.5rem;
    color: #FEFEFE;
}
.adoption_point:nth-of-type(odd){
    background-color: #84A4D5;
}
.adoption_point:nth-of-type(even){
    color:#707070;
}
.open_flex{
    display: flex;
    align-items: center;
}
.open_txt{
    flex: 1 1 80%;
}
.open_img{
    flex:1 1 20%;
}
.prpl_font img{
    width: 50px;
    margin-right: 0.5rem;
}

@media (max-width:767px) {
    header .bg-dark{ background-color: #fff !important;}
    .nav_width { width: 100%; box-shadow: 0px 3px 6px #00000029;}
    .nav_width .show{padding-bottom: 0 !important;}
    .xs-show{ display: inline;}
    .main_banner { padding: 4rem 0 0;}
    .bby_left{margin-bottom: 2rem;}
    .bby_right{ text-align: center;}
    .bby_right::before{top:0;}
    .bby_right::after{top:80%;}
    .bby_bnr, .process_container, .abs_flex { flex-direction: column;}
    .navbar-nav{border-top: 1px dotted #947ab321;}
    header .navbar-dark .navbar-nav .nav-link {
        color: #947ab3;
        font-weight: 500;
        padding: 0.5rem 1rem;
        border-bottom: 1px dotted #947ab321;}
    .navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
            color: #947ab3 !important;
    }
    .adoption_card{margin-right: 0}
    .top_logo, .top_email{ display: none;}
    .prpl_btn{padding: 6px 12px 8px; font-size: 15px;}
    .navbar-brand img{ width: 220px;}
    .navbar-dark .navbar-toggler-icon{background-color: #947ab3; border-radius: 5px;}
    .abs_img img { height: auto;}
    .abs_txt { padding: 1rem; text-align: center;}
    .abs_txt h3 { font-size: 1.5rem;  margin: 1rem 0 0.5rem;}
    .abs_txt:before { left: 10%;  top: 5%;}
    .abs_txt p span, .bby_right p span, .faq_bg h2 span, footer p span, .pathway_bg h2 span{ display: inline;}
    .client_widget { padding: 1rem 0 2rem;}   
    .client_says{ padding: 2rem 1.5rem; text-align: center;}
    .faq_bg {
        background: url(../images/adoption-decision-choiceline-bg.png) 80% bottom no-repeat;
        background-size: cover;} 
    .faq_inner { text-align: center;}
    .process_flex, .process_step, .guide_flex { flex-direction: column;text-align: center;}
    .process_step{padding: 0;}
    .steps_widget.pad-l6{padding-left: 0;}
    .steps_widget.pad-r6{ padding-right: 0;}
    .step_icon{ margin-bottom: 1rem;flex: 1 1 100%; padding: 20px 0;}
    .step_txt { flex: 1 1 100%; padding: 0 20px;}
    .process_flex.xs_reverse{ flex-direction: column-reverse;}
    .process_img { margin: 5rem 0;} 
    .process_img img{width:80%;}
    .step1_bg::before { right: 0; top: -44px;}
    .step1_bg::after { left: 0; bottom: auto;  top: 78%;}
    .step3_bg::before { left: 0; top: -30px;}
    .step3_bg::after { right: 0; left: auto;  top: 78%;}
    .step5_bg::before{left: auto;  right: 0; top: -44px;}
    .step5_bg::after{right: auto; left: 0; bottom: auto; top: 78%;}
    .step7_bg::before{right: auto; left: 0;}
    .step7_bg::after{top: 78%; left: auto; right: 0;}
    .video_bg img { width: 100%;}
    .key_flex{ padding: 2rem 0;}
    .key_sqr {  width: 100%; margin-bottom: 1.5rem;}
    .guide_sqr{ margin-right: 0;}
    .type_flex{ flex-direction: column;}
    .type_txt { padding-left: 0; padding-top: 2rem;}
    .open_widget .text-start, .open_widget{ text-align:center !important;}
    .open_flex { flex-direction: column; justify-content: center;}
    .open_txt{ padding-top:2rem;}
    .adoption_point{ text-align:center}
    .sub_bnr{ background: #f5f5f6 !important;}
    .open_widget_bnr .txt_widget{width: 100%;}
    .bby_right p{width: 100%;}
}
@media screen and (min-width:768px) and (max-width:990px) {
    .nav_width { width: 76%;}
    .top_logo img{width: 170px;} 
    .top_txt h6 { font-size: 14px;}   
    .top_txt p { font-size: 14px;}   
    .prpl_btn{padding: 6px 12px;font-size: 15px;}
    .adoption_card.mar-r0 {margin-right: 2.5rem !important;}
    .adoption_card:nth-of-type(even){margin-right: 0 !important;}
    .faq_bg h2 span, .abs_txt p span { display: inline;}
    .abs_txt:before{left:0}
    .abs_txt { padding: 1rem 0;} 
    .faq_bg {
        background: url(../images/adoption-decision-choiceline-bg.png) 80% bottom no-repeat;
        background-size: cover;} 

    .process_flex, .process_step, .guide_flex { flex-direction: column;text-align: center;}
    .steps_widget.pad-l6{padding-left: 0;}
    .steps_widget.pad-r6{ padding-right: 0;}
    .step_icon{ margin-bottom: 1rem;}
    .process_flex.xs_reverse{ flex-direction: column-reverse;}
    .process_img { margin: 5rem 0;} 
    .process_img img{width:80%;}
    .step1_bg::before { right: 0; top: -44px;}
    .step1_bg::after { left: 0; bottom: auto;  top: 78%;}
    .step3_bg::before { left: 0; top: -30px;}
    .step3_bg::after { right: 0; left: auto;  top: 78%;}
    .step5_bg::before{left: auto;  right: 0; top: -44px;}
    .step5_bg::after{right: auto; left: 0; bottom: auto; top: 78%;}
    .step7_bg::before{right: auto; left: 0;}
    .step7_bg::after{top: 78%; left: auto; right: 0;}
    .key_sqr {  width: 100%; margin-bottom: 1.5rem;}
}
@media screen and (min-width:991px) and (max-width:1199px) {
    .nav_width { width: 60%;}
    .abs_txt {padding: 1rem 0 1rem 4rem;}
    .sub_bnr{ background-size: contain !important;}
    .faq_bg {
        background: url(../images/adoption-decision-choiceline-bg.png) 50% bottom no-repeat;
        background-size: cover;} 
}
@media screen and (min-width:1200px) {
    .nav_width { width: 50%;}
}
@media screen and (min-width:1400px) {
    .step1_bg::after, .step3_bg::after, .step5_bg::after, .step7_bg::after{top:72%}
}
@media screen and (min-width:1600px) {
    .abs_img img {height: auto;}
    .sub_bnr{padding: 6rem 0;}
}
@media screen and (min-width:2001px) { 
    .sub_bnr{padding: 10rem 0;}
}