.logo-font {font-family: 'Gochi Hand', cursive;}
.marker-font {font-family: 'Permanent Marker', cursive;}
blockquote {font-style: italic;  margin-left: 32px; font-family: Georgia, "Times New Roman", serif;}

body { padding-top: 60px; }
.no-decoration { text-decoration: none !important; }


.shadow { box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19); }

/* #007bff */
.bg-primary-l50 { background-color: #ffffff!important; }
.bg-primary-l40 { background-color: #cce5ff!important; }
.bg-primary-l30 { background-color: #99caff!important; }                    
.bg-primary-l20 { background-color: #66b0ff!important; }
.bg-primary-l10 { background-color: #3395ff!important; }
.bg-primary-d10 { background-color: #0062cc!important; }
.bg-primary-d20 { background-color: #004a99!important; }
.bg-primary-d30 { background-color: #003166!important; }
.bg-primary-d40 { background-color: #001933!important; }


/* #868e96 */
.bg-secondary-l40 { background-color: #f3f4f5!important; }
.bg-secondary-l30 { background-color: #d8dadd!important; }                    
.bg-secondary-l20 { background-color: #bdc1c5!important; }
.bg-secondary-l10 { background-color: #a1a7ae!important; }
.bg-secondary-d10 { background-color: #6c747d!important; }
.bg-secondary-d20 { background-color: #555b61!important; }
.bg-secondary-d30 { background-color: #3d4146!important; }
.bg-secondary-d40 { background-color: #25282b!important; }
.bg-secondary-d50 { background-color: #0d0e10!important; }

/* #28a745 */
.bg-success-l50 { background-color: #d8f6df!important; }
.bg-success-l40 { background-color: #afecbd!important; }
.bg-success-l30 { background-color: #86e29b!important; }                    
.bg-success-l20 { background-color: #5dd879!important; }
.bg-success-l10 { background-color: #34ce57!important; }
.bg-success-d10 { background-color: #1e7e34!important; }
.bg-success-d20 { background-color: #145523!important; }
.bg-success-d30 { background-color: #0a2c12!important; }
.bg-success-d40 { background-color: #010201!important; }

/* #dc3545 */
.bg-danger-l40 { background-color: #fae3e5!important; }
.bg-danger-l30 { background-color: #f3b7bd!important; }                    
.bg-danger-l20 { background-color: #eb8c95!important; }
.bg-danger-l10 { background-color: #e4606d!important; }
.bg-danger-d10 { background-color: #bd2130!important; }
.bg-danger-d20 { background-color: #921925!important; }
.bg-danger-d30 { background-color: #66121a!important; }
.bg-danger-d40 { background-color: #3b0a0f!important; }
.bg-danger-d50 { background-color: #0f0304!important; }

/* #ffc107 */
.bg-warning-l40 { background-color: #fff4d3!important; }
.bg-warning-l30 { background-color: #ffe7a0!important; }                    
.bg-warning-l20 { background-color: #ffda6d!important; }
.bg-warning-l10 { background-color: #ffce3a!important; }
.bg-warning-d10 { background-color: #d39e00!important; }
.bg-warning-d20 { background-color: #a07800!important; }
.bg-warning-d30 { background-color: #6d5200!important; }
.bg-warning-d40 { background-color: #3a2b00!important; }
.bg-warning-d50 { background-color: #070500!important; }

/* #17a2b8 */
.bg-info-l25 { background-color: #63d9eb!important; }
.bg-info-l10 { background-color: #1fc8e3!important; }
.bg-info-d10 { background-color: #117a8b!important; }
.bg-info-d25 { background-color: #093e47!important; }

.wmax-1024 { max-width: 1024px; }
.wmax-800 { max-width: 800px; }
.wmax-600 { max-width: 600px; }
.wmax-550 { max-width: 550px; }
.wmax-500 { max-width: 500px; }
.wmax-400 { max-width: 400px; }
.wmax-200 { max-width: 200px!important; }



.wmin-400 { min-width: 400px; }
.wmin-350 { min-width: 350px; }
.wmin-200 { min-width: 200px; }




.vh-100{ min-height: 100vh; }
.vh-80{ min-height: 80vh; }
.vh-50{ min-height: 50vh; }


.op-0 { opacity: 0.0; }
.op-20 { opacity: 0.2; }
.op-40 { opacity: 0.4; }
.op-60 { opacity: 0.6; }
.op-80 { opacity: 0.8; }
.op-100 { opacity: 1.0; }


.algo { white-space:pre-wrap; font-family: "Lucida Console", Monaco, monospace; line-height: 300%;}


/* Extra small device ( less than 576px) */
h1{ font-size: 2.0rem; }
h2{ font-size: 1.4rem; }
h3{ font-size: 1.3rem; }
h4{ font-size: 1.2rem; }
h5{ font-size: 1.1rem; }
h6{ font-size: 1.0rem; }
.font-lg { font-size: 2.0rem; }
.font-md { font-size: 1.0rem; }
.font-sm { font-size: 0.8rem; }
.MathJax { font-size: 1.2rem!important; }
.MathJax_Display { font-size: 0.6rem; }

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
    h1{ font-size: 2.2rem; }
    h2{ font-size: 1.5rem; }
    h3{ font-size: 1.4rem; }
    h4{ font-size: 1.3rem; }
    h5{ font-size: 1.2rem; }
    h6{ font-size: 1.1rem; }
    .font-lg { font-size: 2.2rem; }
    .font-md { font-size: 1.1rem; }
    .font-sm { font-size: 0.82rem; }
    /*.MathJax { font-size: 1.8rem!important; }*/
    .MathJax_Display { font-size: 1.0rem; }
}

/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) { 
    h1{ font-size: 2.6rem; }
    h2{ font-size: 2.2rem; }
    h3{ font-size: 2.0rem; }
    h4{ font-size: 1.8rem; }
    h5{ font-size: 1.6rem; }
    h6{ font-size: 1.4rem; }
    .font-lg { font-size: 2.6rem; }
    .font-md { font-size: 1.4rem; }
    .font-sm { font-size: 0.85rem; }
/*    .MathJax { font-size: 2.0rem!important; } */
    .MathJax_Display { font-size: 1.6rem; }
}

/* Large devices (desktops, 992px and up) */
@media (min-width: 992px) { 
    h1{ font-size: 2.8rem; }
    h2{ font-size: 2.2rem; }
    h3{ font-size: 2.0rem; }
    h4{ font-size: 1.8rem; }
    h5{ font-size: 1.6rem; }
    h6{ font-size: 1.4rem; }
    .font-lg { font-size: 2.8rem; }
    .font-md { font-size: 1.4rem; }
    .font-sm { font-size: 0.88rem; }
/*    .MathJax { font-size: 2.2rem!important; } */
    .MathJax_Display { font-size: 2.0rem; }
    .card-columns{ column-count: 4; }
}

/* Extra large devices (large desktops, 1200px and up) */
@media (min-width: 1200px) { 
    h1{ font-size: 3.4rem; }
    h2{ font-size: 2.2rem; }
    h3{ font-size: 2.0rem; }
    h4{ font-size: 1.8rem; }
    h5{ font-size: 1.6rem; }
    h6{ font-size: 1.4rem; }
    .font-lg { font-size: 3.4rem; }
    .font-md { font-size: 1.4rem; }
    .font-sm { font-size: 0.9rem; }
/*    .MathJax { font-size: 2.4rem!important; } */
    .MathJax_Display { font-size: 2.4rem; }
    .card-columns{ column-count: 5; }
}