html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
    vertical-align: baseline;
    
}

#img_Sun {
    width: 550px;
    position : sticky;
    left : 31.5%;
    top: 17%;
}
#img_Moon{
    width: 180px;
    position : sticky;
    top: 5%;
    left : 85%;
}
.img_buliding{
    width: 100%;
    position: absolute;
    height: 246px;
    bottom: 0px;
    left: 0px;
}
 #img_backcolor{
    height: 100vh;
    background: linear-gradient( rgb(241, 102, 9),rgb(238, 170, 24),rgb(248, 223, 0));
    
 }
 #img_backcolor_2{
    display: none;
    height: 100vh;
    background: linear-gradient( rgb(4, 0, 36),rgb(3, 6, 145),rgb(77, 106, 231));
    
 }
.jangjuyoung{
     position: absolute;
     top:35%; 
     left:40%;
     transform: skew(-20deg);
     font-size:4rem;
     color: white;
     font-size: 200%;
     /* display: block; */
     animation: fadeinout 2s  infinite;
}
.Day_Night_select{
    position: absolute;
    top: 5px;
    left: 5px;
}

#Day_Night_select_2{
    display: flex;
    flex-direction: column;
    position: sticky;
    /* justify-content: flex-end; */
    align-items: flex-end;
    top: 35%;
    margin-right: 3%;
    
    /* background-color: black; */
    
}
#Day_Night_select_2>button{
    width: 5%;
    height: 10vh;
    margin-bottom: 5px;
    font-weight: 600;
}
@keyframes fadeinout{
    0%{opacity: 0.1;}
    10%{opacity: 0.5;}
    20%{opacity: 0.7;}
    30%{opacity: 1.3;}
    40%{opacity: 1.3;}
    50%{opacity: 1.3;}
    60%{opacity: 1.3;}
    80%{opacity: 0.5;}
    90%{opacity: 0.3;}
    100%{opacity: 0.1;}
}

.article_about .fadeinleft{
    opacity:0;
    margin-left:-300px;    
    max-width:100%;
}


.article_skills .fadeinleft_2 {
    opacity:0;
    margin-left:-300px;    
    max-width:100%;
}

#article_project_1{
    opacity:0;
    margin-left:-300px;    
    max-width:100%;
}
@media(max-width:449px){
    #img_Sun{
        width: 250px;
    }
    #Day_Night_select_2{
        display: none;
    }
}