/*! service-page-template.css */

/* service page wrapper and all child elements
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper {font-family: var(--outfit);}
html > body .service-page-wrapper,
html > body .service-page-wrapper * {position: relative; width: auto; height: auto; margin: 0; padding: 0; box-sizing: border-box;}

/* block elements */
html > body .service-page-wrapper,
html > body .service-page-wrapper :is(div,h1,h2,h3,h4,h5,h6,p,ul,ol,dl,li) {display: block; float: left;}




















/* global content resets
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* full width block elements */
html > body .service-page-wrapper :is(h1,h2,h3,h4,h5,h6,p,ul,ol,dl,li) {display: block; float: left; width: 100%; margin: 0; padding: 0;}

/* adjust font sizes */
html > body .service-page-wrapper :is(p,li) {font-size: 1.8rem;}

/* paragraphs and lists */
html > body .service-page-wrapper :is(ul,ol,dl,p) {margin: 0 0 2em 0;}

/* lists */
html > body .service-page-wrapper :is(li) {margin: 0; padding: 0 0 0 1.5em;}
html > body .service-page-wrapper :is(li)::before
{
    transform: translate3d(0,0.5em,0);
    top: 0; left: 0;
}





/* title areas
==================================================================================================== */

/* main container */
html > body .service-page-wrapper .title {margin: 0 0 4em 0;}

/* heading tags */
html > body .service-page-wrapper .title :is(h1,h2,h3,h4,h5,h6)
{
    margin: 0; padding: 0;
    text-transform: uppercase;
    font-weight: 400; font-size: 3.8rem; line-height: 1.35em;
    text-shadow: 0 0.05em 0.1em rgba(0,0,0,0.25);
}

/* paragraph tag */
html > body .service-page-wrapper .title :is(p) {margin: 0.5em 0 0 0;}

/* centered */
html > body .service-page-wrapper .title.center :is(h1,h2,h3,h4,h5,h6,p) {text-align: center;}




















/* global classes
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* padding */
html > body .service-page-wrapper .add-padding {padding: var(--section-padding);}

/* mobile settings */
@media only screen and (max-width: 1280px)
{
    html > body .service-page-wrapper .add-padding {padding: calc(var(--section-padding) * 2) var(--section-padding);}
}




















/* page sections
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
/*html > body .service-page-wrapper > .page-section {}*/

/* last section */
html > body .service-page-wrapper > :last-child:is(.page-section) {padding-bottom: 5em;}




















/* section colors
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* gunmetal/blue */
html > body .service-page-wrapper :is(div):is([data-background="gunmetal"],[data-background="blue"])
{
    color: var(--white);
    background: linear-gradient(to top right, var(--gunmetal-lite), var(--gunmetal-norm));
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1), 0 0 3em 0 rgba(0,0,0,0.25);
}

/* iceberg/lite blue */
html > body .service-page-wrapper :is(div):is([data-background="iceberg"],[data-background="lite-blue"])
{
    color: var(--white);
    background: linear-gradient(to top right, var(--iceberg-dark), var(--iceberg-norm));
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1), 0 0 3em 0 rgba(0,0,0,0.25);
}

/* persian/red */
html > body .service-page-wrapper :is(div):is([data-background="persian"],[data-background="red"])
{
    color: var(--white);
    background: linear-gradient(to top right, var(--persian-norm), var(--persian-lite));
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1), 0 0 3em 0 rgba(0,0,0,0.25);
}

/* white */
html > body .service-page-wrapper :is(div):is([data-background="white"])
{
    color: var(--eerie-norm);
    background: linear-gradient(to top right, var(--white-lite), var(--white-norm));
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1), 0 0 3em 0 rgba(0,0,0,0.25);
}

/* gray */
html > body .service-page-wrapper :is(div):is([data-background="gray"],[data-background="grey"])
{
    color: var(--eerie-norm);
    background: linear-gradient(to top right, rgba(210,210,210,1), rgba(230,230,230,1));
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.05), 0 0 3em 0 rgba(0,0,0,0.05);
}




















