/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */
/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
@font-face {
    font-family: lato;
    src: url(fonts/LATO-REGULAR_0.TTF);
}
html,
button,
input,
select,
textarea {
    color: #888888;
}
html {
    font-size: 0.9em;
    line-height: 1.4;
}
/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * 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;
}
::-webkit-input-placeholder {
   color: #888888;
}
:-moz-placeholder { /* Firefox 18- */
  color: #888888;  
}
::-moz-placeholder {  /* Firefox 19+ */
  color: #888888;  
}
:-ms-input-placeholder {  
  color: #888888;  
}
/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */
audio,
canvas,
img,
video {
    vertical-align: middle;
}
/*
 * Remove default fieldset styles.
 */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
/*
 * Allow only vertical resizing of textareas.
 */
textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */
.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
a {text-decoration:none;}
/* ==========================================================================
   Author's custom styles
   ========================================================================== */
   /*floating css */
   .fleft {float:left;}
   .fright {float:right;}
   .clear{clear:both;}
/*align css */
.alignleft {text-align:left;}
.alignright {text-align:right;}
.aligncenter {text-align: center;}
img.alignright {float:right; margin:0 0 1em 1em}
img.alignleft {float:left; margin:0 1em 1em 0}
img.aligncenter {display: block; margin-left: auto; margin-right: auto}
/*fontsizes */
.font11 {font-size:11px;}
.font18 {font-size:18px;}
/*main page ids */   
#page {
	  background-image: linear-gradient(180deg, #5881af, #183a67);
	     min-height: 100%;
  /* equal to footer height */
  margin-bottom: -75px; 
}
#ars {
	  min-height: 100%;
  /* equal to footer height */
  margin-bottom: -75px; 
}

