.blueBoxTrans,.blueBoxTransPopup{
    z-index:101;
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,31,51,.8);
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    display:none 
}
.blueBoxTrans .blueBox,.blueBoxTransPopup .blueBox{
    position:relative;
    background:#fff;
    width:650px;
    padding:45px 50px;
    border:1px solid #A6B1B8 
}
.blueBoxTrans .blueBox .blueBoxClose,.blueBoxTransPopup .blueBox .blueBoxClose{
    position:absolute;
    top:20px;
    right:20px;
    width:30px;
    height:30px;
    cursor:pointer 
}
.blueBoxTrans .blueBox h3,.blueBoxTransPopup .blueBox h3{
    color:#001F33 
}
.blueBoxTrans .blueBox h2,.blueBoxTransPopup .blueBox h2{
    font-size:20px;
    font-family:"Avenir-Medium";
    color:#fff;
    text-transform:capitalize;
    margin-bottom:30px 
}
.blueBoxTrans .blueBox .loginBtn,.blueBoxTransPopup .blueBox .loginBtn{
    margin-top:20px;
    display:flex;
    justify-content:space-between 
}
.blueBoxTrans .blueBox .loginBtn button,.blueBoxTransPopup .blueBox .loginBtn button{
    color:#003DDA;
    border:2px solid #003DDA;
    background:#fff;
    padding:7px 40px 7px 25px;
    height:47px;
    font-size:18px;
    font-family:"Avenir-Heavy";
    position:relative 
}
.blueBoxTrans .blueBox .loginBtn button:after,.blueBoxTransPopup .blueBox .loginBtn button:after{
    content:"\f105";
    font:bold 18px/1 FontAwesome;
    transition:all 0.5s ease;
    transform:translateX(8px);
    position:absolute;
    top:12px 
}
.blueBoxTrans .blueBox .loginBtn button:hover:after,.blueBoxTransPopup .blueBox .loginBtn button:hover:after{
    transform:translateX(13px) 
}
.blueBoxTrans .blueBox .loginBtn a.backtoLgn,.blueBoxTransPopup .blueBox .loginBtn a.backtoLgn{
    color:#003DDA;
    border:2px solid #003DDA 
}
.blueBoxTrans .blueBox .loginBox .emailBox,.blueBoxTransPopup .blueBox .loginBoxPopup .emailBox1{
    border:1px solid #A6B1B8;
    background:#fff;
    opacity:1;
    height:68px;
    margin-bottom:40px;
    position:relative 
}
.blueBoxTrans .blueBox .loginBox .emailBox input,.blueBoxTransPopup .blueBox .loginBoxPopup .emailBox1 input{
    background:none;
    border:none;
    height:100%;
    width:100%;
    font-size:18px;
    color:#a6b1b8;
    font-family:"Avenir-Book";
    padding:0 20px 
}
.blueBoxTrans .blueBox .loginBox .passBox,.blueBoxTransPopup .blueBox .loginBoxPopup .passBox{
    border:1px solid #A6B1B8;
    background:#fff;
    opacity:1;
    height:68px;
    margin-bottom:40px;
    position:relative 
}
.blueBoxTrans .blueBox .loginBox .passBox input,.blueBoxTransPopup .blueBox .loginBoxPopup .passBox input{
    background:none;
    border:none;
    height:100%;
    width:100%;
    font-size:18px;
    color:#a6b1b8;
    text-transform:capitalize;
    font-family:"Avenir-Book";
    padding:0 20px 
}
.blueBoxTrans .blueBox .loginBox .blueBoxLink,.blueBoxTransPopup .blueBox .loginBoxPopup .blueBoxLink{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    padding-top:40px 
}
.blueBoxTrans .blueBox .loginBox .blueBoxLink p,.blueBoxTransPopup .blueBox .loginBoxPopup .blueBoxLink p{
    font-size:18px;
    font-family:"Avenir-Roman";
    color:#001F33;
    text-transform:capitalize 
}
.blueBoxTrans .blueBox .loginBox .blueBoxLink p a{
    color:#007bff 
}
.blueBoxTrans .blueBox .loginBox .blueBoxLink a.btn,.blueBoxTransPopup .blueBox .loginBoxPopup .blueBoxLink a.btn{
    margin-top:15px;
    padding:7px 35px 7px 20px;
    color:#fff 
}
.blueBoxTrans .blueBox .loginBox .blueBoxLink a.btn:after,.blueBoxTransPopup .blueBox .loginBoxPopup .blueBoxLink a.btn:after{
    top:8px 
}
.blueBoxTrans .blueBox .forgotBox,.blueBoxTransPopup .blueBox .forgotBox{
    display:none 
}
.blueBoxTrans .blueBox .forgotBox .passBox,.blueBoxTransPopup .blueBox .forgotBox .passBox{
    border:1px solid #A6B1B8;
    background:#fff;
    opacity:1;
    height:68px;
    margin-bottom:40px;
    position:relative 
}
.blueBoxTrans .blueBox .forgotBox .passBox input,.blueBoxTransPopup .blueBox .forgotBox .passBox input{
    background:none;
    border:none;
    height:100%;
    width:100%;
    font-size:18px;
    color:#a6b1b8;
    text-transform:capitalize;
    font-family:"Avenir-Book";
    padding:0 20px 
}

.blueBoxTrans .blueBox h3 {
    padding-bottom: 15px;
    position: relative;
    margin-block-end: 20px;
}
  .blueBoxTrans .blueBox h3:before {
    content: "";
    background: #00b4ff;
    height: 10px;
    width: 130px;
    position: absolute;
    bottom: 0;
    /*left: 0;*/
}
.blueBoxTrans{
    z-index: 999;
}
a.btn:hover:after, a.btn:hover.arrow:after {
    border-color: #fff !important;
}
*, ::after, ::before {
    box-sizing: border-box;
}
#remove-row-derivative.btn:hover:after, #remove-row-derivative.btn:hover.arrow:after{
    border-color: #fff !important;
}
#declineBtn.btn:hover:after, #declineBtn.btn:hover.arrow:after, #acceptBtn.btn:hover:after{
    border-color: #fff !important;
}
#calculate-button-derivative{width: 130px;}

#acceptBtn:hover{
    background: #001f33!important;
    color: #fff!important;}
    #declineBtn:hover{
    background: #001f33!important;
    color: #fff!important;}
    
    button.btn.arrow:after {
    border: solid #001f33;
    border-width: 0 2px 2px 0;
    content: "";
    display: inline-block;
    margin: 0 2px 1px 6px;
    padding: 3px;
    transform: rotate(315deg);
}

.blueBoxClose svg{
    filter: invert(7%) sepia(18%) saturate(5472%) hue-rotate(181deg) brightness(17%) contrast(110%);
}
.blueBoxLink{
    justify-content: flex-end !important;
    gap: 20px !important;
}