/* section textures
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* default settings */
html > body .service-page-wrapper .page-section::before {top: 0; left: 0; display: block; float: left;}

/* grunge */
html > body .service-page-wrapper .page-section:is([data-texture="grunge-dark"])::before {background: url("../../Media/textures/grunge-dark.png") no-repeat center center / cover; opacity: 0.015;}
html > body .service-page-wrapper .page-section:is([data-texture="grunge-lite"])::before {background: url("../../Media/textures/grunge-lite.png") no-repeat center center / cover; opacity: 0.01;}

/* brushed metal */
html > body .service-page-wrapper .page-section:is([data-texture="brushed-metal-vertical"])::before {background: url("../../Media/textures/brushed-metal-vertical-dark.png") no-repeat center center / cover; opacity: 0.15;}
html > body .service-page-wrapper .page-section:is([data-texture="brushed-metal-horizontal"])::before {background: url("../../Media/textures/brushed-metal-dark.png") no-repeat center center / cover; opacity: 0.15;}
html > body .service-page-wrapper .page-section:is([data-texture="brushed-metal-angle"])::before {background: url("../../Media/textures/brushed-metal-angle.png") no-repeat center center / cover; opacity: 0.25;}

/* carbon fiber */
html > body .service-page-wrapper .page-section:is([data-texture="carbon-fiber"])::before {background: url("../../Media/textures/carbon-fiber.svg") repeat center center / 10em; opacity: 0.05;}

/* diamond plate */
html > body .service-page-wrapper .page-section:is([data-texture="diamond-plate"])::before {background: url("../../Media/textures/diamond-plate.png") repeat center center / 10em; opacity: 0.1;}

/* angled lines */
html > body .service-page-wrapper .page-section:is([data-texture="angled-lines-dark"])::before {background: url("../../Media/textures/angled-lines-black.svg") repeat center center / 16em; opacity: 0.075;}
html > body .service-page-wrapper .page-section:is([data-texture="angled-lines-dark-alt"])::before {background: url("../../Media/textures/angled-lines-black-alt.svg") repeat center center / 16em; opacity: 0.075;}
html > body .service-page-wrapper .page-section:is([data-texture="angled-lines-lite"])::before {background: url("../../Media/textures/angled-lines-white.svg") repeat center center / 16em; opacity: 0.1;}
html > body .service-page-wrapper .page-section:is([data-texture="angled-lines-lite-alt"])::before {background: url("../../Media/textures/angled-lines-white-alt.svg") repeat center center / 16em; opacity: 0.1;}

/* multi angled lines */
html > body .service-page-wrapper .page-section:is([data-texture="multi-angled-lines-lite"])::before {background: url("../../Media/textures/multi-angled-lines-white.svg") repeat center center / 16em; opacity: 0.1;}
html > body .service-page-wrapper .page-section:is([data-texture="multi-angled-lines-dark"])::before {background: url("../../Media/textures/multi-angled-lines-black.svg") repeat center center / 16em; opacity: 0.1;}




















/* buttons
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper .button {margin: 5em 0 0 0;}





/* button wrapper
==================================================================================================== */

/* main container */
html > body .service-page-wrapper .button-wrapper
{
    display: inline-block; float: none;
    text-align: center; text-transform: uppercase;
    font-family: var(--oswald); font-size: 2rem; line-height: 1.5em;
    border-width: 0.2rem; border-style: solid;
    will-change: auto;
    transition: color 0.2s ease 0s, background 0.2s ease 0s, background-color 0.2s ease 0s, border-color 0.2s ease 0s;
}





/* specific colors
==================================================================================================== */

/* gunmetal/blue
================================================== */

/* main container */
html > body .service-page-wrapper :is(div):is([data-background="gunmetal"],[data-background="blue"]) .button-wrapper
{
    color: var(--iceberg-dark);
    background: var(--white);
    border-color: var(--iceberg-dark);
    box-shadow: 0 0.25em 0.5em 0 rgba(0,0,0,0.15), 0 0.5em 1em 0 rgba(0,0,0,0.15), 0 1em 2em 0 rgba(0,0,0,0.15);
}

