:root{
    --tritonblue:#0086BB;
    --tritonbluedark:#0053aa;
    --tritongreen:#41b490;
    --papermultiplier:9;
    --paperwidth:calc(21px * var(--papermultiplier));
    --paperheight:calc(29.7px * var(--papermultiplier));
}

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

.iranydiag.bootstrap-select .dropdown-menu{
 }

.iranydiag.bootstrap-select .dropdown-menu .inner{
    overflow-x:auto!important;
 }


.gradlink{
    background: -webkit-linear-gradient(34deg, var(--tritonblue) 0%, var(--tritongreen) 33%, var(--tritongreen) 66%, #1a4a89 100%);
    background-size:200% 100%;
    background-position:0% 100%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    transition: all 0.2s ease-in-out;
    font-family: 'Noto Sans';
    font-weight:700;
    text-transform: uppercase;
    text-decoration: none;
}
.gradlink:hover{
    background-position:100% 100%;
    text-decoration:underline;
}
#loginSubmit, .gradbtn, #regSubmit{
    background: var(--tritonblue);
    background: linear-gradient(45deg, var(--tritonblue) 0%, var(--tritongreen) 45%, var(--tritongreen) 55%, var(--tritonblue) 100%);
    background-size: 200% 100%;
    background-position: 0 100%;
    padding:15px 30px;
    transition: all 0.4s ease-in-out;border:none;text-transform: uppercase;
    border-radius:.4em;
}
#loginSubmit:hover, .gradbtn:hover, #regSubmit:hover{
    background-position: 100% 100%;
    padding:15px 70px;
    border-radius:.1em;
}


.logincard, .activatecard {
    position: relative;
    border-radius: 0.7rem;
    border:none;
}
.logincard .card-header, .activatecard .card-header, .forgottencard .card-header {
    background: var(--tritonblue);
    background: linear-gradient(45deg, var(--tritonblue) 0%, var(--tritongreen) 100%);
    font-family: 'Noto Sans';
    font-weight: 700;
    font-size:1.25rem;
    text-transform: uppercase;
    border-radius:inherit;
    /*box-shadow:0px 0px 8px 2px #232456;*/
}

.loginAction{
    text-transform: uppercase;
    z-index:10;
    transition: all .2s linear;
    border-radius:.3em!important;
}
.loginAction a{
    display:block;
    text-decoration:none;
    color: var(--tritonblue);
    transition: color .2s linear;
    border-radius:.2em;
}
.loginAction:hover{
    background:var(--tritonblue);
}

.loginAction:hover a{
    color:white;
}
footer .footermain{
    background:var(--tritonbluedark);
}
footer .copyright{
    background:#181818;
}

.logincard .card-header{
    font-size:1.2rem;
}

.panel{
    border-radius:.75rem;
    border:NONE;
}

.panel .card-header{
    margin-left:-1.5rem;
    border-radius:1rem;
}

