/* BEGIN: colors */

    /*
    colors info:
    main color: FIRST_BASE/COMP
    hover color: SECOND_BASE/COMP
    box background: THIRD_BASE/COMP
    header or navi: FOURTH_BASE/COMP
    footer: FIFTH_BASE/COMP
    accent (saving etc.) color: SIXTH_BASE/COMP
     */
     :root {
        --TEXT: #222222;
        --CONTENT: #FFFFFF;
        --BACKGROUND: #FFFFFF;

        --FIRST_BASE: #232D59;
        --FIRST_COMP: #FFFFFF;

        --SECOND_BASE: #4E4E4E;
        --SECOND_COMP: #FFFFFF;

        --THIRD_BASE: #F2F2F2;
        --THIRD_COMP: #333333;

        --FOURTH_BASE: #FFFFFF;
        --FOURTH_COMP: #333333;

        --FIFTH_BASE: #232D59;
        --FIFTH_COMP: #FFFFFF;

        --SIXTH_BASE: #333333;
        --SIXTH_COMP: #FFFFFF;

        --PHARMACY1_FIRST_BASE: #232D59;
        --PHARMACY1_FIRST_COMP: #FFFFFF;
        --PHARMACY1_SECOND_BASE: #333333;
        --PHARMACY1_SECOND_COMP: #FFFFFF;
        --PHARMACY1_THIRD_BASE: #F2F2F2;
        --PHARMACY1_THIRD_COMP: #df091e;

        --PHARMACY2_FIRST_BASE: #232D59;
        --PHARMACY2_FIRST_COMP: #FFFFFF;
        --PHARMACY2_SECOND_BASE: #333333;
        --PHARMACY2_SECOND_COMP: #FFFFFF;
        --PHARMACY2_THIRD_BASE: #F2F2F2;
        --PHARMACY2_THIRD_COMP: #df091e;

        --PHARMACY3_FIRST_BASE: #CE9905;
        --PHARMACY3_FIRST_COMP: #FFFFFF;
        --PHARMACY3_SECOND_BASE: #FFCC00;
        --PHARMACY3_SECOND_COMP: #423501;
        --PHARMACY3_THIRD_BASE: #F4EFE2;
        --PHARMACY3_THIRD_COMP: #423501;

        --GRAY_03: #F7F7F7;
        --GRAY_05: #F2F2F2;
        --GRAY_08: #EBEBEB;
        --GRAY_10: #E5E5E5;
        --GRAY_15: #D9D9D9;
        --GRAY_20: #CCCCCC;
        --GRAY_25: #BFBFBF;
        --GRAY_30: #B2B2B2;
        --GRAY_40: #999999;
        --GRAY_50: #7F7F7F;
        --GRAY_60: #666666;
        --GRAY_70: #4C4C4C;
        --GRAY_80: #333333;
        --GRAY_90: #191919;
    }

/* END: colors */

/* BEGIN: Google Fonts */

    @font-face {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 100;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-100.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-100.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 300;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-300.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-300.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: italic;
        font-weight: 100;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-100italic.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-100italic.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: italic;
        font-weight: 300;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-300italic.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-300italic.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 400;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-regular.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-regular.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: italic;
        font-weight: 400;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-italic.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-italic.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 700;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-700.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-700.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: italic;
        font-weight: 700;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-700italic.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-700italic.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: normal;
        font-weight: 900;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-900.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-900.woff') format('woff');
    }

    @font-face {
        font-family: 'Lato';
        font-style: italic;
        font-weight: 900;
        src: local(''),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-900italic.woff2') format('woff2'),
            url('https://cdn2.comvalue.com/pharmacom/assets/design/fonts/lato-v20-latin-900italic.woff') format('woff');
    }

/* END: Google Fonts */

