body {
    margin: 0;
    background-image: url('../../media/zebralodge/bg.jpg');
    background-size: cover;
    height: 100vh;
    background-position: center;
    font-family: sans-serif, serif !important;
}

h1,h2,h3,h4,h5,h6 {
    font-family: "Poppins-Regular", sans-serif, serif !important;
    color: #444444 !important;
}

p,
span,
input,
label {
    font-family: sans-serif, serif !important;
}

@font-face {
    font-family: 'Poppins-Regular';
    src: url('../../fonts/Poppins-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

.primary-btn {
    width: 30%;
    background-color: #0698D5 !important;
    color: white !important;
    border-color: #0698D5 !important;
    /*border-radius: 10px !important;*/
    font-family: 'Poppins-Regular', serif !important;
    box-shadow: 4px 4px 6px #000000;
}

.primary-btn:hover {
    background-color: #0582b7 !important;
    color: white !important;
    border-color: #0582b7 !important;
}

.secondary-btn {
    width: 30%;
    background-color: #0698D5 !important;
    color: white !important;
    border-color: #0698D5 !important;
    /*border-radius: 10px !important;*/
    font-family: 'Poppins-Regular', serif !important;
    box-shadow: 4px 4px 6px #000000;
}

.secondary-btn:disabled,
.delete-btn:disabled {
    background-color: #f7f7f7;
    color: lightgrey;
    border-color: darkgrey;
    box-shadow: none;
}

.secondary-btn:hover {
    background-color: #0582b7 !important;
    color: white !important;
    border-color: #0582b7 !important;
}

.delete-btn {
    background-color: rgb(255, 28, 28);
    color: white;
    border: 1px solid rgb(255, 28, 28);
    /*border-radius: 10px;*/
    box-shadow: 4px 4px 6px #000000;
}

.delete-btn:hover {
    background-color: white;
    color: rgb(255, 28, 28);
    border-color: rgb(255, 28, 28);
}

/* ---- region APPBAR COMPONENT ---- */
.menu-appbar {
    background-color: #FFFFFF;
}

.header-logo {
    width: 140px !important;
}

.header-pages-btn {
    color: #0698D5 !important;
    /*font-weight: bold;*/
    border: none;
    background-color: transparent;
    font-family: 'Barlow-Regular', serif !important;
    font-size: larger;
    text-transform: capitalize;
    /*box-shadow: none;*/
}

.header-pages-btn:hover {
    color: #0582b7 !important;
}

.header-profile-avatar {
    border: 1px solid #0698D5;
}

.header-profile-login-btn {
    color: #0698D5;
}

.header-profile-login-btn:hover {
    color: #0582b7;
}

.header-mb-menu-icon,
.header-mb-menu-ico-chev-left,
.header-login-icon,
.header-menu-contact-ico.tel:hover,
.header-menu-contact-ico.facebook:hover,
.header-menu-contact-ico.instagram:hover,
.header-menu-contact-ico.youtube:hover,
.header-menu-contact-ico.linkedin:hover {
    color: #0582b7;
}

.header-mb-menu-ico-chev-left {
    color: #0582b7;
}

.header-mb-menu-icon:hover,
.header-mb-menu-ico-chev-left:hover,
.header-login-icon:hover,
.header-tb-menu-icon.share:hover {
    color: #0582b7;
    transform: scale(1.2);
}

.header-tb-menu-icon.share,
.header-menu-contact-ico.tel,
.header-menu-contact-ico.facebook,
.header-menu-contact-ico.instagram,
.header-menu-contact-ico.youtube,
.header-menu-contact-ico.linkedin {
    color: #0582b7;
}

.header-tb-menu-icon.share:hover,
.header-menu-contact-ico.tel:hover,
.header-menu-contact-ico.facebook:hover,
.header-menu-contact-ico.instagram:hover,
.header-menu-contact-ico.youtube:hover,
.header-menu-contact-ico.linkedin:hover {
    color: #0582b7;
    transform: scale(1.2);
}

.drawer-contact-wrapper button .header-menu-contact-ico.tel,
.drawer-contact-wrapper button .header-menu-contact-ico.facebook,
.drawer-contact-wrapper button .header-menu-contact-ico.linkedin,
.drawer-contact-wrapper button .header-menu-contact-ico.instagram,
.drawer-contact-wrapper button .header-menu-contact-ico.youtube {
    color: #0582b7;
}

.drawer-contact-wrapper button .header-menu-contact-ico.tel:hover,
.drawer-contact-wrapper button .header-menu-contact-ico.facebook:hover,
.drawer-contact-wrapper button .header-menu-contact-ico.linkedin:hover,
.drawer-contact-wrapper button .header-menu-contact-ico.instagram:hover,
.drawer-contact-wrapper button .header-menu-contact-ico.youtube:hover {
    color: #0582b7;
    transform: scale(1.2);
}

.drawer-menu-list-item {
    transition: color 50ms, background 500ms;
}

.drawer-menu-list-item:hover {
    background-color: #0582b7;
}

.drawer-menu-list-item:hover svg,
.drawer-menu-list-item:hover p {
    color: white;
}

/* ---- region-end APPBAR COMPONENT ---- */


/* ---- region FOOTER COMPONENT ---- */
.footer {
    background: #FFFFFF00;
    border-color: black;
}
.footer:hover {
    background-color: rgba(0, 0, 0, 0.78);
}

.footer:hover span {
    color: white;
}

/* ---- region-end FOOTER COMPONENT ---- */



/* ---- region SIGN IN/UP COMPONENT ---- */

.signin-wrapper,
.signin-box-wrapper,
.signup-wrapper {
    background-color: #FFFFFF;
    box-shadow: 4px 4px 6px #000000;
}

.signin-logo,
.signup-logo {
    width: 180px;
    height: auto;
}

.signin-title,
.signup-title {
    font-weight: bold;
}

/*.signin-email-input,*/
/*.signin-password-input,*/
/*.signup-name-input,*/
/*.signup-lastname-input,*/
/*.signup-email-input,*/
/*.signup-password-input {*/
/*    background-color: #bdd73c;*/
/*}*/

/*.signin-form-link:hover,*/
/*.signup-form-link:hover {*/
/*    font-weight: bold;*/
/*}*/

.signin-box-wrapper {
    background: rgb(255, 255, 255);
}

/* ---- region-end SIGN IN/UP COMPONENT ---- */


/* ---- region LOADING ANIMATION COMPONENT ---- */
.loading-anim-container {
    background: rgba(0, 0, 0, 0.78);
}

.loading-anim-image-text {
    color: #ffffff !important;
}

.loading-anim-image-icon {
    width: 250px;
    height: auto;
}

.lds-ellipsis div {
    background: #ffffff;
}

/* ---- region-end LOADING ANIMATION COMPONENT ---- */