/* hover */
html > body .service-page-wrapper :is(div):is([data-background="gunmetal"],[data-background="blue"]) .button-wrapper:hover {color: var(--white);}

/* sliding background */
html > body .service-page-wrapper :is(div):is([data-background="gunmetal"],[data-background="blue"]) .button-wrapper::before {background: linear-gradient(to top right, var(--iceberg-dark), var(--iceberg-norm));}





/* iceberg/lite blue
================================================== */

/* main container */
html > body .service-page-wrapper :is(div):is([data-background="iceberg"],[data-background="lite-blue"]) .button-wrapper
{
    color: var(--iceberg-dark);
    background: var(--white);
    border-color: var(--gunmetal-lite);
    box-shadow: 0 0.25em 0.5em 0 rgba(0,0,0,0.15), 0 0.5em 1em 0 rgba(0,0,0,0.15), 0 1em 2em 0 rgba(0,0,0,0.15);
}

/* hover */
html > body .service-page-wrapper :is(div):is([data-background="iceberg"],[data-background="lite-blue"]) .button-wrapper:hover {color: var(--white);}

/* sliding background */
html > body .service-page-wrapper :is(div):is([data-background="iceberg"],[data-background="lite-blue"]) .button-wrapper::before {background: linear-gradient(to top right, var(--gunmetal-lite), var(--gunmetal-norm));}





/* persian/red
================================================== */

/* main container */
html > body .service-page-wrapper :is(div):is([data-background="persian"],[data-background="red"]) .button-wrapper
{
    color: var(--iceberg-dark);
    background: var(--white);
    border-color: var(--iceberg-dark);
    box-shadow: 0 0.25em 0.5em 0 rgba(0,0,0,0.15), 0 0.5em 1em 0 rgba(0,0,0,0.15), 0 1em 2em 0 rgba(0,0,0,0.15);
}

/* hover */
html > body .service-page-wrapper :is(div):is([data-background="persian"],[data-background="red"]) .button-wrapper:hover {color: var(--white);}

/* sliding background */
html > body .service-page-wrapper :is(div):is([data-background="persian"],[data-background="red"]) .button-wrapper::before {background: linear-gradient(to top right, var(--iceberg-dark), var(--iceberg-norm));}





/* white/gray
================================================== */

/* main container */
html > body .service-page-wrapper :is(div):is([data-background="white"],[data-background="gray"],[data-background="grey"]) .button-wrapper
{
    color: var(--persian-dark);
    background: var(--white);
    border-color: var(--persian-dark);
    box-shadow: 0 0.25em 0.5em 0 rgba(0,0,0,0.075), 0 0.5em 1em 0 rgba(0,0,0,0.075), 0 1em 2em 0 rgba(0,0,0,0.075);
}

/* hover */
html > body .service-page-wrapper :is(div):is([data-background="white"],[data-background="gray"],[data-background="grey"]) .button-wrapper:hover {color: var(--white);}

/* sliding background */
html > body .service-page-wrapper :is(div):is([data-background="white"],[data-background="gray"],[data-background="grey"]) .button-wrapper::before {background: linear-gradient(to top right, var(--persian-norm), var(--persian-lite));}





/* sliding background
================================================== */

/* main container */
html > body .service-page-wrapper .button-wrapper::before
{
    transform: scaleX(0); transform-origin: right center;
    top: 0; left: 0; display: block; float: left;
    opacity: 0;
    will-change: auto;
    transition: transform 0.2s ease 0s, opacity 0.2s ease 0.1s;
}

/* hover */
html > body .service-page-wrapper .button-wrapper:hover::before
{
    transform: scaleX(1); transform-origin: left center;
    opacity: 1;
    transition: transform 0.2s ease 0s, opacity 0.2s ease 0s;
}





/* the actual button
================================================== */

