@font-face {
	font-family: RobotoQweb;
	src: url("/static/css/fonts/roboto/Roboto-Regular.ttf") format("truetype");
	font-weight: 400;
	font-style: normal
}

@font-face {
	font-family: Roboto;
	src: url("/static/css/fonts/roboto/Roboto-Regular.ttf") format("truetype");
	font-weight: 400;
	font-style: normal
}

@font-face {
	font-family: RobotoMedium;
	src: url("/static/css/fonts/roboto/Roboto-Medium.ttf") format("truetype");
	font-weight: 600;
	font-style: normal
}

@font-face {
	font-family: RobotoBold;
	src: url("/static/css/fonts/roboto/Roboto-Bold.ttf") format("truetype");
	font-weight: 800;
	font-style: normal
}

@font-face {
	font-family: OswaldQweb;
	src: url("/static/css/fonts/oswald/Oswald-Regular.ttf") format("truetype");
	font-weight: 800;
	font-style: normal
}

@font-face {
	font-family: RobotoLight;
	src: url("/static/css/fonts/roboto/Roboto-Light.ttf") format("truetype");
	font-weight: 100;
	font-style: normal
}

@font-face {
	font-family: RobotoCondensed;
	src: url("/static/css/fonts/roboto/RobotoCondensed.ttf") format("truetype");
	font-weight: 100;
	font-style: normal
}

/*for basic window changes */
::-webkit-scrollbar {
	width: 6px;
	padding-top: 2px;
	padding-bottom: 2px;
}

::-webkit-scrollbar-track {
	color: #ffffff;
	border-radius: 4px;
}

::-webkit-scrollbar-thumb {
	border-radius: 4px;
	background: #56707e;
}

@supports (-moz-appearance:none) {
	* {
		scrollbar-width: thin;
		scrollbar-color: #56707e transparent;
	}
}

div.qualys-client-outdated,
div.qualys-client-deprecated,
div.qualys-client-unsupported,
div.qualys-client-cookie-support {
	width: 85%;
	margin: 0 auto;
}

div.qualys-client-javascript-required {
	display: flex;
	justify-content: center;
	margin-top: 120px;
}

div.qualys-client-deprecated,
div.qualys-client-unsupported,
div.qualys-client-cookie-support {
	margin-top: 80px;
	padding: 16px;
	color: #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	display: flex;
	border: 1px solid #F6C5C0;
	background: #FBE8E6;
	border-radius: 8px;
}

div.qualys-client-outdated {
	margin-top: 80px;
	padding: 16px;
	color: #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	display: flex;
	border: 1px solid #EBCF29;
	background: #FEFAE0;
	border-radius: 8px;
}

div.qualys-client-deprecated-header,
div.qualys-client-unsupported-header,
div.qualys-client-cookie-support-header,
div.qualys-client-outdated-header {
	display: flex;
	flex-direction: column;
	margin: 0 0 0 12px;
}


div.qualys-client-deprecated a,
div.qualys-client-outdated a,
div.qualys-client-cookie-support a,
div.qualys-client-unsupported a {
	color: #2B5EEC;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-style: normal;
	font-weight: 700;
	line-height: 16px;
	text-decoration: none;
}

div.qualys-client-outdated h5,
div.qualys-client-deprecated h5,
div.qualys-client-unsupported h5,
div.qualys-client-cookie-support h5 {
	text-align: left;
	font-family: Roboto,'RobotoQweb';
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	margin: 0;
}

div.qualys-client-javascript-required h5 {
	color: #56707E;
	text-align: center;
	font-family: Roboto,'RobotoQweb';
	font-size: 20px;
	font-style: normal;
	font-weight: 400;
	line-height: 24px;
	margin-left: 20px;
}

div.qualys-client-javascript-required img {
	animation: rotate-clockwise 2s infinite;
}

@keyframes rotate-clockwise {
	from {
		transform: rotateZ(0);
	}
	to {
		transform: rotateZ(360deg);
	}
}

div.qualys-client-outdated img,
div.qualys-client-deprecated img,
div.qualys-client-unsupported img,
div.qualys-client-cookie-support img {
	align-self: flex-start;
}

