/* Extra large devices (large desktops, 1200px and up) */

@media only screen and (min-width: 1200px) {
    .top-bar .bar a, .top-bar .bar p {
        font-size: 1.5rem;
    }

    .logo-top {
        width: 200px;
    }
    #main-nav .active a {
        color: var(--green);
   }
   #main-nav .active {
    background-color: unset;
}

.dropdown:hover .dropdown-menu {
    display: block;
}
#main-nav .dropdown-toggle {
    pointer-events: none;
}
.dropdown-menu {
    margin-top: 0;
    transition: all 0.3s ease;
}
#main-nav .dropdown-menu {
    margin-top: 0;
}
#main-nav .nav-item.dropdown:hover a:not(#main-nav .nav-item.dropdown:hover ul li a) {
    color: var(--black);
}
#main-nav .nav-item.dropdown ul li a {
    color: #ffffff;
}
#main-nav .nav-item:hover a{
    opacity: .98;
}
#main-nav .nav-item.dropdown ul li a:hover {
    color: var(--yellow);
    background-color: transparent!important;
}
#main-nav .dropdown.active {
    color: var(--green)!important;
}
#main-nav .dropdown.active ul li a:hover {
    color: var(--black)!important;
    background-color: transparent!important;
}
#main-nav .dropdown ul {
    background-color: var(--green);
    padding: .5rem .125rem;
    border-radius: 0;
}
#main-nav .dropdown-item {
    padding: .2rem!important;
}
/* #main-nav .dropdown-toggle::after {
    vertical-align: 0;
} */
#main-nav .dropdown:hover .dropdown-toggle::after {
    transform: rotate(-180deg);
     transform-origin: 50% 50%;
    /* vertical-align: -0.1em;
    margin-top: .1em;  */

}
#main-nav .nav-item.active.dropdown a {
    color: var(--green)!important;
}

.navbar-nav .nav-item, .navbar ul li:first-child:not(.dropdown ul li), #main-nav .navbar-nav .nav-item:last-of-type {
    border: none;
}

#main-nav .nav-item.active.dropdown {
    background-color: unset;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

a.dropdown-item.active {
    color: var(--black)!important;
}
.dropdown .dropdown-menu li:hover a {
    opacity: .67!important;
    color: #ffffff!important;
}
#main-nav .nav-item:hover a:not(#main-nav .dropdown a) {
    color: var(--pink);
}

.hero .circle-text-svg {
    width: 30vw;
    padding: 1rem 3rem;
    margin-left: -30rem;
}
.domestic-abuse h2 {
    font-size: 3rem;
    margin-top: 1.5rem;
}
.domestic-abuse .card-link {
    width: unset;
}

/* .domestic-abuse .card-container {
    display: grid!important;
    grid-template-columns: repeat(7, 1fr);
    justify-content: space-between;
} */
.domestic-abuse .card-container {
    display: flex!important;
    flex-direction: row;
    justify-content: center!important;
    align-items: center;
    gap: 0rem;
    grid-template-columns:unset;
}
.domestic-abuse .card-container .card-link {
    width: fit-content!important;
}
.domestic-abuse .card-link h3 {
    font-size: 1.5rem;
    margin: 0 .5rem;
}

.domestic-abuse .card-link p {
    /* font-size: 1rem; */
}
.who-help .circle-text-svg {
    width: 26rem;
}

.who-help .container {
    margin-bottom: -4rem;
}
.our-stories .img-container {
    height: 50rem;
}

.our-stories .img-bg {
    
}
.our-stories .circle-text-svg {
    width: 36rem;
    padding: 2rem 0rem 0 6rem;
}

.cta .img-container {
    height: 50rem;
}

.cta .circle-text-svg {
    width: 36rem;
    padding: 2rem 0rem 0 6rem;
}
.cta .container-fluid a:nth-of-type(1) .circle-text-svg {
    width: 25rem;
    padding: 26rem 2rem 0rem 3rem;
}
.cta .container-fluid a:nth-of-type(1) {
    position: absolute;
    left: 3rem;
    bottom: 0;
}
.cta .container-fluid a:nth-of-type(2) {
    position: absolute;
    right: 5rem;
}
.cta .img-bg {
    height: 85%;
}
.cta .img-container {
    height: 60rem;
}
/* Footer - Large Devices */

.shfooter .collapse {
    display: block;
    }
    footer .fa-chevron-right {
    display: inline-block;
    }
    footer ul li {
    margin-bottom: 10px;
    
    }
    footer ul li span {
        display: inline-block;
    }
    footer ul li a:hover span {
        animation: arrow-right 0.3s linear forwards; 
              
          }
      
      @keyframes arrow-right {
        from {
          transform: translateX(0px); }
        to {
          transform: translateX(2px); } 
          
      }
    
      #footer .footer-title {
        font-size: 1.5rem;
      }
    
}