/*-------------------------- Put all of your Custom Classes here - Go nuts --------------------------*/
:root {
	--clients: #85D3F2;
	--clientsl: #D0EAF4;
	--clientsd: #3F6473;
    --finances: #9fc31d;
	--financesl: #b8cf66;
	--financesd: #617320;
	--projects: #7663F2;
	--projectsl: #B7AEF4;
	--projectsd: #382F73;
    --dashboard: #F24B78;
	--dashboardl: #F495AE;
	--dashboardd: #732439;
	--operations: #F2B705;
	--operationsl: #F4CB4E;
	--operationsd: #574101;
	--reports: #cd5c5c;
    --sales: #3b81f9;
    --salesl: #88b2f7;
    --salesd: #2a61ba;
    --green: #548235;
	--greenl: #9fc585;
	--greend: #30491f;
    --yellow: #efc443;
    --orange: #e7762c;
	--orangel:rgb(250, 181, 134);
	--oranged:rgb(138, 70, 24);
    --tan: #a0907c;
	--tanl: #d1bca3;
	--tand: #6b6053;
    --dark: #191919;
	--darkl: #999999;
	--darkd: #030303;
	--light: #E3E3E3;
	--lightl: #F0F0F0;
	--lightd: #bcbcbc;
	--black: #000000;
	--white: #ffffff;
}
html {
	font-family: "Montserrat" ,sans-serif;
}
input,
select,
textarea {
    border: 1px solid var(--lightd);
    border-radius: 4px;
    padding: 1px 2px;
}
input[type="submit"] {
	cursor: pointer;
}
h5>p {
	font-size: 1rem;
	margin-bottom: 0;
}
p>a {
	font-size: inherit;
}
strong {
	font-size: inherit;
	font-weight: 600;
}
#main>header {
    position: fixed;
    z-index: 2;
}
#login-page,
#incoming-call {
    background: -webkit-linear-gradient(-45deg, var(--clientsl) 0%, var(--clients) 100%);
    min-height: 100vh;
	overflow: hidden;
}
#login-section,
#top,
#title {
    text-shadow: 0 1px 4px rgba(0,0,0,.3);
	z-index: 3;
}
#top h1,
#title h1 {
    font-size: 20rem;
    line-height: 200px;
}
#client {
    min-height: calc(100vh - 50px);
}
#client a.domain:hover {
    color: var(--clients);
}
#client #basic-info-box {
    flex: 1 0 90%;
}
#client-history-container {
    position: fixed;
    height: 100%;
    right: 0;
    max-width: 33%;
	z-index: 1;
}
#history-container {
	position: fixed;
	right: 0;
    height: 100%;
    width: 20px;
	transition: width 0.5s ease-in-out;
	z-index: 1;
}
#history-container.isOut {
	width: 33vw;
}
#hist-sidebar {
    overflow-y: auto;
	width: 100%;
}
#hist-tab {
    height: 10%;
    writing-mode: vertical-rl;
    position: relative;
}
#incoming {
    height: 100vh;
}
#incoming form {
    height: 100%;
}
#logo {
    max-height: 50vh;
}
#logo:hover {
    transform: rotate(-4deg);
}
#logo-box {
	background-color: var(--light);
	min-width: 300px;
	z-index: 99;
}
#logo-box .logo:hover {
	-webkit-box-shadow: none;
	        box-shadow: none;
}
#notification-bell {
	position: fixed;
	top: 12px;
	right: 16px;
	cursor: pointer;
	padding: 8px;
	border-radius: 4px;
	z-index: 101;
	-webkit-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}
