/**
 * ============================================================================
 * Table of Contents
 * -----------------------------------------------------------------------
 * #Base styles: opinionated defaults
 * #Author Custom Style
 *      1.Author Custom Global Style
 *         2.Intro Section
 *         2.1.FullScreen Image
 *         2.2.Intro Content
 *         2.2.1.Logo
 *         2.2.2.Intro Main Heading
 *         2.2.3.Countdown
 *         2.2.4.Intro Sub Heading
 *         2.2.5.Calandar
 *         3.6.Footer         
 *     #Helper classes
 *     #Responsive Style
 *     #Screen loader
 *     #Preloader
 *    
 * ============================================================================
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
    color: #222;
    font-size: 1em;
    line-height: 1.4;
}
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}
::selection {
    background: #b3d4fc;
    text-shadow: none;
}
/*
 * A better looking default horizontal rule
 */
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio,
canvas,
iframe,
img,
svg,
video { vertical-align: middle }
/*
 * Remove default fieldset styles.
 */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
/*
 * Allow only vertical resizing of textareas.
 */
textarea { resize: vertical }
/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
/* 
* ==========================================================================
  ================= 1.Author Custom Global Style ===========================
* ========================================================================== 
*/

html,
body {
    width: 100%;
    height: 100%;
    font-family:'Nunito', sans-serif;
    font-size: 14px;
    margin: 0;
    padding: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 { font-weight: normal }
h2 {
    font-family: 'Nunito';
    font-size: 1.5em;
    text-transform: capitalize;
}
img {
    width: 100%;
    height: auto;
}
ul { list-style: none }
a { text-decoration: none }
.padding-big { padding: 60px 0 }
p {
    color: #787878;
    font-family: 'Nunito';
}
#container {
    margin: 0;
    padding: 0;
}
.title {
    color: #0d6081 ;
    font-family: 'Nunito';
    font-size: 2em;
    text-transform: uppercase;
    position: relative;
    display: table;
    margin: 0 auto;
}
.title::before {
    background: none repeat #ddd;
    content: "";
    height: 2px;
    left: 25%;
    position: absolute;
    top: -8px;
    width: 50%;
}
.title::after {
    background: none repeat #ddd;
    content: "";
    height: 2px;
    left: 25%;
    position: absolute;
    bottom: -8px;
    width: 50%;
}
.title-tag {
    font-family: 'Nunito';
    font-size: 1.1em;
    padding: 10px 0 20px 0;
}
.padding-2x { padding: 60px 0 }
.padding-x { padding: 20px 0 }
.padding-top-2x { padding-top: 60px }
.padding-top-x { padding-top: 20px }
.padding-btm-2x { padding-bottom: 60px }
.padding-btm-x { padding-bottom: 20px }
.margin-2x { margin: 60px 0 }
.margin-x { margin: 20px 0 }
.margin-top-2x { margin-top: 60px }
.margin-top-x { margin-top: 20px }
.margin-btm-2x { margin-bottom: 60px }
.margin-btm-x { margin-bottom: 20px }

