//META{"name":"SteinsGateTheme","description":"Welcome to my world","author":"me","version":"0.3"}*//





/**
 *	LICENSE:
 *
 *	Use this however you like, unless it breaks any laws in your
 *	country (the country in which you are using this theme)
 *	and unless it hurts someone, though that would be an impressive feat.
 **/
/**
 *  Background for the whole window
 **/

.app {
    background-image: url(https://i.imgur.com/nmWK7Zo.jpg) !important;
    /*Has to be HTTPS*/
    
    background-size: cover;
}
/**
 *	Transparency so we can see the background.
 **/

#voice-connection,
#friends,
#friends .btn,
.friends-header,
.friends-table,
.search-bar,
.guilds-wrapper,
.channels-wrap,
.guild-channels,
.account,
.links,
.messages-wrapper,
.title-wrap,
.content,
.chat-empty,
.message-group-blocked,
.private-channels,
.typing,
.chat,
.divider-red span {
    background: rgba(0, 0, 0, 0.45) !important;
}
.channel-muted,
.channel-muted a,
.channel-text.channel-muted,
.channel-text.channel-muted a {
    text-decoration: line-through;
}
#bd-pub-btn {
    background-color: rgba(0, 0, 0, 0.5);
}
.friends
/**
 *	"Guilds" being servers
 **/

.guild-inner,
li.active .guild-inner {
    background-color: rgba(198, 118, 29, 0.5);
}
.guild-inner:hover,
li.active .guild-inner {
    background-color: rgba(198, 118, 29, 0.5) !important;
}
.guilds-wrapper {
    width: 75px;
}

.guilds-wrapper .guilds{
	overflow-y: auto!important;
	background-color: rgba(0, 0, 0, 0.5);
}

.guilds li {
    margin-left: 1px;
}
/**
 *  Selected server & servers with unread messages.
 **/

.guilds-wrapper .guilds .guild.unread:before {
    background-color: rgba(198, 118, 29, 0.5);
}
.guilds-wrapper .guilds .guild.selected:before {
    background-color: rgba(123, 21, 6, 0.5);
}
.guilds-wrapper .guilds .guild.selected:before,
.guilds-wrapper .guilds .guild.unread:before {
    width: 65px;
    height: 55px;
    margin-top: -28px;
    margin-left: 7.5px;
    transition: background-color .25s cubic-bezier(0.4, 0, 1, 1);
}
.guilds-add {
    opacity: .3;
}
/**
 *	server name
 **/

.guild-header span {
    text-align: center;
}
.guild-header header {
    background-color: rgba(123, 21, 6, 0.5);
    box-shadow: none;
}
.guild-header header:hover {
    background-color: rgba(198, 118, 29, 1);
}
/**
 *	server settings
 **/

.guild-header ul {
    opacity: 0;
    transition: transform .5s cubic-bezier(0.18, 0.89, 0.32, 1.28);
}
.guild-header-open ul {
    opacity: 1;
    background-color: rgba(198, 118, 29, 1);
}
.guild-header-open ul li a {
    font-size: 15px;
    color: white;
    opacity: 1;
}
.guild-header-open ul li:last-of-type,
.guild-header-open ul li:last-of-type a {
    background-color: rgba(123, 21, 6, 1);
    color: white;
}
.guild-header-open ul li:not(:last-of-type):hover {
    background-color: rgba(0, 0, 0, 1);
}
.guild-header-open ul li:hover a {
    color: rgba(198, 118, 29, 1);
    opacity: 1;
}
.guild-header-open ul li:last-of-type:hover a {
    color: white;
}
.btn-hamburger {
    display: none;
}
.btn-hamburger span {
    display: none;
}
/**
 *	Channels
 **/

