/* Epic Team Availability v1.0 */
body { background-color: #000000; }
#footer { display: none; }
#header, #page > hr { display: none; }
.mar-b-20 { margin-bottom: 20px; }
.mar-t-10 { margin-top: 10px; }
.mar-t-20 { margin-top: 20px; }
.mar-t-30 { margin-top: 30px; }
.mar-t-40 { margin-top: 40px; }
.col-md-6 { margin: 10px auto; }
h1,h2,h3,h4,h5,h6,p { font-family: 'Urbanist', sans-serif; font-weight: 400; }
.epic_title_four { font-size: 1.1rem; }
.availablility_main h1, .availablility_main h2, .availablility_main h3, .availablility_main h4, .availablility_main h5, .availablility_main h6, .availablility_main p { color: #fff; }
.white { color: #fff; }
.black { color: #000; }
.red { color: red; }
.strong { font-weight: bold; }
h3 { font-size: 25px; }
h3 { font-size: 20px; }
.pad-30 { padding: 30px; }
.team_title { font-size: 18px; font-weight: 600; }
.label_head { display: flex; align-items: center; justify-content: space-between; padding: 0px 30px; }
.filters { display: flex; align-items: center; justify-content: center; margin-bottom: 25px; }
.filters label { margin-right: 12px; color: #fff; }
.team_label { font-size: 1.2rem; font-weight: bold; }
.flexing { display: flex; }
.align-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-space-around { justify-content: space-around; }
.wrap-box { display: block; background-color: #000000; padding: 10px; margin: 10px auto; border-radius: 12px; box-shadow: inset 0px -5px 5px -4px #554235;/* height: 40px;*/ min-height: 40px; max-width: 310px; }

/*Toggle switch CSS*/
.status_label { font-size: 18px; font-family: 'Urbanist'; color: #858585; }
span.checked.red { color: #f02c2c; }
span.checked.green { color: #41e347; }
input[type="checkbox"] { position: relative; appearance: none; width: 44px; height: 22px; background: #f72d2d; border-radius: 50px; box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2); cursor: pointer; transition: 0.4s; }
input:checked[type="checkbox"] { background: #44ed4a; }
input[type="checkbox"]::after { position: absolute; content: ""; width: 20px; height: 20px; top: 0; left: 0; background: #fff; border-radius: 50%; box-shadow: 0 0 5px rgba(0, 0, 0, 0.2); transform: scale(1.1); transition: 0.4s; }
input:checked[type="checkbox"]::after { left: 50%; }
input#profile-status:focus { outline: none; }

/*Online status badge CSS*/
.glowing-circle { width: 15px; height: 15px; border-radius:50%; }
.available { background-color: #96f32a; -webkit-animation: available 0.4s ease-in-out infinite alternate; -moz-animation: available 0.4s ease-in-out infinite alternate; animation: available 0.4s ease-in-out infinite alternate; }
.occupied { background-color: #cc1617; -webkit-animation: accoupied 0.4s ease-in-out infinite alternate; -moz-animation: accoupied 0.4s ease-in-out infinite alternate; animation: accoupied 0.4s ease-in-out infinite alternate; }
.offline { background-color: #f3b32a; -webkit-animation: offline 0.4s ease-in-out infinite alternate; -moz-animation: offline 0.4s ease-in-out infinite alternate; animation: offline 0.4s ease-in-out infinite alternate; }
.offline-box { background-color: #464339; }
.team-box { margin: 0; padding: 20px; background-color: #16141a; border: 1px solid #352e42; border-radius: 12px; /*box-shadow: 0px 0px 25px -10px #8c76c7;*/ }
.nomargin { margin: 0 !important; }
.lrm-form-message { color: #000 !important; }
.sort_me { background-color: #000000; border: 2px solid #404040; width: 300px; color: #fff; }
.modal { display: none; }
.black_color { color: #000000 !important; }
.modal-dialog { top: 30%; }
.first_login { text-align: right; }
.first_login h4 { font-size: 11px; margin-top: 5px; text-transform: capitalize; letter-spacing: 0.4px; color: #B3B3B3; }
.main_calendar { background-color: #fff; margin: 40px auto; border-radius: 12px; height: 100%; }
@-webkit-keyframes accoupied {
	from { box-shadow: 0 0 5px #ff494a, 0 0 10px #ff494a, 0 0 15px #ff8c8e, 0 0 20px #ff8c8e; }
	to { box-shadow: 0 0 5px #ff494a, 0 0 10px #cb4949, 0 0 15px #cb4949, 0 0 20px #cb4949; }
}
@-webkit-keyframes available {
	from { box-shadow: 0 0 5px #9edf56, 0 0 10px #9edf56, 0 0 15px #ccf999, 0 0 20px #ccf999; }
	to { box-shadow: 0 0 5px #9edf56, 0 0 10px #7a9759, 0 0 15px #7a9759, 0 0 20px #7a9759; }
}
@-webkit-keyframes offline {
	from { box-shadow: 0 0 5px #ffdf50, 0 0 10px #ffdf50, 0 0 15px #ffec95, 0 0 20px #ffec95; }
	to { box-shadow: 0 0 5px #ffdf50, 0 0 10px #ad962f, 0 0 15px #ad962f, 0 0 20px #ad962f; }
}
.digits, #fullDate span { color: #00f1ff; }
#app { width: fit-content; height: auto; position: absolute; background-color: #16141a; border-radius: 10px; left: 2%; padding: 0px 15px 15px 15px; border: 1px solid #352e42; }
#app #time { margin: 0 auto; text-align: center; font-size: 2em; text-shadow: 0px 2px 25px rgba(144, 244, 253, .6); }
#app #time #ampm { font-size: 0.5em; }
#app #days, #app #fullDate {width: 25%; margin: 0 auto; display: flex; text-align: center; align-items: center; justify-content: center; }
#app .days { flex: 1; color: #444; text-align: center; margin: 5px; }
#app .active { color: #19ff00; text-shadow: 0px 2px 25px rgba(144, 244, 253, .6); }
#app #fullDate { margin-top: 0.25em; text-shadow: 0px 2px 25px rgba(144, 244, 253, .6); }
#app #sec { display: inline-block; }
.leave_status { padding: 2px 5px; border-radius: 8px; text-transform: capitalize; text-align: center; }
.approved { background-color: #59a538;  border: 1px solid #bcffbc; color: #bcffbc; min-width: 100px;  }
.pending { background-color: #a59138; border: 1px solid #fff4bc; color: #fff4bc; min-width: 100px; }
.rejected { background-color: #a53838; border: 1px solid #ffbcbc; color: #ffbcbc; min-width: 100px; }
ul.leave_approved{ padding: 0; }
.leave_approved li { display: flex; justify-content: space-between; margin-top: 10px; }

/*EPIC Tooltip*/
.tooltip-container { position: relative; display: inline-block; cursor: pointer; margin-left: 10px; border-radius: 40px; width: 16px; height: 16px; }
.epic_note { color: #f5a511; }
.tooltip { visibility: hidden; width: 300px; background-color: #000; color: #fff; text-align: center; border-radius: 4px; padding: 12px 0; position: absolute; z-index: 1; bottom: 150%; left: 50%; transform: translateX(-20%); opacity: 0; transition: opacity 0.3s ease;  }
.tooltip-container:hover .tooltip {visibility: visible; opacity: 1; }
.tooltip_title { font-size: 1rem; margin-bottom: 0; }
.leave_badge { margin-left: 15px; color: #51eb14; font-size: 1rem; }
.tooltip ul { margin: 0; }

/*Mobile*/
@media only screen and (max-width: 455px) {
	h2 { font-size: 22px; }
	h3 { font-size: 16px; }
	.container { width: 90% !important; }
	.team-box { box-shadow: unset; }
	.team_label { font-size: 16px; }
	.col-md-6 { margin-top: 12px; }
	.mar-t-40 { margin-top: 0; }
	.filters { margin-left: 10px; margin-right: 10px; }
}
/*Small screen*/
@media only screen and (max-width: 767px) {
	#app { width: 100%; position: static; }
}