#main {
 	padding:15px;
   border-top:1px solid #7b9ec6; 
}
#page:after, #ars:after {
  content: "";
  display: block;
}
#footer, #page:after, #ars:after {
  /* .push must be the same height as footer */
  height: 75px; 
}
#footer {
  background:#fafafa;
}
#footer p {text-align:center;color:#696969; margin:0px; padding:12px;  }
#page header {border-bottom:1px solid #3f649a; padding:15px;  }
#page header h1 {text-align:center; font-size:30px; font-weight:normal; margin:0PX; color:#fff; }
#page header h2 {font-size:18px; margin:0px; padding:0px; font-weight:normal; color:#fff; float:left; text-transform: capitalize;}
.logout {float:right; color:#fff; text-decoration:none; font-size:18px;}
.loginwrap {padding:30px; width:550px; margin:0 auto;}
.loginform {width:320px; padding:12px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; margin:0 auto;
background:#fff; border:1px solid #e6e6e6; border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; position:relative;}
.loginform:after, .loginform:before {
	right: 100%;
	top: 12%;
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
}
.loginform:after {
	border-color: rgba(255, 255, 255, 0);
	border-right-color: #fff;
	border-width: 20px;
	margin-top: -20px;
}
.loginform:before {
	border-color: rgba(230, 230, 230, 0);
	border-right-color: #e6e6e6;
	border-width: 21px;
	margin-top: -21px;
}
.loginform h2 {display:block; text-align:center; overflow:hidden; }
.loginform h2 img {width:100%;}
/*form */
.form-row {margin-bottom:10px;}
input[type="text"], input[type="password"], input[type="tel"], input[type="date"], textarea, select, .globalbtn {
	width:100%; height:auto; padding:8px; 
	box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
	 border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
	border:1px solid #e6e6e6;
	background:#fafafa;
	color:#888888 !important;
}
a.globalbtn {text-align:center; display:block; text-decoration:none;}
.globalbtn:hover, a.globalbtn:hover  {background:#f1f1f1;}
.globalbtn:focus, a.globalbtn:focus {background:#e9e9e9;}
input[type="submit"], .button {
	width:100%; height:auto; padding:8px 15px; 
	box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box;
	 border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
	 border:1px solid #e6e6e6;
	 background: rgb(93,133,181); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzVkODViNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzZDY4OWIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(93,133,181,1) 1%, rgba(61,104,155,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(93,133,181,1)), color-stop(100%,rgba(61,104,155,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(93,133,181,1) 1%,rgba(61,104,155,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(93,133,181,1) 1%,rgba(61,104,155,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(93,133,181,1) 1%,rgba(61,104,155,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(93,133,181,1) 1%,rgba(61,104,155,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5d85b5', endColorstr='#3d689b',GradientType=0 ); /* IE6-8 */
color:#fff;
}
input[type="submit"]:focus, .button:focus {background:#3e699c;}
input[type="submit"]:hover, .button:hover {
	background: rgb(102,169,196); /* Old browsers */
/* IE9 SVG, needs conditional override of 'filter' to 'none' */
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIxJSIgc3RvcC1jb2xvcj0iIzY2YTljNCIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMzZDY4OWIiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(top,  rgba(102,169,196,1) 1%, rgba(61,104,155,1) 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(102,169,196,1)), color-stop(100%,rgba(61,104,155,1))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  rgba(102,169,196,1) 1%,rgba(61,104,155,1) 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  rgba(102,169,196,1) 1%,rgba(61,104,155,1) 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  rgba(102,169,196,1) 1%,rgba(61,104,155,1) 100%); /* IE10+ */
background: linear-gradient(to bottom,  rgba(102,169,196,1) 1%,rgba(61,104,155,1) 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66a9c4', endColorstr='#3d689b',GradientType=0 ); /* IE6-8 */
}
a.button {display:inline-block; width:auto !important; border:none;}
.radio, .checkbox {
 display: inline-block;  
    cursor: pointer;  
    position: relative;  
	vertical-align:middle;  
      }
.radio input[type="radio"], .checkbox input[type="checkbox"] {
float: left;
margin-left: -20px;}
input[type="radio"], input[type="checkbox"] {
margin: 4px 0 0;
margin-top: 1px \9;
line-height: normal;
size
}
.radio-inline label { float:left; margin-right:10px;}
.radio-inline label:last-child {margin-right:0px;}
/*color */
.color-gray {color:#888888;}
.color-red {color:#ff0000;}
.color-green {color:#6fc261;}
/*notification */
[class*="notification"] {margin:8px 0; padding:8px; color:#fff; text-align:left; font-weight:bold; color:#000;}
[class*="notification"] p {margin:0px; padding:0px; font-size:11px;}
.notification-success {background:#DFF2BF; color:#4F8A10; }
.notification-warning {background:#FEEFB3; color:#9F6000; }
.notification-error {background:#FFBABA; color:#D8000C; }
.container {width:95%; margin:0 auto; }
.list-group {
  padding-left: 0;
  margin-bottom: 20px;
}
.list-group-item {
  position: relative;
 display: block;
  padding: 10px 15px;
  margin-bottom: -1px;
  background-color: #fff;
  border: 1px solid #ddd;
}
.media {
  margin-top: 15px;
}

.media:first-child {
  margin-top: 0;
}
.media,
.media-body {
  overflow: hidden;
  zoom: 1;
}
.media-body {
  width: 10000px;
}
.media-object {
  display: block;
}
.media-object.img-thumbnail {
  max-width: none;
}
.media-right,
.media > .pull-right {
  padding-left: 10px;
}
.media-left,
.media > .pull-left {
  padding-right: 10px;
}
.media-left,
.media-right,
.media-body {
  display: table-cell;
  vertical-align: top;
}
.media-middle {
  vertical-align: middle;
}
.media-bottom {
  vertical-align: bottom;
}
.media-heading {
  margin-top: 0;
  margin-bottom: 5px;
}
.media-list {
  padding-left: 0;
  list-style: none;
}
.label {
    border: 1px solid #000;
  }
/* attendance page */
.profilepic {width:133px; height:128px; overflow:hidden; margin-bottom:15px;}
.profilepic img {max-width:100%; max-height:100%;}
#sidebar {width:12%; float:left;  }
nav  ul {margin:0px; padding:0px; border-bottom:1px solid rgba(255, 255, 255, 0.2); margin-bottom:10px; padding-bottom:10px;}
nav  ul:last-child {margin:0px; padding:0px; border:none;}
nav ul li strong {color:#fff;}
#sidebar nav ul li strong {color: #4394e7 !important;}
nav li {display:block; margin-bottom:4px; font-size:14px;}
nav li a {color:#fff; text-decoration:none; text-transform:capitalize; padding-left:14px;}
#content {width:85%; float:right; background:#fff;}
.tablelist { color:#fff; text-align:center;}
.tablelist th {background:#34567d;}
.tablelist th:first-child, .tablelist td:first-child  {text-align:left;}
.tablelist th:last-child, .tablelist td:last-child  {text-align:left;}
.tablelist tbody tr { background-color: #4f729d;}
.tablelist tbody tr:nth-child(odd) {
   background-color: #3c618d;	
}
/*custom radio button and checkbox */
input[type="radio"] {display:none;}
.radio:before {
	 content: "";  
    display: inline-block;  
    width: 14px;  
    height: 14px;  
    margin-right: 10px;  
   vertical-align:middle !important; 
    border:1px solid #e6e6e6;
	border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px;
}

input[type=radio]:checked + .radio:before {  
    content: "\2022";  
    color: #5d85b5 !important; 
    font-size: 19px !important;  
    text-align: center !important;  
    line-height: 14px !important; 
	vertical-align:middle !important; 
}  
.tbl {
	background:#FAFAFA;
	font-size:12px;
	color:#000;
}

.head-bg {padding:6px 6px; COLOR:#fff; background:#445070; font-size:14px; text-align:left;
background: #082b55;
}
.tbl .links {color:#000; text-decoration:none; font-weight:bold; text-transform:capitalize;}
.tbl th { font-size:14px;}
.tbl th, .tbl td{text-align:left; padding:8px;}
.tbl-head th {text-decoration:underline; padding:8px 6px; COLOR:#5d85b5; }
.tbl-head2 th {padding:8px 6px; COLOR:#fff; background:#445070; font-size:16px; text-align:center;
background: #082b55;
}
.tbl-holder {padding:0px !important;}
.sub-tbl tr:nth-child(even){background:#f1f1f1;}
.sub-tbl tr:last-child td {padding-bottom:20px;}
.data-tbl th {border-right:1px solid #000; border-bottom:1px solid #000; background:#f0f0f0;}
.data-tbl th:last-child {border-right:none;}
.th-title th{font-size:12px;}
/* column css */
.col {width:auto !important}
.col1 {width:8.33% !important;}
.col2 {width:16.66% !important;}
.col3 {width:24.99% !important;}
.col4 {width:33.33% !important;}
.col5 {width:49.99% !important;}
/*icons */
nav ul   i {padding-right:5px; font-weight:normal;}
.iconpadright {padding-right:5px;}
.iconpadleft {padding-left:5px;}
.actionbtn {display:block !important; text-align:center; text-decoration:none !important; }
/*dashboard */
.dashboard {  margin:0 auto; padding:0px; padding-top:5%;}
.dashboard > li {display:inline-block; text-align:center; width:175px; vertical-align:top; }
.circle { width:100px; height:100px; border-radius:50%; -moz- border-radius:50%; -webkit- border-radius:50%; background:#fff; vertical-align:middle; line-height:100px; margin:0 auto 15px auto;}
.circle i {font-size:40px; vertical-align:middle; text-align:center; -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out;}
.dashboard ul {margin:0px; padding:0px; list-style:none;}
.dashboard ul li, .dashboard ul li a {color:#fff; font-size:18px; text-decoration:none;}
.dashboard > li:hover  i {
	-ms-transform: rotate(360deg); /* IE 9 */
-webkit-transform: rotate(360deg); /* Chrome, Safari, Opera */
transform: rotate(360deg);}
 .dashboard ul li a  {font-size:14px;  -webkit-transition:all 0.6s ease-in-out; -moz-transition:all 0.6s ease-in-out; transition:all 0.6s ease-in-out; -o-transition:all 0.6s ease-in-out;}
 .dashboard ul li a:hover {font-size:18px;}
/*pagination */
.pagination {padding:10px;  }
.pagination li { display:inline-block;}
.pagination li a{display:inline-block; border-radius:4px; -moz-border-radius:4px; -webkit-border-radius:4px; border:1px solid #e6e6e6; 
background:#fafafa; padding:4px 12px; color:#888888; transition:all 0.6s linear; -moz-transition:all 0.6s linear; -webkit-transition:all 0.6s linear;}
.pagination li a:hover {background:#5D85B5; color:#fff;}
.pg-center {margin:0px auto; text-align:center; }
.pg-center li {text-align:center;}
.pg-left {margin:0px; text-align:left; }
.pg-left li {text-align:left;}
.pg-right {margin:0px; text-align:right; }
.pg-right li {text-align:right;}
.logoarea {height:100px; width:auto;}
/*tracker work history */
.tracker-shots {
	list-style:none;
	padding:0px;
	margin:-10px;
}
.tracker-shots >li {
	display:inline-block;
	padding:10px;
}
.tracker-shots >li .tracker-img {
	position:relative;
}
.tracker-shots >li .tracker-img .deleteicon{
	position:absolute;
	top:0px;
	right:0px;
	background:red;
	padding:5px;
	color:white;
	text-decoration:none;
display:none;
}
.tracker-shots >li:hover .tracker-img .deleteicon{
	display:block;
}

.tracker-shots >li .overlaytracker {
	display:none;
}
.tracker-shots >li time{
	font-weight:bold;
	padding:4px 0px;
	display:block;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */
/*
 * Image replacement
 */
.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}
.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}
/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */
.hidden {
    display: none !important;
    visibility: hidden;
}
/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}
/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}
/*
 * Hide visually and from screenreaders, but maintain layout
 */
.invisible {
    visibility: hidden;
}
/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */
.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}
.clearfix:after {
    clear: both;
}
/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.clearfix {
    *zoom: 1;
}
/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media only screen and (min-width: 35em) {
    /* Style adjustments for viewports that meet the condition */
}
@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}
/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
@media print {
   * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    /*
     * Don't show links for images, or javascript/internal links
     */
    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
       content: "";
    }
    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }
    thead {
        display: table-header-group; /* h5bp.com/t */
    }
    tr,
    img {
        page-break-inside: avoid;
    }
    img {
        max-width: 100% !important;
    }
    @page {
        margin: 0.5cm;
    }
    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        page-break-after: avoid;
    }
}
.transition, p, ul li i:before, ul li i:after {
  transition: all 0.25s ease-in-out;
}
.flipIn, h1, ul li {
  animation: flipdown 0.5s ease both;
}
.no-select, h2 {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.pagination {
    padding: 10px;
    text-align: center;
    font-size: 14px;
}
.pagination a{
   padding: 4px 8px;
    color: #444;
    display: inline-block;
    margin: 4px;
    border: 1px solid transparent;
}
.pagination a:hover{
    border-color: #ccc;
}

.pagination a.active{
    border-color: #ccc;
}

.spanbutton{
	font-size: 12px; padding: 4px 9px; background-color: #397ec5;color:white;	
}

.spanbutton a{
	color:white;	
}

.spanbutton a:hover{
	color:#e6f8fa;
}

/* The alert message box */
.alert {
    padding: 20px;
    background-color: #006633; /* Red */
    color: white;
    margin-bottom: 15px;
}

/* The close button */
.closebtn {
    margin-left: 15px;
    color: white;
    font-weight: bold;
    float: right;
    font-size: 22px;
    line-height: 20px;
    cursor: pointer;
    transition: 0.3s;
}

/* When moving the mouse over the close button */
.closebtn:hover {
    color: black;
}
.error {color:#F00}

.info-msg,
.success-msg,
.warning-msg,
.error-msg {
  margin: 10px 0;
  padding: 10px;
  border-radius: 3px 3px 3px 3px;
}
.info-msg {
  color: #059;
  background-color: #BEF;
}
.success-msg {
  color: #270;
  background-color: #DFF2BF;
}
.warning-msg {
  color: #9F6000;
  background-color: #FEEFB3;
}
.error-msg {
  color: #D8000C;
  background-color: #FFBABA;
}

.loader--fullscreen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 500;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background-color: rgba(0, 0, 0, 0.5);
}

.loader--fullscreen svg {
    width: 6.25rem !important;
    height: 6.25rem !important;
}

.loader--fullscreen svg path, .loader--fullscreen svg rect {
    fill: #fff;
}