div.qualys-client-outdated p,
div.qualys-client-deprecated p,
div.qualys-client-unsupported p,
div.qualys-client-javascript-required p,
div.qualys-client-cookie-support p {
	font-size: 13px;
	line-height: 16px;
	font-family: Roboto,'RobotoQweb';
}

body.no-js form,
body.yes-js.no-cookies form,
body.no-client-supported form,
body.no-js p.forgot-password,
body.yes-js.no-cookies p.forgot-password,
body.no-client-supported p.forgot-password,
body.no-js div.qualys-client-unsupported,
body.no-js div.qualys-client-outdated,
body.no-js div.qualys-client-deprecated,
body.no-js div.qualys-client-cookie-support,
body.no-cookies div.qualys-client-unsupported,
body.no-cookies div.qualys-client-outdated,
body.no-cookies div.qualys-client-deprecated {
	display: none;
	visibility: hidden;
}
body.yes-client-supported div.qualys-client-unsupported,
body.no-client-supported div.qualys-client-outdated,
body.no-client-supported div.qualys-client-deprecated,
body.no-client-deprecated div.qualys-client-deprecated,
body.no-client-outdated div.qualys-client-outdated,
body.yes-js div.qualys-client-javascript-required,
body.yes-cookies div.qualys-client-cookie-support {
	display: none;
	visibility: hidden;
}

body {
	margin: 0;
	background-image: url(/static/images/4_0_ui_icons/bgImage.png);
	background-repeat: no-repeat;
	background-size: cover;
}

.container {
	display: flex;
/*	height: 664px;*/
}

body > #content_block {
	position: unset;
	/*overflow: unset;*/
	width: unset;
	margin: unset;
}

.left-container {
	display: flex;
	flex-direction: column;
	width: 80%;
	margin: 2% 3%;
}

.banner-container {
	width: 100%;
	flex-shrink: 0;
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	min-height: 50%;
	justify-content: center;
}

.banner {
	display: flex;
}

.left-controls, .right-controls {
	height: 36px;
	width: 36px;
	align-self: center;
	cursor: pointer;
}

.banner-images {
	border-radius: 23px;
	width: 100%;
	margin: 0 20px;
	background-repeat: no-repeat;
	background-size: 100% 100%;
	position: relative;
	overflow: hidden;
}

.learn-more {
	position: absolute;
	bottom: 44px;
	height: 20px;
	width: 81px;
	padding: 12px 20px;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background: #FFFFFF;
	color: #095FB3;
	text-align: center;
	font-family: Roboto,'RobotoQweb';
	font-size: 16px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	cursor: pointer;
	text-decoration-line: none;
	display: none;
}

