* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html {
	font-size: 62.5%;
}

body {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	min-width: 1600px;
	font-family: 'Montserrat', sans-serif;
	background-color: #181d23;
	overflow: scroll;
}

.active {
	background-color: rgba(255, 255, 255, 0.2);
}

.panel {
	width: 1600px;
	height: 1040px;
	border: 1px solid #4b5769;
	border-radius: 15px;
	overflow: hidden;
}

.panel-left {
	display: flex;
	flex-direction: column;
	justify-content: center;
	background-color: #4b5769;
}

.panel-right {
	background-image: linear-gradient(180deg, rgba(55, 64, 76, 1) 0%, rgba(21, 26, 32, 1) 100%);
}

.info-top h1 {
	font-size: 4rem;
	font-weight: bold;
	text-transform: uppercase;
}

/* ---------- */

.date-box {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	height: 160px;
}

.date-box .day {
	font-size: 2rem;
}

.date-box .time {
	font-size: 4rem;
	font-weight: bold;
}

.date-box .date {
	font-size: 1.8rem;
}

/* ---------- */

.menu {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
	height: 700px;
}

.menu a {
	display: flex;
	flex-direction: column;
	justify-content: space-around;
	width: 100%;
	height: 30%;
	text-decoration: none;
	color: #fff;
	border: 1px solid #ddd;
	border-radius: 15px;
}

.menu a:hover {
	background-color: transparent;
	background-image: linear-gradient(160deg, rgba(0, 110, 255, 0.25) 0%, rgba(9, 255, 0, 0.25) 100%);
}

.menu-item i {
	font-size: 6rem;
	margin-bottom: 0.4rem;
}

.menu-item p {
	font-size: 2rem;
	text-transform: uppercase;
}

/* ---------- */

.info-box h3 {
	font-size: 2rem;
}

.info-box p {
	font-size: 1.6rem;
}

/* ---------- */

.main-stats h1 {
	font-size: 3rem;
	text-transform: uppercase;
	font-weight: bold;
}

.main-stat-box {
	height: 140px;
	border-radius: 15px;
	transition: background-color 0.3s;
}

.main-stat-box:hover {
	background-color: rgba(255, 255, 255, 0.08);
}

.main-stat-box h3 {
	margin-bottom: 1em;
	font-size: 1.8rem;
	text-transform: uppercase;
	font-weight: bold;
}

.main-stat-box p {
	font-size: 1.2rem;
}

/* ---------- */

.main-table h3 {
	font-size: 2.6rem;
	color: #fff;
	font-weight: bold;
}

.main-table thead,
.main-table .dropdown-item {
	font-size: 1.6rem;
}

.main-table tbody {
	font-size: 1.6rem;
}

.main-table .btn {
	font-size: 1.6rem;
}

.page-link {
	padding: 0.5em 1em;
	font-size: 1.4rem;
	background-color: transparent;
	color: #fff;
}

.page-link:hover {
	background-color: rgba(255, 255, 255, 0.08);
	color: #ddd;
}

/* prawa strona */

aside h3 {
	margin-bottom: 1em;
	font-size: 2rem;
	font-weight: bold;
	text-transform: uppercase;
}

.logo .logo-text {
	font-size: 3.4rem;
	text-shadow: 0 0 5px rgb(255, 255, 255);
}

.logo p {
	font-size: 1.8rem;
}

.users-online p,
.users-gender i {
	font-size: 4rem;
}

.users-gender .fa-male {
	text-shadow: 0 0 10px #09ff00;
}

.users-gender .fa-female {
	text-shadow: 0 0 10px #006eff;
}

.users-gender p {
	font-size: 3rem;
}

.monthly-stats .form-select, .monthly-stats option {
	font-size: 1.6rem;
}

.monthly-stats .info {
	font-size: 1.8rem;
}
.monthly-stats .number {
	font-size: 1.4rem;
}

/* SUBPAGE POSTS */

.posts h3 {
	font-size: 2.4rem;
	text-transform: uppercase;
	font-weight: bold;
}

.featured-post .card-body {
	font-size: 1.4rem;
}

.featured-post .card-title {
	font-size: 2rem;
}

.featured-post .btn {
	margin-top: 0.5em;
	font-size: 1.6rem;
}

.active-users .card-img {
	overflow: hidden;
} 

.active-users img {
	height: 180px;
	object-fit: cover;
	opacity: 0.6;
	transition: opacity 0.4s, transform 0.4s;
}

.active-users img:hover {
	opacity: 1;
	transform: scale(1.125);
}

.active-users .card-body, .active-users .btn {
	font-size: 1.4rem;
}

.find-post .find-post-info, .find-post button, .find-post .dropdown-item {
	font-size: 1.6rem;
}

.post-modal h3 {
	font-size: 1.8rem;
	font-weight: bold;
}

.post-modal p, .post-modal .btn {
	font-size: 1.4rem;
}

.post-modal .modal-body .btn {
	text-transform: uppercase;
}

/* SUBPAGE USERS */

.users-main .list-group-item {
	padding: 0.5em 1em;
	margin: 0.2em 0;
	font-size: 2rem;
	border: 1px solid #fff;
}

.users-main .btn {
	font-size: 1.6rem;
}

.user-search label,
.user-search input,
.user-search select {
	font-size: 1.6rem;
}

.user-search .btn {
	font-size: 2rem;
}

.users-modal h2 {
	font-size: 2.6rem;
}

.users-modal label,
.users-modal input,
.users-modal select,
.users-modal .btn {
font-size: 1.6rem;
}
