html[data-theme="light"] {
    /* Variables */
    --primary-dark: rgb(32, 32, 32);
    --primary-light: rgb(242, 240, 235);
    --accent: #1558B0;
    --accent-light: #59F2FF;
    --text-dark: rgb(45, 45, 45);
    --text-light: rgb(245, 245, 245);

    /* Section backgrounds */
    section:nth-of-type(odd):not(:first-of-type) {
        background: url(backgrounds/Light-blue-marble-bg.jpg);
        background-size: cover;
        background-position: center;
        color: var(--text-dark);
        /* clip-path: polygon(0% 0%, 100% 0%, 100% 90%, 50% 95%, 0% 100%); */
    }

    section:nth-of-type(even) {
        background: url(backgrounds/White-marble.jpg);
        background-size: cover;
        background-position: center;
        color: var(--text-dark);
    }

    /* Colors for links*/
    #header-text a { color: var(--accent-light); }

    a{color:#82008F};

    span { color: var(--accent); }

    /* Text shadows */
    h1, h2, h3, .sub-title {
        text-shadow: 0.1rem 0.1rem 0.2rem rgba(0, 0, 0, 0.3);
    }

    nav ul li a, #header-text h1,
    #header-text h2,
    #header-text h3 {
        text-shadow: 0.1rem 0.1rem 0.3rem rgba(0, 0, 0, 0.5);
    }

    /* Navigation -- same color as header links*/
    nav ul li a { color: #fff; }
    nav ul li a::after { background: var(--accent-light); }

    .tab-links::after { background: var(--accent); }

    /* Header */
    #header { color: var(--text-light); }

    /* Images and shadows */
    .about-col-1 img {
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
    }

        #other img {
        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
    }


    /* Buttons */
    .btn {
        background-color: rgb(238, 230, 215);
        color: var(--text-dark);
        border-color: var(--primary-dark);
        border: 0.18rem solid;
    }
    .btn:hover {
        background: #FF0000;
        border-color: var(--primary-dark);
        box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
    }

    /* Forms */
    form input, form textarea {
        border: 0.18rem solid;
        background: rgba(245,245, 245, 0.9);
        color: var(--text-dark);
    }

    .btn .btn2:hover{
        background: #000;
    }

    .copyright { background: var(--primary-light); }

    /* Mobile/responsive specific theme colors */
    @media only screen and (max-width: 600px) {
        
        .btn{
            border: 1px solid;
        }

        form textarea, form input {
            border: 1px solid;
        }
    }
}