/* GENERAL */
* {
	box-sizing: border-box;
}
html {
	font-family: "Poppins", sans-serif;
	font-size: 10px;
	color: #333;
	line-height: 1.5;
}
body {
	background-color: #f7f7f7;
	font-size: 1.6rem;
}
.inner {
	margin: 0 auto;
	max-width: 140rem;
}
a {
	text-decoration: none;
	color: #333;
}
p a {
	color: #007bff;
}
strong {
	font-weight: 600;
}
.overlay {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 200;
	background-color: rgba(0, 0, 0, 0.75);
}
@media screen and (max-width:1420px) {
	.inner {
		padding: 0 2rem;
		max-width: 100%;
	}
}
@media screen and (max-width:768px) {
	html {
		font-size: 8px;
	}
}

/* HEADER */
header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 100;
	background: #fff;
	border-bottom: 1px solid #ccc;
}
header::after {
	content: "";
	clear: both;
	display: table;
}
header h1 {
	float: left;
}
header h1 a {
	display: block;
	padding: 2rem;
}
header.nav-open {
	height: 100%;
}
@media screen and (min-width:1025px) {
	header.nav-open {
		height: initial;
	}	
}

/* NAVIGATION */
nav {
	float: left;
}
nav ul li {
	float: left;
}
nav ul li a {
	display: block;
	padding: 3.3rem 2rem 3.4rem;
	font-weight: 600;
	font-size: 1.6rem;
	-webkit-transition: all 250ms ease;
	-moz-transition: all 250ms ease;
	-o-transition: all 250ms ease;
	transition: all 250ms ease;
}
nav ul li a.active {
	color: #c00;
	text-decoration: underline;
	text-underline-offset: 1rem;
	text-decoration-thickness: 3px;
}
nav ul li a:hover {
	background-color: #f7f7f7;
}
nav ul li a i {
	margin-right: 0.8rem;
}
.btn-create-post {
	margin-top: 2rem;
	padding: 1.2rem 2rem;
	background-color: #f00;
	border-radius: 4px;
	color: #fff;
}
.btn-create-post:hover {
	background-color: #c00;
}
.account-nav {
	float: right;
}
.account-nav li {
	position: relative;
	float: left;
}
.account-nav li a {
	display: block;
	padding: 3.3rem 2rem;
	font-weight: 600;
	font-size: 1.6rem;
}
.btn-register {
	padding: 2.3rem 0 2rem !important;
}
.btn-register span {
	display: inline-block;
	padding: 1rem 2rem;
	border-radius: 4px;
	border: 2px solid #ccc;
	-webkit-transition: all 250ms ease;
	-moz-transition: all 250ms ease;
	-o-transition: all 250ms ease;
	transition: all 250ms ease;
}
.btn-register:hover span {
	border-color: #f00;
	background-color: #f00;
	color: #fff;
}
.btn-sp-toggle {
	display: none;
	float: right;
	padding: 2.8rem;
	font-size: 2.5rem;
	color: #f00;
}
.btn-sp-toggle.open .fa-bars {
	display: none;
}
.btn-sp-nav-close {
	display: none;
}
@media screen and (max-width:1024px) {
	.nav-wrapper {
		display: none;
	}
	.nav-wrapper.open {
		display: block;
	}
	.nav-wrapper.open nav {
		overflow: hidden;
	}
	.nav-wrapper.open nav,
	.nav-wrapper.open nav ul li {
		float: none;
		width: 100%;
		text-align: center;
		text-transform: uppercase;
	}
	.nav-wrapper.open nav ul li a {
		padding: 2rem;
	}
	.btn-sp-toggle {
		display: block;
	}
	.account-nav {
		float: none;
		margin-top: 4rem;
	}
	.account-nav li {
		width: 100%;
		text-align: center;
	}
	.account-nav li a {
		padding: 2rem;
	}
	.btn-register {
		padding: 0 !important;
	}
}
@media screen and (max-width:768px) {
	.btn-sp-toggle {
		padding: 3.3rem;
	}
}