/* main container */
html > body .service-page-wrapper .button-wrapper > :is(a,input,button)
{
    z-index: 2;
    position: absolute; top: 0; left: 0; display: block; float: left; width: 100%; height: 100%; margin: 0; padding: 0;
    text-align: inherit; text-transform: inherit;
    font-family: inherit; font-weight: inherit; font-size: inherit; line-height: inherit;
    color: inherit;
    opacity: 0;
}





/* text
================================================== */

/* main container */
html > body .service-page-wrapper .button-wrapper > :is(div,span).text
{
    padding: 0.5em 1em;
}

/* icon */
html > body .service-page-wrapper .button-wrapper > :is(div,span).text::after
{
    position: relative; display: inline-block; float: none; width: auto; height: auto; margin: 0 0 0 0.5em; content: "\f054";
    font-family: var(--fa); font-weight: 700; font-size: inherit; line-height: inherit;
}





















/* intro section
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
/*html > body .service-page-wrapper > .intro {}*/










/* intro content
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .intro > .intro-content
{
    /* variables */
    --locations-width: 55rem;
}





/* left side
================================================== */

/* main container */
html > body .service-page-wrapper > .intro > .intro-content > :is(div).intro-left
{
    width: calc(100% - var(--locations-width));
    padding: 0 10em 0 0;
}

/* mobile settings */
@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper > .intro > .intro-content > :is(div).intro-left {width: 100%; padding: 0;}
}





/* right side
================================================== */

/* main container */
html > body .service-page-wrapper > .intro > .intro-content > :is(div).intro-right {width: var(--locations-width);}

/* mobile settings */
@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper > .intro > .intro-content > :is(div).intro-right {width: 100%; margin: 5em 0 0 0;}
}





/* button
================================================== */

/* main container */
html > body .service-page-wrapper > .intro > .button {margin: 4em 0 0 0;}

/* mobile settings */
@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper > .intro > .button {text-align: center;}
}
@media only screen and (max-width: 768px)
{
    html > body .service-page-wrapper > .intro > .button .button-wrapper {width: 100%;}
}










/* intro content
==================================================================================================== */

/* list
================================================== */

/* main container */
html > body .service-page-wrapper ul.location-list {margin: 0;}

/* mobile settings */
@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper ul.location-list
    {
        /* flexbox rules */
        display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: stretch; align-content: stretch; row-gap: 0; column-gap: 1em;
    }
}
@media only screen and (max-width: 768px)
{
    html > body .service-page-wrapper ul.location-list {display: block;}
}





/* list item
================================================== */

/* main container */
html > body .service-page-wrapper ul.location-list li
{
    z-index: 1;
    margin: 1em 0; padding: 0 0 0 5em;
    text-transform: uppercase;
    font-weight: 600; font-size: 2em; line-height: 2em;
}

/* first/last child */
html > body .service-page-wrapper ul.location-list > :first-child:is(li),
html > body .service-page-wrapper ul.location-list > :last-child:is(li) {margin: 0;}

/* mobile settings */
@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper ul.location-list li
    {
        /* flexbox rules */
        order: 0; flex-grow: 1; flex-shrink: 1; flex-basis: auto; align-self: stretch;

        /* other rules */
        clear: none; width: auto; margin: 0; padding: 1em 1em 1em 5em;
        font-size: 1.4em; line-height: 1.35em;
        background: linear-gradient(to top right, rgba(255,255,255,0.05), rgba(255,255,255,0.1));
    }
}
@media only screen and (max-width: 1024px)
{
    html > body .service-page-wrapper ul.location-list li {font-size: 1.2em;}
}
@media only screen and (max-width: 768px)
{
    html > body .service-page-wrapper ul.location-list li {width: 100%; margin: 1em 0;}
    html > body .service-page-wrapper ul.location-list > :first-child:is(li),
    html > body .service-page-wrapper ul.location-list > :last-child:is(li) {margin: 0;}
}





/* state spans
================================================== */

/* main container */
html > body .service-page-wrapper ul.location-list li span
{
    display: inline; float: none;
    font-weight: 200;
}





/* state icons
================================================== */