#notification-bell:hover {
	background-color: var(--lightd);
}
#notification-bell .fa-bell {
	font-size: 18px;
}
.notification-badge {
	position: absolute;
	top: 0;
	right: 0;
	background: #ff1900;
	color: white;
	border-radius: 50%;
	font-size: 10px;
	font-weight: bold;
	min-width: 16px;
	height: 16px;
	line-height: 16px;
	text-align: center;
	padding: 0 4px;
}
#notification-dropdown {
	display: none;
	position: absolute;
	top: 100%;
	right: 0;
	min-width: 340px;
	width: 340px;
	max-height: 420px;
	overflow-y: auto;
	background: var(--white);
	border: 1px solid var(--silver);
	border-radius: 6px;
	-webkit-box-shadow: 0 4px 12px rgba(0,0,0,0.15);
	        box-shadow: 0 4px 12px rgba(0,0,0,0.15);
	z-index: 100;
}
#notification-dropdown .notification-item > a {
	min-width: 0;
	flex: 1;
}
#notification-dropdown .notification-item > a > div {
	min-width: 0;
}
#notification-dropdown .notification-item > a > div > p {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 100%;
}
.notification-actions {
	flex-shrink: 0;
	white-space: nowrap;
}
.notification-item.urgency-1 {
	border-left: 3px solid var(--dashboard);
}
.notification-item.urgency-2 {
	border-left: 3px solid var(--red);
	background-color: #fff5f5;
}
.toggle-switch {
	position: relative;
	display: inline-block;
	width: 40px;
	height: 22px;
	flex-shrink: 0;
}
.toggle-switch input {
	opacity: 0;
	width: 0;
	height: 0;
}
.toggle-slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: var(--silver);
	border-radius: 22px;
	-webkit-transition: background-color 0.2s ease;
	transition: background-color 0.2s ease;
}
.toggle-slider::before {
	content: "";
	position: absolute;
	height: 16px;
	width: 16px;
	left: 3px;
	bottom: 3px;
	background-color: white;
	border-radius: 50%;
	-webkit-transition: -webkit-transform 0.2s ease;
	transition: transform 0.2s ease;
}
.toggle-switch input:checked + .toggle-slider {
	background-color: var(--green);
}
.toggle-switch input:checked + .toggle-slider::before {
	-webkit-transform: translateX(18px);
	transform: translateX(18px);
}
#menu-box {
	height: auto;
}
#modal {
	margin: 0 !important;
}
#notes-info-box p {
	margin: 0 !important;
}
#sidebar {
	height: 100vh;
	overflow: hidden;
	-webkit-transition: none;
	transition: none;
}
#sidebar-container {
	height: 100vh;
	position: fixed;
	z-index: 3;
}
#slide-tab {
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	-webkit-transform: perspective(40px) rotateY(40deg);
	transform: perspective(40px) rotateY(40deg);
	cursor: pointer;
	margin-left: -1px;
	z-index: -1;
}
.no-anim {
    -webkit-transition: none;
    transition: none;
}
.no-style {
    font-style: unset;
}
.curved-s {
	border-radius: 4px;
}
.row-5 {
    width: 5%;
}
.row-99 {
    width: 99%;
}
.row-dash {
	width: 55px;
	height: 15px;
	margin-right: -2px;
}
.row-dot {
	width: 80px;
	height: 80px;
	max-width: 80px;
}
.column>.box.fit {
    flex: 1;
}
.gap {
	gap: 1rem;
}
.gap-2 {
	gap: 2rem;
}
.gap-3 {
	gap: 3rem;
}
.gap-4 {
	gap: 4rem;
}
.gap-5 {
	gap: 5rem;
}
.gap-c {
	column-gap: 1rem;
}
.gap-r {
	row-gap: 1rem;
}
.bottom-round {
	border-bottom-left-radius: .5rem;
	border-bottom-right-radius: .5rem;
}
.left-round {
	border-bottom-left-radius: .5rem;
	border-top-left-radius: .5rem;
}
.right-round {
	border-top-right-radius: .5rem;
	border-bottom-right-radius: .5rem;
}
.top-round {
	border-top-left-radius: .5rem;
	border-top-right-radius: .5rem;
}
.active-wi {
	box-shadow: 0 1px 4px rgb(158 219 52), 0 0 40px rgba(0 0 0 / 10%) inset;
	transform: translate(2px, 2px);
}
.bx-u {
    background-color: var(--lightd);
}
.bx-b {
    background-color: var(--yellow);
}
.bx-c,
.bx-reg,
.bx-time,
.bx-guide {
    background-color: var(--orange);
}
.bx-cl {
	background-color: var(--orangel);
}
.bx-a,
.bx-365,
.bx-profile {
    background-color: var(--green);
}
.bx-m,
.bx-des,
.bx-marketing,
.bx-dashboard,
.bx-reference {
    background-color: var(--dashboard);
}
.bx-ml,
.bx-dashboardl {
	background-color: var(--dashboardl);
}
.bx-dev,
.bx-dashboardd {
	background-color: var(--dashboardd);
}
.bx-w,
.bx-hos,
.bx-hosting {
    background-color: var(--tan);
}
.bx-reports {
    background-color: var(--reports);
}
.bx-documents,
.bx-other {
    background-color: var(--tan);
}
.bx-wl,
.bx-documentsl {
	background-color: var(--tanl);
}
.bx-tand,
.bx-wd,
.bx-hosd,
.bx-hostingd,
.bx-documentsd {
	background-color: var(--tand);
}
.bx-dl,
.bx-clients,
.bx-checklist {
    background-color: var(--clients);
}
.bx-clientsl {
    background-color: var(--clientsl);
}
.bx-clientsd {
    background-color: var(--clientsd);
}
.bx-p,
.bx-seo,
.bx-project,
.bx-projects,
.bx-training {
    background-color: var(--projects);
}
.bx-ppc,
.bx-projectsd,
.bx-admin,
.bx-iqu {
    background-color: var(--projectsd);
}
.bx-projectsl {
    background-color: var(--projectsl);
}
.br-projects {
	border-color: var(--projects);
}
.br-projectsd,
.br-admin {
	border-color: var(--projectsd);
}
.br-projectsl {
	border-color: var(--projectsl);
}
.bx-rev,
.bx-email,
.bx-sales {
    background-color: var(--sales);
}
.bx-d,
.bx-ada,
.bx-salesd {
	background-color: var(--salesd);
}
.bx-dns,
.bx-operations,
.bx-list {
    background-color: var(--operations);
}
.bx-h,
.bx-em,
.bx-finances,
.bx-hourly,
.bx-key-process {
    background-color: var(--finances);
}
.bx-Issue,
.bx-issue {
	background-color: #e60017;
}
.bx-Quote,
.bx-quote {
	background-color: #f06673;
}
.bx-Update,
.bx-update {
	background-color: #7f1725;
}
.tall {
	height: 100%;
}
.tx-ops-counter {
	font-size: 20rem;
}
.tx-mid {
    font-size: 1.4rem;
}
.tx-block-serif {
	font-family: "Ultra" ,serif;
}
.tx-simple {
	font-family: "Roboto" ,sans-serif;
}
.tx-clients,
.tx-checklist {
    color: var(--clients);
}
.tx-clientsl {
    color: var(--clientsl);
}
.tx-clientsd {
    color: var(--clientsd);
}
.tx-m,
.tx-des,
.tx-marketing,
.tx-dashboard,
.tx-reference {
    color: var(--dashboard);
}
.tx-dashboardl {
    color: var(--dashboardl);
}
.tx-dev,
.tx-dashboardd {
    color: var(--dashboardd);
}
.tx-seo,
.tx-training,
.tx-projects {
    color: var(--projects);
}
.tx-projectsl {
    color: var(--projectsl);
}
.tx-ppc,
.tx-iqu,
.tx-projectsd,
.tx-admin {
    color: var(--projectsd);
}
.tx-email,
.tx-sales {
    color: var(--sales);
}
.tx-salesl {
    color: var(--salesl);
}
.tx-ada,
.tx-salesd {
    color: var(--salesd);
}
.tx-dns,
.tx-list,
.tx-operations {
    color: var(--operations);
}
.tx-operationsl {
    color: var(--operationsl);
}
.tx-operationsd {
    color: var(--operationsd);
}
.tx-h,
.tx-key-process,
.tx-finances {
    color: var(--finances);
}
.tx-financesl {
    color: var(--financesl);
}
.tx-financesd {
    color: var(--financesd);
}
.tx-darkwhite,
.tx-darkwhitet {
    color: var(--clientsd);
}
.tx-u {
    color: var(--lightd);
}
.tx-a,
.tx-hourly,
.tx-profile {
    color: var(--green);
}
.tx-b {
    color: var(--yellow);
}
.tx-c,
.tx-project,
.tx-reg,
.tx-time,
.tx-guide {
    color: var(--orange);
}
.tx-reports {
	color: var(--reports);
}
.tx-w,
.tx-tan,
.tx-hosting,
.tx-other,
.tx-documents {
	color: var(--tan);
}
.tx-tanl,
.tx-documentsl {
	color: var(--tanl);
}
.tx-tand,
.tx-documentsd {
	color: var(--tand);
}
.tx-at,
.tx-clientst,
.tx-darkt,
.tx-dashboardt,
.tx-dashboardlt,
.tx-greent,
.tx-greyt,
.tx-financest,
.tx-hourlyt,
.tx-operationst,
.tx-oranget,
.tx-projectst,
.tx-projectsdt,
.tx-salest,
.tx-silvert,
.tx-skyt,
.tx-hostingt,
.tx-timet {
    color: var(--white);
}
.tx-Issue,
.tx-issue {
	color: #e60017;
}
.tx-Quote,
.tx-quote {
	color: #f06673;
}
.tx-Update,
.tx-update {
	color: #7f1725;
}