/* NOTIFICATIONS */
.notification-count {
	position: absolute;
	bottom: 50%;
	right: 50%;
	z-index: 2;
	margin-bottom: -2rem;
	margin-right: -2.5rem;
	padding: 0.5rem 0;
	width: 2rem;
	height: 2rem;
	cursor: pointer;
	background-color: #c00;
	border-radius: 50%;
	font-size: 1rem;
	font-weight: 600;
	color: #fff;
	text-align: center;
}
.notifications-list {
	display: none;
	position: absolute;
	top: 7rem;
	right: 0;
	width: 30rem;
}
.notifications-list li {
	width: 100%;
}
.notifications-list li a {
	display: block;
	margin-bottom: -1px;
	padding: 1rem;
	background: #fff;
	border: 1px solid #ddd;
	font-weight: 400;
	color: #000;
	overflow: hidden;
}
.notifications-list li a.is-viewed {
	color: #666;
}
.notifications-list li a:hover {
	background: #e7e7e7;
}
.notif-timelapsed {
	margin-top: 0.5rem;
	margin-left: 0.8rem;
	font-size: 1.2rem;
}
.notif-avatar {
	position: relative;
	float: left;
	padding: 0.75rem 0;
	margin-right: 0.8rem;
	width: 4rem;
	height: 4rem;
	border-radius: 50%;
	font-weight: 600;
	text-align: center;
}
.notif-avatar span {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
}
.notif-details {
	padding-top: 0.2rem;
	margin-left: 4rem;
	line-height: 1.2;
}
.notif-details strong {
	font-weight: 600;
}
.view-all-notifications a {
	text-align: center;
}

/* HERO */
.hero {
	position: relative;
	margin-top: 8.2rem;
	padding: 8rem 0;
	background: url("/assets/img/hero-bg.jpg") no-repeat center center;
	background-size: cover;
	text-align: center;
}
.hero::after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	background-color: rgba(0, 0, 0, 0.6);
}
.hero > * {
	position: relative;
	z-index: 2;
}
.hero h2 {
	margin-bottom: 3rem;
	font-size: 7.2rem;
	color: #fff;
}
.hero h2 small {
	display: block;
	font-size: 3rem;
}
.hero h2 small span {
	color: #f00;
}

/* SEARCH */
.search-bar {
	margin: 0 auto 1rem;
	max-width: 70rem;
}
.search-bar input {
	padding: 1.6rem 2rem;
	width: calc(100% - 14rem);
	border: 0;
	border-top-left-radius: 1rem;
	border-bottom-left-radius: 1rem;
	font-size: 1.8rem;
	outline: none;
}
.btn-search {
	padding: 1.6rem 2rem;
	width: 14rem;
	cursor: pointer;
	background-color: #339;
	border: 0;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
	font-size: 1.8rem;
	color: #fff;
	-webkit-transition: all 250ms ease;
	-moz-transition: all 250ms ease;
	-o-transition: all 250ms ease;
	transition: all 250ms ease;
}
.btn-search:hover {
	background-color: #44a;
}
.search-bar p {
	margin-top: 1rem;
	padding-left: 2rem;
	font-size: 1.2rem;
	color: #ccc;
	text-align: left;
}

/* CATEGORIES */
.categories-sidebar {
	margin-top: -3rem;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 1rem;
}
.categories-sidebar .section-header {
	padding: 2.3rem 2rem;
	border-bottom: 1px solid #ddd;
	font-size: 2.4rem;
}
.categories-sidebar .categories-list .category-title {
	padding: 1.4rem 2rem;
	background-color: #eee;
	border-bottom: 1px solid #ddd;
	font-size: 1.4rem;
	font-weight: 600;
	color: #666;
	text-transform: uppercase;
}
.categories-sidebar .category-sub li a {
	display: block;
	padding: 1.2rem 1.2rem 1.2rem 3rem;
	border-bottom: 1px solid #ddd;
}
.categories-sidebar .category-sub li a span {
	position: relative;
	top: -0.2rem;
	display: inline-block;
	margin-left: 0.5rem;
	padding: 0.3rem 0.8rem;
	background-color: #cbd3ff;
	border-radius: 0.8rem;
	font-size: 1.1rem;
	font-weight: 600;
	color: #333;
}
.categories-sidebar .section-footer {
	padding: 2rem;
	text-align: center;
}

/* TOP CATEGORIES */
.top-categories {
	clear: both;
	margin-bottom: 4rem;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 1rem;
	overflow: hidden;
}
.top-categories .section-header h2 {
	padding: 2.3rem 2rem;
	border-bottom: 1px solid #ddd;
	font-size: 2.4rem;
}
.category-grid {
	padding: 2rem;
	overflow: hidden;
}
.category-grid li {
	float: left;
	width: 20%;
	padding: 1rem;
}
.category-card {
	position: relative;
	display: block;
	border-radius: 0.8rem;
	line-height: 1;
	overflow: hidden;
}
.category-card img {
	width: 100%;
}
.top-categories .category-title {
	position: absolute;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 2;
	padding: 2rem 1rem 1rem;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0.8) 100%);
	font-size: 1.4rem;
	font-weight: 600;
	color: #fff;
	text-align: center;
}
@media screen and (max-width:768px) {
	.category-grid li {
		width: 33.33%;
	}
}
@media screen and (max-width:425px) {
	.category-grid li {
		width: 50%;
	}
}

/* FOOTER */
footer {
	padding: 5rem 0 0;
	background: linear-gradient(to bottom, rgba(72, 72, 163, 1) 1%, rgba(46, 46, 138, 1) 100%);
}
.footer-links {
	max-width: 100rem;
	overflow: hidden;
}
.footer-column {
	float: left;
	padding: 1rem;
	width: 25%;
}
.footer-column h2 {
	margin-bottom: 1.5rem;
	font-size: 1.8rem;
	color: #fff;
}
.footer-column ul li {
	margin-bottom: 0.5rem;
}
.footer-column ul li a {
	font-size: 1.2rem;
	color: #fff;
}
.social-icons li {
	float: left;
}
.social-icons li a {
	font-size: 3rem !important;
}
.footer-main {
	margin-top: 5rem;
	padding: 4rem 5rem 5rem;
	background: #000;
	color: #fff;
	font-size: 1rem;
}
.footer-main .inner > * {
	margin: 0 1rem;
}
.footer-logo {
	position: relative;
	bottom: -0.6rem;
}
.footer-main a {
	color: #fff;
}
@media screen and (max-width:768px) {
	.footer-column {
		width: 50%;
	}
	.footer-main .inner > * {
		display: block;
		margin-bottom: 1rem;
		bottom: 0;
		text-align: center;
	}
}

/* BUTTONS */
.btn {
	display: inline-block;
	padding: 1rem 2rem;
	border-radius: 5px;
	font-size: 1.2rem;
	font-weight: 600;
}
.btn-01 {
	background-color: #eef;
	color: #339;
}

/* REGISTER MODAL */
.register-notice {
	padding: 1rem;
	border: 1px dashed #f00;
}
.register-notice i {
	float: left;
	margin-right: 0.5rem;
	font-size: 3rem;
	color: #f00;
	line-height: 1.1;
}

