/* global css */

/* http://meyerweb.com/eric/tools/css/reset/ 
    v2.0 | 20110126
    License: none (public domain)
*/

@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;500;600;700&family=Open+Sans:wght@300;400;500;600&family=Roboto:wght@400;500;700&display=swap');
/* font-family: 'Lato', sans-serif;
font-family: 'Open Sans', sans-serif;
font-family: 'Roboto', sans-serif; */

:root {
    --accent: #FF3300;
    --green: #11b7b5;
    --green-hover: #0E9795;
    --accent-hover: #C53815;
    --primary: #11b7b5;
    --primary-hover: #0E9795;
    --background-blue:#E7F8F8;
    --gray:rgb(206, 206, 206);
    --lato:'Lato', sans-serif;
    --openSans:'Open Sans', sans-serif;
}


body {
    background: white;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    overflow-x:hidden;
}

/* width */
::-webkit-scrollbar {
    width: 10px;
    /* opacity: 0.5; */
}

/* Track */
::-webkit-scrollbar-track {
background: #f1f1f1;
opacity: 0.5;
}

/* Handle */
::-webkit-scrollbar-thumb {
background: var(--primary);
border-radius: 10px;

}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
background: var(--primary-hover);
opacity: 1;
}

h1, h2, h3, h4, h5 {
    font-family: 'Lato', sans-serif;
    font-weight: 700;
}

a {
    text-decoration: none;
    color: black;

    /* modified code */
    /* width: 100%; */
}

a:hover {
    cursor: pointer;
    text-decoration: none;
}

.gray{
    color: var(--gray);
}
.primary {
    color: var(--primary)!important;
}

.accent {
    color: var(--accent)!important;
}

/* button */
.green-button, .primary-button {
    background-color: var(--primary);
    color: white;
    padding: 6px 10px;
    border-radius: 8px;
    margin: 10px;
}

.green-button a,
.accent-button a{
    color:white;
}

.accent-button, .accent-button {
    background-color: #FF3300;
    color: white;
    padding: 6px 10px;
    border-radius: 8px;
    margin: 10px;
}

.text-underline {
    text-decoration: underline;
}

a.green-button, a.accent-button, a.primary-button, a.accent-button {
    color: white;
}

.green-button:hover, .primary-button:hover {
    background-color: var(--primary-hover);
    color: white;
}

.green-button:hover a, .primary-button:hover a {
    text-decoration: none;
}

a.green-button:hover, a.primary-button:hover {
    text-decoration: none;
}

.accent-button:hover, .accent-button:hover {
    background-color: #C53815;
    color: white;
}

ul {
    list-style: none;
}

/* video title */
.player .vp-title{
    display: none!important;
}

@media (max-width:400px) {
    .page-header .text{
        padding-left: 40px;
        padding-right: 40px;
    }
    .page-header-title{
        padding-left: 40px;
        padding-right: 40px;
    }
    .page-header .text p{
        /* text-align: justify; */
    }
}
