*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    list-style: none;
    text-decoration: none;
    font-family: 'Rubik', sans-serif;
}
a:hover,
textarea:hover, 
input:hover, 
textarea:active, 
input:active, 
textarea:focus, 
input:focus,
button:focus,
button:active,
button:hover,
label:focus,
.btn:active,
.btn.active
{
    outline:0px !important;
    -webkit-appearance:none;
    box-shadow: none !important;
    text-decoration: none;
}
body{
    background: rgba(46, 91, 225, 0.1);
    margin: auto;
    /* min-width: 1024px; */
}
a{
    color: initial;
}
p{
    margin-bottom: 0rem;
}
table{
    width: 100%;
}
a:hover{
    color: inherit;
}
.form-size{
    width: 50%;
}
.letter-spacing{
    letter-spacing: .1em;
}
.list-group-item {
    border: none;
}
#load-info li {
    width: 33%;
    float: left;
    list-style: none;
    padding: .6rem .6rem;
}
#load-info p{
    margin-bottom: 0rem;
}
.personal-data p{
    margin-bottom: 1rem;
}
#ship-req li{
    width: 23%;
    float: left;
    list-style-image: url('../img/check.svg');
    list-style-position: inside;
    padding: .5rem;
}
.txt-blue{
    color: #2E5BFF;
}
.main-content, .main-content-table{
    margin-left: 15rem;
    margin-right: 10rem;
}
form label{
    font-weight: 500;
    color: #B0BAC9;
    font-size: .8em;
    text-transform: uppercase;
}
.table-w90{
    width: 90%;
}
.form-control::placeholder{
    font-weight: 300;
    color: #8798AD; 
}
.form-control{
    background: rgba(224, 231, 225, .2);
    border: 1px solid rgba(224, 231, 225, 1);
}
.header{
    height: 5em;
    position: fixed;
    width: 100%;
    top:0;
    z-index: 1;
    border-bottom: 1px solid #E4E8F0;
}
.top-margin-content{
    margin-top: 7.5rem;
}
.parent{
    height: 5em;
}
.header td{
    padding: .5rem;
}
.sidebar{
    position: fixed;
    top: 0em;
    bottom: 0em;
    left: 0em;
    width: 5em;
    height: 100%;
    z-index: 2;
}
.sandwich-menu{
    height: 5em;
    margin-bottom: 6rem;
}
.sidebar .active{
    background-color: #E0E7FF;
    border-left: 3px solid #2E5BFF;
}
.sidebar li:hover{
    background-color: #E0E7FF;
    border-left: 3px solid #2E5BFF;
}
.sidebar li{
    padding: 1rem;
    border-left: 3px solid transparent;
}
.txt-title-page{
    font-weight: 300;
    font-size: 1.6em;
    color: #2E384D;
    margin-bottom: 10px;
  }
.txt-subtitle-page{
    margin-left: 1rem;
    font-weight: 400;
    color: #8798AD;
}
.txt-title-box{   
    font-weight: 300;
    font-size: 2em;
    color: #2E384D;
  }
.txt-desc-box{
    font-weight: 400;
    font-size: 1em;
    color: #8798AD; 
  }
#list-items li{
    font-weight: 400;
    font-size: 1em;
    color: #2E5BFF;  
    padding-bottom: 1rem;
  }
#list-items a:hover {
    color: #2E5BFF;
    text-decoration: none;
}
#list-items a{
    color: #2E5BFF;
    text-decoration: none;
}
.icon-add{
    width: .8em;
    height: auto;    
    margin-right: .5rem;
}
.white-box{
    padding: 2rem;
    margin-bottom: 3rem;
    margin-right: .4rem;
    background-color: #fff;
    box-shadow: 0 10px 20px 0 rgba(46,91,255,0.07); 
    border-radius: 1px; 
    min-height: 26em;
}
.bg-lightgreen{
    background-color: #E1F3E0;
}
.bg-lightpurple{
    background-color: #EEE6FF;
}
.bg-lightskyblue{
    background-color: #D9F6F9;
}
.bg-lightred{
    background-color: #F9E2E4;
}
.bg-lightyellow{
    background-color: #FEF6E2;
}
.img-symbol-size{
    width: 3em;
    height: 3em;
    border-radius: 50%!important;
    align-items: center!important;
    justify-content: center!important;
    display: flex!important;    
}
.blue-button{    
    font-weight: 400;
    background-color: #2E5BFF;
    color: #fff;
    padding: .5rem 5rem .5rem 5rem;
}
.filter-style{
    background-color: #fff;
    padding: 2rem;
    margin-top: 1.5rem;
}
.filter-style label{  
    font-weight: 400;
    color: #2E384D;
}
.filter-style .row{
    margin: 0px;
}
.filter-style input{
    border: 1px solid #E0E7FF;
    font-weight: 400;
    color: #2E5BFF;
}
.filter-style ::placeholder{    
    font-weight: 300;
    color: #8798AD;    
}