.channel-text,
.channel-text a {
    opacity: 1;
    color: white;
}
.channel-text.channel-muted:hover a {
    color: rgba(255, 255, 255, 1);
    opacity: 1;
}
.guild-channels .channel-text a {
    color: white;
}
.channel-text.selected a {
    background-color: rgba(123, 21, 6, 0.5);
}
.channel:not(.selected) {
    transition: background .3s ease-out;
}
.channel:not(.selected):hover a {
    transition: background .2s ease-in;
    background-color: rgba(198, 118, 29, 0.5);
    color: rgba(255, 255, 255, 1);
}
.channel:not(.selected)a:hover {
    transition: background .2s ease-in;
    background-color: rgba(198, 118, 29, 0.5);
    color: rgba(255, 255, 255, 1);
}
.guild-channels .channel-text.selected:before,
.guild-channels .channel-text.selected:hover:before,
.guild-channels .channel-text:hover.channel-muted:before,
.guild-channels .channel-text:hover:not(.unread):before,
.private-channels .channel.selected:before,
.private-channels .channel:hover:before {
    border-left: 5px solid rgb(0, 0, 0);
}
.private-channels .channel:hover:before {
    opacity: .25;
}
.guild-channels ul .channel-text.unread:not(.selected):not(.channel-muted):before {
    left: -11px;
}
.search-result,
.tab-bar-item:hover {
    background: rgba(235, 232, 218, 0.05) !important;
}
.friends-row:hover,
.search-result:hover,
.btn-friends.selected,
.search-result.selected,
.channel.selected.private,
div.channel.channel-text.selected {
    background-color: rgba(0, 0, 0, 0.5);
}
#voice-connection {
    border-top: none;
}
#voice-connection .btn,
.account .btn {
    border: none;
    border-bottom: solid 1px rgba(235, 232, 218, 0.05);
    opacity: .65;
}
#voice-connection .btn-group,
.account .btn-group {
    box-shadow: .75px 1.5px 1px #14171b;
    border: none;
}
/**
 *	Friends list stuff
 **/

.friends-icon {
    background-color: rgba(0, 0, 0, 0.5);
}
.friends-icon:hover {
    background-color: rgba(198, 118, 29, 0.5);
}
#friends .btn:hover {
    background-color: rgba(198, 118, 29, 0.5) !important;
}
.friends-header {
    background-color: rgba(0, 0, 0, 0.5) !important;
}
/**
 *	User settings
 **/

.account .username {
    font-size: 15px;
    font-weight: bold;
    font-family: sans-serif;
    text-shadow: 1.35px .75px 1px black;
}
.account {
    border-top: none;
}
.status {
    border-color: rgba(0, 0, 0, 0.33) !important;
}
.popout header,
.slider-bar-fill {
    background-color: rgba(198, 118, 29, 0.5);
}
.user-popout .user-popout-options .btn {
    background-color: rgba(198, 118, 29, 0.5);
}
.user-popout .user-popout-options .btn:hover {
    background-color: rgba(198, 118, 29, 0.5);
}
.user-popout .username {
    font-size: 16px;
}
/**
 *	Tooltips
 **/

.tooltip {
    background: rgb(198, 118, 29);
    color: #fff;
}
.tooltip.tooltip-right:after {
    border-right-color: rgb(198, 118, 29);
}
.tooltip.tooltip-top:after {
    border-top-color: rgb(198, 118, 29);
}
/**
 *	Info links
 **/

.links {
    display: none;
}
/**
 *	Channel info
 **/

.flex-spacer .title-wrap {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    border-top: none;
    border-style: solid;
    border-color: transparent !important;
}
/**
 *	Channel title
 **/

.topic {
    color: #cdcdcd;
}
/**
 *	Chat area
 **/

.chat .flex-spacer {
    background: rgba(255, 255, 255, 0.05);
    border-top-left-radius: 23px;
    border-bottom-left-radius: 23px;
}
.chat .new-messages-bar {
    background-color: rgba(123, 21, 6, 0.5);
}
.chat .new-messages-bar:hover {
    background-color: rgba(123, 21, 6, 0.5);
}
.chat .new-messages-bar button:last-child {
    color: rgba(255, 255, 255, 0.5);
}
.markup .highlight {
    background-color: rgba(123, 21, 6, 1) !important;
    color: #ddd;
    border-radius: 10%;
}
.markup .highlight:hover {
    background-color: rgba(198, 118, 29, 0.5) !important;
    color: #ddd;
    border-radius: 10%;
}
.file-input:hover {
    background-color: rgba(198, 118, 29, 0.5) !important;
}
/**
 *	links in messages
 **/

