/* No Idea */
/*
Flag Colors
-----------------
Orange: CE5C17
Yellow: FED700
Red: BF0A30
Blue: 002868
-----------------
*/

/* Load Fonts */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,400;0,700;1,400&display=swap');

/* Body and HTML Defaults */
body, html { padding: 0px; margin: 0px; }
html { min-height: 100%; overflow-x: hidden; }
body { 
    background: #1e1e1e; color: #EFEFEF; 
    font-size: 14px; font-family: 'Open Sans', sans-serif;
    line-height: 26px; letter-spacing: 0.5px;
}

h1 { font-size: 46px; }
h2 { font-size: 38px; }


.fixed { max-width: 1024px; }
.center { margin-left: auto; margin-right: auto; }

.fullpage { min-height: 100vh; }

/* Bio Section Setup */
section.bio { position: relative; overflow: auto; }
    section.bio:after {
        opacity: 0.25;
        background-attachment: fixed; background-size: cover;
        background-repeat: no-repeat; background-position: center;
        top: 0px; right: 0px; bottom: 0px; left: 0px;
        position: absolute;
        content: ""; z-index: 1;
    }
    @media all and (max-width: 10000px) { section.bio.car:after { background-image: url(https://repo.mydudeaz.me/image/placeholder.jpg); } }
    @media all and (max-width: 1000px) { section.bio.car:after { background-image: url(https://repo.mydudeaz.me/image/placeholder-480.jpg); } }
    @media all and (max-width: 500px) { section.bio.car:after { background-image: url(https://repo.mydudeaz.me/image/placeholder-240.jpg); } }
    /* Bio Articles */
    section.bio article {
        text-align: center; z-index: 3;
        padding: 5vh 10px 50px; position: relative;
        min-height: 50vh;
    }
        /* Bio:Avatar */
        section.bio article .avatar {
            display: inline-block; background: #3e3e3e;
            width: 350px; height: 350px; margin: 0px 0px 20px 0px;
            border-radius: 600px; border: 10px solid rgba(191,10,48,1.0);
            box-shadow: 0px 0px 15px -5px #000; transition: all 0.35s ease;
        }
            section.bio article .avatar:hover { border-color: rgba(254,215,0,1.00); }
            section.bio article .avatar > img { 
                width: 350px; height: 350px; display: block; 
                border-radius: 600px; background: #EFEFEF;
            }
        /* Bio:Content */
        section.bio article h1, section.bio article h2 { margin: 0px; padding:  25px 0px 50px; }
        section.bio article p { font-size: 24px; line-height: 34px; text-align: left; padding: 10px 15px; }
        /* Bio:List */
        section.bio article ul.list { list-style: none; padding: 0px; margin: 0px; overflow: hidden;}
            /* section.bio article ul.list li { display: inline-block; margin: 5px; } */ 
            section.bio article ul.list li { 
                display: inline-block; margin: 5px; padding: 18px 28px; 
                font-weight: 700; text-transform: uppercase; text-decoration: none; font-size: 18px;
                border: none; border-radius: 50px 0px; box-shadow:  5px 5px 10px -5px #1e1e1e;
                background: rgba(0,40,104,0.50); transition: all 0.35s ease;
                cursor: pointer;
            }
            section.bio article ul.list li:hover { background: rgba(206,92,23,0.75); border-radius: 25px 0px; }
        /* Bio:Social */
        section.bio article ul.social { }
            section.bio article ul.social li { background: rgba(191,10,48,0.75); }
                section.bio  article ul.social li:hover { background: rgba(191,10,48,1.00); border-radius: 0px 25px; }
            section.bio article ul.social a { text-decoration: none; color: #F3F3F3; }