/*
AUTHOR BY DeMorMr  | https://github.com/DeMorMr
Want to help us? Join to our server!
*/

*{cursor:url(data/main/ArrowCursor.png) 40 40, auto !important;}

@font-face {font-family:"Comic-Sans-MS";font-display:swap;src:url("data/main/Comic-Sans-MS.woff2")format("woff2")}
@font-face {font-family:"geo_1";font-display:swap;src:url("data/main/microsoftsansserif.woff2")format("woff2")}
body {max-width:900px;margin:0 auto;padding:20px;
 background-image:url('data/main/loading.webp');
 font-family:Comic-Sans-MS, sans-serif;
 image-rendering:pixelated;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  background-attachment:fixed;
  transition:all 0.5s ease-in-out;
}

header {border:1px solid #010101;text-align:center;width:900px;height:70px;} header img{margin-top:5px;}
.banner{background-image:url('data/main/loading.webp');background-size:cover;background-position:center;background-repeat:no-repeat;
transition:all 0.5s ease-in-out;
}

footer{font-family:Arial;font-size:10px;text-align:center;padding-top:10px;}
container{display:flex;gap:10px;}
a{text-decoration:none;color:#2900ff;}

.unselectable {-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}

.upload{border:1px solid #010101;width:150px;height:150px;font-size:11px;background-color:#eeeeee;margin-top:10px;}
.center{text-align:center;}
.center div{background-color:#eeeeee;border:1px solid #010101;opacity:0.7;border-top:none;}
.center a{background-color:#eeeeee;border:1px solid #010101;opacity:0.7;border-bottom:none;}

.content-section{display: none;}

.upload .css{padding:0px 5px 0px;}
.upload .t{border-bottom:1px solid #010101;background-color:#cccccc;width:100%;height:20px;text-align:center;}
.upload tt{font-family:Arial;letter-spacing:2px;}
.upload img{margin-top:90px;}

.block{background-color:#eeeeee;border:1px solid #010101;width:750px;height:530px;font-size:12px;margin-top:10px;color:#333333;} /*height:475px;*/
.block ht{font-size:25px;padding:0px 10px 0px;font-weight:bold;}
.block hd{font-size:15px;padding:0px 10px 0px;font-weight:bold;}

.container{background-color:#ffffff;font-family:Arial;width:718px;height:425px;padding:10px;text-align:center;} /*border: 1px solid #010101;height:370px;*/
.place{width:115px;height:95px;display:inline-block;padding:0px 10px 50px;overflow-wrap:break-word;vertical-align:top;text-align:left;} /* border: 1px solid red;*/
.place img{aspect-ratio:16/10;width:115px;border:1px solid #010101;}
.place t{font-size:12px;color:#2900ff;font-weight:bold;} /* border: 1px solid #010101;*/
.place desc{font-size:9px;} /*10px*/

.cool{
  background-image:url("data/main/every_old_roblox_assets_ever__2006_2014_esque_by_arodiguezb_dj5puy7.webp");background-position:center;background-repeat:no-repeat;background-size:100%;
  border:1px solid #010101;width:100%;height:90px;margin-top:10px;position:relative;} /*padding:5px;*/
.cool .tb{font-size:12px;color:#333333;display:inline-block;padding:5px 10px 0px;} /*border:1px solid red;*/
.cool .d{border-right:1px solid #010101;background-color:#bbbbbb;width:161px;height:100%;}
.cool .title{font-size:15px;}
.cool .desc{margin-top:10px;line-height:1;}

.UserPlaces{width:730px;height:90px;position:absolute;top:0;left:170px;align-items:center;gap:20px;justify-content:center;display:flex;} /*gap:10px;  border:1px solid blue;*/
.UserPlace{aspect-ratio:16/10;width:115px;display:inline-block;}
.UserPlace img{aspect-ratio:16/10;width:115px;border:1px solid rgba(255, 255, 255, 0.5);}

.empty-message {font-family:"geo_1", Arial;align-items:center;padding:50px;font-size:18px;color:#666;margin:20px auto;max-width:500px;}

#categories-container {margin-top:5px;max-height:50px;overflow-y:auto;border:1px solid #010101;padding:5px;}
.categories-list {display: flex;flex-direction: column;gap:5px;}
.category-item {height:10px;display:flex;justify-content:space-between;align-items:center;padding:5px;background:white;border:1px solid #010101;}
#categories-container[style*="none"] + #manageCategoriesBtn {display:block;}

.pagination {display:flex;justify-content:center;align-items:center;gap:10px;margin:0px 0;}
.pagination button:disabled{opacity:0.5;cursor:not-allowed;}

input{background-color:#ffffff;width:100%;max-width:500px;max-height:20px;box-sizing:border-box;font-size:10px;border:none;border:2px solid #777777;outline:none;border-style:dashed;}
input:focus{border-radius:5px;border:2px solid #101010;}

select{border-radius:none;background-color:#ffffff;font-family:'geo_1', Arial;max-height:15px;max-width:95px;font-size:10px;border:2px solid #777777;border-style:dashed;}
select:focus{background-color:#6e99c9;color:white;}

button{border:none;border:1px solid #777777;margin-top:5px;background:#ffffff;color:#777777;font-size:10px;min-width:40px;min-height:20px;}
button:hover{background:#6e99c9;color:#ffffff;text-decoration:underline;border:1px solid #000000;}

.music-player{background-image:url('data/main/banners/');background-size:cover;background-position:center;background-repeat:no-repeat;margin-top:10px;}
.track-info {border:1px solid #010101;height:5px;overflow:hidden;position:relative;background:rgba(0,0,0,0.2);padding:10px;}
.track-name {
  text-shadow:-1px 0 0 red,0 -1px 0 red,1px 0 0 red,0 1px 0 red; 
  font-size:20px;font-family:'geo_1', Arial;color:white;background-image:url('data/main/banners/old-roblox-banners-v0-ioau0u85om7b1.webp');background-size:cover;background-position:center;background-repeat:no-repeat;position:absolute;white-space:nowrap;animation:moveText 15s linear infinite;margin-top:-8px;}
.controls {display:flex;justify-content:space-between;}
.volume-container {display:flex;align-items:center;gap:10px;}
.progress {height: 4px;background: black;border: 1px solid red;margin-top: 5px;overflow: hidden;position: relative;}
.progress-bar {height:100%;width:0%;background:red;transition:width 0.1s;}

.information {width:880px;height:10px;overflow:hidden;position:relative;background:#6e99c9;padding:10px;border:1px solid #010101;border-top:none;margin-top:10px;}
.information-text {position:absolute;white-space:nowrap;animation:moveText 15s linear infinite;margin-top:-7px;color:white;}
.information-text a:hover{text-decoration:underline;}
.information a{color:white;}
@keyframes moveText{0%{left:100%;transform:translateX(0);}100%{left:0;transform:translateX(-100%);}}

canvas {position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:9999;}

.event-indicator {height: 100%;background: rgba(255, 255, 255, 0.3);position: absolute;top: 0;left: 0;}