/* Notifications Section */
.badge-red {background:red;margin-top: -18px;margin-left: -5px;font-size: 11px;padding: 2px 6px}
.notifications li {height: 45px; width: 325px}
.notifications li{
    border-bottom:1px solid #ccc;
}
.notifications li:first-child {
    margin-top:0;
}
.nIcon {height: 100%; width: 45px; background-color: #fcfafa; float: left}
.nConttainer {height: 100%; width: 180px; background-color: white; float: left; color: #222; font-size: 11px}
.nBtn {height: 100%; width: 100px; float: left}
.nBtn .nRevoque {height: 100%; width: 50px; background-color: rgb(230, 76, 59); float: left; border: 0;}
.nRevoque:hover {background-color: rgba(230, 76, 59, 0.75)}
.nBtn .nConfirm {height: 100%; width: 50px; background-color: rgb(46, 204, 113); border: 0;}
.nConfirm:hover {background-color: rgba(46, 204, 113, 0.75)}
.fIcon {font-size: 30px; line-height: 45px; color:white; text-align: center; vertical-align: bottom;}
.pointer {cursor: pointer;}
/* 
* ==========================================================================
    =========+++++++++++++++ 2.Intro Section +++++++++++++++=============
* ==========================================================================
*/
.center-content {
    display: table;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.intro {
    background: url("/img/bg-footer.png"), linear-gradient(#0C6182, #000), #0C6182;
    background-size: contain;
    background-position: center;
    background-color: #2a2e39;
    position: fixed;
    overflow: auto;
    width: 100%;
    height: 100%;
    color: #fff;
    box-shadow: inset 0 0 0 680px rgba(0, 0, 0, 0.6);
}

.logo-img {
    height: 10%;
    width: 10%
}

table tr.rowLink:hover {
    background-color: #000;
    opacity: 0.9;
}
.link-class:hover{
    background-color:#f1f1f1;
   }
/* 
* ==========================================================================
        2.1.FullScreen Image
* ========================================================================== 
*/
.intro-image {
    background-color: rgba(0,0,0,0.6);
    position: fixed;
    bottom: 0;
    min-width: 100%;
    min-height: 120%;
    width: auto;
    height: auto;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-transition: -webkit-transform 0.6s, opacity 0.6s;
    transition: transform 0.6s, opacity 0.6s;
    -webkit-transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
    transition-timing-function: cubic-bezier(0.7, 0, 0.3, 1);
}
.container-open .intro-image {
    background-color: #2a2e39;
    -webkit-transform: translate3d(0, 20%, 0);
    transform: translate3d(0, 20%, 0);
}
/* 
* ==========================================================================
                +++++++++++++++ 2.2.Intro Content +++++++++++++++
* ========================================================================== 
*/
.intro-content {
    display: table-cell;
    font-size: 1.15em;
    margin: 0;
    padding: 0;
    min-width: 100%;
    min-height: 100%;
    vertical-align: middle;
}
/* 
* ==========================================================================
        2.2.2.Intro Main Heading
* ========================================================================== 
*/
.intro-title {
    font-family: 'Nunito';
    font-size: 2.5em;
    font-weight: normal;
    margin: 20px 0;
    text-transform: uppercase;
}
.obak { color: #0d6081  }
/* 
* ==========================================================================
        2.2.4.Intro Sub Heading
* ========================================================================== 
*/
.intro-subtitle {
    display: block;
    -webkit-align-items: center;
    align-items: center;
    text-align: center;
}
.intro-subtitle p { color: #efefef }
.intro_description {
    margin: 0 auto 0 1em;
    line-height: 1.2;
}

/*
* Login Style
*/

.block {
    max-width: 350px;
    margin: 0 auto;
    padding: 25px;
    background-color: rgba(0,0,0,0.5);;
    border-radius: 10px;
    margin-bottom: 250px;
}

.block-page {
    margin: 0 auto;
    padding: 25px;
    background-color: rgba(0,0,0,0.5);;
    border-radius: 10px;
    margin-bottom: 50px;
}

.po {
  font-weight: normal;
  color: #1997c6;
  border-radius: 0; }
  .po, .po:active, .po.active, .po:disabled {
    background-color: transparent; }
  .po, .po:focus, .po:active {
    border-color: transparent; }
  .po:hover {
    border-color: transparent; }
  .po:focus, .po:hover {
    color: #106382;
    text-decoration: underline;
    background-color: transparent; }
  .po:disabled {
    color: #aaa; }
    .po:disabled:focus, .po:disabled:hover {
      text-decoration: none; }


.brm .po {
    position: absolute;
    top: 0;
    right: 0;
    padding: 9px 10px;
    color: #b7bcc8;
    border: 0;
    line-height: 0;
}

.form-controlDark {
  display: block;
  width: 100%;
  padding: 0.5rem 0.75rem;
  font-size: 0.9rem;
  line-height: 1.25;
  color: #fff;
  background-color: #434857;
  background-image: none;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 0.25rem;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; }
  .form-controlDark::-ms-expand {
    background-color: transparent;
    border: 0; }
  .form-controlDark:focus {
    color: #555;
    background-color: #fff;
    border-color: #fff;
    outline: none; }
  .form-controlDark::-webkit-input-placeholder {
    color: #cfd2da;
    opacity: 1; }
  .form-controlDark::-moz-placeholder {
    color: #cfd2da;
    opacity: 1; }
  .form-controlDark:-ms-input-placeholder {
    color: #cfd2da;
    opacity: 1; }
  .form-controlDark::placeholder {
    color: #cfd2da;
    opacity: 1; }
  .form-controlDark:disabled, .form-controlDark[readonly] {
    background-color: #30343e;
    opacity: 1; }
  .form-controlDark:disabled {
    cursor: not-allowed; }

select.form-controlDark:not([size]):not([multiple]) {
  height: calc(2.25rem + 2px); }

select.form-controlDark:focus::-ms-value {
  color: #fff;
  background-color: #434857; }


.brm {
  position: relative;
  margin-top: 10px;
  margin-right: 10px;
   }

  .brm .po {
    position: absolute;
    top: 0;
    right: 0;
    padding: 9px 10px;
    color: #b7bcc8;
    border: 0;
    line-height: 0; }
    .brm .po .brn {
      vertical-align: text-top; }

 
/* 
* ==========================================================================
        2.2.5.Calander
* ========================================================================== 
*/

table{  
    border-collapse:collapse;   
}
.clear{  clear:both;}
.years{  
    color:#D90000;  
    font-size:85px;
}
.years h1 a {
    padding-right: 15px;
    text-decoration: none;
}
.relative{  position:relative; }


.events{
    font-family:'Nunito', sans-serif;
    width:auto;
    white-space:nowrap; 
    height:auto;
    padding:0px;
    text-align: center;
    margin-bottom: 10px;
}
.events li{
    height:40px;  line-height:40px; 
    font-weight:bold;
    border-bottom:1px solid #D6D6D6;
    text-indent:0;
}
table td .events{  
    position: static;   
    list-style:none; 
    margin:-12.5px 0px 0px;  
    padding:11px 0px 0px;
}

 .events li:first-child{
        border-top:1px solid #D6D6D6;
}
table td .events li:last-child{  
        border-radius: 0 0 5px 5px;
}
table td .daytitle{  display:none;}
table td:hover .daytitle{  
    position:absolute;
    left:582px;  
    top:21px;  
    width:442px;  
    list-style:none;  
    margin:0px 0px 0px 16px;  
    padding:0px;  
    color:#D90000;  
    font-size:41px;  
    display:block;  
    font-weight:bold;}

.month{  
    margin-top:12px;
    margin: auto;
    width: 450px;
    height: 450px
}
.months{  margin-top: 20px;}
.months ul{  list-style:none;  margin:0px;  padding:0px;}
.months ul li a{  float:left;  margin: auto;  padding:0px 15px 0px 0px;  color:#888888;  text-decoration:none;  font-size:25px;  font-weight:bold;  text-transform:uppercase;}
.months ul li a:hover, .months ul li a.active{  color:#D90000;}

.block-page {
    margin: 0 auto;
    padding: 25px;
    background-color: rgba(0,0,0,0.5);;
    border-radius: 10px;
    margin-bottom: 50px;
}

.calendar {
	text-align: center;
}

.calendar header {
	position: relative;
}


.calendar thead {
	font-weight: 600;
	text-transform: uppercase;
}

.calendar tbody {
	color: #7c8a95;
}

.calendar tbody td:hover {
	border: 2px solid #00addf;
}

.calendar td {
	border: 2px solid transparent;
	border-radius: 50%;
	display: inline-block;
	height: 4em;
	line-height: 4em;
	text-align: center;
	width: 4em;
}

.calendar .prev-month,
.calendar .next-month {
	color: #cbd1d2;
}

.calendar .prev-month:hover,
.calendar .next-month:hover {
	border: 2px solid #cbd1d2;
}

.current-day {
	background: #00addf;
	color: #f9f9f9;
}

.event {
	cursor: pointer;
	position: relative;
}

.event:after {
	background: #00addf;
	border-radius: 50%;
	bottom: .5em;
	display: block;
	content: '';
	height: .5em;
	left: 50%;
	margin: -.25em 0 0 -.25em;
	position: absolute;
	width: .5em;
}

.event.current-day:after {
	background: #f9f9f9;
}

.btn-prev,
.btn-next {
    cursor:default;    
	color: #cbd1d2;
	height: 2em;
	font-size: 1.5em;
	line-height: 2em;
	margin: -1em;
	position: absolute;
	top: 50%;
	width: 2em;
}

.btn-prev:hover,
.btn-next:hover {
	color: #f9f9f9;
    text-decoration: none;
}

.btn-prev {
	left: 6em;
}

.btn-next {
	right: 6em;
}

 /* The switch - the box around the slider */
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The slider */
.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .slider {
  background-color: #2196F3;
}

input:focus + .slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
  -webkit-transform: translateX(26px);
  -ms-transform: translateX(26px);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
} 


.dhx_year_tooltip {
    border: 1px solid #BBB;
    position: absolute;
    z-index: 9998;
    width: 300px;
    height: auto;
    font-size: 8pt;
    overflow: hidden;
}
.dhx_tooltip_line {
    height: 20px;
}


/* 
* ==========================================================================
        3.6.Footer
* ========================================================================== 
*/
#footer {
    background-color: #0d6081;
    padding: 15px 0;
    position: fixed;
    bottom: 0;
    width: 100%;
}
.copyright p {
    color: #fff;
    display: block;
    padding-top: 20px;
    font-size: 1.1em;
}

.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
.w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.w3-center{text-align:center!important}

.noselect {
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}