.message-group a span {
    color: #5af;
    text-shadow: 1px 1px 0 #001a33;
}
/**
 *	Code
 **/

.chat .markup code {
    background: rgba(123, 21, 6, 0.7) !important;
}
.chat .markup pre {
    background: none !important;
    border: 1px solid rgba(0, 0, 0, 0.5) !important;
}
/**
 *	Spoilers
 **/

.message-group-blocked-btn,
.message-group-blocked.revealed {
    background-color: rgba(0, 0, 0, 0.3) !important;
}
.message-group-blocked,
.message-group-blocked.revealed {
    border: none !important;
}
/*Scrolling bar*/

.scroller-wrap .scroller::-webkit-scrollbar-thumb {
    border: 3px solid rgba(0, 0, 0, 0.25) !important;
}
.scroller-wrap .scroller::-webkit-scrollbar-track-piece {
    border: 3px solid rgba(255, 255, 255, 0) !important;
    background-color: rgba(0, 0, 0, 0.3) !important;
}
/*Message area*/

.channel-textarea .channel-textarea-inner {
    background: rgba(255, 255, 255, 0);
}
/*Twitch emotes button*/

#twitchcord-button {
    background-size: 24px;
    background-position: 20px;
    background-color: transparent;
}
/*Typing status*/

.typing {
    font-size: 13px;
}
/*Settings panel*/

.settings .settings-header {
    background-color: #1e1e1e;
}
/**
 *	"Done" button
 **/

.form .btn-primary {
    background-color: rgba(198, 118, 29, 1) !important;
}
.form .btn-primary:hover {
    background-color: rgba(123, 21, 6, 1) !important;
}
.user-settings-modal a {
    color: #1D6586;
}
.user-settings-modal a:hover {
    color: #25ACE8;
}
.settings-panel,
.settings .settings-actions,
.settings .tab-bar.SIDE {
    background-color: #1e1e1e;
    border-color: #1e1e1e;
}
/**
 *	Text boxes
 **/

.form .control-group input[type=email],
.form .control-group input[type=number],
.form .control-group input[type=password],
.form .control-group input[type=text],
.form .control-group textarea {
    background-color: #5b5b5b;
    color: #fff;
    border-radius: 3px;
    padding-left: 5px;
    margin-bottom: 0;
}
/**
 *	Logout
 **/

.btn-confirm .btn:first-of-type:hover,
.btn-confirm.active .btn:last-of-type:not(:first-of-type):hover,
.btn-confirm.active .btn:last-of-type:not(:first-of-type) {
    background-color: rgba(123, 21, 6, 1) !important;
}
.btn-confirm.active .btn {
    background-color: #1e1e1e;
}
/**
 *	Change password link
 **/

.form .control-group label a {
    color: #fff;
}
.form .control-group label a:hover {
    color: rgba(198, 118, 29, 1) !important;
}
/*Channel members*/

.channel-members {
    background: rgba(20, 23, 27, 0.25) !important;
}
.member-username {
    text-shadow: 0 0 0 rgba(255, 255, 255, 0.255);
}
.channel-members-wrap .member-inner div {
    -webkit-filter: none !important;
}
.channel-members .invite-btn {
    background: #06c;
    transition: background .3s ease-out;
}
.channel-members .invite-btn:hover {
    background: #39f;
    transition: background .2s ease-in;
}
.channel-members .member:hover,
.channel-members .popout-open {
    background: rgba(255, 255, 255, 0.07) !important;
}
.emoji.jumboable {
    width: 40px !important;
    height: 40px !important
}

.emoji {
    width: 40px !important;
    height: 40px !important;
}