.banner-shimmer {
	background: linear-gradient(to right, #B6D2EA 40%, rgba(182, 210, 234, 0.32) 60%, #B6D2EA 80%);
	background-size: 300%;
	background-position-x: 100%;
	animation: shimmer-right 1s infinite linear;
}

.default-banner {
	width: 100%;
	border-radius: 23px;
}

.banner-wrap {
	border-radius: 23px;
	width: 100%;
	cursor: pointer;
}

.indicators {
	display: flex;
	padding-top: 32px;
	align-self: center;
}

.indicator {
	width: 12px;
	height: 6px;
	border-radius: 5px;
	background: rgba(9, 95, 179, 0.30);
	margin: 0 4px;
	cursor: pointer;
}

.indicator-active {
	width: 12px;
	height: 6px;
	border-radius: 5px;
	margin: 0 4px;
	cursor: pointer;
	background: #095FB3;
}

.left-bottom-container {
	display: flex;
	margin: 4% 5% 20px 5%;
}

.left-bottom-container-listing {
	display: flex;
	margin: 0 5% 0 5%;
	overflow: auto;
}

.events {
	width: 48%;
	display: flex;
	flex-direction: column;
}

.event-date {
min-width: 56px;
padding: 12px 8px;
align-self: center;
border-radius: 12px;
background: rgba(255, 255, 255, 0.30);
box-shadow: 0 9px 12px 0 rgba(0, 0, 0, 0.05);
text-align: center;
}

.date {
	font-family: Roboto,'RobotoQweb';
	font-size: 24px;
	line-height: 24px;
	font-style: normal;
	font-weight: 600;
	background: linear-gradient(141deg, #56707E 18%, #0E1215 73%);
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

.month {
	color: #364750;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	padding-top: 4px;
}

.event-details {
	width: calc(100% - 102px);
	padding-left: 30px;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.event-title {
	color: #193DAA;
	font-family: Roboto,'RobotoQweb';
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
}

.event-time-container {
	color: #56707E;
	display: flex;
	padding: 4px 0;
}

.event-time-icon {
	width: 16px;
	height: 16px;
}

.event-time {
	font-family: Roboto,'RobotoQweb';
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	margin-left: 8px;
}

.event-location {
	display: flex;
}

.location-icon {
	width: 16px;
	height: 16px;
}

.location-detail {
	height: 16px;
	flex: 1 0 0;
	overflow: hidden;
	color: #56707E;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-family: Roboto,'RobotoQweb';
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	margin-left: 8px;
}

.notification-container {
	padding: 16px;
	margin: 36px 40px;
	border-radius: 8px;
	border: 1px solid  #F6C5C0;
	background: #FBE8E6;
	box-shadow: 0px 0px 4px 0px rgba(220, 236, 218, 0.50);
	display: none;
}

.notification-icon {
	align-self: flex-start;
	padding-right: 12px;
}

.notification-message {
	display: flex;
	flex-direction: column;
}

.notification-title {
	display: flex;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
	font-family: Roboto,'RobotoQweb';
}

.notification-subtitle {
	color:  #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	padding-top: 8px;
}

.event-wrap {
	display: flex;
	flex-direction: column;
}

.event-separator {
	height: 1px;
	width: 100%;
	background: #C1D7EC;
}

.event {
	display: flex;
	cursor: pointer;
	margin: 20px 0 20px 0;
}

.event-date {
	min-width: 56px;
	padding: 12px 8px;
	align-self: center;
	border-radius: 12px;
	background: rgba(255, 255, 255, 0.30);
	box-shadow: 0 9px 12px 0 rgba(0, 0, 0, 0.05);
	text-align: center;
}

.events-title {
	display: flex;
}

.features-text, .events-text {
	color: #364750;
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 24px;
	line-height: 32px;
}

.view-all-events {
	color: #2B5EEC;
	text-align: center;
	font-family: Roboto,'RobotoQweb';
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	text-decoration: none;
	margin-left: 10px;
	align-self: flex-end;
	padding-bottom: 4px;
}

.features {
	width: 48%;
	display: flex;
	flex-direction: column;
	margin: 0 1% 0 4%;
}

.features-title {
	display: flex;
}

.events-icon,
.features-icon {
	height: 32px;
	width: 32px;
	padding-right: 10px;
}

.left-bottom-container-listing .events .events-title, .left-bottom-container-listing .features .features-title {
	display: none;
}

.shimmer-for-features {
	display: flex;
	flex-direction: column;
}

.feature-separator {
	height: 1px;
	width: 100%;
	background: #C1D7EC;
}

.shimmer-content-feature {
	padding: 0px 12px 0px 16px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 32px;
}

.shimmer-title {
	height: 15px;
	background: linear-gradient(to right, #B6D2EA 40%, rgba(182, 210, 234, 0.32) 60%, #B6D2EA 80%);
	background-size: 300%;
	background-position-x: 100%;
	animation: shimmer-right 1s infinite linear;
}

.feature-wrap {
	display: flex;
	flex-direction: column;
}

.feature-box {
	display: flex;
	padding: 20px 12px 16px 16px;
	justify-content: center;
	align-items: flex-start;
	align-self: stretch;
	border-radius: 8px;
	border: 2px solid #FFF;
	background: linear-gradient(90deg, #FCFDFF 0%, rgba(249, 249, 249, 0.30) 52%, #F9F9F9 100%);
	box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.08);
	position: relative;
	cursor: pointer;
	margin: 20px 0 20px 0;
}

.feature-title {
	height: 40px;
	flex: 1 0 0;
	align-self: stretch;
	color: #193DAA;
	font-family: Roboto,'RobotoQweb';
	font-size: 15px;
	font-style: normal;
	font-weight: 400;
	line-height: 20px;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.feature-date-wrap {
	text-align: right;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	display: flex;
	flex-direction: column;
}

.new-badge {
	display: flex;
	padding: 0px 8px;
	align-items: flex-start;
	gap: 10px;
	position: absolute;
	top: 0px;
	right: 0px;
	border-radius: 0px 8px 0px 4px;
	background: linear-gradient(134deg, #0368C0 1%, #00A2AF 49%, #08CAD3 100%);
	color: #FFFFFF;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.25);
	font-family: Roboto,'RobotoQweb';
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 16px;
}

.feature-date-check {
	color: #364750;
}

.feature-date {
	color: #56707E;
}

/* Login Container CSS */
.login-container {
	width: 36%;
	min-height: 84%;
	margin: 2% 2% 2% 0;
	padding: 2% 2%;
	border-radius: 24px;
	background: linear-gradient(136deg, rgba(254, 254, 254, 0.80) 26%, rgba(255, 255, 255, 0.08) 157%, rgba(243, 243, 243, 0.80) 157%);
	box-shadow: 0px 4px 24px -1px rgba(6, 61, 116, 0.16);
	display: flex;
	flex-direction: column;
	height: -webkit-fill-available;
	justify-content: space-between;
}

.header-wrap, .footer-wrap {
	display: flex;
	flex-direction: column;
}

.q-logo {
	width: 50%;
	height: 84px;
	display: flex;
	background: no-repeat center;
	align-self: center;
	cursor: pointer;

	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}

#logo {
	border-left: 1px solid #C1D7EC;
	padding-left: 8px;
	margin-left: 8px;
}

.login-box {
	display: flex;
	flex-direction: column;
	padding: 64px 40px 0 40px;
	align-self: center;
}

.caps-tooltip-container-user,
.caps-tooltip-container-password {
	display: none;
	flex-direction: column;
	position: absolute;
/*	top: -40px;*/
	top: -30px;
	left: 10px;
	background: #212B31;
	color: #fff;
	font-family: Roboto,'RobotoQweb';
	font-size: 16px;
	padding: 5px;
	border-radius: 4px;
	z-index: 1;
}

.caps-lock {
	display: flex;
}

.down-arrow {
	align-self: center;
	position: absolute;
	/*top: 28px;*/
	top: 20px;
}

.user-name, .password {
	display: flex;
	width: 92%;
	padding: 15px 4%;
	gap: 10px;
	border-radius: 8px;
	border: 1px solid #C1D7EC;
	background: #FFF;
	margin: 16px 0 8px 0;
	position: relative;
}

.username-input-td,
.password-input-td {
	line-height: 20px;
	width: 100%;
}

input {
	border: none !important;
	outline: none !important;
	color: #0E1215 !important;
	font-family: Roboto, 'RobotoQweb' !important;
	font-size: 16px !important;
/*	line-height: 20px !important;*/
	width: 100% !important;
}

.forgot-password {
	color: #2B5EEC;
	display: inline;
	flex-direction: column;
	align-items: flex-end;
	font-family: Roboto, 'RobotoQweb';
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px;
	text-decoration: none;
	cursor: pointer;
	padding: 0;
	margin: 0;
}

.login-button input {
	width: 100%;
	padding: 16px 6%;
	margin: 36px 0;
	border-radius: 8px;
	background: #095FB3;
	box-shadow: 0px 14px 32px 0px rgba(0, 0, 0, 0.20), 0px 7px 18px 0px rgba(46, 167, 224, 0.18), 0px 4px 8px 0px rgba(46, 167, 224, 0.14);
	color: #FFF !important;
	text-align: center;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, 0.25);
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 20px !important;
	line-height: 24px;
	border: 0px;
	cursor: pointer;
}

.intro {
	display: flex;
	align-self: center;
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 16px;
	font-style: normal;
	line-height: 20px;
	padding-bottom: 24px;
}

.new-text {
	color: #262626;
	text-align: center;
	font-style: normal;
	font-weight: 400;
}

.try-link {
	color: #2B5EEC;
	font-weight: 500;
	padding-left: 10px;
	text-decoration: none;
}

.other-info {
	display: flex;
	flex-direction: column;
	align-items: center;
}

.other-buttons {
	display: flex;
}

.status, .support {
	display: flex;
	padding: 9px 16px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	border: 1px solid #DAE7F4;
	background: #FFF;
	box-shadow: 0px 9px 16px 0px rgba(0, 0, 0, 0.08), 0px 6px 8px 0px rgba(36, 178, 251, 0.05);
	color: #2B5EEC;
	text-align: center;
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 15px;
	font-style: normal;
	font-weight: 500;
	line-height: 20px;
	margin: 0 12px;
	text-decoration: none;
}

a.status:hover, a.support:hover {
	text-decoration: none;
	border: 1px solid #2B5EEC;
}

.other-links {
	color: #2B5EEC;
	margin-top: 24px;
	text-align: center;
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	display: flex;
}

.faq, .q-community, .q-blog, .privacy {
	color: #2B5EEC;
	padding: 0 10px;
	text-decoration: none;
}

.copyright {
	color: rgba(86, 112, 126, 0.80);
	/*font-family: Roboto, 'RobotoQweb';*/
	font-size: 12px;
	font-style: normal;
	font-weight: 400;
	line-height: 16px;
	display: flex;
	align-self: center;
	margin-top: 40px;
}

h1 {
	display: none;
}

#qg_pci, #logo {
	position: unset;
	height: 30px;
}

.form_box_shell {
    border-top: unset;
    border-bottom: unset;
	padding: unset;
}

.form_box_fields {
	 background: unset;
	 border: unset;
	 padding: unset;
}
.form_box_fields table {
	border-collapse: separate;
}

.form_box_fields table .login-errors-message {
	color: #212B31;
	font-family: Roboto, 'RobotoQweb';
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	text-align: left;
	color: #212B31;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid #F6C5C0;
	background: #FBE8E6;
	box-shadow: 0px 0px 4px 0px rgba(220, 236, 218, 0.50);
}


.form_box {
	background: unset;
    border: unset;
	width: unset;
	margin: unset;
}

.form_box_fields td {
	 text-align: unset;
	 padding: unset;
}

.user-name,
.password {
	display: flex;
	width: 92%;
	padding: 15px 4%;
	gap: 10px;
	border-radius: 8px;
	border: 1px solid #C1D7EC;
	background: #FFF;
	margin: 16px 0 8px 0;
	position: relative;
}

.user-name:focus,
.password:focus {
	border: 1px solid #528FC9;
}

.user-name:active,
.password:active {
	border: 1px solid #528FC9;
}



#username-input-td input::placeholder,
#password-input-td input::placeholder {
	font-family: Roboto, 'RobotoQweb';
	color: #56707E;
}

/*Media Queries */

@media screen and (max-height: 570px) {
	.login-container {
		height: fit-content;
	}
}
@media screen and (max-width:2000px) {
	@media screen and (max-height: 770px) {
		.left-container {
			margin: 1.4% 2.1% 1.4% 2.1%;
		}

		.login-container {
			margin: 1.4% 2% 1.4% 0;
		}

		.events-icon, .features-icon {
			height: 30px;
			width: 30px;
		}

		.features-text,
		.events-text,
		.date {
			font-size: 22px;
		}

		.month,
		.event-time,
		.feature-date-wrap {
			font-size: 11px;
		}

		.event-title,
		.feature-title {
			font-size: 13px;
		}

		input,
		.forgot-password,
		.intro,
		.status,
		.support {
			font-size: 14px;
		}

		.login-button  input {
			font-size: 18px;
		}
	}

	@media screen and (max-height: 740px) {
		.login-box {
			padding-top: 0px;
		}
	}

	@media screen and (max-height: 700px) {
		.copyright {
			margin-top: 10px;
		}
	}

	.left-container {
		margin: 2% 2.1% 1.7% 2.1%;
	}

	.features {
		margin: 0 1% 0 6%;
	}

	.status {
		margin: 0 24px;
	}

	.support {
		margin: 0 24px 0 0;
	}

	.event,
	.feature,
	.feature-box {
		margin: 24px 0 24px 0;
	}

	.left-bottom-container {
		margin: 5.1% 5% 24px 5%;
	}

	.left-bottom-container-listing {
		margin: 0 5% 0 5%;
	}
}

@media screen and (max-width:1300px) {
	@media screen and (max-height: 2000px) {
		.left-container {
			margin: 2% 1.9% 3.8% 1.9%;
		}

		.features-text,
		.events-text {
			font-size: 20px;
		}

		.login-box {
			padding: 0;
			margin-top: 30%;
		}
	}

	@media screen and (max-height: 770px) {
		.left-container {
			margin: 1.4% 2.1% 1.4% 2.1%;
		}

		.login-container {
			margin: 1.4% 2% 1.4% 0;
		}

		.features-text,
		.events-text,
		.date {
			font-size: 22px;
			line-height: 22px;
		}

		.month,
		.event-time,
		.feature-date-wrap {
			font-size: 11px;
		}

		.event-title,
		.feature-title {
			font-size: 13px;
		}

		input,
		.forgot-password,
		.intro,
		.status,
		.support {
			font-size: 13px;
		}

		.login-button input {
			font-size: 18px !important;
		}

		.login-box {
			padding: 0;
			margin-top: 15%;
		}
	}

	.indicators {
		padding-top: 20px;
	}

	.copyright {
		flex-direction: column;
		margin-top: 16px;
	}

	.left-controls,
	.right-controls {
		height: 36px;
		width: 36px;
	}

	.banner-images {
		border-radius: 16px;
		margin: 0 12px;
	}

	.banner-wrap {
		border-radius: 16px;
		cursor: pointer;
	}

	.learn-more {
		height: 16px;
		width: 61px;
		bottom: 30px;
		border-radius: 8px;
		padding: 8px 16px;
		font-size: 12px;
		line-height: 16px;
	}

	.q-logo {
		height: 56px;
	}

	.login-button input {
		font-size: 15px;
	}

	.forgot-password {
		font-size: 13px;
		line-height: 16px;
	}

	.login-button input {
		margin: 20px 0;
		padding: 12px 6%;
	}

	.intro {
		font-size: 13px;
		line-height: 16px;
	}

	.status,
	.support {
		font-size: 13px;
		line-height: 16px;
		padding: 7px 16px;
	}

	.status {
		margin: 12px 12px 0 12px;
	}

	.support {
		margin: 12px 12px 0 0;
	}

	.other-links {
		margin-top: 12px;
	}

	.user-name,
	.password {
		margin: 8px 0 8px 0;
		padding: 11px 4%;
	}

	.password {
		margin-top: 16px;
	}

	.notification-container {
		margin: 36px 0;
	}

	.feature-title {
		font-size: 13px;
		line-height: 16px;
		height: 32px;
	}

	.event-date {
		padding: 8px 8px;
	}

	.event-title {
		font-size: 13px;
	}

	.events-icon,
	.features-icon {
		height: 24px;
		width: 24px;
	}

	.features {
		margin: 0 1% 0 6.4%;
	}

	.left-bottom-container {
		margin: 4.8% 5% 16px 5%;
	}

	.login-container {
		padding: 24px 2%;
	}

	.features-text,
	.events-text {
		line-height: 28px;
	}

	.left-bottom-container-listing {
		margin: 0 5% 0 5%;
	}

	.event,
	.feature,
	.feature-box {
		margin: 16px 0 16px 0;
	}
}

@media screen and (max-width:1050px) {
	.banner-images {
		border-radius: 12px;
		margin: 0 6px;
	}

	.banner-wrap {
		border-radius: 12px;
		cursor: pointer;
	}

	.learn-more {
		height: 16px;
		width: 60px;
		bottom: 23px;
		border-radius: 8px;
		padding: 8px 16px;
		font-size: 12px;
		line-height: 16px;
	}
}
@media screen and (max-width:1080px) {
	.view-all-events {
		font-size: 11px;
	}

	.features-text, .events-text {
		font-size: 18px;
	}
}

@media screen and (max-width:900px) {
	.indicators {
		padding-top: 16px;
	}

	.container {
		flex-direction: column;
		position: relative;
		margin-bottom: 52px;
	}

	.copyright {
		position: absolute;
		bottom: -20px;
	}

	.login-container {
		order: 1;
		width: 96%;
		padding: 24px 0 0 0;
		margin: 2%;
	}

	.banner-images {
		border-radius: 8px;
		margin: 0;
	}

	.banner-wrap {
		border-radius: 8px;
		cursor: pointer;
	}

	.left-controls,
	.right-controls {
		display: none;
	}

	.left-container {
		width: 96%;
		order: 2;
		margin: 2%;
	}

	.left-bottom-container {
		flex-direction: column;
		margin: 60px 0px 0px 0px;
	}

	.left-bottom-container-listing {
		flex-direction: column;
		margin: 60px 0px 0px 0px;
	}

	.events {
		width: 100%;
	}

	.features {
		width: 100%;
		margin: 40px 0px;
	}

	.other-info {
		margin-top: 120px;
	}

	.learn-more {
		height: 11px;
		width: 40px;
		bottom: 16px;
		border-radius: 8px;
		padding: 5px 10px;
		font-size: 7px;
		line-height: 10px;
	}

	.login-box {
		margin: 10% 5%;
	}

	.other-links {
		padding-bottom: 40px;
	}

	.notification-container {
		margin: 0 5%;
	}

	.left-bottom-container-listing .events .events-title,
	.left-bottom-container-listing .features .features-title {
		display: flex;
	}

	.left-bottom-container {
		display: none;
		margin: 0 0 16px 0;
	}

	.view-all-events {
		font-size: 12px;
	}

	.features-text,
	.events-text {
		font-size: 20px;
	}
}

.alert-messages-container {
	display: flex;
	/*display:none;*/
	font-family: Roboto,'RobotoQweb';
	color:  #212B31;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid  #F6C5C0;
	background: #FBE8E6;
	box-shadow: 0px 0px 4px 0px rgba(220, 236, 218, 0.50);
	margin-bottom: 28px;
}

.alert-icon {
	align-self: flex-start;
	padding-right: 12px;
}

.alert-content {
	display: flex;
	flex-direction: column;
}

.alert-message-header,
.notification-header {
	display: flex;
	font-size: 16px;
	font-style: normal;
	font-weight: 700;
	line-height: 20px;
}

.alert-message {
	color: #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	padding-top: 8px;
	text-align: left;
}

.notification-warning-message {
	font-family: Roboto,'RobotoQweb';
	color:  #212B31;
	padding: 16px;
	border-radius: 8px;
	background-color: #FFFEF4;
	border: 1px solid #F8DB2C;
	box-shadow: 0px 0px 4px 0px rgba(220, 236, 218, 0.50);
	/*margin-bottom: 28px;*/
	color: #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	padding-top: 8px;
	text-align: left;
}

.notification-error-message {
	/*display: flex;*/
	font-family: Roboto,'RobotoQweb';
	color:  #212B31;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid  #F6C5C0;
	background: #FBE8E6;
	box-shadow: 0px 0px 4px 0px rgba(220, 236, 218, 0.50);
	/*margin-bottom: 28px;*/
	color: #212B31;
	font-family: Roboto,'RobotoQweb';
	font-size: 13px;
	font-weight: 400;
	line-height: 16px;
	padding-top: 8px;
	text-align: left;
}

.header {
	display: flex;
	flex-direction: row;
	padding-bottom: 10px;
}

.field-error {
	background: rgb(255, 251, 251);
	border: 1px solid rgb(225, 25, 0);
}

.notification_box {
	border:none;
}

.forgot-password-container {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}