/*Custom Box by HokZ #41458 / #170947, commissioned by and written for felix#252394 and permitted to use by them ONLY.
Do not copy, edit, upload, redistrubute or use any bit of the code provided. It does not belong to you.*/
.MainContainer {
background-color: #00000063;
color: white !important;
border: 2px solid #999 !important;
max-width: 640px;
border-radius: 25px;
border-collapse: separate;
padding: 5px !important;
height: auto !important;
margin: 5px;
margin-bottom: 20px;
transition: box-shadow 1s ease-in-out;
}
.MainContainer .Header {
background-color: #151515;
font-size: 20px !important;
color: #505050 !important;
}
.MainContainer:hover {
box-shadow: 0px 0px 30px #333;
}
.ContentCover {
width: 100%;
display: flex;
overflow: hidden;}
.LeftContent {
height: 290px;
width: 50%;
overflow: auto;
margin: 5px 2.5px 5px 5px !important;
padding: 10px;
font-size: 13px;
text-align: left;
}
.ExpandCover {
width: 100%;
overflow: hidden;
}
.Expand {
background: #171717;
height: 50px;
width: 100%;
overflow: hidden;
margin-top: -10px;
border: 1px solid #ffffff29;
padding: 5px 5px 5px 10px;
transition: 1s;
}
.Expand:hover {
height: 150px;
transition: 1s;
}
.Expand h4 {
font-size: 18px !important;
margin-bottom: -7px;
color: #505050 !important;
}
.RightContent {
height: 290px;
width: 50%;
margin: 5px 5px 5px 2.5px !important;
padding: 10px;
font-size: 13px;
text-align: left;}
.TopLinks a {
letter-spacing: 0.5px;
transition: 1s !important;
margin-left: 50px;
margin-right: 50px;
}
.TopLinks a:hover,
.TopLinks a:active {
letter-spacing: 2px;
transition: 1s !important;
}
.TopLinks {
font-size: 15px;
text-align: center;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
margin-bottom: 2px;}
/*CodeSnippet for animated underline yoink'd from 30secondsofcode.org*/
.TopLinks a {
display: inline-block;
position: relative;}
.TopLinks a::before {
color: #999;
content: "▼";
position: absolute;
width: 100%;
transform: scaleX(0);
height: 1px;
top: -10px;
left: 0;
}
.TopLinks a:hover::before {
content: "▼";
position: absolute;
width: 100%;
transform: scaleX(1);
height: 1px;
top: -11px;
left: 0;
transition: transform 0.25s ease-out;
}
.TopLinks a::after {
content: '';
position: absolute;
width: 100%;
transform: scaleX(0);
height: 1px;
bottom: 0;
left: 0;
background-color: #999;
transition: transform 0.25s ease-out;
}
.TopLinks a:hover::after {
transform: scaleX(1);
transform-origin: bottom center;}
.credit {
text-align: right;
margin-right: 15px;
font-size:5px;
transition: 1s;}
.credit:hover {
font-size: 12px;
transition: 1s;
text-decoration: unerline;
letter-spacing: 2px;}
.credit a {
color: #515151 !important;}
.credit a:hover {
color: #ffffff !important}
.LeftContent::-webkit-scrollbar,
.RightContent::-webkit-scrollbar,
.Expand::-webkit-scrollbar {
display: none;
}