/* BEGIN: Font Awesome */

    @font-face {
        font-display: auto;
        font-family: 'FontAwesome';
        font-style: normal;
        font-weight: 400;
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.eot?v=5.11.2');
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.eot?#iefix&v=5.11.2') format('embedded-opentype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.woff2?v=5.11.2') format('woff2'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.woff?v=5.11.2') format('woff'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.ttf?v=5.11.2') format('truetype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-regular-400-5112.svg?v=5.11.2#fontawesome') format('svg');
    }

    @font-face {
        font-display: auto;
        font-family: 'FontAwesome solid';
        font-style: normal;
        font-weight: 900;
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.eot?v=5.11.2');
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.eot?#iefix&v=5.11.2') format('embedded-opentype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.woff2?v=5.11.2') format('woff2'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.woff?v=5.11.2') format('woff'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.ttf?v=5.11.2') format('truetype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-solid-900-5112.svg?v=5.11.2#fontawesomesolid') format('svg');
    }

    @font-face {
        font-display: auto;
        font-family: 'FontAwesome brands';
        font-style: normal;
        font-weight: normal;
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.eot?v=5.11.2');
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.eot?#iefix&v=5.11.2') format('embedded-opentype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.woff2?v=5.11.2') format('woff2'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.woff?v=5.11.2') format('woff'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.ttf?v=5.11.2') format('truetype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/fa-brands-400-5112.svg?v=5.11.2#fontawesomebrands') format('svg');
    }

    @font-face {
        font-family: 'Comvalue_FontAwesome';
        font-style: normal;
        font-weight: normal;
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.eot');
        src: url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.eot?#iefix') format('embedded-opentype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.woff2') format('woff2'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.woff') format('woff'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.ttf') format('truetype'),
                url('https://cdn3.comvalue.com/pharmacom/assets/design/fonts/comvalue_fontawesome_v1.svg') format('svg');
    }

    .fa,
    .far {
        display: inline-block;
        font-family: 'FontAwesome';
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-style: normal;
        font-variant: normal;
        font-weight: 400;
        line-height: 1;
        text-rendering: auto;
    }

    .fas {
        display: inline-block;
        font-family: 'FontAwesome solid';
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-style: normal;
        font-variant: normal;
        font-weight: 900;
        line-height: 1;
        text-rendering: auto;
    }

    .fab {
        display: inline-block;
        font-family: 'FontAwesome brands';
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-style: normal;
        font-variant: normal;
        font-weight: 900;
        line-height: 1;
        text-rendering: auto;
    }

    .cfa {
        display: inline-block;
        font-family: 'Comvalue_FontAwesome';
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-style: normal;
        font-variant: normal;
        font-weight: 400;
        line-height: 1;
        text-rendering: auto;
    }

    .fa-lg {
        font-size: 1.33333em;
        line-height: 0.75em;
        vertical-align: -.0667em;
    }

    .fa-xs {
        font-size: .75em;
    }

    .fa-sm {
        font-size: .875em;
    }

    .fa-1x {
        font-size: 1em;
    }

    .fa-2x {
        font-size: 2em;
    }

    .fa-3x {
        font-size: 3em;
    }

    .fa-4x {
        font-size: 4em;
    }

    .fa-5x {
        font-size: 5em;
    }

    .fa-6x {
        font-size: 6em;
    }

    .fa-7x {
        font-size: 7em;
    }

    .fa-8x {
        font-size: 8em;
    }

    .fa-9x {
        font-size: 9em;
    }

    .fa-10x {
        font-size: 10em;
    }

    .fa-fw {
        text-align: center;
        width: 1.25em;
    }

    .fa-ul {
        list-style-type: none;
        margin-left: 2.5em;
        padding-left: 0;
    }

    .fa-ul > li {
        position: relative;
    }

    .fa-li {
        left: -2em;
        line-height: inherit;
        position: absolute;
        text-align: center;
        width: 2em;
    }

    .fa-angle-left:before {
        content: "\f104";
        font-family: 'FontAwesome solid';
    }

    .fa-angle-right:before {
        content: "\f105";
        font-family: 'FontAwesome solid';
    }

    .fa-arrow-down:before {
        content: "\f063";
        font-family: 'FontAwesome solid';
    }

    .fa-arrow-left:before {
        content: "\f060";
        font-family: 'FontAwesome solid';
    }

    .fa-arrow-right:before {
        content: "\f061";
        font-family: 'FontAwesome solid';
    }

    .fa-arrow-up:before {
        content: "\f062";
        font-family: 'FontAwesome solid';
    }

    .fa-ban:before {
        content: "\f05e";
        font-family: 'FontAwesome solid';
    }

    .fa-bars:before {
        content: "\f0c9";
        font-family: 'FontAwesome solid';
    }

    .fa-book:before {
        content: "\f02d";
        font-family: 'FontAwesome solid';
    }

    .fa-bullhorn:before {
        content: "\f0a1";
        font-family: 'FontAwesome solid';
    }

    .fa-calendar:before {
        content: "\f073";
        font-family: 'FontAwesome';
    }

    .fa-check:before {
        content: "\f00c";
        font-family: 'FontAwesome solid';
    }

    .fa-check-circle:before {
        content: "\f058";
        font-family: 'FontAwesome solid';
    }

    .fa-check-double:before {
        content: "\f560";
        font-family: 'FontAwesome solid';
    }

    .fa-chevron-right:before {
        content: "\f054";
        font-family: 'FontAwesome solid';
    }

    .fa-clock:before {
        content: "\f017";
        font-family: 'FontAwesome';
    }

    .fa-clock-three:before {
        content: "\f017";
        font-family: 'FontAwesome';
    }

    .fa-clock-o:before {
        content: "\f017";
        font-family: 'FontAwesome solid';
    }

    .fa-desktop:before {
        content: "\f390";
        font-family: 'FontAwesome solid';
    }

    .fa-envelope:before {
        content: "\f0e0";
        font-family: 'FontAwesome solid';
    }

    .fa-envelope-open-text:before {
        content: "\f658";
        font-family: 'FontAwesome solid';
    }

    .fa-exclamation:before {
        content: "\f12a";
        font-family: 'FontAwesome solid';
    }

    .fa-exclamation-circle:before {
        content: "\f06a";
        font-family: 'FontAwesome solid';
    }

    .fa-exclamation-triangle:before {
        content: "\f071";
        font-family: 'FontAwesome solid';
    }

    .fa-facebook:before {
        content: "\f09a";
        font-family: 'FontAwesome brands';
    }

    .fa-facebook-f:before {
        content: "\f39e";
        font-family: 'FontAwesome brands';
    }

    .fa-hand-point-right:before {
        content: "\f0a4";
        font-family: 'FontAwesome';
    }

    .fa-heartbeat:before {
        content: "\f21e";
        font-family: 'FontAwesome solid';
    }

    .fa-home:before {
        content: "\f015";
        font-family: 'FontAwesome solid';
    }

    .fa-instagram:before {
        content: "\f16d";
        font-family: 'FontAwesome brands';
    }

    .fa-laptop:before {
        content: "\f109";
        font-family: 'FontAwesome solid';
    }

    .fa-leaf:before {
        content: "\f06c";
        font-family: 'FontAwesome solid';
    }

    .fa-life-ring:before {
        content: "\f1cd";
        font-family: 'FontAwesome solid';
    }

    .fa-map-marker-alt:before {
        content: "\f3c5";
        font-family: 'FontAwesome solid';
    }

    .fa-medkit:before {
        content: "\f0fa";
        font-family: 'FontAwesome solid';
    }

    .fa-mobile:before {
        content: "\f10b";
        font-family: 'FontAwesome solid';
    }

    .fa-mobile-alt:before {
        content: "\f3cd";
        font-family: 'FontAwesome solid';
    }

    .fa-moon:before {
        content: "\f186";
        font-family: 'FontAwesome solid';
    }

    .fa-mortar-pestle:before {
        content: "\f5a7";
        font-family: 'FontAwesome solid';
    }

    .fa-newspaper-o:before,
    .fa-newspaper:before {
        content: "\f1ea";
        font-family: 'FontAwesome';
    }

    .fa-pagelines:before {
        content: "\f18c";
        font-family: 'FontAwesome brands';
    }

    .fa-percentage:before {
        content: "\f295";
        font-family: 'FontAwesome solid';
    }

    .fa-phone:before {
        content: "\f095";
        font-family: 'FontAwesome solid';
    }

    .fa-pills:before {
        content: "\f484";
        font-family: 'FontAwesome solid';
    }

    .fa-search:before {
        content: "\f002";
        font-family: 'FontAwesome solid';
    }

    .fa-shipping-fast:before {
        content: "\f48b";
        font-family: 'FontAwesome solid';
    }

    .fa-shopping-basket:before {
        content: "\f291";
        font-family: 'FontAwesome solid';
    }

    .fa-shopping-cart:before {
        content: "\f07a";
        font-family: 'FontAwesome solid';
    }

    .fa-star:before {
        content: "\f005";
        font-family: 'FontAwesome';
    }

    .fa-user:before {
        content: "\f007";
        font-family: 'FontAwesome solid';
    }

    .fa-user-alt:before {
        content: "\f406";
        font-family: 'FontAwesome solid';
    }

    .far-user:before {
        content: "\f007";
        font-family: 'FontAwesome';
    }

    .fa-user-circle:before {
        content: "\f2bd";
        font-family: 'FontAwesome solid';
    }

    .fa-whatsapp:before {
        content: "\f232";
        font-family: 'FontAwesome brands';
    }

    .fa-sharp .fa-regular .fa-xmark:before {
        content: "\f00d";
        font-family: 'FontAwesome';
    }

    .fa-youtube:before {
        content: "\f167";
        font-family: 'FontAwesome brands';
    }

    .cfa-amamed:before {
        content: "\e005";
    }

    .cfa-dea:before {
        content: "\e003";
    }

    .cfa-payback:before {
        content: "\e004";
    }

    .cfa-prescription:before {
        content: "\e002";
        font-family: 'Comvalue_FontAwesome';
    }

    .cfa-pharmacy:before {
        content: "\e001";
        font-family: 'Comvalue_FontAwesome';
    }

