BetterPonyTown by mcgames75

/* ==UserStyle==
@name           BetterPonyTown
@namespace      github.com/KornineQ/BetterPonyTown
@version        1.0.0
@description    Changes Style of Pony.Town only!
@author         KornineQ
==/UserStyle== */
@-moz-document domain("pony.town") {
@import url('https://fonts.googleapis.com/css2?family=Rubik&family=Ubuntu&display=swap');

/* button animation */
.chat-line-name {
	color: #9e9e9eeb
}
.action-bar {
	transform: scale(0.9);
	width: 200%
}
button {
    font-family: 'Rubik', sans-serif;
	opacity: 0.7;
	transition: 0.05s !important;
}
button:hover {
    font-family: 'Rubik', sans-serif;
	opacity: 1;
	transform: translateY(-0.4em)scale(1.1)
}

/* #chat-input{
    transition: 0.3s;
    transform: translateY(0em);
}
#chat-input:hover{
    transform: translateY(0em)
}

 */
/* usernamebox */
.pony-box-rect {
	background-color: #ffffff75 !important;
	border: 1px solid #fff;
	backdrop-filter: blur(10px);
	transition: 0.3s;
}
.pony-box-rect:hover {
	background-color: #ffffff8f !important;
	border: 1px solid #ffffff8a;
}

.chat-line:last-child {
    font-family: 'Rubik', sans-serif;
	font-size: 18px !important;
}
.chat-line:hover {
    font-family: 'Rubik', sans-serif;

	font-weight: bold;
	box-shadow: 0 0 10px #00000073;
	border-radius: 5px;
	backdrop-filter: blur(10px);
}

.pony-menu {
    font-family: 'Rubik', sans-serif;
	box-shadow: 0 0 10px #00000073;
	border-radius: 5px;
	backdrop-filter: blur(10px);
}
    
#_ngcontent-phs-c104 {
	box-shadow: 0 0 10px #00000073;
	border-radius: 5px;
	backdrop-filter: blur(10px);
}

.chat-line-message {
    font-family: 'Rubik', sans-serif;
	font-weight: bold;
	border-radius: 5px;
	backdrop-filter: blur(10px);
}

.chat-log-content {
	opacity: 0.05;
	background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
	/* 	backdrop-filter: blur(10px); */
	transition: 0.3s;
}

.chat-textarea-wrap{
	box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
    background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
}

.chat-log-tab {
    background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}

#svg {
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}

span {
    font-family: 'Rubik', sans-serif;
}
.dropdown-item {
    background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}
    
.maps-modal, actions-modal, toys-modal, settings-modal, character-modal {
    background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}

.slider-bar-control {

	border: 1px solid #9f9f9f;
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}

.btn {
    background-color: #2b2b2b36 !important;
	border: 1px solid #9f9f9f;
    box-shadow: 0 0 10px #00000073;
    font-family: 'Rubik', sans-serif;
}

.chat-log-content:hover {
	opacity: 1;
	background-color: #2b2b2b36 !important;
	border: 1px solid #000000a3;
	backdrop-filter: blur(10px);
}
/* .chat-log{
	transform: translateX(-350px);
/* 	backdrop-filter: blur(10px); 
}
.chat-log:hover{
	transition: 0.1s;
	transform: translateX(0px);
} */
}