* {
margin: 0;
padding: 0;
box-sizing: border-box;
}

.dsb_wrp {
width: 100%;
min-height: 100vh;
background-color: rgb(255, 255, 255);
display: flex;
}

.dsb_lfbx {
width: 14%;
min-height: 100vh;
background-image: linear-gradient(to right, #686868,  #1b1a1a);
}

.dsh_resize {
cursor: ew-resize;
width: 5px;
min-height: 100vh;
background-image: linear-gradient(to right, #535252,  #767676);
}




/* COMPANY NAME & REDIRECT  */
.dsb_hdtpb {
max-width: 93%;
min-width: 50px;
margin-left: 3%;
margin-right: 3%;
margin-top: 10px;
display: flex;
height: 50px;
border-radius: 3px;
background-color: rgb(161, 161, 161);
cursor: default;
transition-duration: 0.1s;
}

.dsb_hdtpb:hover {
background-color: rgb(138, 138, 138);    
}

.dsb_cmv_lbx {
width: 70px;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
}

.dsb_cmv_lbx img {
width:30px;
} 

.dsb_cmv_rbx {
width: 100%;
height: 50px;
}

.dsb_cmv_rbx p:nth-child(1) {
font-family: 'Inter', sans-serif;  
font-size: 13px;
font-weight: 600;
color: rgb(255, 255, 255);
padding-top: 10px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 90%;
} 

.dsb_cmv_rbx p:nth-child(2) {
font-family: 'Inter', sans-serif;  
font-size: 10px;
font-weight: 400;
padding-top: 2px;
color: rgb(84, 84, 84);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 90%;
} 

/* WHITE PART  */
/* COMPANY NAME & REDIRECT  */
.dsb_pgtpb {
width: 17%;
margin-top: 13px;
margin-left: 15px;
display: flex;
justify-content: start;
height: 45px;
border-radius: 3px;
border: 1px solid #d1d5db;
border-radius: 8px;
background-color: #f9fafb;
cursor: default;
transition-duration: 0.1s;
}

.dsb_pgtpb:hover {
opacity: 80%;
}

.dsb_cpg_lbx {
width: 70px;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
}

.dsb_cpg_lbx img {
width:30px;
} 

.dsb_cpg_rbx {
width: 100%;
height: 40px;
}

.dsb_cpg_rbx p:nth-child(1) {
font-family: 'Inter', sans-serif;  
font-size: 13px;
font-weight: 600;
color: rgb(0, 0, 0);
padding-top: 7px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 90%;
} 

.dsb_cpg_rbx p:nth-child(2) {
font-family: 'Inter', sans-serif;  
font-size: 10px;
font-weight: 400;
padding-top: 2px;
color: rgb(162, 162, 162);
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
max-width: 90%;
} 

.dspg_wrp {
width: 100%;
min-height: 100vh;
background-image: url("../static/setup.png");
padding-bottom: 20px;
}

.dspg_cont {
width: 74%;
margin-left: 3%;
min-height: 100vh;
height: auto;
border-left: 1px solid #D4DBE0;
background-color: white;
box-shadow: 0px 4px 12px 0px rgba(209, 208, 208, 0.4);
margin-top: 20px;
padding-top: 20px;
}



.dsb_hdbdbx {
width: 100%;
height: auto;
margin-top: 15px;
margin-bottom: 100px;
z-index: 5500;
position: relative;
}

/* OPTION  */
.dbecop {
align-items: center;
width: 100%;
height: 35px;
transition-duration: 0.2s;
overflow: hidden;
transition-duration: 0.1s;
cursor: default;
display: flex;
justify-content: start;
padding-left: 9px;
border-left: 6px  #686868 solid;
}

.dbecop:hover {
border-left: 6px white solid;
background-image: linear-gradient(to right, #767676, #535252);
}

.dbecop i {
color: rgb(182, 181, 181);
font-size: 14px;
margin-right: 10px;
width: 15px;
}

.dbecop img {
width: 20px;
margin-right: 10px;
}

.dbecop p {
font-family: 'Inter', sans-serif; 
color: rgb(255, 255, 255);
font-size: 14px;
font-weight: 500;
}

.dbecop text {
border-radius: 50%;
color: white;
padding: 5px;
position: absolute;

font-size: 12px;
width: 23px;
height: 23px;
display: flex;
justify-content: center;
align-items: center;
font-family: 'Inter', sans-serif; 
right: 10px;
}

/* RIGHT BOX */
.dsb_rgbx {
width: 86%;
min-height: 100vh;
background-image: url("../static/setup.png");
}










/* COMPANY CHOOSER  */
.cmcsr_cont {
width: 30%;
margin-left: 35%;
margin-right: 35%;
min-height: 450px;
height: auto;
background-color: white;
box-shadow: 0px 4px 12px 0px rgba(209, 208, 208, 0.4);
margin-top: 80px;
margin-bottom: 60px;
padding-top: 10px;
padding-bottom: 30px;
}

.cmcsr_hdbx {
width: 100%;
height: 65px;
padding-left: 5%;
padding-right: 5%;
}

.cmcsr_hdp {
font-family: 'Roboto', sans-serif; 
font-size: 25px;
text-align: center;
color: black;
padding-top: 15px;
font-weight: 500;
}

.cmcsr_bdbx {
width: 86%;
min-height: 400px;
margin-left: 7%;
margin-right: 7%;
border-radius: 8px;
padding-bottom: 10px;
border: 1px rgb(224, 224, 224) dotted;
}

.cmcr_ecrw {
width: 94%;
min-height: 80px;
margin-left: 3%;
margin-right: 3%;
margin-top: 15px;
display: flex;
box-sizing: border-box;
border: 2px rgb(226, 226, 226) solid;
cursor: default;
border-radius: 8px;
}

.cmcr_ecrw:hover {
border: 2px rgb(36, 146, 255) solid;
}

.cmcr_eclg {
width: 20%;
height: 70px;
display: flex;
justify-content: center;
align-items: center;
}

.cmcr_eclg img {
width: 70%;
height: auto;
}

.cmcr_ecdt {
width: 75%;
min-height: 80px;
}

.cmcr_ecdtp1 {
font-family: 'Rubik', sans-serif;
font-size: 20px;
font-weight:500;
padding: 10px;
padding-top: 15px;
padding-bottom: 4px;
max-width: 95%; 
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

.cmcr_ecdtp2 {
font-family: 'Roboto', sans-serif;
font-size: 15px;
color: grey;
padding-left: 10px;
font-weight: 400;
max-width: 95%; 
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}