/* END: Font Awesome */

/* BEGIN: markup defaults */

    html {
        color: var(--TEXT);
        font-family: 'Lato', sans-serif;
        font-weight: 400;
        scroll-behavior: smooth;
    }

    i, italic {
        font-family: 'Lato', sans-serif;
        font-style: italic;
        font-weight: 400i;
    }

    b, strong {
        font-family: 'Lato', sans-serif;
        font-weight: 700;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        color: var(--FIRST_BASE);
        font-family: 'Lato', sans-serif;
        font-weight: 700;
        line-height: 1.4;
        margin-bottom: 15px;
    }

        .pharmacy1 h1,
        .pharmacy1 h2,
        .pharmacy1 h3,
        .pharmacy1 h4,
        .pharmacy1 h5,
        .pharmacy1 h6 {
            color: var(--PHARMACY1_FIRST_BASE);
        }

        .pharmacy2 h1,
        .pharmacy2 h2,
        .pharmacy2 h3,
        .pharmacy2 h4,
        .pharmacy2 h5,
        .pharmacy2 h6 {
            color: var(--PHARMACY2_FIRST_BASE);
        }

        .pharmacy3 h1,
        .pharmacy3 h2,
        .pharmacy3 h3,
        .pharmacy3 h4,
        .pharmacy3 h5,
        .pharmacy3 h6 {
            color: var(--PHARMACY3_FIRST_BASE);
        }

    h1 {
        font-size: 180%;
    }

    h2 {
        font-size: 160%;
    }

    h3 {
        font-size: 140%;
    }

    p {
        line-height: 1.4;
        margin-bottom: 15px;
    }

    a {
        color: var(--FIRST_BASE);
        text-decoration: none;
    }

        .pharmacy1 a {
            color: var(--PHARMACY1_FIRST_BASE);
        }
        .pharmacy2 a {
            color: var(--PHARMACY2_FIRST_BASE);
        }
        .pharmacy3 a {
            color: var(--PHARMACY3_FIRST_BASE);
        }
        .pharmacy4 a {
            color: var(--PHARMACY4_FIRST_BASE);
        }
        .pharmacy5 a {
            color: var(--PHARMACY5_FIRST_BASE);
        }
        .pharmacy6 a {
            color: var(--PHARMACY6_FIRST_BASE);
        }

    li, ul {
        list-style: none;
    }

    video {
        max-height: 100%;
        width: 100%;
    }

    button,
    .button {
        background-color: transparent;
        border: 1px solid;
        border-color: var(--FIRST_BASE);
        border-radius: 5px;
        color: var(--FIRST_BASE);
        cursor: pointer;
        display: inline-block;
        font-weight: bold;
        padding: 15px 30px;
        position: relative;
        text-align: left;
        text-decoration: none;
    }
        button:hover,
        .button:hover {
            background-color: var(--FIRST_BASE);
            border-color: var(--FIRST_BASE);
            color: var(--FIRST_COMP);
            text-decoration: none;
            -ms-transition: .5s all;
			-webkit-transition: .5s all;
			transition: .5s all;
        }
    .pharmacy1 button,
    .pharmacy1 .button {
        border-color: var(--PHARMACY1_FIRST_BASE);
        color: var(--PHARMACY1_FIRST_BASE);
    }
        .pharmacy1 button:hover,
        .pharmacy1 .button:hover {
            background-color: var(--PHARMACY1_FIRST_BASE);
            border-color: var(--PHARMACY1_FIRST_BASE);
            color: var(--PHARMACY1_FIRST_COMP);
        }

    .pharmacy2 button,
    .pharmacy2 .button {
        border-color: var(--PHARMACY2_FIRST_BASE);
        color: var(--PHARMACY2_FIRST_BASE);
    }
        .pharmacy2 button:hover,
        .pharmacy2 .button:hover {
            background-color: var(--PHARMACY2_FIRST_BASE);
            border-color: var(--PHARMACY2_FIRST_BASE);
            color: var(--PHARMACY2_FIRST_COMP);
        }

    .pharmacy3 button,
    .pharmacy3 .button {
        border-color: var(--PHARMACY3_FIRST_BASE);
        color: var(--PHARMACY3_FIRST_BASE);
    }
        .pharmacy3 button:hover,
        .pharmacy3 .button:hover {
            background-color: var(--PHARMACY3_FIRST_BASE);
            border-color: var(--PHARMACY3_FIRST_BASE);
            color: var(--PHARMACY3_FIRST_COMP);
        }

    img {
        display: block;
        height: auto;
        max-width: 100%;
        width: 100%;
    }