.filter-style .blue-button{
    color: #fff;
    border: none;
    margin-top: .5rem;
}
.input-group-width{
    width: 15%;
}
.input-group-text {
    background-color: #2E5BFF;
    border: 1px solid #2E5BFF;
    color: #fff;
    font-weight: 400;
}
.table-loads{
    margin-top: 2rem;
}
.table-loads td:nth-child(9){
    cursor: pointer;
}
.table-loads td:last-child{
    padding-left: 1rem;
    padding-right: .6rem;
    cursor: pointer;
}
.admin-access table {
    border-collapse: separate;
    border-spacing: 5em em;
}
.btn-deny{
    font-weight: 400;
    border-radius: .3em;
    padding: .6rem 3.5rem;
    text-transform: uppercase;
    background-color: rgba(232, 74, 80,.15);
    color: #E84A50;
    border: none;
}
.btn-allow{
    font-weight: 400;
    border-radius: .3em;
    padding: .6rem 3.5rem;
    text-transform: uppercase;
    background-color: rgba(11, 107, 242,.15);
    color: #0B6BF2;
    border: none;
}
.table-loads th:nth-child(1) {
    padding-left: 1rem;
}
.table-loads td:nth-child(1) {
    padding-left: 1rem;
}
.table-loads thead th{
    font-weight: 500;
    color: #B0BAC9;
    font-size: .8em;
    text-transform: uppercase;
    padding: 0rem 0rem 1rem 0rem;
    border-bottom: none;
    border-top: none;
}
.table-loads td{
    border-top: none;
    /* font-size: .8em; */
    color: #2E384D;
    background-color: #fff;
    padding: 1.5rem 2rem 1.5rem 0rem;
    border-bottom: 10px solid rgba(46, 91, 225, 0.1);
}
.table-loads .text-rate{
    color: #2E384D;
    font-weight: 500;
    font-size: 1em;
}
.table-loads tbody > tr:last-child > td {
    border-bottom: 0;
  }