#loginEmail, #loginPassword, #accountName{
    border-radius:.4em;
}
.userBlockie canvas, .userBlockie2 canvas{
    border:5px solid #222;
    border-radius:100px;
    transition: .5s;
}
.userBlockie canvas:hover, .userBlockie2 canvas:hover{
    border:5px solid transparent;
    border-radius:0px;
}
.profileCompletion{
    width:100px;
    height:100px;
    border:3px solid #222;
    border-radius:100px;
}
.profileCompletion.bad{
    border-color: #dc3545;
}
.profileCompletion.meh{
    border-color: #ffc107;
}
.profileCompletion.good{
    border-color: #198754;
}
.opLink{
    border:1px solid var(--tritonblue);
    border-radius:5px;
    background:white;
    transition: .5s;
    display: inline-block;
    width:100%;
    height: 100%;
    color: var(--tritonblue);
    transition: .5s;
    text-decoration: none;
}
.opLink.opOff{
    border:1px solid #222;
    color: #222;
}
.opLink.opSoon{
    border:1px solid #ffc107;
    color: #ffc107;
}
.opLink:hover{
    color: white;
    border-radius:0px;
    background: var(--tritonblue);
    background: linear-gradient(45deg, var(--tritonblue) 0%, var(--tritongreen) 100%);
    border:1px solid white;
}
.opLink.opOff:hover{
    background: #222;
    background: linear-gradient(45deg, #222 0%, #666 100%);
}
.opLink.opSoon:hover{
    background: #ffc107;
    background: linear-gradient(45deg, #ffc107 0%, #ff8f05 100%);
}
.loginAction{
    text-transform: uppercase;
    z-index:10;
    transition: all .2s linear;
    border-radius:.3em!important;
}
.loginAction a{
    text-decoration:none;
    color: var(--tritonblue);
    transition: color .2s linear;
    border-radius:.2em;
}
.loginAction:hover{
    background:var(--tritonblue);
}

.loginAction:hover a{
    color:white;
}
body .list-group-flush>.list-group-item {
    border-width: 0;
}

.logincard .card-header{
    font-size:1.2rem;
}

.logincard {
    position: relative;
    border-radius: 0.7rem;
    border:none;
}
.login .card-header.tritongrad,
.register .card-header.tritongrad,
.activate .card-header.tritongrad,
.forgotten-password .card-header.tritongrad,
.tritongrad{
    background: var(--tritonblue);
    background: linear-gradient(45deg, var(--tritonblue) 0%, var(--tritongreen) 100%);
    font-family: 'Noto Sans';
    font-weight: 700;
    font-size:1.25rem;
    text-transform: uppercase;
    border-radius:inherit;
}
.dangergrad{
    background: #cb2d3e;
    background: linear-gradient(45deg, #cb2d3e 0%, #ef473a 100%);
    font-family: 'Noto Sans';
    font-weight: 700;
    font-size:1.25rem;
    text-transform: uppercase;
    border-radius:inherit;
}
.panel{
    border-radius:.75rem;
    border:none;
}


.panel .card-header {
	margin-left: 0.45rem;
	border-radius: 0.5rem;
	margin-right: 0.45rem;
}
#loginEmail, #loginPassword, #accountName{
    border-radius:.4em;
}
.quickAccountDelete{
    position: absolute;
    top: -4px;
    right: -4px;
    background: #ddd;
    height: 16px;
    width: 16px;
    font-size: .7em;
    color: #222;
    text-align: center;
    padding-left: 1px;
    border-radius: 1em;
    cursor: pointer;
    transition: all .2s linear;
}
.quickAccountDelete:hover{
    background:#E64F5E;
    color:white;
}
.gx-6{
    --bs-gutter-x: 5rem;
}
.userBlockie canvas{
    border:5px solid #222;
    border-radius:100px;
    transition: .5s;
}
.userBlockie canvas:hover{
    border:5px solid transparent;
    border-radius:0px;
}
.profileCompletion{
    width:100px;
    height:100px;
    border:3px solid #222;
    border-radius:100px;
}
.profileCompletion.bad{
    border-color: #dc3545;
}
.profileCompletion.meh{
    border-color: #ffc107;
}
.profileCompletion.good{
    border-color: #198754;
}
span.mandatory{
    color:red;
}
.loginAction.disabled{
    background:#e5e5e5;
}
.bootstrap-select{
    width:100%!important;
}
.bootstrap-select .dropdown-toggle, .bootstrap-select>select.mobile-device+.dropdown-toggle {
	outline: 1px solid #ccc!important;
	outline-offset: 0px;
}
header .bootstrap-select .dropdown-toggle, header .bootstrap-select>select.mobile-device+.dropdown-toggle {
	border:2px solid #999!important;
}
.bootstrap-select>.dropdown-toggle {
    padding:1rem .5rem
}
.exam-link{
    outline:none!important;
    border:2px solid #999!important;
    background:none!important;
    color:#999!important;
    border-radius: 30px!important;
}
.exam-link.active{
    border:2px solid var(--tritonblue)!important;
    color:var(--tritonblue)!important;
    font-weight:700;
}
.exam-link.done{
    border:2px solid darkgreen!important;
    color:darkgreen!important;
}
.tab-step {
    width: 30px;
    height: 30px;
    border-radius: 30px 0 0 30px;
    border:none;
    border-right: 1px solid #999;
    background: none;
    color: #999;
    margin-right: 5px;
    line-height: 1.8rem;
}
.exam-link.active .tab-step {
    line-height: 1.8rem;
    border:none;
    border-right: 2px solid var(--tritonblue);
    background:var(--tritonblue);
    color:white;
}
.exam-link.done .tab-step {
    line-height: 1.8rem;
    border:none;
    border-right: 2px solid darkgreen;
    background:darkgreen;
    color:white;
    font-weight: 700;
}
.country-select .country-list {
    z-index:6!important;
    max-height: 300px!important;
}
main{
    min-height: calc(100vh - 73px);
}
.primary-tooltip {
    --bs-tooltip-bg: var(--bs-primary);
}
.success-tooltip {
    --bs-tooltip-bg: var(--bs-success);
}
.logOut:hover > *{
    color:white!important;
}
.toast-container {
    z-index: 2147483649;
}
.non-interactive {
    pointer-events: none;
    user-select: none;
}
.paper{
  line-height:0;
  background:#fff;
  width:var(--paperwidth);
  height:var(--paperheight);
  padding:0;
  margin:20px auto 0px auto;
}
.papercell{
  box-sizing:padding-box;
  padding:0px;
  margin:0px;
  width: calc(calc(var(--paperwidth) / 4) - 1px);
  height: calc(calc(var(--paperheight) / 11) - 1px);
  border:.1px solid #e2e2e2;
  display:inline-block;
}
.papercell.active{
  background:#94fec5;
}
.paperwrap{
  position: relative;
  z-index:10;
}
p.special{
  position: absolute;
  top: 29%;
  transform: rotate(-57deg);
  transform-origin: center;
  left: 23%;
  font-size: 4.5em;
  color: rgba(0,0,0,0.1);
  pointer-events: none;
  user-select: none;
  z-index:9;
}