/* END: markup defaults */

/* BEGIN: header */

    .header {
        padding: 30px 0px 0px 0px;
        text-align: center;
        width: 100%;
    }

    .header .portal-logo {
        height: 100px;
    }

/* END: header */

/* BEGIN: slider */

    .slider {
        position: relative;
    }

    .first-slide {
        display: block;
        height: 100%;
        width: auto;
    }

    .slide {
        bottom: 0;
        height: 100%;
        left: 0;
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
    }

    .slide-image {
        display: block;
        height: auto;
        width: 100%;
    }

        .portal-slider .slide-image {
            height: 100%;
            object-fit: cover;
            width: auto;
        }

    .first-slide {
        animation: fade-1 10s infinite;
        -webkit-animation: fade-1 10s infinite;
    }

    .slide.index2 {
        animation: fade-2 10s infinite;
        -webkit-animation: fade-2 10s infinite;
    }

    .slide.index3 {
        animation: fade-3 10s infinite;
        -webkit-animation: fade-3 10s infinite;
    }

    .slide.index3 {
        animation: fade-4 10s infinite;
        -webkit-animation: fade-4 10s infinite;
    }

    @keyframes fade-1 {
        0% { opacity: 1; }
        33% { opacity: 0; }
        66% { opacity: 0; }
        100% { opacity: 1; }
    }

    @keyframes fade-2 {
        0% { opacity: 0; }
        33% { opacity: 1; }
        66% { opacity: 0; }
        100% { opacity: 0; }
    }

    @keyframes fade-3 {
        0% { opacity: 0; }
        33% { opacity: 0; }
        66% { opacity: 1; }
        100% { opacity: 0; }
    }

    /* example for a 4th slide */
    @keyframes fade-4 {
        0% { opacity: 0; }
        25% { opacity: 0; }
        50% { opacity: 0; }
        75% { opacity: 1; }
        100% { opacity: 0; }
    }

    .slide-content {
        font-size: 100%;
        position: absolute;
        text-align: center;
        top: 33%;
        width: 100%;
        z-index: 2;
    }

        .slide-content .button {
            background-color: rgba(255,255,255,0.75);
            color: var(--TEXT);
        }
            .slide-content .button:hover {
                background-color: rgba(255,255,255,1);
                color: var(--TEXT);
            }
            .slide-content .button:after {
                content: "\f078";
                font-family: FontAwesome solid;
                margin-left: 10px;
                text-rendering: auto;
                -moz-osx-font-smoothing: grayscale;
                -webkit-font-smoothing: antialiased;
                vertical-align: inherit;
            }

        .slide-content .portal-image {
            display: block;
            height: auto;
            opacity: 0.75;
            margin: 0px auto 30px auto;
            max-width: 767px;
            padding: 0px 15px;
            width: calc(100% - 30px);
        }

