/* Default styles - small devices (Mobile, screen width < 768px) */

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
body {
    font-family: "Barlow Condensed", sans-serif;
    font-size: 1.125rem;
    font-weight: 400;
}
#bodycontent a {
 color: #0095c5;
}

  

.sticky-note{
background:var(--pink);
	border:5px solid #ffffff;
	display:inline-block;
	border-bottom:none;
	position: fixed;
    right:0;
    top: 300px;
    transform: rotate(-90deg);
	padding: 10px;
    margin-right:-90px;
	width:250px;
	z-index:999999;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
	align-items: center;}

.sticky-note h4{
	font-size:25px;
	color:#ffffff;
	text-transform:uppercase;
	padding-left: 10px;	padding-right: 10px;}

.sticky-note img, .sticky-note h4{
	display:inline-block;}

.poppins {
    font-family: "Poppins", sans-serif;
}

h2 {
    color: var(--purple);
    font-size: 3rem;
    font-weight: 700;
}

section {
    overflow: hidden;
}

/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/
.top-bar .col-12 {
    padding: 0;
}
.top-bar .bar {
    display: flex;
    justify-content: center;
    padding: .75rem;
}
.top-bar .bar a, .top-bar .bar p {
    color: #ffffff;
    font-size: 1.25rem;
    margin-bottom: 0;
    text-decoration: none;
}
.top-bar .col-12:nth-of-type(1) .bar {
    background-color: var(--pink);
}
.top-bar .col-12:nth-of-type(2) .bar {
    background-color: var(--purple);
}
.top-bar .col-12:nth-of-type(3) .bar {
    background-color: var(--blue);
}

.top-bar .col-12:nth-of-type(4) .bar {
    background-color: var(--green);
}
/*--------------------------------------------------------------
# Main Navigation
--------------------------------------------------------------*/
.navbar-toggler {
    border: none;
}

#main-nav .active {
    background-color: var(--green);
}

#main-nav a {
    /* text-transform: uppercase; */
    color: var(--black);
    font-weight: 500;
    transition: all .3s;
}

#main-nav .btn {
    font-size: 18px;
}

#main-nav .active a {
     color: #ffffff;
}

#main-nav .btn {
    font-size: 18px;
}

.nav-outer .container {
    padding: 0;
}


.navbar ul {
    padding: 0;
}

.navbar ul li, .site-logo-top, .navbar-toggler, .mobile-search-btn {
    padding-left: calc(var(--bs-gutter-x) * .5);
    padding-right: calc(var(--bs-gutter-x) * .5);
}

.navbar-nav .nav-item, .navbar ul li:first-child:not(.dropdown ul li) {
    padding: .9rem calc(var(--bs-gutter-x) * .5);
    border-top: thin solid var(--lightGray);
}

.navbar a {
    padding: 0;
}
.nav-contact-contain {
    padding: 0 calc(var(--bs-gutter-x) * .5);
}
#main-nav .navbar-nav .nav-item:last-of-type {
    border-bottom: thin solid var(--lightGray);
}

/* Collapse Button Mobile */
.animated-icon {
    cursor: pointer;
    height: 20px;
    margin: 0px;
    position: relative;
    width: 30px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
}

    .animated-icon span {
        border-radius: 9px;
        display: block;
        height: 3px;
        position: absolute;
        left: 0;
        opacity: 1;
        width: 100%;
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
        -webkit-transition: .25s ease-in-out;
        -moz-transition: .25s ease-in-out;
        -o-transition: .25s ease-in-out;
        transition: .25s ease-in-out;
    }

    .animated-icon span {
        background: var(--black);
    }

        .animated-icon span:nth-child(1) {
            top: 0px;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center;
        }

        .animated-icon span:nth-child(2) {
            top: 10px;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center;
        }

        .animated-icon span:nth-child(3) {
            top: 20px;
            -webkit-transform-origin: left center;
            -moz-transform-origin: left center;
            -o-transform-origin: left center;
            transform-origin: left center;
        }

    .animated-icon.open span:nth-child(1) {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
        top: 0px;
        left: 8px;
    }

    .animated-icon.open span:nth-child(2) {
        width: 0%;
        opacity: 0;
    }

    .animated-icon.open span:nth-child(3) {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
        top: 21px;
        left: 8px;
    }

    #main-nav .logo-top {
        padding-left: calc(var(--bs-gutter-x)* .5);
        width: 11rem;
    }