.table-loads th .fa-angle-down{
    color: #2E5BFF;
}
.table-loads td .fa-angle-right{
    color: #2E5BFF;
}
#map{
    height: 25em;
    margin-top: 5rem;
    margin-left: 5rem;
    overflow: hidden;
}
.top-shipper-info{
    margin-top: -7rem;
}
.txt-title-shipper{
    font-weight: 400;
    color: #B0BAC9;
    font-size: .8em;
    text-transform: uppercase;
} 
.img-profile-shipper{
    width: 2.7em;
    height: 2.7em;
}
.txt-500{
    font-weight: 500;
}
.txt-400{
    font-weight: 400;
}
.txt-400-mt{
    font-weight: 400;
    margin-top: -1rem;
    color: #8798AD;
    margin-bottom: 3rem;
    margin-top: .2rem;
}
.txt-400-mt::before{
    content: url(../img/spark.svg);
}
.ratings{
    color: #8798AD;
    font-weight: 400;
}
.txt-review{
    font-weight: 500;
    color: #2E5BFF;
}
.info-dot{
    cursor: pointer;
}
.bg-light-black{
    background: rgba(0, 0, 0, .4);
    height: 10em;
    width: 8em;
    position: absolute;
    border-radius: 10px;
}
.upload-img{
    height: 10em;
    width: 8em;
    border-radius: 10px;
    overflow: hidden;
    cursor: pointer;
}
.upload-img-empty{
    height: 10em;
    width: 8em;
    border-radius: 10px;
    border: 1px solid #2E5BFF;
    cursor: pointer;
}
.upload-plus{
    position: relative;
    top: -90px;
    left: 52px;
    color: #fff;
}
.upload-plus-empty{
    position: relative;
    top: 70px;
    left: 52px;
    color: #2E5BFF
}
.img-upload{
    height: 10em;
    width: 8em;
}
.txt-pay{
    font-weight: 400;
    font-size: 3.5em;
}
.bg-darkblue{
    background: #2E5BFF;
}
.bg-bluegrey{
    background: rgba(46,56,77,1);
}
.line-horizontal{
    margin: .3rem .3rem;
    width: 15em;
    height: 2px;
    background-color: rgba(46, 91, 225, .15)
}
.ft-light-blue{
    color: rgba(135,152,173,7);
}
.txt-300{
    font-weight: 300;
    font-size: 1.8em;
}
.txt-300-1em{
    font-weight: 300;
    font-size: 1em;
    color: #B0BAC9;
}
.title-form{
    font-weight: 300;
    font-size: 1.8em;
    border-bottom: 3px solid #2E5BFF;
    width: 10em;
    padding-bottom: 1rem;
}
.form{
    padding-bottom: 2rem;
}
.form-success{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    display: none;
    padding-bottom: 1.5rem;
}
.signin span{
    margin: .4em 0 1em;
	color: #ff7a7a;
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: .15em;
}
.signin{
    height: 100vh;
    flex-direction: column;
    display: flex;
    justify-content: center;
    align-items: center;
    
}
.bg-img{
    background-image: url(../img/signin-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    top: 0em;
    bottom: 0em;
    right: 0em;
}
#temp li{
    background-color: #fff;
    width: 32%;
    padding: 2rem;
    /* float: left; */
    /* margin-right: 1rem; */
    display: inline-block;
}
#temp-items li{
    width: 100%;
    padding: .5rem 0rem;
    color: #2E5BFF;
}
#address td{
    width: 50%;
    padding-right: 15rem;
    padding-top: .5rem;
    vertical-align: baseline;
}
#delivery-info li{
    float: left;
    width: 50%;
    padding: .6rem .6rem;
}               
#contact li{
    float: left;
    width: 50%;
    padding: .6rem;
} 
#address li{
    float: left;
    padding: .6rem .6rem;
    width: 50%;
} 
.new-driver{
    background-color: #fff;
    padding: 2rem;
    margin-top: 1rem;
    margin-bottom: 4rem;
    overflow: auto;
} 
.new-driver li{
    float: left;
    width: 46%;
    margin-right: 1rem;
}
.new-driver ul{
    margin-top: .6rem;
}
.new-driver label{
    font-weight: 500;
    color: #B0BAC9;
    font-size: .7em;
}
.new-driver th{
    font-weight: 500;
    color: #B0BAC9;
    font-size: .7em;
    text-transform: uppercase;
}
.add{
    margin-top: 2rem;
    width: 75%;
    height: 70%;
    background: rgba(46, 91, 225, 0.1);
    border-radius: 5px;
    background-image: url(../img/plus-icon.svg);
    background-repeat:no-repeat;
    background-position: center;
    cursor: pointer;
    margin-bottom: 3rem;
}
.identity li{
    width: 23%;
}
.img-vechile{
    width: 5em;
    height: 5em;
    border-radius: 100px;
    background-color: #F2F4F7;
    background-image: url(../img/truck.svg);
    background-repeat:no-repeat;
    background-position: center;
}
.img-attach{
    background-image: url(../img/plus-icon.svg);
}
.box-white{
    background-color: #fff;
    padding: 2rem;
    margin-top: 1rem;
    margin-bottom: 4rem;    
    overflow: auto;
}
.box-white li{
    float: left;
    width: 32%;
    padding: 1rem;
    border: 1px solid #E0E7FF;
    border-radius: 5px;
    margin-right: 1.2rem;
    list-style: none;
    margin-bottom: 1.2rem;
    cursor: pointer;
}
.box-white li:hover{
    border-color: #2E5BFF;
}
/* .box-white li:hover .active-check{
    display: block;
} */
li.active-border{
    border: 1px solid #2E5BFF;
}
.active-check{
    width: 1.5em;
    height: 1.5em;
    background: #2E5BFF;
    border-radius: 100%;
    background-image: url(../img/check-white.svg);
    background-repeat: no-repeat;
    background-position: center;    
    position: relative;
    left: 1.8em;
    bottom: 1.8em;
    margin-left: auto;
}
.txt-400-B0BAC9{
    font-weight: 400;
    color: #B0BAC9;
    font-size: 1em;
}
.card-box{
    margin-top: 1rem;

}
.card-box {
    margin-top: 1rem;
    margin-bottom: 4rem;
    overflow: auto;
}
.card-box ul{
    display: flex!important;
    justify-content: space-between!important;

}
.card-box li{
    background-color: #fff;
    padding: 2rem;
    width: 30%;
    float: left;
}
.txt-light-3em{
    font-weight: 300;
    font-size: 3em;
}
.txt-light-1em{    
    font-size: 1.5em;
}
.profile-pic{
    width: 4em;
    height: 4em;
    border-radius: 100%;
}
.driver-rank{
    left: -1.8rem;
    position: relative;
    width: 3em;
    height: 1.5em;
    border-radius:  2em;
    font-weight: 500;
    color: #fff;
    font-size: .8em;
    text-align: center;
    box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
  }
