@import url('https://fonts.googleapis.com/css?family=Rubik:300,300i,400,400i,500,500i,700,700i');

#loadingDiv {
    display: none;
    padding-top: 20%;
    text-align: center;
    font-size: 8em;
    background-color: rgba(255,255,255, 0.95);
    height: 2000px;
    width: 100%;
    position: fixed;
    z-index: 1000;
}

/*GENERAL TYPOGRAPHY*/

::selection {
    background: #ff6666; /* WebKit/Blink Browsers */
    color: #fff;
}
::-moz-selection {
    background: #ff6666; /* Gecko Browsers */
    color: #fff;
}

body {
    font-family: 'Rubik', sans-serif;
}

h1, h2, h3, h4, h5, h6 {
    color: #ff6666;
}

a:link,
a:visited {
    color: #ff6666;
    transition: .4s;
}
a:hover,
a:active {
    color: #ff4444;
}

.alt-link:link,
.alt-link:visited {
    color: #ff6666;
    transition: .4s;
}
.alt-link:hover,
.alt-link:active {
    color: #474747;
}

.white-link:link,
.white-link:visited,
white-link:hover, 
.white-link:active {
    color: #fff;
    transition: .4s;
}


.font-xs {font-size: 0.5em}
.font-s {font-size: 0.8em}
.font-m {font-size: 1em}
.font-l {font-size: 1.2em}
.font-xl {font-size: 1.5em}

.text-cch-success {color: #1a572b;}
.text-cch-danger {color: #e61d2b;}

.display-block {display: block;}
.centered-block {margin: 0 auto;}

.mt-1 { margin-top: 1rem;}
.mt-2 { margin-top: 2rem;}
.mt-3 { margin-top: 3rem;}
.mt-4 { margin-top: 4rem;}
.mt-5 { margin-top: 5rem;}

.mr-1 { margin-right: 1rem;}
.mr-2 { margin-right: 2rem;}
.mr-3 { margin-right: 3rem;}
.mr-4 { margin-right: 4rem;}
.mr-5 { margin-right: 5rem;}

.mb-1 { margin-bottom: 1rem;}
.mb-2 { margin-bottom: 2rem;}
.mb-3 { margin-bottom: 3rem;}
.mb-4 { margin-bottom: 4rem;}
.mb-5 { margin-bottom: 5rem;}

.ml-1 { margin-left: 1rem;}
.ml-2 { margin-left: 2rem;}
.ml-3 { margin-left: 3rem;}
.ml-4 { margin-left: 4rem;}
.ml-5 { margin-left: 5rem;}

.pt-1 { padding-top: 1rem;}
.pt-2 { padding-top: 2rem;}
.pt-3 { padding-top: 3rem;}
.pt-4 { padding-top: 4rem;}
.pt-5 { padding-top: 5rem;}

.pr-1 { padding-right: 1rem;}
.pr-2 { padding-right: 2rem;}
.pr-3 { padding-right: 3rem;}
.pr-4 { padding-right: 4rem;}
.pr-5 { padding-right: 5rem;}

.pb-1 { padding-bottom: 1rem;}
.pb-2 { padding-bottom: 2rem;}
.pb-3 { padding-bottom: 3rem;}
.pb-4 { padding-bottom: 4rem;}
.pb-5 { padding-bottom: 5rem;}

.pl-1 { padding-left: 1rem;}
.pl-2 { padding-left: 2rem;}
.pl-3 { padding-left: 3rem;}
.pl-4 { padding-left: 4rem;}
.pl-5 { padding-left: 5rem;}

.btn {transition: .5s;}
.btn-dark,
.btn-dark:visited {
  color: #fff !important;
  background-color: #111;
}
.btn-dark:hover,
.btn-dark:focus {
  box-shadow: inset 0 0 0 20rem #333;
  color: #fff;
}
.btn-dark:active {
    color: #fff;
    box-shadow: inset 0 0 0 20rem #333,
    inset 0 3px 4px 0 #333,
    0 0 1px #333;
}
.btn-dark:disabled,
.btn-dark.is-disabled {
  color: #fff;
  opacity: .3;
}

/*HEADER*/

#main-header {
    
}

/*FOOTER*/

#footer-container {
    margin-top: 8em;
}

.footer-right {
    border-top: 5px solid #ff6666;
}
.footer-left {
    border-top: 5px solid #454545;
}
#footer-text {
    /*text-align: right;*/
    padding-top: 20px;
    color: #919191;
}

/*NAVIGATION*/

#main-nav {
    border-radius: 0;
    border: 0;
    border-top: 1px solid #ff6666;
    border-bottom: 3px solid #ff6666;
    background-color: #fff;
    font-size: 1em;
}

.main-nav-dropdown {
    background-color: #fff;
}

.main-nav-link:link,
.main-nav-link:visited {
    transition: .3s;
    font-weight: 400;
    color: #ff6666;
}

.main-nav-link:hover,
.main-nav-link:focus {
    background-color: #ff6666 !important;
    color: #fff;
}

/*CHINESE TABLE*/
.export > .dropdown-menu li {
    text-align: center;
}

.pagination > .active > .page-link:link,    
.pagination > .active > .page-link:visited {
    background-color: #e61d2b !important;
    border-color: #e61d2b !important;
    color: #fff !important;
}    

.page-link:link,
.page-link:visited {
    color: #fff;
    background-color: #222;
    border-color: #222;
    transition: 0.33s;
}

.page-link:hover {
    background-color: #e61d2b !important;
    border-color: #e61d2b !important;
    color: #fff !important;
}

/*TOOL TYPE LABELS*/
.tt-in-trays, .tt-role-plays, .tt-tests {font-weight: 500;}
.tt-tests {
    background-color: #000;
}
.tt-role-plays {
    background-color: #e61d2b;
}
.tt-in-trays {
    /*background-color: #1a572b;*/
}