/* Main nav dropdowns  */
#main-nav .nav-item:hover a:not(#main-nav .dropdown a){
    /* color: var(--yellow); */
}
#main-nav .nav-item:active a:not(#main-nav .dropdown a){
    /* color: var(--red); */
}
#main-nav .dropdown-menu {
    margin-top: .75rem;
}
.navbar-nav .nav-item, .navbar ul li:first-child:not #main-nav .dropdown ul li {
    padding: 1rem calc(var(--bs-gutter-x) * .5);
}

#main-nav .dropdown ul {
    /* background-color: var(--lightGray); */
    border: none;
    transition: all .3s;
}

#main-nav .dropdown a:active:not(#main-nav .dropdown ul li a:active) {
    color: #ffffff;
}
#main-nav .dropdown a:hover:not(#main-nav .dropdown ul li a:hover) {
    color: var(--lightGray);
}

#main-nav .dropdown-item:active {
    color: var(--green);
    background-color: var(--white);
}
#main-nav .dropdown-item:hover {
    color: var(--green);
    background-color: var(--white);
}

.dropdown-toggle[aria-expanded="true"]::after {
    transform: rotate(180deg);
    /* transform-origin: 50% 50%; */
    vertical-align: -0.1em;
    margin-top: .2em;
}
#main-nav .dropdown-item {
    padding-top: .35rem;
    padding-left: 1rem;
}
#main-nav .dropdown-item:last-of-type {
    padding-bottom: .35rem;
}
#main-nav .nav-item.active.dropdown {
    background-color: var(--green);
}
#main-nav .nav-item.active.dropdown a {
    color: var(--white)!important;
}
#main-nav .nav-item.active ul li .dropdown-item {
    background-color: var(--green)!important;
    color: var(--white)!important;
}
#main-nav .nav-item.active ul {
    background-color: var(--green)!important;
}

#main-nav {
z-index: 9;
}

#main-nav .nav-item.active ul li a.dropdown-item.active {
    color: #ffffff!important;
}
#main-nav a#navbarDropdown:hover {
    color: var(--white)!important;
}

/*--------------------------------------------------------------
# SVGs
--------------------------------------------------------------*/

svg .text-container p {
    color: var(--white);
    font-weight: 600;
    margin-bottom: 0;
}
svg .text-container div p span {
    color: var(--yellowLight);
}

svg .text-container div p span {
    margin-top: -1rem;
}

/*--------------------------------------------------------------
# Hero
--------------------------------------------------------------*/
.hero {
    height: fit-content;
    height:420px;
}
.hero .swiper-slide {
    position: relative;
}
.hero img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 2%;
    position: absolute;
    top: 0;
    z-index: -1;
}
.hero .circle-text-svg {
    padding: 6.5rem 3rem;
}

/*--------------------------------------------------------------
# Home About
--------------------------------------------------------------*/
.home-about {
    background-color: var(--blue);
}
.home-about p {
    color: var(--white);
    font-size: 2rem;
    font-weight: 300;
    margin-bottom: 0;
}

/*--------------------------------------------------------------
# Domestic Abuse
--------------------------------------------------------------*/
.domestic-abuse {
    background-color: var(--purple);
}
.domestic-abuse h2 {
    color: var(--white);
    font-size: 2.5rem;
    font-weight: 600;
}
.domestic-abuse h3 {
    color: var(--orange);
}
.domestic-abuse p {
    color: var(--blue);
    padding-top: .5rem;
    text-transform: uppercase;
}
.domestic-abuse p::before {
    content: "\00BB";
    margin-right: .25rem;
    display: inline-block;
    transition: all .3s;
}