/* main container */
html > body .service-page-wrapper ul.location-list li::before
{
    z-index: -1;
    transform: translate3d(0,-50%,0);
    top: 50%; left: 0; display: block; float: left; width: 4em; height: 2em;
    background-color: transparent; background-repeat: no-repeat; background-position: center center; background-size: contain;
    border-radius: 0; border-width: 0 0.2rem 0 0; border-style: solid; border-color: rgba(255,255,255,0.1);
}

/* specific state icon */
html > body .service-page-wrapper ul.location-list li.in::before {background-image: url("../../Media/states/indiana-star-white.svg");}
html > body .service-page-wrapper ul.location-list li.tx::before {background-image: url("../../Media/states/texas-star-white.svg");}
html > body .service-page-wrapper ul.location-list li.ms::before {background-image: url("../../Media/states/missouri-star-white.svg");}




















/* enroll section
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll {padding: calc(var(--section-padding) * 2) var(--section-padding);}





/* icon cards
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll .cards {margin: 5em 0 0 0;}

@media only screen and (max-width: 1280px)
{
    html > body .service-page-wrapper > .enroll .cards {margin: 3em 0 0 0;}
}





/* list
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll .cards ul
{
    /* flexbox rules */
    display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; align-content: stretch; row-gap: 2.5em; column-gap: 2.5em;

    /* standard rules */
    margin: 0;
}





/* list items
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll .cards ul li
{
    /* flexbox rules */
    order: 0; flex-grow: 1; flex-shrink: 1; flex-basis: 15em; align-self: stretch;

    /* standard rules */
    margin: 0; padding: 2em;
    overflow: hidden;
    color: var(--white);
    background: var(--persian-dark);
    border-radius: 3em;
    box-shadow: 0 1em 2em 0 rgba(0,0,0,0.1), 0 7em 5em 0 rgba(0,0,0,0.1);
}

/* hide dot */
html > body .service-page-wrapper > .enroll .cards ul li::before {display: none;}





/* specific flexbox lists
==================================================================================================== */

/* passenger enroll
================================================== */

/* list */
/*html > body .service-page-wrapper.passenger-endorsement-training > .enroll .cards ul {}*/

/* list item */
/*html > body .service-page-wrapper.passenger-endorsement-training > .enroll .cards ul li {}*/

@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper.passenger-endorsement-training > .enroll .cards ul li {flex-basis: 45%;}
}
@media only screen and (max-width: 768px)
{
    html > body .service-page-wrapper.passenger-endorsement-training > .enroll .cards ul li {flex-basis: 15em;}
}



/* manual why it matters
================================================== */

/* list */
/*html > body .service-page-wrapper.remove-the-automatic-restriction-from-your-cdl > .enroll .cards ul {}*/

/* list item */
/*html > body .service-page-wrapper.remove-the-automatic-restriction-from-your-cdl > .enroll .cards ul li {}*/

@media only screen and (max-width: 1400px)
{
    html > body .service-page-wrapper.remove-the-automatic-restriction-from-your-cdl > .enroll .cards ul li {flex-basis: 45%;}
}
@media only screen and (max-width: 768px)
{
    html > body .service-page-wrapper.remove-the-automatic-restriction-from-your-cdl > .enroll .cards ul li {flex-basis: 15em;}
}



/* corporate why work with us
================================================== */

/* list */
/*html > body .service-page-wrapper.corporate-business-cdl-training > .enroll .cards ul {}*/

/* list item */
/*html > body .service-page-wrapper.corporate-business-cdl-training > .enroll .cards ul li {}*/

@media only screen and (max-width: 1700px)
{
    html > body .service-page-wrapper.corporate-business-cdl-training > .enroll .cards ul li {flex-basis: 25%;}
}
@media only screen and (max-width: 1024px)
{
    html > body .service-page-wrapper.corporate-business-cdl-training > .enroll .cards ul li {flex-basis: 15em;}
}



/* cdl refresher course covers
================================================== */

/* list */
/*html > body .service-page-wrapper.cdl-refresher-courses > .enroll .cards ul {}*/

/* list item */
/*html > body .service-page-wrapper.cdl-refresher-courses > .enroll .cards ul li {}*/

