﻿
/* css global  variables*/
:root {
    /* Primary Colors */
    --primary-blue-color: #17315A; /* Blue (Primary) */
    --primary-blue-rgb-color: 23, 49, 90; /* RGB values for #17315A */
    --primary-teal-color: #2D6E8D; /* Teal (Primary) */
  
    /* Secondary Colors */
    --secondary-light-gray-color: #ECEEF0; /* Light Gray */
    --secondary-medium-gray-color: #AAAAAA; /* Medium Gray */
    --secondary-medium-dark-gray-color: #696A6A; /* Medium Dark Gray */
    --secondary-dark-gray-color: #515253; /* Dark Gray */
  
    /* Accent Colors */
    --accent-yellow-color: #F9A71C; /* Yellow (Accent) */
    --accent-orange-color: #E47225; /* Orange (Accent) */
  
  }
  

a.btn-standout {
    background-color: var(--accent-yellow-color);
    color: var(--primary-blue-color);
}

a.btn-white-nobg {
    background-color: none;
    color: white;
}
a.btn-white-nobg:hover {
    background-color: none;
    border: 1px white solid;
}

.btn {
    text-decoration: none !important;
    border-radius: 0;
    font-weight: 600;
    transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

.text_content_cta_primary-blue{
    background-color: var(--primary-blue-color);
    color: white;
}
.text_content .cta-title{
    font-weight: bold;
}
.text_content .cta-content{
    margin: 0;
}

.gap{
    margin: 10px 0 10px 0 !important;
}

.text_content {
    margin: 0; 
    height: 100%   ;
}

h2.orange-heading {
    font-size: 1.2em;
    font-weight: bold;
    color: var(--accent-orange-color); 
    margin-bottom: 20px;
}

/* crisiscounsellingservices main section*/
.main-section.crisiscounsellingservices .get-support-btns{
    display: inline-block;
    width: 100%;
    margin-left: 10px;
  }
  
  .main-section.crisiscounsellingservices .getsuport,
  .main-section.crisiscounsellingservices .getresources{
    min-width: 260px !important;
    margin-bottom: 10px;
    font-weight: bold;
    width: 70%;
  }

  .main-section.crisiscounsellingservices #hero_warmline {
    background: url(/assets/img/crisiscounselingservices-hero.jpg);
    background-size: cover;
}

.main-section.crisiscounsellingservices .hero-img-mobile {
    background: url(/assets/img/crisiscounselingservices-hero-mobile.jpg);
    background-size: cover;
    background-position-x: center;
    background-repeat: no-repeat;
}

.gfx-heart {
	padding: 20px;
    width: auto;
    height: 100%;
    min-height: 120px;
    background: url(/assets/img/happy-face-heart.png);
    background-size: cover;
    background-position-x: center;
    background-position-y: 37%;
    background-repeat: no-repeat;
}

.gfx-music {
    padding: 20px;
    width: auto;
    height: 100%;
    min-height: 230px;
    background: url(/assets/img/music.png);
    background-size: cover;
    background-position-x: center;
    background-repeat: no-repeat;
}

.cta-btn-light-orng{
    background-color: var(--accent-yellow-color) !important;
    color: var(--primary-blue-color) !important;
}

.cta-btn-light-orng:hover{
    background-color: var(--accent-orange-color) !important;
    color: var(--primary-blue-color) !important;
}

/* fix the calhope schools image size */
@media only screen and (max-width: 767.98px) {
    .CH-schools .col-md-6.fullbleed:nth-child(odd) {
        min-height: 380px;
    }
}

.cta-emergency-help-section{
	display: flex;
	flex-wrap: nowrap; 
	justify-content: space-between;
	gap: 20px; 
	padding: 20px 0;
}

.cta-emergency-help{
	display: flex;
    align-items: center;
    gap: 20px;
    background: white;
    padding: 20px !important;
    width:49%;
}

@media (max-width: 767px) {
    .cta-emergency-help-section {
        flex-direction: column;  /* Stack the sections vertically */
        gap: 20px;               /* Maintain gap between sections */
    }

    .cta-emergency-help {
        width: 100%;             /* Make each section take up 100% width */
    }
}


  .center-flex {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }