@font-face {
	font-family: "futura-bold";
	src: url("../fonts/Futura-Bold.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}

.d-grid {
	display: grid;
}

.justify-self-center {
	justify-self: center;
}

.justify-self-end {
	justify-self: end;
}

.c-pointer {
	cursor: pointer;
}

.as-border__rl {
	border-radius: 10rem 0 0 10rem;
}
.as-border__rr {
	border-radius: 0 10rem 10rem 0;
}
.as-center {
	display: grid;
	justify-items: center;
}

.as-footer {
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 60px;
	line-height: 60px;
	background-color: #f5f5f5;
}

.as-footer-2 {
	position: absolute;
	width: 100%;
	height: 60px;
	line-height: 60px;
	background-color: #f5f5f5;
}

/* ============================================================================================================== */

.as-bgr__color {
	background-color: #4e73df;
	background-image: linear-gradient(180deg, #4e73df 10%, #224abe 100%);
	background-size: cover;
}

/* ============================================================================================================== */
/* ==== Special Styles ==== */
.scr-log__center-itm {
	height: 100%;
	display: grid;
	align-items: center;
}

.scr-log__card {
	min-width: 18rem;
	border-radius: 8px;
}
.scr-log__btn {
	border-radius: 10rem;
	width: 100%;
	background-color: #4e73df;
	border-color: #4e73df;
	color: white;
}
.as-gog__btn {
	border-radius: 0.5rem;
	width: 100%;
	background-color: white;
	border-color: #0000008a;
	color: #0000008a;
	font-family: "Roboto", sans-serif;
}
.scr-log__btn:hover {
	background-color: #1d59d8;
	border-color: #1d59d8;
	color: white;
}
.scr-log__btn:active {
	background-color: #1d59d8;
	border-color: #1d59d8;
	color: white;
}

/* ============================================================================================================== */
/* ==== Common Styles ==== */
.ws-wrap {
	white-space: pre-wrap;
}

a.disabled {
	pointer-events: none;
	cursor: default;
}
.as-txt__dh {
	color: rgba(0, 0, 0, 0.87);
}
.as-txt__dm {
	color: rgba(0, 0, 0, 0.6);
}
.as-txt__dx {
	color: rgba(0, 0, 0, 0.38);
}
.as-txt__lh {
	color: rgba(255, 255, 255, 0.87);
}
.as-txt__lm {
	color: rgba(255, 255, 255, 0.6);
}
.as-txt__lx {
	color: rgba(255, 255, 255, 0.38);
}

/* #4e73df , #dfbb4e */
.as-style__circle {
	background-color: #4e73df;
	cursor: pointer;
	width: 30px;
	height: 30px;
	display: inline-grid;
	justify-items: center;
	align-items: center;
	border-radius: 10rem;
}

.scr-abs__0 {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.as-float__right {
	position: absolute;
	right: 1rem;
}

.as-float__tr {
	position: absolute;
	right: 1rem;
	top: 1rem;
}

.as-size__eqsmall {
	width: 1.5rem;
	height: 1.5rem;
}

.as-style__title {
	font-family: "futura-bold";
	font-weight: 700;
	line-height: 1.2;
}

.as-style__stars {
	color: #1e1e4b !important;
}

.as-float__br {
	position: absolute;
	bottom: 0;
	right: 0;
}

.carousel-subtitle {
	width: 100%;
	position: absolute;
	top: 0;
	background-image: linear-gradient(
		to right,
		rgba(255, 255, 255, 0.5),
		rgba(255, 255, 255, 0)
	);
	font-size: 3vw;
}

.carousel-back-circle {
	background: #1e1e4b;
	border-radius: 50%;
	align-items: center;
	justify-content: center;
	display: flex;
	width: 3rem;
	height: 3rem;
}

.pictures {
	list-style: none;
	margin: 0;
	/* max-width: 30rem; */
	padding: 0;
}

.pictures > li {
	border: 1px solid transparent;
	float: left;
	height: calc(100% / 3);
	overflow: hidden;
	width: calc(100% / 3);
}

.pictures > li > img {
	cursor: zoom-in;
	width: 100%;
}

.w-fit {
	width: fit-content;
}

.radius-8 {
	border-radius: 0.8rem;
}

.radius-8t:first-child {
	border-top-left-radius: calc(0.8rem - 1px);
	border-top-right-radius: calc(0.8rem - 1px);
}

.radius-8b:last-child {
	border-bottom-left-radius: calc(0.8rem - 1px) !important;
	border-bottom-right-radius: calc(0.8rem - 1px) !important;
}

.count-msg {
	background-color: #777;
	position: absolute;
	bottom: 5px;
	right: 5px;
}

.label {
	display: inline;
	padding: 0.4em 0.6em 0.1em;
	font-size: 75%;
	font-weight: 700;
	line-height: 1;
	color: #fff;
	text-align: center;
	white-space: nowrap;
	vertical-align: baseline;
	border-radius: 1rem;
}

ul.timeline {
    list-style-type: none;
    position: relative;
}
ul.timeline:before {
    content: ' ';
    background: #d4d9df;
    display: inline-block;
    position: absolute;
    left: 29px;
    width: 2px;
    height: 100%;
    z-index: 400;
}
ul.timeline > li {
    margin: 20px 0;
    padding-left: 20px;
}
ul.timeline > li:before {
    content: ' ';
    background: white;
    display: inline-block;
    position: absolute;
    border-radius: 50%;
    border: 3px solid #22c0e8;
    left: 20px;
    width: 20px;
    height: 20px;
    z-index: 400;
}

/* Rules for sizing the icon. */
.material-icons.md-18 { font-size: 18px !important; }
.material-icons.md-24 { font-size: 24px !important; }
.material-icons.md-36 { font-size: 36px !important; }
.material-icons.md-48 { font-size: 48px !important; }

/* Rules for using icons as black on a light background. */
.material-icons.md-dark { color: rgba(0, 0, 0, 0.54); }
.material-icons.md-dark.md-inactive { color: rgba(0, 0, 0, 0.26); }

/* Rules for using icons as white on a dark background. */
.material-icons.md-light { color: rgba(255, 255, 255, 1); }
.material-icons.md-light.md-inactive { color: rgba(255, 255, 255, 0.3); }