/* Colors */
.bg-teal,
.dark .bg-teal:hover {
    background-color: rgb(42 175 160 / 1);
}
.bg-muted {
    background-color: var(--muted);
}
.dark .bg-teal,
.bg-teal:hover {
    background-color: rgb(28 138 126 / 1);
}
.text-cream {
    color: rgb(242 232 213 / 1);
}
.hover-bg-muted:hover {
    background-color: var(--muted) !important;
}
.hover-text-accent:hover {
    color: var(--accent) !important;
}
.hover-scale-1:hover {
    transform: translate( 0, -2px ) rotate( 0 ) skew( 0 ) skewY( 0 ) scaleX( 1.02 ) scaleY( 1.02 );
}
.bg-teal-900 {
    background-color: rgb(19 78 74 / 1);
}
.heading-cream-light h2,
.heading-cream-light h3,
.heading-cream-light h4{
    color: rgb(248 243 233 / 1);
}
.text-cream-light {
    color: rgb(248 243 233 / 1);
}
.text-cream-light {
    color: #f8f3e9e6;
}
.text-white {
    color: rgb(255 255 255 / 1);
}
.h-teal-900 h2,
.h-teal-900 h3,
.h-teal-900 h4{
    color: rgb(19 78 74 / 1);
}
.text-teal-700 p,
.text-teal-700 li,
.text-teal-700 a {
    color: rgb(15 118 110 / 1);
}

.text-teal-900 p,
.text-teal-900 li,
.text-teal-900 a {
    color: rgb(19 78 74 / 1);
}

.text-muted-foreground p,
.text-muted-foreground li,
.text-muted-foreground a {
    color: var(--muted-foreground);
}
.color_foreground{
    color: var(--foreground);
}
.fill-primary{
    fill: var(--primary);
}
.text-teal-dark{
    color: rgb(28 138 126 / 1);
}
body .h-teal-dark h2,
body .h-teal-dark h3,
body .h-teal-dark h4 {
    color: rgb(28 138 126 / 1);
}
.text-black{
    color: #000;
}
.bg-white{
    background-color: #fff;
}
.text-gray-800 p,
.text-gray-800 li,
.text-gray-800 a{
    color: rgb(31 41 55 / 1);
}
.text-card-foreground {
    color: var(--card-foreground);
}
.bg-card {
    background-color: var(--card);
}

/* paddings */
.py_120{
    padding: 120px 0;
}
.py_96{
    padding: 96px 0;
}
.py_80{
    padding: 80px 0;
}
.pt_64{
    padding-top: 64px;
}
.py_64{
    padding: 64px 0;
}
.sec_py_96{
    padding: 96px 0;
}

/* margings */
.mt-0\.5 {
    margin-top: .125rem;
}


/* ::shadow */
.shadow_lg{
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);
}
.hover-shadow-xl:hover,
.shadow_xl {
    box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
}

/* End */


@media( max-width: 1024px ){
    .sec_py_96{
        padding: 64px 0;
    }
}
@media( max-width: 767px ){
    .sec_py_96{
        padding: 48px 0;
    }
    .py_96{
        padding: 64px 0;
    }
}