.domestic-abuse .card-link {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: 1rem 0;
}
.domestic-abuse a {
    text-decoration: none;
}
.domestic-abuse .card-link h3, .domestic-abuse .card-link p {
    transition: all .3s;
}

.domestic-abuse .card-link:hover h3, .domestic-abuse .card-link:hover p {
    color: var(--white);
}

.domestic-abuse .card-link:hover p::before {
    transform: translateX(.125rem);
    color: var(--white);
}
/*--------------------------------------------------------------
# Who we can help
--------------------------------------------------------------*/
.who-help {
    z-index: 1;
}
.who-help .container {
    position: relative;
    z-index: 1;
    margin-bottom: -5rem;
}
.who-help .circle-text-svg {
    padding: 3rem;
}
.who-help .container .circle-text-svg:nth-of-type(1) {
    margin-bottom: -12rem;
}
.who-help .container .circle-text-svg:nth-of-type(2) {
    margin-top: -12rem;
}
.who-help img {
    width: 225%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: translateX(-25%);
    z-index: -1;
}
.who-help .divider-angle {
    /* margin-top: -10rem; */
    z-index: -9;
}
/*--------------------------------------------------------------
# How we can help you
--------------------------------------------------------------*/
.how-help {
    /* margin-top: calc(-10rem); */
    z-index: -1;
}
.how-help .container-fluid{
    background-color: var(--lightGray);
}
.how-help p {
    color: var(--purple);
    font-size: 1.5rem;
    line-height: calc(1.7*1.5rem);
}
.how-help ul li a {
    text-decoration: none;
}
.how-help ul li {
    font-size: 2.25rem;
    font-weight: 700;
    /* display: flex;
    justify-content: space-between; */
    align-items: end;
    margin: .75rem 0;
    transition: all .3s;
}
.how-help ul li span {
    color: var(--black);
    text-transform: uppercase;
    font-size: .8rem;
    font-weight: 400;
    font-family: "Poppins", sans-serif;
    padding-bottom: .5rem;
    transition: all .3s;
}
.how-help ul li span::after {
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-left: 0.5em;
    margin-bottom: .3rem;
    vertical-align: middle;
    transition: all .3s;
}
.how-help ul li:nth-of-type(4n+1) a {
    color: var(--blue);
}
.how-help ul li:nth-of-type(4n+2) a {
    color: var(--pink);
}
.how-help ul li:nth-of-type(4n+3) a {
    color: var(--green);
}
.how-help ul li:nth-of-type(4n+4) a {
    color: var(--purple);
}
.how-help ul li:nth-of-type(4n+1) a span::after {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.39 10.39"><circle cx="5.2" cy="5.2" r="5.2" fill="%230095c5"/><polygon points="4.25 7.93 3.72 7.08 6.3 5.43 3.89 3.03 4.6 2.33 7.89 5.61 4.25 7.93" fill="%23fff"/></svg>');
}
.how-help ul li:nth-of-type(4n+2) a span::after {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.39 10.39"><circle cx="5.2" cy="5.2" r="5.2" fill="%23aa55a1"/><polygon points="4.25 7.93 3.72 7.08 6.3 5.43 3.89 3.03 4.6 2.33 7.89 5.61 4.25 7.93" fill="%23fff"/></svg>');
}
.how-help ul li:nth-of-type(4n+3) a span::after {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.39 10.39"><circle cx="5.2" cy="5.2" r="5.2" fill="%2300b274"/><polygon points="4.25 7.93 3.72 7.08 6.3 5.43 3.89 3.03 4.6 2.33 7.89 5.61 4.25 7.93" fill="%23fff"/></svg>');
}
.how-help ul li:nth-of-type(4n+4) a span::after {
    content: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 10.39 10.39"><circle cx="5.2" cy="5.2" r="5.2" fill="%23594579"/><polygon points="4.25 7.93 3.72 7.08 6.3 5.43 3.89 3.03 4.6 2.33 7.89 5.61 4.25 7.93" fill="%23fff"/></svg>');
}

.how-help ul li:hover a {
    opacity: .8;
}

.how-help ul li:hover a span::after {
    transform: translateX(.25rem);
}
.how-help ul li:nth-of-type(4n+1):hover a span {
    color: var(--blue);
}
.how-help ul li:nth-of-type(4n+2):hover a span {
    color: var(--pink);
}
.how-help ul li:nth-of-type(4n+3):hover a span {
    color: var(--green);
}
.how-help ul li:nth-of-type(4n+4):hover a span {
    color: var(--purple);
}
/*--------------------------------------------------------------
# Our Stories
--------------------------------------------------------------*/
.our-stories {
    margin-top: -7rem;
    z-index: 99999;
}
.our-stories .container-fluid:nth-of-type(2) {
    background-color: var(--lightGray);
    padding-bottom: 8rem;
}
.our-stories .img-container {
    position: relative;
}
.our-stories .img-bg {
    position: absolute;
    top: 7rem;
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 66%;
    z-index: -1;
}
.our-stories .circle-text-svg {
    padding: 2rem 2rem 20rem 5rem;
}
.our-stories .container-fluid:nth-of-type(2) p {
    color: var(--purple);
    font-size: 1.5rem;
    line-height: calc(1.7*1.5rem);
    font-weight: 300;
}
.our-stories .quote {
    width: 30%;
}
.our-stories .container-fluid:nth-of-type(2) .quote-text p {
    font-style: italic;
    font-weight: 200;
    font-size: 1.25rem;
    line-height: calc(1.7*1.25rem);
    font-family: "Poppins", sans-serif;
}
.our-stories .container-fluid:nth-of-type(2) .quote-text p.author {
        font-family: "Poppins", sans-serif;
        font-weight: 400;
        font-style: unset;
        margin-left: auto;
    
}
/*--------------------------------------------------------------
# CTA
--------------------------------------------------------------*/
section.cta {
    margin-top: -7rem;
}
.cta .img-container {
    position: relative;
}
.cta .img-bg {
    position: absolute;
    top: 7rem;
    height: 75%;
    width: 100%;
    object-fit: cover;
    object-position: 66%;
    z-index: -1;
}
.cta .circle-text-svg {
    padding: 0rem 2rem 5rem 2rem;
    z-index: 9;
} 

.cta .container-fluid a:nth-of-type(2) .circle-text-svg {
    padding: 5rem 2rem 0rem 2rem;
}
.cta a .circle-text-svg g circle {
    transition: all .3s;
}
.cta a:hover .circle-text-svg g circle:nth-of-type(3) {
    fill: var(--green)!important;
}
/*--------------------------------------------------------------
# partners
--------------------------------------------------------------*/

.partners .swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-button-next, .swiper-button-prev {
    color: #cfcdce!important;
    transition: all .3s;
}
.swiper-button-next:hover, .swiper-button-prev:hover {
    color: var(--pinkBright)!important;
}
/*--------------------------------------------------------------
# Domestic Abuse 2
--------------------------------------------------------------*/
.domestic-abuse-2 .container-fluid {
    background-color: var(--blue);
}
.domestic-abuse-2 h2 {
    color: var(--white);
    margin-bottom: 3rem;
}
.domestic-abuse-2 p {
    color: var(--white);
    font-size: 1.875rem;
    line-height: calc(1.7*2rem);
    font-weight: 300;
}

.domestic-abuse-2 a.btn-more {
    text-transform: uppercase;
    color: var(--purple);
    text-decoration: none;
    border-radius: 50%;
    height: 200px;
    width: 200px;
    background-color: var(--white);
    padding: 2rem;
    font-size: 1.5rem;
    margin-bottom: -5.5rem;
    transition: all .1s;
}
.domestic-abuse-2 a.btn-more:hover {
    background-color: var(--purple);
    color: var(--white);
}

/* .circle-text-svg g circle:nth-of-type(1) {
    animation: moveCircles 10s ease-in-out infinite;
}
@keyframes moveCircles {
    0%, 100% {
      transform: translate(0, 0);
    }
    50% {
      transform: translate(-5px, 10px);
    }
  }
.circle-text-svg g circle:nth-of-type(2) {
    animation: moveCircles2 10s ease-in-out infinite;
}
@keyframes moveCircles2 {
    0%, 100% {
      transform: translate(0, 0);
    }
    50% {
      transform: translate(5px, -10px);
    }
  } */

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
footer {
    font-size: .875rem;
}
footer .logo-footer {
    width: 16rem;
}