@media only screen and (max-width: 1700px)
{
    html > body .service-page-wrapper.cdl-refresher-courses > .enroll .cards ul li {flex-basis: 25%;}
}
@media only screen and (max-width: 1024px)
{
    html > body .service-page-wrapper.cdl-refresher-courses > .enroll .cards ul li {flex-basis: 15em;}
}





/* icon
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll .cards ul li .icon {text-align: center;}

/* icon element */
html > body .service-page-wrapper > .enroll .cards ul li .icon::before
{
    position: relative; display: inline-block; float: none; width: 5em; height: 5em;
    background-color: var(--white); background-position: center center; background-size: 3.5em; background-repeat: no-repeat;
    border-radius: 50%;
    box-shadow: 0 1em 2em 0 rgba(0,0,0,0.25);
}

/* specific icon */
html > body .service-page-wrapper > .enroll .cards ul li.bus .icon::before {background-image: url("../../Media/services/Icons/10. Bus 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.luggage .icon::before {background-image: url("../../Media/services/Icons/Suitcase 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.money .icon::before {background-image: url("../../Media/services/Icons/comisions 1-1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.hand-shake .icon::before {background-image: url("../../Media/services/Icons/Trust 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.badge .icon::before {background-image: url("../../Media/services/Icons/approval-07 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.clip-board .icon::before {background-image: url("../../Media/services/Icons/11 service 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.user-stars .icon::before {background-image: url("../../Media/services/Icons/13 rating 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.user-group .icon::before {background-image: url("../../Media/services/Icons/4 teamwork 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.truck-front .icon::before {background-image: url("../../Media/services/Icons/1.Truck 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.truck-side .icon::before {background-image: url("../../Media/services/Icons/Truck-22 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.magnifying-glass .icon::before {background-image: url("../../Media/services/Icons/search 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.document-check .icon::before {background-image: url("../../Media/services/Icons/agreement-10 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.shield-check .icon::before {background-image: url("../../Media/services/Icons/shield 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.user-dots .icon::before {background-image: url("../../Media/services/Icons/7 connect 1.png");}
html > body .service-page-wrapper > .enroll .cards ul li.checklist .icon::before {background-image: url("../../Media/services/Icons/checklist 1.png");}





/* text
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .enroll .cards ul li .text {margin: 1.65em 0 0 0;}

/* paragraph */
html > body .service-page-wrapper > .enroll .cards ul li .text p {text-align: center; text-transform: uppercase;}




















/* programs section
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs {padding: calc(var(--section-padding) * 2) var(--section-padding);}





/* picture cards
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs .cards {margin: 5em 0;}





/* list
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs .cards ul
{
    /* flexbox rules */
    display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: stretch; align-content: stretch; row-gap: 2.5em; column-gap: 2.5em;

    /* standard rules */
    margin: 0;
}





/* list items
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs .cards ul li
{
    /* variables */
    --photo-height: 7em;

    /* flexbox rules */
    order: 0; flex-grow: 1; flex-shrink: 1; flex-basis: 15em; align-self: stretch;

    /* standard rules */
    margin: 0; padding: var(--photo-height) 2em 2em 2em;
    overflow: hidden;
    color: var(--eerie-norm);
    border-radius: 3em;
    box-shadow: 0 1em 2em 0 rgba(0,0,0,0.1), 0 7em 5em 0 rgba(0,0,0,0.1);
}

/* hide dot */
html > body .service-page-wrapper > .programs .cards ul li::before {display: none;}

/* background color */
html > body .service-page-wrapper > .programs .cards:is([data-card-background="gray"],[data-card-background="grey"]) ul li {background: var(--gainsboro-norm);}
html > body .service-page-wrapper > .programs .cards:is([data-card-background="white"]) ul li {background: var(--white);}





/* photos
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs .cards ul li .photo
{
    position: absolute; top: 0; left: 0; height: var(--photo-height);
    background-repeat: no-repeat; background-size: cover;
}

/* photo alignment */
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="top-left"],[data-picture-alignment="left-top"]) {background-position: top left;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="top-center"],[data-picture-alignment="center-top"]) {background-position: top center;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="top-right"],[data-picture-alignment="right-top"]) {background-position: top right;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="center-left"],[data-picture-alignment="left-center"]) {background-position: center left;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="center-center"],[data-picture-alignment="center-center"]) {background-position: center center;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="center-right"],[data-picture-alignment="right-center"]) {background-position: center right;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="bottom-left"],[data-picture-alignment="left-bottom"]) {background-position: bottom left;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="bottom-center"],[data-picture-alignment="center-bottom"]) {background-position: bottom center;}
html > body .service-page-wrapper > .programs .cards ul li .photo:is([data-picture-alignment="bottom-right"],[data-picture-alignment="right-bottom"]) {background-position: bottom right;}





/* text
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .programs .cards ul li .text {margin: 2em 0 0 0;}

/* heading */
html > body .service-page-wrapper > .programs .cards ul li .text :is(h1,h2,h3,h4,h5,h6)
{
    text-align: center; text-transform: uppercase;
    font-family: var(--outfit); font-weight: 700; font-size: 1.8rem; line-height: 1.35em;
}

/* paragraph */
html > body .service-page-wrapper > .programs .cards ul li .text p {text-align: center;}




















/* picture sections
========================================================================================================================================================================================================
========================================================================================================================================================================================================
======================================================================================================================================================================================================== */

/* main container */
html > body .service-page-wrapper .picture-section
{
    /* variables */
    --picture-width: 50%;

    /* rules */
    overflow: hidden;
}





/* picture container
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .picture-section > .picture-container
{
    position: absolute; top: 0; width: var(--picture-width); height: 100%;
    overflow: hidden;
    box-shadow: 0 0 1em 0 rgba(0,0,0,0.1), 0 0 2em 0 rgba(0,0,0,0.1);
}

/* mobile settings */
@media only screen and (max-width: 1024px)
{
    html > body .service-page-wrapper > .picture-section > .picture-container {position: relative; top: auto; left: auto; right: auto; width: 100%;}
    html > body .service-page-wrapper > .picture-section:is([data-mobile-height="short"]) > .picture-container {height: 25vh;}
    html > body .service-page-wrapper > .picture-section:is([data-mobile-height="normal"]) > .picture-container {height: 35vh;}
    html > body .service-page-wrapper > .picture-section:is([data-mobile-height="tall"]) > .picture-container {height: 45vh;}
}

/* picture position */
html > body .service-page-wrapper .picture-section[data-picture-position="left"] > .picture-container {left: 0; float: left;}
html > body .service-page-wrapper .picture-section[data-picture-position="right"] > .picture-container {right: 0; float: right;}

/* image positioning */
html > body .service-page-wrapper > .picture-section > .picture-container {background-repeat: no-repeat; background-size: cover;}

/* top */
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="top-left"]) > .picture-container {background-position: top left;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="top-center"]) > .picture-container {background-position: top center;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="top-right"]) > .picture-container {background-position: top right;}

/* center */
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="center-left"]) > .picture-container {background-position: center left;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="center-center"]) > .picture-container {background-position: center center;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="center-right"]) > .picture-container {background-position: center right;}

/* bottom */
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="bottom-left"]) > .picture-container {background-position: bottom left;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="bottom-center"]) > .picture-container {background-position: bottom center;}
html > body .service-page-wrapper > .picture-section:is([data-picture-alignment="bottom-right"]) > .picture-container {background-position: bottom right;}





/* content container
==================================================================================================== */

/* main container */
html > body .service-page-wrapper > .picture-section > .content-container {width: calc(100% - var(--picture-width));}

/* content position */
html > body .service-page-wrapper .picture-section[data-picture-position="left"] > .content-container {float: right;}
html > body .service-page-wrapper .picture-section[data-picture-position="right"] > .content-container {float: left;}

/* mobile settings */
@media only screen and (max-width: 1024px)
{
    html > body .service-page-wrapper > .picture-section > .content-container {width: 100%;}
}