/* FORM */
.sagishi-form .form-group {
	clear: both;
	position: relative;
	margin-bottom: 1.5rem;
}
.sagishi-form .form-group label {
	position: absolute;
	top: 2rem;
	left: 1rem;
	transform: translateY(-50%);
	background: #fff;
	padding: 0 5px;
	font-size: 1.6rem;
	color: #888;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.sagishi-form .form-group input,
.sagishi-form .form-group select,
.sagishi-form .form-group textarea,
.sagishi-form .form-group select {
	width: 100% !important;
	padding: 1rem;
	border: 1px solid #ccc;
	font-size: 1.6rem;
	resize: none;
}
.sagishi-form .form-group input:focus + label,
.sagishi-form .form-group input:not(:placeholder-shown) + label,
.sagishi-form .form-group textarea:focus + label,
.sagishi-form .form-group textarea:not(:placeholder-shown) + label,
.sagishi-form .form-group select:focus + label,
.sagishi-form .form-group select:not(:placeholder-shown) + label {
	top: 0;
	left: 10px;
	font-size: 1.2rem;
	color: #888;
}
.sagishi-form .form-group.has-error label {
	font-weight: 600;
	color: #f00 !important;
}
.sagishi-form .form-group textarea {
	height: 10rem;
}
.sagishi-form .form-group.has-error input:focus + label,
.sagishi-form .form-group.has-error input:not(:placeholder-shown) + label {
	color: #f00 !important;
}
.sagishi-form .form-group.has-error input {
	border-color: #f00 !important;
	outline: 1px solid #f00;
}
.sagishi-form .form-group .err-msg {
	display: none;
	margin: 0.5rem 0.5rem 1.5rem;
	font-size: 1.4rem;
	font-weight: 600;
	color: #f00;
}
.sagishi-form .form-group.has-error .err-msg {
	display: block;
}
.sagishi-form .btn-submit {
	background-color: #c00;
	color: #fff;
}
.sagishi-form-note {
	margin-top: 0.5rem !important;
	margin-left: 1rem !important;
	font-size: 80%;	
}
.btn-option {
	position: absolute;
	top: 0;
	right: 0;
	display: block;
	padding: 1.5rem 2rem;
	background-color: rgba(0, 0, 0, 0.75);
	color: #fff;
}
.btn-option:hover {
	opacity: 0.8;
}
.photo-field-wrapper > div {
	position: relative;
	display: none;
	width: calc(100% - 4.6rem);
}
.photo-field-wrapper > div.active {
	display: block;
}
.photo-field-wrapper > div .btn-remove-photo {
	position: absolute;
	top: 0;
	right: -4.6rem;
	display: block;
	padding: 1.4rem 0;
	width: 4.6rem;
	line-height: 1;
	text-align: center;
}
.photo-field-wrapper > .first-photo {
	display: block;
	width: 100%;
}
.photo-field-wrapper > .first-photo .btn-remove-photo {
	display: none;
}
.sagishi-form .btn-add-photo {
	display: inline-block;
	padding: 0.5rem 1rem;
	border: 1px solid #ddd;
	border-radius: 0.5rem;
	font-size: 1.4rem;
}

.show-hide-password-wrapper {
	position: absolute;
	top: 0;
	right: 5rem;
}
.show-hide-password-wrapper,
.show-hide-password-wrapper * {
	cursor: pointer;
}
.show-hide-password-wrapper label {
	margin-bottom: 0;
}
.show-hide-password-wrapper input {
	display: none;
}

/* SAGISHI MODAL */
.sagishi-modal {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 201;
	transform: translate(-50%, -50%);
	width: 60rem;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 1rem;
}
.sagishi-modal-header {
	padding: 2rem;
	border-bottom: 1px solid #ddd;
}
.sagishi-modal-header a {
	float: right;
	margin-top: -0.5rem;
	margin-right: -0.5rem;
	font-size: 4rem;
}
.sagishi-modal-header a i {
	color: #999;
	background-color: #fff;
	border-radius: 50%;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.sagishi-modal-header a:hover i {
	color: #333;
}
.sagishi-modal-header h2 {
	font-family: "Walkway Black";
	font-size: 3rem;
	color: #333;
	text-transform: uppercase;
	letter-spacing: 2px;
}
.sagishi-modal-content {
	padding: 3rem 4rem;
	max-height: 50rem;
	overflow-y: auto;
}
.sagishi-modal-content p {
	margin: 2rem 0 1rem;
	line-height: 1.2;
}
.sagishi-modal-footer {
	padding: 0 0.5rem 0.5rem;
	overflow: hidden;
}
.sagishi-modal-footer button {
	float: left;
	width: 50%;
	padding: 1.5rem 2rem;
	cursor: pointer;
	border: 0;
	border-radius: 0.6rem;
	font-size: 1.8rem;
	-webkit-transition: all 200ms ease;
	-moz-transition: all 200ms ease;
	-o-transition: all 200ms ease;
	transition: all 200ms ease;
}
.sagishi-modal-footer button:hover {
	opacity: 0.8;
}
.sagishi-modal-footer .btn-submit-form {
	background-color: #c00;
	color: #fff;
}
.sagishi-modal-footer .btn-modal-close {
	background-color: #eee;
	color: #333;
}
@media screen and (max-width:520px) {
	.sagishi-modal {
		width: 90%;
	}
}

/* NOTIF */
.sagishi-notif p {
	margin-top: 2rem;
	padding: 2rem;
	border-radius: 1rem;
	font-size: 2rem;
}
.sagishi-notif p i {
	margin-right: 1rem;
}
.sagishi-notif.notif-err p {
	background-color: #c00;
	color: #fff;
}
.sagishi-notif.notif-suc p {
	background-color: #090;
	color: #fff;
}

/* LOGIN MODAL */
.modal-footer-options {
	overflow: hidden;
}
.modal-footer-options button {
	float: left;
	width: 50%;
	padding: 1.5rem 2rem;
	cursor: pointer;
	border: 0;
	font-size: 1.8rem;
}
.modal-footer-options button:hover {
	opacity: 0.8;
}
.modal-footer-options .btn-submit-login,
.btn-submit-password-reset,
.btn-submit-resend-code {
	background-color: #c00;
	color: #fff;
}
.opt-showhide-password {
	display: block;
	margin: 1rem 1rem 2rem;
	cursor: pointer;
}
.opt-showhide-password input {
	margin-right: 0.5rem;
}
.login-options {
	margin-top: 1rem;
	overflow: hidden;
}
.login-options > * {
	float: left;
	width: 50%;
}
.login-options > div:last-child {
	text-align: right;
}
.login-options a,
.login-options label {
	display: block;
	padding: 1rem;
	cursor: pointer;
}
.login-options a {
	clear: right;
	float: right;
}
.login-options label input {
	margin-right: 0.5rem;
}
.btn-login-facebook,
.btn-login-google {
	display: block;
	float: left;
	width: 50%;
	padding: 1.5rem;
	margin-bottom: 2px;
	text-align: center;
}
.btn-login-facebook {
	background: #1877f2;
	color: #fff;
}
.btn-login-google {
	background: #ea4335;
	color: #fff;
}

/* DIALOG */
.sagishi-dialog {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	z-index: 201;
	transform: translate(-50%, -50%);
	width: 40rem;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 1rem;
	text-align: center;
}
.sagishi-dialog-header {
	padding: 2rem;
	border-bottom: 1px solid #ccc;
	font-family: "Walkway Black";
	font-size: 2rem;
	color: #333;
	text-transform: uppercase;
	letter-spacing: 2px;
}
.sagishi-dialog-content {
	padding: 1rem;
	line-height: 1.2;
}
.sagishi-dialog-footer {
	padding: 1rem;
}
.sagishi-dialog-footer a {
	display: block;
	padding: 1rem;
	background-color: #c00;
	font-size: 2rem;
	font-weight: 600;
	color: #fff;
}

/* CMS */
.cms-section .container {
	margin: 0 auto;
	padding: 2rem;
}
.cms-section h1 {
	padding: 3rem;
	font-size: 4rem;
	font-weight: 600;
	text-align: center;
}
.cms-section p {
	margin-bottom: 1.5rem;
	font-size: 1.6rem;
	line-height: 1.5rem;
	text-align: justify;
}

/* LOADING */
#loading {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 2000;
	background-color: rgba(0, 0, 0, 0.75);
}
#loading img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 15rem;
}