.bx-darkwhite a:hover, a.bx-darkwhite:hover {
    color: rgba(0, 0, 0, .5);
}
.contact-remove {
	position: absolute;
	bottom: 15px;
}
.hist-container {
	font-size: 0;
}
.hist {
	display: inline-block;
	position: relative;
	width: 4px;
	margin-right: 1px;
	vertical-align: bottom;
	anchor-name: --hist-bar;
	anchor-scope: --hist-bar;
}
.hist-unknown {
	height: 2px;
	background-color: var(--lightd);
}
.hist-down {
	height: 4px;
	background-color: var(--dashboard);
}
.hist-up {
	height: 12px;
	background-color: var(--green);
}
.hist-cert {
	height: 8px;
	background-color: var(--operations);
}
.hist-err {
	height: 8px;
	background-color: var(--orange);
}
.hist-tip {
	display: none;
	position: fixed;
	min-width: 100px;
	z-index: 100;
	position-anchor: --hist-bar;
	position-area: top center;
	position-try-fallbacks: flip-inline, flip-block, flip-block flip-inline;
	margin-bottom: 4px;
}
.hist-tip::before {
	content: '';
	display: block;
	position: absolute;
	bottom: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-right: 3px solid transparent;
	border-left: 3px solid transparent;
	border-top: 8px solid var(--darkl);
	border-bottom: 0 solid transparent;
}
.hour-tip {
	display: none;
	position: fixed;
	z-index: 100;
	position-anchor: --hour-bar;
	position-area: bottom center;
	position-try-fallbacks: flip-inline, flip-block, flip-block flip-inline;
	margin-top: 4px;
}
.hour-tip::before {
	content: '';
	display: block;
	position: absolute;
	top: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-right: 3px solid transparent;
	border-left: 3px solid transparent;
	border-bottom: 8px solid var(--darkl);
	border-top: 0 solid transparent;
}
.hist:hover > .hist-tip,
.hour-day:hover > .hour-tip {
	display: block;
}
.ops-status-filter {
	padding: 6px 12px;
	border: none;
	outline: none;
	opacity: 0.5;
	transition: opacity 0.2s ease;
}
.ops-status-filter:hover {
	opacity: 0.8;
}
.ops-status-filter.active {
	opacity: 1;
}
.hour-burn-left h2,
.task-left-burn h2 {
	line-height: 0.8;
}
.hour-day {
	margin-right: 1px;
	min-height: 5px;
	anchor-name: --hour-bar;
	anchor-scope: --hour-bar;
}
.hour-tip {
	min-width: 175px;
}
.badge-tip-anchor {
	anchor-name: --badge;
	anchor-scope: --badge;
}
.badge-tip {
	display: none;
	position: fixed;
	z-index: 100;
	position-anchor: --badge;
	position-area: bottom center;
	position-try-fallbacks: flip-inline, flip-block, flip-block flip-inline;
	margin-top: 4px;
	white-space: nowrap;
}
.badge-tip::before {
	content: '';
	display: block;
	position: absolute;
	top: -8px;
	left: 50%;
	transform: translateX(-50%);
	width: 0;
	height: 0;
	border-right: 3px solid transparent;
	border-left: 3px solid transparent;
	border-bottom: 8px solid var(--darkl);
	border-top: 0 solid transparent;
}
.badge-tip-anchor:hover > .badge-tip {
	display: block;
}
.alert-icon {
    padding: 2px 0;
}
.tiny-icon {
	min-width: 24px;
	max-width: 24px;
	height: 24px;
}
.ck.ck-editor {
	width: 100% !important;
}
.client-logo {
    width: 150px;
    height: 150px;
    object-fit: cover;
}
.client-type-icon,
.client-level-icon {
    height: 24px;
    width: 24px;
}
.connection-group .ajaxinput:last-of-type {
    border: none;
}
.highlite-box {
    max-width: 100px;
	min-height: 90px;
}
.hr {
	height: 2px;
	width: 100%;
}
.icon-box {
	min-width: 45px;
}
.opp-box {
	max-width: 34px;
}
.stage-box {
	max-width: 38px;
}
.report-caret {
	transition: transform 0.2s ease;
	margin-right: 4px;
}
button {
	white-space: nowrap;
}
.stage-box .circle{
	height: 35px;
}
.logo {
    width: 100px;
}
.modalbox .logo {
    height: 100px;
    object-fit: contain;
}
.md-close {
    position: absolute;
    right: 10px;
    top: 10px;
    cursor: pointer;
}
.modalbg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	z-index: 5;
}
.modalbox {
    position: absolute;
    top: -50vh;
	max-height: 100%;
    overflow-y: auto;
    animation: modal-open .5s forwards;
    -webkit-transition: none;
	transition: none;
}
.no-shadow {
	box-shadow: none !important;
}
.md-clickable,
.sb-clickable {
	cursor: pointer;
}
.page-btn:hover {
	cursor: pointer;
	background-color: var(--clients);
	color: var(--white);
}
.project-note a {
	font-size: 1.2rem;
	font-weight: 500;
	color: var(--projectsd);
}
.project-note a:hover {
	color: var(--projects);
}
.project-stage-bg {
	position: absolute;
	top: 0;
	width: 100%;
	height: 100%;
}
.project-stage-deets {
    max-height: 0;
	opacity: 0;
	overflow: hidden;
	transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out, overflow 0.9s ease-in-out;
}
.project-stage-deets.isDown {
	max-height: 100%;
	opacity: 1;
	overflow: visible;
}
.recent-blip {
    position: absolute;
    top: -10px;
    left: -8px;
    min-height: 20px;
    min-width: 20px;
    rotate: -90deg;
}
.sb-item>.sb-item-header:hover {
	background-color: var(--white) !important;
	z-index: 9;
}
.sb-item-disabled {
	background-color: rgba(188,188,188,.1);
	color: var(--lightd) !important;
	cursor: default;
}
.sb-sub-border-bottom {
	border-bottom: 1px solid var(--light);
    border-image:   linear-gradient(to right, #810195 15.1%, #dcdcdc 15.1%) 1;
}
.sb-sub-border-top {
    border-top: 1px solid var(--light);
    border-image:   linear-gradient(to right, #810195 15.1%, #dcdcdc 15.1%) 1;
}
.sb-sub-group,
.sb-sub-item {
    display: none;
    -webkit-transition: none;
	transition: none;
}
.tt-menu {
    width: 100%;
}
.tt-highlight {
    font-size: inherit;
    color: var(--dashboard);
}
input[type=radio].css-radio {
	position:absolute;
	z-index:-1000;
	left:-1000px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height:1px;
	width:1px;
	margin:-1px;
	padding:0;
	border:0;
}

input[type=radio].css-radio + label.css-rlabel {
	padding-left:26px;
	padding-top: 5px;
	height:21px;
	display:inline-block;
	background-repeat:no-repeat;
	background-position: 0 0;
	cursor:pointer;
}

input[type=radio].css-radio:checked + label.css-rlabel {
	background-position: 0 -21px;
}
label.css-rlabel {
	background-image:url(../media/images/radio.png);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
input[type=checkbox].css-checkbox {
	position:absolute;
	z-index:-1000;
	left:-1000px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	height:1px; width:1px;
	margin:-1px;
	padding:0;
	border:0;
}

input[type=checkbox].css-checkbox + label.css-label {
	padding-left:30px;
	height:25px;
	display:inline-block;
	line-height:25px;
	background-repeat:no-repeat;
	background-position: 0 0;
	vertical-align:middle;
	cursor:pointer;
}

input[type=checkbox].css-checkbox:checked + label.css-label {
	background-position: 0 -25px;
}
label.css-label {
	background-image:url(../media/images/checkboxo.png);
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

/*-------------------------- Calendar --------------------------*/
.ui-datepicker {
	background: #eeeeee;
	height: auto;
	margin: 5px auto 0;
	font: 9pt Arial, sans-serif;
	-webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
	box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, .5);
}
.ui-datepicker a {
	text-decoration: none;
}
.ui-datepicker table {
	width: 100%;
}
.ui-datepicker-header {
	background: var(--clientsd);
	color: var(--dark);
	font-weight: 700;
	-webkit-box-shadow: inset 0px 1px 1px 0px rgba(250, 250, 250, 2);
	box-shadow: inset 0px 1px 1px 0px rgba(250, 250, 250, .2);
	line-height: 30px;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: var(--darkd);
}
.ui-datepicker-title {
	text-align: center;
}
.ui-datepicker-prev, .ui-datepicker-next {
	display: inline-block;
	width: 30px;
	height: 30px;
	text-align: center;
	cursor: pointer;
	background-image: url('../media/images/arrow.png');
	background-repeat: no-repeat;
	line-height: 600%;
	overflow: hidden;
}
.ui-datepicker-prev {
	float: left;
	background-position: center -30px;
}
.ui-datepicker-next {
	float: right;
	background-position: center 0px;
}
.ui-datepicker thead {
	background-color: #f7f7f7;
	background-image: -webkit-gradient(linear,  left top, left bottom,  from(#f7f7f7),to(#f1f1f1));
	background-image: linear-gradient(top,  #f7f7f7 0%,#f1f1f1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f1f1f1',GradientType=0 );
	border-bottom: 1px solid #bbb;
}
.ui-datepicker th {
	text-transform: uppercase;
	font-size: 6pt;
	padding: 5px 0;
	color: var(--dark);
	text-shadow: 1px 0px 0px var(--white);
	-webkit-filter: dropshadow(color=var(--white), offx=1, offy=0);
	filter: dropshadow(color=var(--white), offx=1, offy=0);
}
.ui-datepicker tbody td {
	padding: 0;
	border-right: 1px solid #bbb;
}
.ui-datepicker tbody td:last-child {
	border-right: 0px;
}
.ui-datepicker tbody tr {
	border-bottom: 1px solid #bbb;
}
.ui-datepicker tbody tr:last-child {
	border-bottom: 0px;
}
.ui-datepicker td span, .ui-datepicker td a {
	display: inline-block;
	font-weight: bold;
	text-align: center;
	width: 30px;
	height: 30px;
	line-height: 30px;
	color: var(--dark);
	text-shadow: 1px 1px 0px var(--white);
	-webkit-filter: dropshadow(color=var(--white), offx=1, offy=1);
	filter: dropshadow(color=var(--white), offx=1, offy=1);
}
.ui-datepicker-calendar .ui-state-default {
	background: #ededed;
	background: -webkit-gradient(linear,  left top, left bottom,  from(top),  color-stop(0%, #ededed),to(#dedede));
	background: linear-gradient(top,  #ededed 0%,#dedede 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#dedede',GradientType=0 );
	-webkit-box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
	box-shadow: inset 1px 1px 0px 0px rgba(250, 250, 250, .5);
}
.ui-datepicker-unselectable .ui-state-default {
	background: #f4f4f4;
	color: #b4b3b3;
}
.ui-datepicker-calendar .ui-state-hover {
	background: #f7f7f7;
}
.ui-datepicker-calendar .ui-state-active {
	background: #6eafbf;
	-webkit-box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	box-shadow: inset 0px 0px 10px 0px rgba(0, 0, 0, .1);
	color: #e0e0e0;
	text-shadow: 0px 1px 0px #4d7a85;
	-webkit-filter: dropshadow(color=#4d7a85, offx=0, offy=1);
	filter: dropshadow(color=#4d7a85, offx=0, offy=1);
	border: 1px solid #55838f;
	position: relative;
	margin: -1px;
}

.box-area{ 
    height: 100vh;
    width: 100%;
    z-index: 0
}
.boxes{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.boxes li{
    position: absolute;
    display: block;
    list-style: none;
    width: 20px;
    height: 20px;
    background-image: url("/assets/media/images/logo-300x214.png");
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    animation: boxes-animate 25s linear infinite;
    bottom: -150px;
}
.boxes li:nth-child(1){
    left: 25%;
    width: 80px;
    height: 80px;
    animation-delay: 0s;
}
.boxes li:nth-child(2){
    left: 10%;
    width: 20px;
    height: 20px;
    animation-delay: 2s;
    animation-duration: 12s;
}
.boxes li:nth-child(3){
    left: 70%;
    width: 20px;
    height: 20px;
    animation-delay: 4s;
}
.boxes li:nth-child(4){
    left: 40%;
    width: 60px;
    height: 60px;
    animation-delay: 0s;
    animation-duration: 18s;
}
.boxes li:nth-child(5){
    left: 65%;
    width: 20px;
    height: 20px;
    animation-delay: 0s;
}
.boxes li:nth-child(6){
    left: 75%;
    width: 110px;
    height: 110px;
    animation-delay: 3s;
}
.boxes li:nth-child(7){
    left: 35%;
    width: 150px;
    height: 150px;
    animation-delay: 7s;
}
.boxes li:nth-child(8){
    left: 50%;
    width: 25px;
    height: 25px;
    animation-delay: 15s;
    animation-duration: 45s;
}
.boxes li:nth-child(9){
    left: 20%;
    width: 15px;
    height: 15px;
    animation-delay: 2s;
    animation-duration: 35s;
}
.boxes li:nth-child(10){
    left: 85%;
    width: 150px;
    height: 150px;
    animation-delay: 0s;
    animation-duration: 11s;
}
.pulse {
	box-shadow: 0 0 0 0 rgba(0, 0, 0, 1);
    transform: scale(1);
    animation: pulse 2s infinite 3.3s;
}
.shake {
	animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) infinite both;
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
	perspective: 1000px;
}
.shake2 {
	animation: shake 0.82s cubic-bezier(.36,.07,.19,.97) 0.41s infinite both;
	transform: translate3d(0, 0, 0);
	backface-visibility: hidden;
	perspective: 1000px;
}
/*
.colorize-0 {
	animation: colorize 0.3s ease;
}
.colorize-1 {
	animation: colorize1 0.3s ease 0.3s;
}
.colorize-2 {
	animation: colorize 0.3s ease 0.6s;
}
.colorize-3 {
	animation: colorize 0.3s ease 0.9s;
}
.colorize-4 {
	animation: colorize 0.3s ease 1.2s;
}
.colorize-5 {
	animation: colorize 0.3s ease 1.5s;
}
.colorize-6 {
	animation: colorize 0.3s ease 1.8s;
}
.colorize-7 {
	animation: colorize 0.3s ease 2.1s;
}
.colorize-8 {
	animation: colorize 0.3s ease 2.4s;
}
.colorize-9 {
	animation: colorize 0.3s ease 2.7s;
}
.colorize-10 {
	animation: colorize 0.3s ease 3.0s;
}
*/
@keyframes boxes-animate {
    0%{
        transform: translateY(0) rotate(0deg);
        opacity: 1;
    }
    100%{
        transform: translateY(-1000px) rotate(720deg);
        opacity: 0;
    }
}
@keyframes modal-open {
    0%{
		top: -100%;
    }
    100%{
		top: 50%;
		transform: translateY(-50%);
    }
}
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
    }

    70% {
        transform: scale(1.05);
        box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
    }

    100% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
    }
}
@keyframes shake {
	10%, 90% {
	  	transform: translate3d(-1px, 0, 0);
	}
	
	20%, 80% {
	  	transform: translate3d(1px, 0, 0);
	}
  
	30%, 50%, 70% {
	  	transform: translate3d(-2px, 0, 0);
	}
  
	40%, 60% {
	  	transform: translate3d(2px, 0, 0);
	}
}
@keyframes colorize {
	0% {
	  	background-color: rgba(188, 188, 188, .5);
	  	color: rgba(74, 79, 84, .5);
	}
}
@keyframes colorize1 {
	0% {
	  	background-color: rgba(188, 188, 188, .5);
	  	color: rgba(74, 79, 84, .5);
	}
	100% {
		background-color: #F24B78;
	  	color: #ffffff;
	}
}

/*-------------------------- Media Queries --------------------------*/
@media (max-width: 1440px) {
	#title h1 {
        font-size: 14rem;
        line-height: 140px;
    }
    .alert-icon {
        display: none;
    }
}
/* Tablet Width Classes */
@media (max-width: 1024px) {
    #incoming div.row-75 {
        width: 100%;
    } 
    #incoming #title {
        position: fixed;
        bottom: 0;
        right: 0;
        z-index: -1;
    }
	#title h1 {
        font-size: 10rem;
        line-height: 100px;
    }
    .alert-icon {
        display: none;
    }
}
/* Mobile Width Classes */
@media (max-width: 680px) {
	
}