@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600;700&display=swap');
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css");



/*** Reset ***/


/***
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption{ background:transparent; border:0; font-size:100%; margin:0; outline:0; padding:0; vertical-align:baseline;}
ol,ul {list-style: none; }
blockquote,q { quotes: none; }
blockquote:before,blockquote:after,q:before,q:after { content: ''; content: none; }
:focus { outline: 0; }
img { vertical-align: bottom; border:none;display:block;}
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }
form{padding:0;margin:0;}
input, textarea, select {
    font-size: 100%;
    margin:0;
}
***/


/********** General *********/
/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;}
.clearfix {display:inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height:1%;}
.clearfix {display:block;}
/* End hide from IE-mac */
.clear{clear:both;}

.container {
	width: 100%;
    max-width: 1440px;
}



img {
	max-width:100%;
	height: auto;
	border:none;
}
@media \0screen {
  img { 
  	width: auto; /* for ie 8 */
  }
}
p{}
p.nopad{padding:0;}
a{color: #36a7df;text-decoration:none; cursor:pointer; }

a:not([href]):not([class]) {
    color: inherit;
    text-decoration: none;
}

a:hover, a:focus {}
h1,h2,h3,h4,h5,h6{
    font-weight: normal;
}
h1{font-size:30px;margin-bottom: 1.5rem;}
h2{font-size:27px; margin-bottom: 1.5rem;}
h3{font-size:24px;line-height:1.3;}
h4{font-size:16px;line-height:1.3;font-weight: 600;}
h5{font-size:14px;line-height:1.3;font-weight: 600;}

strong{
    font-weight: 700;
}

.font-weight-normal {
    font-weight: 400;
}

ul.unordered-list {
    list-style: disc;
    margin: 0 0 15px 35px;
}

ul.unordered-list li{
    margin: 0 0 5px;
}

@media all and (max-width:480px){
	h1{font-size:24px;}
}

/************ Font **************/


body{
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
	line-height:1.3;
	padding:70px 0 50px 0;
	margin:0;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: none;
	color:#000;
}


/** NAV **/




.navbar-intranet {
    background-color: #1e1e1e;
	padding: 0;
}


.navbar-intranet .navbar-brand img {
    height: 25px;
}

.navbar-intranet .navbar-nav .nav-link {
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    padding: 1rem 1rem;
    position: relative;
}


.navbar-intranet .navbar-nav .active>.nav-link, .navbar-intranet .navbar-nav .nav-link.active, .navbar-intranet .navbar-nav .nav-link.show, .navbar-intranet .navbar-nav .show>.nav-link {
    color: #fff;
}



.navbar-intranet .navbar-nav .nav-link {
    color: rgba(255,255,255,1);
}

.navbar-intranet .navbar-nav .nav-link:hover {
    color: #000;
    background:#fff;
}


.navbar-intranet .navbar-nav>li>a:focus, .navbar-intranet .navbar-nav>li>a:hover{
	
	color: rgba(255,255,255,1);
	
}


.navbar-intranet .dropdown-toggle:after {
    
}


.navbar-intranet .navbar-brand {
    padding-top: .5rem;
    padding-bottom: .5rem;
}
.navbar-intranet .navbar-brand img {
    height: 25px;
}

.nav-logout {
    color:#f5982b;
}

.navbar-intranet .dropdown-item {
    color: #222;
    border-bottom: 1px solid #eee;
    padding: 11px 20px 11px 20px;
    font-size: 13px;
    background: #fff;
}

.navbar-intranet .dropdown-item:hover {
    color: #fff ;
    background:#f5982b;
}

.navbar-intranet .dropdown-menu {
    padding: 0;
}

.navbar-intranet li .dropdown-item:last-child {
    border-bottom: 0;
}

.navbar-toggler-icon {
    color:#f5982b
}


.navbar-intranet .nav-item .dropdown-menu {
	border-radius: 0;
}


@media all and (min-width: 992px) {
	.navbar-intranet .nav-item .dropdown-menu{ display: none; }
	.navbar-intranet .nav-item:hover .dropdown-menu{ display: block; }
	.navbar-intranet .nav-item .dropdown-menu{ margin-top:0; }
   
}

@media all and (max-width: 992px) {

 .navbar-intranet {padding: .5rem 0;}
    .navbar-intranet .dropdown-toggle:after {
    display:inline-block;
    position: absolute;
    right: 20px;
    top: 50%;
    margin-top: -5px;
}
    .navbar-intranet .navbar-nav .nav-link {padding: .75rem 1rem;}
    .navbar-intranet .dropdown-item {padding: .75rem 1rem;}
    .navbar-intranet .navbar-menu {margin: .75rem 0 0;}
    .navbar-intranet .dropdown-menu { margin:0; border:0; }
}



/*** login ***/


.panel-body {
    background: #f7f7f7;
    border: 1px solid #e5e5e5;
    padding: 15px;
    line-height: 1.5;
}



/************ Buttons **************/

.btn {
    
    /*font-size:13px;*/
}

.input-group .btn {
    font-size:13px;
}

.btn-block {
    width: 100%;
	display:block;
}

.btn-inline {
	display:inline-block !important;
}
.btn-primary {
	color:#fff !important;
	background-color: #36a7df;
	border-color: #36a7df;
}

.btn-primary:hover,.btn-primary:focus  {
	background-color: #1E8CC2;
	border-color: #1E8CC2;
}

.btn-orange {
	color: #fff !important;
	background-color: #f58220;
	border-color: #f58220;
}
.btn-red {
	color: #fff !important;
	border-color: #E63F24;
	background-color:#E63F24;
}
.btn-darkgrey{
        color: #fff !important;
    background-color: #333;
    border-color: #333;
}
.btn-black {
	color: #fff !important;
	border-color: #000;
	background-color: #000;
}

.btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ced4da;
}
.btn-default:focus {
    color: #333;
    background-color: #e6e6e6;
    border-color: #8c8c8c;
}
.btn-default:hover {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}
.btn-default:active {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.btn-default.active, .btn-default.focus, .btn-default:active, .btn-default:focus, .btn-default:hover, .open>.dropdown-toggle.btn-default {
    color: #fff;
    background-color: #000;
    border-color: #000;
}


a.btn-red:hover {
	background-color:#eb5740;
}
.or {
	display:inline-block;
	margin:0 10px;
	font-weight:bold;
	font-size:16px;
}

/*** form ***/

.form-label {
	font-weight:600;
}


.form-control, .form-control-plaintext {
	/**font-size:13px;**/
}


.form-check-label {
	/**font-size:13px;**/
	font-weight: 400;
}



/** 2 step  **/

.app-store {
	margin-bottom:30px;
}
.app-store a{
	width:135px;	
	display:inline-block;
	margin:0 10px 10px 0;
}

.ordered-list li{
    padding-bottom: 10px;
}

.btn-user-enabled {
    font-size: 14px;
    padding: 5px 20px;
    display: inline-block;
    background-color: #093;
    color: #fff !important;
    margin: 0 !important;
}
.btn-user-disabled {
    font-size: 14px;
    padding: 5px 20px;
    display: inline-block;
    background-color: #cc0000 !important;
    color: #fff !important;
}
.btn-user-off {
    background-color: #ddd !important;
    color: #999 !important;
}



/** Modal  **/


.modal-order {
    padding-top: 10%;
}

.modal-dialog {
    padding-top: 5%;
}

.modal-sm {
    padding-top: 5%;
	width:330px;
}

@media all and (max-width:767px){
	.modal-sm {
		width:100%;
	}
}

.modal-confirm-body {
	padding:15px 15px 0 15px;
}
.modal-confirm-footer {
	padding:0 15px 15px 15px;
}

.modal-confirm-footer .btn{
	display:block;
	margin-bottom:8px;	
}

.modal-confirm-footer .btn-inline{
	display:inline-block;
	padding: 6px 30px;
}


/*** Staff Leave ***/

.col-form-label {
	font-weight:600;
}

.leavecollapse-header {
	cursor: pointer;
}

.table .thead-dark th {
    color: #fff;
    background-color: #1e1e1e;
    border-color: #1e1e1e;
}

.table .thead-light th {
	color: #000;
    background-color: #e7e7e7;
    border-color: #e7e7e7;
}

.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
	background-color: #f8f9fa;
}

