/* BODY + XP WALLPAPER */

body{
margin:0;
font-family:Tahoma, Verdana, sans-serif;

background-image:url("Winxp.png");
background-size:cover;
background-position:center;
background-repeat:no-repeat;
background-attachment:fixed;
}

/* DESKTOP */

.desktop{
padding:40px;
}

/* WINDOWS */

.window{
width:500px;
background:#ECE9D8;
border:2px solid #0054E3;
box-shadow:4px 4px 8px rgba(0,0,0,0.5);
margin-bottom:25px;
}

.window.small{
width:300px;
}

/* POSITION ABOUT WINDOW */

.about-window{
position:fixed;
left:20px;
bottom:50px; 
}

/* TITLEBAR */

.titlebar{
background:linear-gradient(#3a8cff,#0046c7);
color:white;
padding:4px 8px;
display:flex;
justify-content:space-between;
align-items:center;
font-weight:bold;
font-size:14px;
}

.tray{
display:flex;
align-items:center;
gap:6px;
margin-right:8px;
}

.tray img{
width:16px;
height:16px;
image-rendering:pixelated;
}

/* BUTTONS */

.buttons{
display:flex;
gap:4px;
}

.btn{
background:#dcdcdc;
border:1px solid #888;
padding:0 5px;
font-size:12px;
cursor:pointer;
}

.btn.red{
background:#ff5c5c;
color:white;
}

/* CONTENT */

.content{
padding:12px;
font-size:14px;
}

/* LINKS */

a{
color:#003399;
text-decoration:none;
}

a:hover{
text-decoration:underline;
}

/* TASKBAR */

.taskbar{
position:fixed;
bottom:0;
left:0;
width:100%;
height:34px;
background:linear-gradient(#3c8df5,#245edb);
display:flex;
align-items:center;
color:white;
font-weight:bold;
}

/* START BUTTON */

.start{
background:linear-gradient(#4bd94b,#1fa21f);
padding:6px 16px;
margin-left:6px;
border-radius:3px;
box-shadow:inset 0 0 3px rgba(0,0,0,0.5);
cursor:pointer;
}

/* TASK */

.task{
background:#4a80ff;
padding:5px 14px;
margin-left:10px;
border-radius:3px;
}

/* CLOCK */

.clock{
margin-left:auto;
margin-right:10px;
}