footer#footer {
    /* border-top: 2px solid var(--gold); */
}
    footer a span {
        /* color: var(--cyan); */
    }

    footer .footer-title {
        font-weight: 400;
        font-family: "Barlow Condensed", sans-serif;
        text-transform: uppercase;
        color: var(--purple);
        font-weight: 700;
    }



    footer a {
        color: var(--black);
        font-size: .875rem;
        text-decoration: none;
        font-weight: 400;
    }

        footer a:hover {
            /* text-decoration: underline; */
            color: var(--green);
        }

            


.footer-title {
    font-size: 1.25rem;
    /*font-weight: 500;*/
    margin-bottom: 20px;
}
footer .navbar-toggler {
    border: none;
}

footer ul li {
    margin-bottom: 10px;
    padding-left: 2.3rem;
    text-indent: -1.1rem;
}
footer .fa-angle-right {
   height: 20px;
}
footer .fa-angle-down {
    width: 20px;
}
footer .fa-chevron-right {
    /*color: #ffffff;*/
    /*color: #ffffff;*/
    padding-right: 0.2rem;
}

.shfooter .collapse {
    display: inherit;
}

/* .shfooter i::before {
    color: var(--light);
} */


.resize {
    text-align: center;
}

.resize {
    margin-top: 3rem;
    font-size: 1.25rem;
}

/* Social footer  */
footer .fa-brands {
    width: 7%;
}

footer .fab:before {
    font-size: 1.1rem;
}

.social-footer a:hover svg {
    /*color: var(--links); */
    animation: icons-rise 0.3s linear forwards;
}

#footer .social-logos svg {
   width: 30px;
   height: 30px;
   transition: all .3s;
}
#footer .social-logos svg g rect{
   
    transition: all .3s;
 }
#footer h4 {
    font-size: 1rem;
    margin-top: 2rem;
}
@keyframes icons-rise {
    from {
        transform: translateX(0px);
    }

    to {
        transform: translate(2.5px, -2.5px);
    }
}

.social-footer a:hover {
    text-decoration: none;
}

    .social-footer a:hover span {
        text-decoration: underline;
    }

@keyframes arrow-right {
    from {
        transform: translateX(0px);
    }

    to {
        transform: translateX(3px);
    }
}



footer hr:not([size]) {
    height: 1px;
    /* color: var(--hcs-blue); */
    opacity: .8;
}

footer ul li {
    padding-left: 0;
    text-indent: 0;
    /* remove this if issue 616 617 */
    display: flex;
    align-items: center;
}

footer .fa-chevron-right {
    display: none;
}

.footer-title {
    margin-bottom: 0;
}

.shfooter ul {
    margin-bottom: 0;
}

.shfooter .collapse {
    display: none;
}

    .shfooter .collapse.show {
        display: block;
    }

.shfooter .title .fa-angle-down,
.shfooter .title[aria-expanded=true] .fa-angle-right {
    display: none;
}

.shfooter .title[aria-expanded=true] .fa-angle-down {
    display: block;
}

.shfooter .navbar-toggler {
    display: inline-block;
    padding: 0;
}

footer .helpline {
    color: var(--purple);
    font-weight: 600;
    font-size: 1.5rem;
    transition: all .3s;
}
footer .helpline:hover {
    color: var(--green);
}

footer a, footer p, footer h3 {
    color: var(--purple);
}

footer li a::before {
    content: "\00BB";
    margin-right: .25rem;
    display: inline-block;
    transition: all .3s;
}
footer li a:hover::before {
    transform: translateX(.125rem);
    color: var(--green);
}

footer #social svg {
    width: 2rem;
}


/*SIDE MENUE*/


.current{background-color: var(--purple);}

li a.current{background-color: var(--purple);color:#fff;}
li a.head{background-color: #868889;color:#fff;font-weight:600;}