.form-group-year {
	flex: 1 0 auto;
}
.bg-lightblue {
	background:#EDF7FC;
}

@media all and (max-width:767px){

	.btn-block-sm {
		width: 100%; display:block;
	}
	
}




/*** Calendar ***/


.calendar .calendardate {
    min-height:150px;
}
.calendarday {
	width: 14.2857142857%;
	padding: 1rem;
	background:#1e1e1e;
	color:#fff;
}
.calendardaterow {
	border-style:solid;
	border-color: #ddd;
	border-width: 1px 0 0 1px; 

}
.calendardate {
	width: 14.2857142857%;
	padding: 1rem;
    background:#f7f7f7;
	text-decoration: none !important;
	min-height: 150px;
	border-style:solid;
	border-color: #ddd;
	border-width: 0 1px 1px 0; 

}




.calendardate {color:#999;}

.calendar .calendardate a{padding-bottom: 10px;}

.calendar-default { text-decoration: none !important;}

.currentmonth{background:#fff;color:#000 !important;}

.selectedday{background:#FCD9B0;}
.selectedday {color:#000 !important; font-weight: 700;}

.weekend{background:#C9EAF7;}
.weekend {color:#000 !important;}

.today{background:#FCD9B0;}
.today {color:#000 !important;}


.event {padding:5px 8px;background: #8cc640; border-radius: 3px; margin: 5px 0;font-size:12px;font-weight: 600; color:#fff;text-decoration: none!important;}
.event-partime {padding:2px 8px 2px 0;margin: 5px 0;font-size:12px;font-weight: 600; color:#000;text-decoration: none!important;}
.event-date {color:#000;}
.time {display: block; margin-top: 4px; font-weight: 400;}

.eventdot {max-width: 7px !important; width: 7px!important; height: 8px;border-radius: 50%; background-color: #8cc640;margin: 4px 5px 0 0; flex-grow: 0;
	flex-shrink: 0;}

 .leave .eventdot {
    background-color: #f79420;
 } 

 .event.leave {
    background-color: #f79420;
 }   
 .event.office {
    background-color: #8cc640;
 }  



.submitcalendar .calendardate a{color:#999;display:block; padding:0.25rem}
.submitcalendar .weekend a{color:#000;}
.submitcalendar .currentmonth a{color:#000;}
.submitcalendar .selectedday a{color:#000;}


.web-logo { height:25px;}
.alert-icon .bi {
    display: inline-block;
    font-size: 20px;
}

.red {
	
}

.ui-datepicker { z-index: 9999 !important; }

@media all and (max-width:767px){

    .calendar .calendardate {
        width: 100%;
        display: block;
    }

    .calendar .othermonth {
        display: none;
    }


}


.text-orange {
	color:#f79420;
}





.navbar-right .dropdown-menu {
    right: 0;
    left: auto;
}

.nav-flex {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.nav-flex .nav-flex-item {
	order: 1;
    color: #fff;
	text-decoration: none !important;
    font-weight: 600;
    padding: 15px;
	min-height: 50px;
	display: flex;
    align-items: center;
    font-size: 13px;
}
.nav-flex:hover .nav-flex-item, .nav-flex:focus .nav-flex-item{
    color:#000 !important;
	background:#fff;
}

.nav-flex-caret {
	order: 2;
	width:56px;
	display: none;
	cursor: pointer;
	content: "";
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-caret-down-fill' viewBox='0 0 16 16'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>");
	background-repeat: no-repeat;
	background-size: 1rem 1rem;
	background-position: center right 20px;
}

.nav-flex:hover>.nav-flex-caret, .nav-flex:focus>.nav-flex-caret{
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000000' class='bi bi-caret-down-fill' viewBox='0 0 16 16'><path d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/></svg>");
	background-repeat: no-repeat;
	background-size: 1rem 1rem;
	background-position: center right 20px;
	background-color:#fff;
}

.nav-flex-caret.show,.nav-flex:hover>.nav-flex-caret.show, .nav-flex:focus>.nav-flex-caret.show {
	background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23000000' class='bi bi-caret-down-fill' viewBox='0 0 16 16'><path d='m7.247 4.86-4.796 5.481c-.566.647-.106 1.659.753 1.659h9.592a1 1 0 0 0 .753-1.659l-4.796-5.48a1 1 0 0 0-1.506 0z'/></svg>");
	background-repeat: no-repeat;
	background-size: 1rem 1rem;
	background-position: center right 20px;
	background-color:#fff;
}
.nav-flex .dropdown-menu {
	order: 3;
	top:50px;
	border-top:1px solid #eee !important;

}

.nav-flex .dropdown-menu a {
    color: #222;
    border-bottom: 1px solid #eee;
	padding: 0.75rem 1rem;
    font-size: 13px;
    background: #fff;
}

.nav-flex .dropdown-menu a:hover {
	color:#000;
    background: #eee !important;
}

.nav-flex-ui img{
	height: 11px;
}
.nav-flex-account-icon {

	display: none;
}
.nav-flex-account {
	display: inline-block;
}

@media all and (max-width: 992px){

	.nav-flex-account-icon {
		font-size: 18px;
		display: inline-block;
		margin:0 10px 0 0;
	}
	.nav-flex-account {
		display: inline-block;
	}

	.nav-flex:hover {
		background: #fff;
	}
	.nav-flex-caret {
		display: flex;
		align-items: center;
	}
	.nav-flex-caret.show+.nav-flex-item {
		color: #000;
		background:#fff !important;
	}
	.nav-flex .dropdown-menu{
		width: 100% !important;
		background: #fff !important;
		border-radius: 0;
	}
	.nav-flex .nav-flex-item {
		flex-grow: 1;
		padding: 0.75rem 1rem;
	}

}



