/* Imports ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap');
/* Reset ========================================================================== */
*, *:before, *:after {
   box-sizing: inherit;
}
html {
    box-sizing: border-box;
    font-size: 100%;
    line-height: 1.15;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}
body {
    margin: 0;
    height: 100%;
    width: 100%;
    min-height: 100vh;
    padding: 0;
    background-color: #f2f2f2;
    background-size: cover;
    background-position: center;
    background-blend-mode: screen;
    display: flex;
    flex-flow: column nowrap;
    justify-content: flex-start;
    font-family: 'Roboto', sans-serif;
}
article, aside, footer, header, nav, section {
   display: block;
}
h2 {
   font-size: 0.85em;
   margin: 0;
   color: #000000;
   font-weight:500;
   line-break: auto;
}
a {
   text-decoration: underline;
    background-color: transparent;
    color: #FF0043;
}
a:hover {
   outline-width: 0;
}
strong {
   font-weight: inherit;
   font-weight: bolder;
}
img {
   border-style: none;
}
button {
   font-family: 'Roboto', sans-serif;
   font-size: 100%;
   line-height: 1.15;
   margin: 0;
   overflow: visible;
   text-transform: none;
}
button, html [type="button"], [type="reset"], [type="submit"] {
   -webkit-appearance: button;
}
/* Main styles ========================================================================== */
header {
   left: 0;
   right: 0;
   top: 0;
   background-color: rgb(188, 11, 53);
   height: 80px;
   display: flex;
   justify-content: flex-start;
   align-items: center;
   width: 100%;
   color: white;
   padding: 39px;
}
.header_logo_container {
   width: 100%;
}
.header_logo {
   width: 113px;
   margin: 0 auto;
}
.header_logo img {
   width: 113px;
   height: auto;
   max-width: 100%;
}
.wrapper {
    min-height: 100%;
    margin: auto;
    width: 90%;
    display: flex;
    flex: 1;
    flex-flow: column nowrap;
    justify-content: flex-start;
    position: relative;
}
.client_logo_container {
   width: 100%;
   margin: 10px 0px 0px 0px;
}
.client_logo_container section {
   width: 81%;
   text-align: center;
   display: flex;
   align-items: center;
   float: right;
}
.client_logo_container section div {
   margin: 0px auto;
   padding: 20px 15px;
}
.client_logo_container section div span {
   font-size: 0.75em;
   color: #8d8e91;
}
.client_logo {
   width: 200px;
   padding: 15px 0px;
   float: left;
}
.client_logo img {
   width: 200px;
   height: auto;
   max-width: 100%;
}
.tableholder {
    margin-top: 10px;
    margin-bottom: 60px;
    background-color: white;
    font-size: 0.8em;
    line-height: 2;
    color: #000;
}
.tableholder table {
   width: 100%;
   border-collapse: collapse;
}
.tableholder table, .tableholder td {
   border: 1px solid #b1b2b3;
}
.tableholder th, td {
   padding: 10px 10px;
   text-align: center;
}
.tableholder tbody tr:nth-child(even) {
   background-color: #d7d9db;
}
.tableholder tbody tr:nth-child(odd) {
   background-color: white;
}
.concept-title {
   background-color: #090909;
   color: white;
   font-size: 1em;
}
.table-title {
   border: 1px solid #b1b2b3;
   background-color: #fff;
   color: #000;
}
.backup-thumbnail {
   width: 30%;
   text-align: center;
}
.backup-thumbnail a {
   display: block;
   text-align: center;
}
.backup-thumbnail img {
   max-width: 90%;
   max-height: 200px;
   border: 1px solid #b1b2b3;
   display: inline-block;
   margin: 0 auto;
}
#version {
   font-style: italic;
}
.warning {
   color: #FF0043;
}
.btn {
   box-sizing: border-box;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   background-color: transparent;
   border: 2px solid #FF0043;
   border-radius: 0.6em;
   color: #FF0043;
   cursor: pointer;
   display: -webkit-box;
   display: -webkit-flex;
   display: -ms-flexbox;
   display: flex;
   -webkit-align-self: center;
   -ms-flex-item-align: center;
   align-self: center;
   line-height: 1;
   margin: 0 auto;
   padding: 0.75em 1.25em;
   text-decoration: none;
   text-align: center;
}
.btn:hover {
   color: #fff;
   outline: 0;
   text-decoration: none;
}
.download-btn {
   text-decoration: none;
}
.first {
   -webkit-transition: box-shadow 300ms ease-in-out, color 300ms ease-in-out;
   transition: box-shadow 300ms ease-in-out, color 300ms ease-in-out;
}
.first:hover {
   box-shadow: 0 0 40px 40px #FF0043 inset;
}
.tableholder .concept-title {
   background-color: #222222;
   border: 1px solid #b1b2b3;
   color: white;
}
.clearFooter {
   height: 200px;
   clear: both;
}
.footer {
   height: 50px;
   position: relative;
   bottom: 0;
   width: 100%;
   background-color: #021322;
   padding: 50px 0;
   text-align: center;
}
.footer-caption {
   color: #b5b5b5;
   font-size: 1em;
}
.footer-version {
   color: #FF0043;
   font-size: 0.85em;
}
/* Tool tip styling ========================================================================== */
.tooltip {/* Tooltip container */
   position: relative;
   display: inline-block;
}
.tooltip .tooltiptext { /* Tooltip text */
   opacity: 0;
   transition: opacity 0.5s;
   width: 120px;
   background-color: black;
   color: #fff;
   text-align: center;
   padding: 5px 0;
   border-radius: 6px;

   /* Position the tooltip text - see examples below! */
   position: absolute;
   z-index: 1;
   width: 120px;
   top: 90%;
   left: 50%;
   margin-left: -60px; /* Use half of the width (120/2 = 60), to center the tooltip */
}
.tooltip:hover .tooltiptext {/* Show the tooltip text when you mouse over the tooltip container */
   opacity: 1;
}
.tooltip .tooltiptext::after {
   content: " ";
   position: absolute;
   bottom: 100%;  /* At the top of the tooltip */
   left: 50%;
   margin-left: -5px;
   border-width: 5px;
   border-style: solid;
   border-color: transparent transparent black transparent;
}