.rank-driver{
    margin-top: 1rem;
}
.rank-driver td{
    padding-left: 0rem;
}
.load-more{
    border-bottom: 2px solid #E4E8F0;
}
.txt-load-more{
    font-weight: 500;
    color: #B0BAC9;
    font-size: .8em;
    text-transform: uppercase;
    text-align: center;
    position: relative;
    bottom: -.8em;
    background-color: #e9edfb;
    padding: .9rem 2rem;
}
                                                     /* Screen width equal to or greater than 1440px */
@media(max-width:1440px){                                      
.form-size{
    width: 75%;
}    
.main-content {
    margin-left: 15rem;
    margin-right: 10rem;
}
.table-w90{
    width: 85%;
}
.table-loads td {
    padding-right: .6rem;
}
.main-content-table {
    margin-left: 10rem;
    margin-right: 5rem;
}
#ship-req li {
    width: 30%;
}
.img-symbol-size {
    width: 2.5em;
    height: 2.5em;
}
.white-box {
    padding: 1rem;
    min-height: 22em;
}
.txt-title-box {
    font-size: 1.6em;
}
.txt-desc-box {
    font-size: .9em;
}
#list-items li{
    font-size: .9em;
}
.filter-style .form-group {
    margin-right: 1rem;
}
.input-group-width{
    width: 22%;
}
#address td{
    padding-right: 6rem;
}
#load-info li {
    width: 50%;
}
.box-white li {
    width: 31%;
}
}

@media(max-width:1366px){                                       /* Screen width equal to or greater than 1366px */

.input-group-width{
    width: 24%;
}
#ship-req li {
    width: 33%;
}
#delivery-info .txt-300{
    font-size: 1.6em;
}
.box-white li {
    width: 31%;
}
}

@media(max-width:1280px){                                       /* Screen width equal to or greater than 1280px */
.filter-style ::placeholder{    
    font-size: .9em;   
}
.filter-style input{
    font-size: .9em;
}
.input-group-width{
    width: 26%;
}
#ship-req li {
    width: 40%;
}
#address td{
    padding-right: 4rem;
}
#delivery-info .txt-300{
    font-size: 1.4em;
}
.box-white li {
    width: 48%;
}
}

@media(max-width:1024px){                                       /* Screen width equal to or greater than 1024px */
.main-content {
    margin-left: 10rem;
    margin-right: 5rem;
}
.main-content-table {
    margin-left: 6rem;
    margin-right: 1rem;
}
.table-loads td {
    font-size: .8em;
    /* padding: 1rem; */
}
#ship-req li {
    width: 45%;
}
.white-box {
    padding: .8rem;
    margin-bottom: 2.5rem;
    margin-right: 0rem;
    min-height: 21em;
}
.img-symbol-size {
    width: 2.2em;
    height: 2.2em;
}
.txt-title-box {
    font-size: 1.4em;
}
.txt-desc-box {
    font-size: .8em;
}
#list-items li{
    font-size: .8em;
}
.input-group-width{
    width: 30%;
}
#address td{
    padding-right: 3rem;
}
#delivery-info .txt-300{
    font-size: 1.3em;
}
.box-white li {
    width: 47%;
}
}