/* END: slider */

/* BEGIN: main */

    /* BEGIN: contents */

        .container-box {
            background-color: var(--THIRD_BASE);
            color: var(--THIRD_COMP);
        }

            .container-box h1,
            .container-box h2,
            .container-box h3,
            .container-box h4,
            .container-box h5,
            .container-box h6 {
                color: var(--THIRD_COMP);
            }

        .container-centered {
            display: block;
            margin: 15px auto;
            max-width: 1470px;
            padding: 15px;
            width: calc(100% - 30px);
        }

        .container-full {
            display: flex;
            margin: 15px;
            width: calc(100% - 30px);
        }

    /* END: contents */

    /* BEGIN: button-to-top */

        #backToTopBtn {
            background-color: var(--FIRST_COMP);
            -webkit-box-shadow: 0px 1px 5px 0px #8C8C8C;
            box-shadow: 0px 1px 5px 0px #8C8C8C;
            bottom: 40px;
            display: none;
            padding: 15px 16px;
            position: fixed;
            right: 15px;
            z-index: 99;
        }
            #backToTopBtn:hover {
                background-color: var(--FIRST_BASE);
            }

    /* END: button-to-top */

    /* BEGIN: pharmacy-picker */

        .pharmacy-picker .pharmacies {
            display: flex;
            gap: 30px;
        }

            .pharmacy-picker .pharmacies .pharmacy {
                align-items: flex-start;
                display: flex;
                flex: 1;
                flex-direction: column;
                gap: 15px;
            }

            .pharmacy .pharmacy-logo {
                max-height: 150px;
            }

            .pharmacy .pharmacy-details {
                flex-grow: 1;
            }

            .pharmacy-businesshours {
                display: flex;
                flex-direction: column;
                justify-content: start;
            }

                .pharmacy-businesshours .clock {
                    color: var(--FIRST_BASE);
                    font-weight: bold;
                }
                    .pharmacy-businesshours .clock:before {
                        content: "\f017";
                        font-family: 'FontAwesome';
                        margin-right: 10px;
                    }

                .pharmacy-businesshours .business-hours {
                    line-height: 1.6;
                    margin-bottom: 15px;
                }

                .pharmacy-businesshours .weekdays {
                    padding-right: 15px;
                }

                .pharmacy-links-items {
                    align-items: center;
                    display: flex;
                    flex-wrap: wrap;
                    gap: 15px;
                    margin: 15px 0px;
                    width: 100%;
                }

                    .pharmacy-links-items .item .icon {
                        align-items: center;
                        background-color: var(--THIRD_COMP);
                        border-radius: 50%;
                        color: var(--THIRD_BASE);
                        display: flex;
                        height: 64px;
                        justify-content: center;
                        text-align: center;
                        -ms-transition: .5s all;
                        -webkit-transition: .5s all;
                        transition: .5s all;
                        width: 64px;
                    }
                        .pharmacy1 .pharmacy-links-items .item .icon {
                            background-color: var(--PHARMACY1_THIRD_BASE);
                            color: var(--PHARMACY1_THIRD_COMP);
                        }
                        .pharmacy2 .pharmacy-links-items .item .icon {
                            background-color: var(--PHARMACY2_THIRD_BASE);
                            color: var(--PHARMACY2_THIRD_COMP);
                        }
                        .pharmacy3 .pharmacy-links-items .item .icon {
                            background-color: var(--PHARMACY3_THIRD_BASE);
                            color: var(--PHARMACY3_THIRD_COMP);
                        }

                        .pharmacy-links-items .item:hover .icon {
                            background-color: var(--THIRD_BASE);
                            color: var(--THIRD_COMP);
                        }
                            .pharmacy1 .pharmacy-links-items .item:hover .icon {
                                background-color: var(--PHARMACY1_THIRD_COMP);
                                color: var(--PHARMACY1_THIRD_BASE);
                            }
                            .pharmacy2 .pharmacy-links-items .item:hover .icon {
                                background-color: var(--PHARMACY2_THIRD_COMP);
                                color: var(--PHARMACY2_THIRD_BASE);
                            }
                            .pharmacy3 .pharmacy-links-items .item:hover .icon {
                                background-color: var(--PHARMACY3_THIRD_COMP);
                                color: var(--PHARMACY3_THIRD_BASE);
                            }

                    .pharmacy-links-items .item .cfa,
                    .pharmacy-links-items .item .fa,
                    .pharmacy-links-items .item .fab,
                    .pharmacy-links-items .item .far,
                    .pharmacy-links-items .item .fas {
                        font-size: 160%;
                    }

                .pharmacy-contact {
                   display: flex;
                   width: 100%;
                }

                    .pharmacy-contact .button,
                    .pharmacy-contact button {
                        flex: 1;
                        text-align: center;
                    }

            .pharmacy .pharmacy-slider {
                border-radius: 5px;
                flex: 1;
                margin-top: 15px;
                overflow: hidden;
            }

                .pharmacy .pharmacy-slider .slide-image {
                    height: 100%;
                    object-fit: cover;
                    width: auto;
                }

            .pharmacy-banner {
                border-radius: 5px;
                margin-top: 15px;
                overflow: hidden;
            }

    /* END: pharmacy-picker */

    /* BEGIN: service */

        .service {
            display: flex;
            gap: 30px;
        }

            .service .banner {
                display: flex;
                flex-direction: column;
                flex: 1;
            }

            .service .text {
                background-color: var(--THIRD_BASE);
                color: var(--THIRD_COMP);
                flex-grow: 1;
                padding: 15px;
            }

            .service .image img {
                object-fit: cover;
                overflow: hidden;
                height: 100%;
                width: 100%;
            }

    /* END: service */

    /* BEGIN: welcome */

        .container-centered.welcome {
            display: flex;
            flex-direction: row;
        }

            .welcome .portal-slider {
                width: 50%;
            }

            .welcome .container-box {
                display: flex;
                flex-direction: column;
                justify-content: center;
                padding: 30px;
                width: 50%;
            }

    /* END: welcome */

/* END: main */

/* BEGIN: footer */

    .footer {
        background-color: var(--FIFTH_BASE);
        color: var(--FIFTH_COMP);
        padding: 15px 0px;
        width: 100%;
    }

        .footer .container-centered {
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            margin: 0px auto;
            padding: 0px 0px;
        }

        .footer ul {
            align-items: center;
            display: flex;
            flex-direction: row;
        }

        .footer .disclaimer {
            align-items: center;
            display: flex;
            flex-direction: row;
            font-size: 80%;
            flex-grow: 1;
        }

        .social-media {
            display: flex;
            flex-direction: row;
            justify-content: flex-end;
        }

            .social-media .item {
                font-size: 140%;
            }

        .footer .item {
            color: var(--FIFTH_COMP);
            padding: 0px 15px;
        }

            .footer .item a {
                color: var(--FIFTH_COMP);
            }

                .footer .item:hover,
                .footer .item a:hover {
                    color: var(--FIFTH_COMP);
                }

/* END: footer */
