@import url('https://fonts.googleapis.com/css?family=Lato&display=swap');
@import url('https://fonts.googleapis.com/css?family=Dosis:400,700&display=swap');
/* TODO: Download fonts and use local versions */

html,
body {
    height: 100%;
    font-family: 'Lato', sans-serif;

}


.cust-bg-1 {
    background: #F9F9F9;
}

.cust-form-styles {
    padding: 25px;
    margin-top: 15px;
}

form hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #000;
    margin: 1em 0;
    padding: 0;
}



/**********************
GLOBAL
***********************/
.link-theme-color {color: #4AC6CF !important; transition:.5s ease; text-decoration:none; }
.link-theme-color:hover {color: #003C56 !important; transition:.5s ease; text-decoration:none; }
.secondary-link-theme-color { color:#B1B1B1; transition:.5s ease; text-decoration:none;}
.secondary-link-theme-color:hover { color:#7E7E7E; transition:.5s ease; text-decoration:none;}
.main-content { margin-top: 70px; min-height:100%;}
@media only screen and (min-width: 992px) {
  .main-content { margin-top: 83px; min-height:800px;}
}
.main-content a { color:#1f69c0; text-decoration:none; transition:.5s ease; }
.main-content a:hover { color:#003C56; text-decoration:none; }
.report-content { font-size: 14px; }
.row-styles {margin-top: 5px; margin-bottom: 25px; padding: 20px; }
.mss-row {margin-top: 5px; margin-bottom: 25px; padding: 20px; background-color:#fff; border-radius: 5px; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; border:0; }
.card { border-radius: 5px; box-shadow: 0 0 7px 1px rgba(0, 0, 0, 0.2); }

/**********************
TYPO
***********************/
h1,h2,h3,h4,h5 { font-family: 'Dosis', sans-serif; font-weight:400; }
h2,h3,h4,h5 { font-family: 'Dosis', sans-serif; font-weight:700; }
h1 {margin:1em 0; color:#7E7E7E; font-size:35px; }
h2,h3 {font-size: 1.2rem; color:#000;}
h2.row-header-title { color:#7E7E7E; }
h5 {margin-bottom: -5px; line-height: 1.7; font-size: 1.5rem; }
h5.card-title { font-size:1rem; }


/**********************
COLORS
***********************/
.badge-warning { background-color: #FCD735; }
.badge-danger { background-color: #F55F43; }
.badge-info { background-color: #4EA585; }
.badge-primary { background-color: #14B9DB; }
.text-danger { color:#F55F43; }

.link-theme-color {color: #5b130d !important; transition:.5s ease; text-decoration:none; }
.link-theme-color:hover {color: #003C56 !important; transition:.5s ease; text-decoration:none; }
.dark-background {background: #525252; }
#logo-container {color: #fff; }


/**********************
LOGIN
***********************/
.login-wrapper { width: 380px; padding:1em; background-color: #fff; border-radius: 5px; box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; border:0; }
ul.lang-switch { list-style:none; margin:0; padding:0; }
ul.lang-switch li { display:inline-block; margin-left:1.5em; }
ul.lang-switch li:last-child { margin-left:0; }
ul.lang-switch li a { color:#B1B1B1; transition:.5s ease; text-decoration:none; font-size:14px;}
ul.lang-switch li a:hover { color:#4AC6CF; transition:.5s ease; text-decoration:none; }
ul.lang-switch li a.active { color:#4AC6CF; transition:.5s ease; text-decoration:none; }

/**********************
FORMS
***********************/
input.form-control { display: block; width: 100%; height: calc(2em + 0.75rem + 2px); padding: 10px 15px; font-size: 1rem; font-weight: 400; line-height: 1.5; color:#000; background-color:#fff; background-clip: padding-box; border: 1px solid #b1b1b1; border-radius: 0.25rem; transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
::placeholder {font-size: 1rem; }
input.mute { opacity:.4; }

/**********************
BUTTONS
***********************/
.btn { border-radius: 2rem; background-color: #d72d1f; width:200px; padding:10px 15px; color:#fff; font-size:16px; transition:.5s ease;}
.btn:hover { color:#fff; background-color:#5b130d; }
/*.btn:disabled:hover { color:#fff; background-color:#14B9DB; }*/
.btn.disabled, .btn:disabled {opacity: 0.65; }
.btn-red { background-color:#F55F43; }
.btn-red:hover { background-color:#D9563D; }
.mss-btn-color-1 {background-color: #14B9DB; }
/*.mss-nav-color {background-color: #08BADD !important; color: #fff; }*/
.mss-nav-color { color: #fff; }
.mss-cust-font {font-family: 'Dosis', sans-serif !important; }
.custom-control-input:checked ~ .custom-control-label::before {color: #fff; border-color: #5b130d; background-color: #5b130d; }
.pdf-download { /*background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='_x31_' enable-background='new 0 0 24 24' height='512' viewBox='0 0 24 24' width='512' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='m17.5 24c-3.584 0-6.5-2.916-6.5-6.5s2.916-6.5 6.5-6.5 6.5 2.916 6.5 6.5-2.916 6.5-6.5 6.5zm0-12c-3.032 0-5.5 2.468-5.5 5.5s2.468 5.5 5.5 5.5 5.5-2.468 5.5-5.5-2.468-5.5-5.5-5.5z'/%3E%3Cpath d='m17.5 21c-.128 0-.256-.049-.354-.146l-3-3c-.195-.195-.195-.512 0-.707s.512-.195.707 0l2.646 2.646 2.646-2.646c.195-.195.512-.195.707 0s.195.512 0 .707l-3 3c-.096.097-.224.146-.352.146z'/%3E%3Cpath d='m17.5 21c-.276 0-.5-.224-.5-.5v-6c0-.276.224-.5.5-.5s.5.224.5.5v6c0 .276-.224.5-.5.5z'/%3E%3Cpath d='m9.5 21h-7c-1.379 0-2.5-1.121-2.5-2.5v-13c0-1.379 1.121-2.5 2.5-2.5h2c.276 0 .5.224.5.5s-.224.5-.5.5h-2c-.827 0-1.5.673-1.5 1.5v13c0 .827.673 1.5 1.5 1.5h7c.276 0 .5.224.5.5s-.224.5-.5.5z'/%3E%3Cpath d='m11.5 6h-6c-.827 0-1.5-.673-1.5-1.5v-2c0-.276.224-.5.5-.5h1.55c.232-1.14 1.243-2 2.45-2s2.218.86 2.45 2h1.55c.276 0 .5.224.5.5v2c0 .827-.673 1.5-1.5 1.5zm-6.5-3v1.5c0 .275.225.5.5.5h6c.275 0 .5-.225.5-.5v-1.5h-1.5c-.276 0-.5-.224-.5-.5 0-.827-.673-1.5-1.5-1.5s-1.5.673-1.5 1.5c0 .276-.224.5-.5.5z'/%3E%3Cpath d='m13.5 9h-10c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h10c.276 0 .5.224.5.5s-.224.5-.5.5z'/%3E%3Cpath d='m10.5 12h-7c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h7c.276 0 .5.224.5.5s-.224.5-.5.5z'/%3E%3Cpath d='m8.5 15h-5c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h5c.276 0 .5.224.5.5s-.224.5-.5.5z'/%3E%3Cpath d='m16.5 9c-.276 0-.5-.224-.5-.5v-3c0-.827-.673-1.5-1.5-1.5h-2c-.276 0-.5-.224-.5-.5s.224-.5.5-.5h2c1.379 0 2.5 1.121 2.5 2.5v3c0 .276-.224.5-.5.5z'/%3E%3C/svg%3E"); background-position: 58% 50%; background-repeat:no-repeat; background-size:28px; */display:block; padding:.7em .3em .4em 1em; font-size:16px; width:50px; height:50px; border-radius: 50px; transition:.5s ease;}
.pdf-download svg { width:24px; height:24px; padding:0; margin:0;}
.pdf-download svg path{ fill:#7E7E7E; }
.pdf-download:hover { background-color:#03BADD; }
.pdf-download:hover svg path{ fill:#fff; }
/**********************
NAVBAR
***********************/
#mainNavbar { padding:0; background-color: #fff}
#mainNavbar .nav-link { color: #391628; font-family: 'Lato', sans-serif; transition:.5s ease; display:inline-block; padding:1em 2em; border-top: 1px solid #ffffff6b; width: 100%;}
#mainNavbar .navbar-item:last-child .nav-link { border-bottom: 0px solid #ffffff6b; }
#mainNavbar .nav-link:hover { color:#d72d1f; }

#mainNavbar .main-nav .dropdown-toggle::after { display:none !important; }
/*#mainNavbar .nav-link { font-size:100%; transition:.5s ease; padding:1em; display: flex; align-items: center;}*/
/*#mainNavbar .nav-link:before { display: inline-block; content: ''; width: 30px; height: 30px; margin-right:.5em;}*/
#mainNavbar .ico { display: inline-block; height:20px; margin:0 .5em 0 auto; width:20px;line-height: 24px; }
#mainNavbar .ico-home {background: url(../images/icon-home.svg) left center no-repeat; background-size: 20px; }
#mainNavbar .ico-story {background: url(../images/icon-story.svg) center no-repeat; background-size: 20px; }
#mainNavbar .ico-reports { background:url(../images/icon-reports.svg) left center no-repeat; background-size: 20px; }
#mainNavbar .ico-admin { background:url(../images/icon-settings.svg) left center no-repeat; background-size: 20px; }
#mainNavbar .ico-settings { display:block; height:20px; width:20px; padding-bottom:5em; line-height: 24px; background:url(../images/icon-admin.svg) center no-repeat; background-size: 20px; }
#mainNavbar .nav-icon { width:25px; height:auto; }
#mainNavbar .navbar-brand { color: #fff; }
#mainNavbar .navbar-brand:hover {color: #000; }
#mainNavbar .navbar-brand img { width: 200px; }
#mainNavbar .navbar-header { position:relative; width:100%; }
#mainNavbar .navbar-toggler { position:absolute; right:5px; top:15px; outline:0; }
#mainNavbar .navbar-toggler-icon {background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(146, 58, 101, 0.95)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
#mainNavbar .flash-info {color: red; }
#mainNavbar .user-msg { font-family: 'Dosis', sans-serif; font-weight:400; }
#mainNavbar .user-box { background:url(../images/icon-admin.svg) 96% 50% no-repeat #923a65; background-size: 25px; width:100%; height:83px; min-width:360px; transition:.5s ease;}
#mainNavbar .user-box:hover { background-color:#d72d1f; }
#mainNavbar a.user_toggle { background:transparent; width:100%; height:100%; display:block; }
#mainNavbar .widget-content { flex-direction: row; align-items: center; width:100%;}
.widget-content .widget-content-wrapper { display: -ms-flexbox; display: flex; -ms-flex: 1; flex: 1; position: relative; -ms-flex-align: center; align-items: center; }
.widget-content-right { align-items: right; }
#mainNavbar .avatar { background-color: #fff; width:55px; height:55px; border-radius:100px; }
#mainNavbar .avatar img { width: 55px; border-radius: inherit; border:3px solid white; }
#mainNavbar .dropdown-toggle:after { display:none; }
#mainNavbar .dropdown-menu { border-radius: 0; margin-top:0; border:0; background-color:#013c56; top:108%; left:15px; transition:.5s ease; font-family: 'Lato', sans-serif; }
#mainNavbar .dropdown-menu li { display:block; width:100%; color:#fff;}
#mainNavbar .dropdown-menu:before {content: ""; border-bottom: 10px solid #013c56; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; top: -10px; left: 32px; z-index: 10; }
#mainNavbar .dropdown-user { top:108%; left:20px; border-radius:0.25rem}
.user-box:hover {cursor:pointer;}
#mainNavbar .dropdown-menu .dropdown-item { padding:.5rem 1.5rem; transition:.5s ease; color: #fff;}
#mainNavbar .dropdown-menu .dropdown-item:hover {font-family: 'Lato', sans-serif; transition:.5s ease; color: #0D7F95; text-decoration: none; background-color: transparent; }
#mainNavbar .dropdown-menu .dropdown-item:active {color: #fff; text-decoration: none; background-color: transparent; }

@media only screen and (min-width: 767px) {
    #mainNavbar .navbar { padding:0 0 0 .5em; }
    #mainNavbar .user-area { background-color:#013C56; width:400px;}
    /*#mainNavbar .nav-link { font-size:100%; }*/
    /*#mainNavbar .nav-link:hover { background-color:transparent;}*/
    .welcome-msg .small { font-size: 11px; }
    /*.dropdown-user { position: absolute; top:70px; right:-1px; border-radius:0; left:auto; margin-top:0; z-index: 1000; display: none; width:100%; min-width: 334px; font-size: 1rem; color: #fff; text-align: left; list-style: none; background-color:#013C56 !important; background-clip: padding-box; border: 0; border-radius: 0; font-family: 'Lato', sans-serif; }*/
}

@media only screen and (min-width: 992px) {
    /*.dropdown-user { width:321px;} */
    #mainNavbar .nav-link { text-align:center; display:table-cell; height:80px; vertical-align: middle; padding:0 1em; border-top: 0px solid #ffffff6b;}
    #mainNavbar .nav-link:hover { background-color:transparent;}
    #mainNavbar .nav-link > .ico { display: block; width: 48px; margin: 2px auto 4px auto; top: 0; line-height: 24px; }
    #mainNavbar .ico { display: block; height:20px; margin:6px auto 4px auto; top: 0; line-height: 24px; }
    #mainNavbar .ico-home {background: url(../images/icon-home.svg) center no-repeat; background-size: 20px; }
    #mainNavbar .ico-reports { background:url(../images/icon-reports.svg) center no-repeat; background-size: 20px; }
    #mainNavbar .ico-admin { background:url(../images/icon-settings.svg) center no-repeat; background-size: 20px; }
    #mainNavbar .ico-settings { display:block; height:20px; width:20px; padding-bottom:5em; padding-right:2em;line-height: 24px; background:url(../images/icon-admin.svg) center no-repeat; background-size: 20px; }
    .welcome-msg .small { font-size: 14px; }
    #mainNavbar .user-box { background:url(../images/icon-admin.svg) 93% 50% no-repeat #923a65; background-size: 25px; width:100%; min-width:360px; transition:.5s ease;}
    #mainNavbar .dropdown-menu { border-radius:0.25rem }
    #mainNavbar .dropdown-menu:before {content: ""; border-bottom: 10px solid #013c56; border-right: 10px solid transparent; border-left: 10px solid transparent; position: absolute; top: -10px; left: 23px; z-index: 10; }
    #mainNavbar .dropdown-user { border-radius:0.25rem }
    #mainNavbar .dropdown-menu .dropdown-item { padding:.5rem 1.5rem; transition:.5s ease; color: #fff;}
    #mainNavbar .dropdown-menu .dropdown-item:hover {font-family: 'Lato', sans-serif; transition:.5s ease; color: #0D7F95; text-decoration: none; background-color: transparent; }
    #mainNavbar .dropdown-menu .dropdown-item:active {color: #fff; text-decoration: none; background-color: transparent; }
}

.animation {
  -webkit-animation-duration: 0.3s;
  animation-duration: 0.3s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes slideDownIn {
  0% {
    -webkit-transform: translateY(-20px);
  }
  100% {
    -webkit-transform: translateY(0);
  }
  0% {
    -webkit-transform: translateY(-20);
  }
}
@keyframes slideDownIn {
  0% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0);
  }
  0% {
    transform: translateY(-20px);
  }
}
.slideDownIn {
  -webkit-animation-name: slideDownIn;
  animation-name: slideDownIn;
}

.tooltip-inner {
    max-width: 200px;
    padding: 1em;
    color: #fff;
    text-align: center;
    background-color: #03BADD;
    border-radius: .25rem;
}

.tooltip.bs-tooltip-right .arrow:before {
    border-right-color: #03BADD !important;
}
.tooltip.bs-tooltip-left .arrow:before {
    border-left-color: #03BADD !important;
}
.tooltip.bs-tooltip-bottom .arrow:before {
    border-bottom-color: #03BADD !important;
}
.tooltip.bs-tooltip-top .arrow:before {
    border-top-color: #03BADD !important;
}

/**********************
DASHBOARD
***********************/
.card { box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important; border:0;  height: 100%;}
.card-body {padding: 1rem 1.5rem}/*; display: flex; flex-wrap: wrap;}*/
.card-footer p {margin-bottom: 0}

.separator {
    color: rgba(0, 0, 0, 0.4);
    font-size: 1.5rem;
    display: flex;
    align-items: center;
    text-align: center;
}
.separator::before, .separator::after {
    content: '';
    flex: 1;
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}
.separator::before {
    margin-right: .25em;
}
.separator::after {
    margin-left: .25em;
}

.row.match-cols {
    overflow: hidden;
}

.row.match-cols [class*="col-"]{
    margin-bottom: -99999px;
    padding-bottom: 99999px;
}



/**********************
FOOTER
***********************/
#sticky-footer {padding:1em; background-color:#ffffff; color:#391628; }
#sticky-footer a { color:#391628; text-decoration:none; transition:.5s ease;}
#sticky-footer a:hover { color:#003C56; text-decoration:none; }
ul.footer-menu, ul.social-menu { list-style:none; margin:0; padding:0; }
ul.footer-menu li, ul.social-menu li { display:inline-block; margin-right:1em; font-size:.8rem;}
ul.footer-menu li:last-child, ul.social-menu li:last-child {margin-right:0; }
.fab { font-size:1.3rem; }


/**********************
REPORT TABLE
***********************/
.variable table {table-layout: fixed; }
td {overflow: hidden; text-overflow: clip; }
td:hover {overflow: visible; }
.row.bordered {border: 1px solid #e1e1e8; border-top: hidden; padding: 2em 1em; }
.row-header {     margin-top: 0;
    margin-bottom: -13px;
    background: rgb(182,182,182);
background: -moz-linear-gradient(0deg, rgba(182,182,182,1) 0%, rgba(216,216,216,1) 25%);
background: -webkit-linear-gradient(0deg, rgba(182,182,182,1) 0%, rgba(216,216,216,1) 25%);
background: linear-gradient(0deg, rgba(182,182,182,1) 0%, rgba(216,216,216,1) 25%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#b6b6b6",endColorstr="#d8d8d8",GradientType=1);
    padding: 1em 1em 1em 1.2em;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.075);
    border: 0;
}}
.h5 {overflow: hidden; text-overflow: ellipsis; }
.tab-content .row {margin-top: 0.5rem; }
.row.header {border-bottom: 1px solid #e1e1e8; /*background-color: #f5f5f5;*/ padding-left: 2em; }
/* Bars in tables */
.freq.table {table-layout: fixed; }
.freq.table thead {font-weight: 600; white-space: nowrap; }
.freq.table thead td {overflow: visible; }
.freq.table th {width: 50%; overflow: hidden; text-overflow: ellipsis; font-weight: 400; text-align: right; padding: 0; white-space: nowrap; }
.freq td.number {width: 100px; }
.freq td.bartd, .frequency-percentage {width: 200px; }
.freq .bar {float: left; width: 0; height: 100%; line-height: 20px; color: #fff; text-align: center; background-color: #337ab7; border-radius: 3px; margin-right: 4px; }
.other .bar {background-color: #999; }
.missing .bar {background-color: #a94442; }