/* TINYMCE */
.tox-tinymce {
	border: 1px solid #ccc !important;
	border-radius: 0 !important;
}
.tox-promotion,
.tox-statusbar {
	display: none !important;
}

/* SELECT2 */
.select2 {
	display: block;
}
.select2-container--open .select2-dropdown--below {
	margin-top: 1px;
}
.select2-container--default .select2-selection--multiple {
	border-color: #ccc;
	border-radius: 0;
}
.select2-container .select2-search--inline .select2-search__field {
	margin-top: 1rem;
	margin-left: 1rem;
	margin-right: 1rem;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice {
	margin-top: 1rem;
	margin-left: 1rem;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__display {
	display: inline-block;
	padding: 0.5rem;
}
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	padding: 0.5rem;
}
.select2-container--default .select2-results__group {
	font-weight: 600;
}

/* PADDING */
.p-1 { padding: 1rem; }

/* COLORS */
.ac-a { background-color: #f5e96c !important; color: #222 !important; }
.ac-b { background-color: #8a75e0 !important; color: #fff !important; }
.ac-c { background-color: #941739 !important; color: #fff !important; }
.ac-d { background-color: #d043f7 !important; color: #fff !important; }
.ac-e { background-color: #38f0b1 !important; color: #222 !important; }
.ac-f { background-color: #f7c85a !important; color: #222 !important; }
.ac-g { background-color: #4a85e0 !important; color: #fff !important; }
.ac-h { background-color: #a123e9 !important; color: #fff !important; }
.ac-i { background-color: #9b1978 !important; color: #fff !important; }
.ac-j { background-color: #63d551 !important; color: #222 !important; }
.ac-k { background-color: #6e1456 !important; color: #fff !important; }
.ac-l { background-color: #527fe5 !important; color: #fff !important; }
.ac-m { background-color: #ca7492 !important; color: #fff !important; }
.ac-n { background-color: #e4b53a !important; color: #222 !important; }
.ac-o { background-color: #26a86b !important; color: #fff !important; }
.ac-p { background-color: #b71f0e !important; color: #fff !important; }
.ac-q { background-color: #689558 !important; color: #fff !important; }
.ac-r { background-color: #c3374f !important; color: #fff !important; }
.ac-s { background-color: #7782a8 !important; color: #fff !important; }
.ac-t { background-color: #43c45a !important; color: #222 !important; }
.ac-u { background-color: #f16f29 !important; color: #fff !important; }
.ac-v { background-color: #7f3963 !important; color: #fff !important; }
.ac-w { background-color: #5ad364 !important; color: #222 !important; }
.ac-x { background-color: #e3a34a !important; color: #222 !important; }
.ac-y { background-color: #99a73a !important; color: #fff !important; }
.ac-z { background-color: #b026a0 !important; color: #fff !important; }

/* TEXT COLORS */
.text-danger { color: #c00 !important; }
.text-gray { color: #ccc !important; }
.text-success { color: #090 !important; }