@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700&display=swap');
body{
    font: 16px "Lato", sans-serif;
    display: flex;
    justify-content: center;
    align-items: start;
    background: #00041D;
}
@media screen and (min-width: 360px){
    body::before{
        content: '';
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(180deg, #00041D, rgb(193, 0, 170));
        height: 300px;
    }
}

.mb-3{
    color: #CEAA5B;
    font-size: 16px;
    margin: 15px;
    font-weight: 700;
    padding: 0px;
}
.mb-3 textarea{
    display: block;
    width: 100%;
    background-color: #353535;
    border-radius: 5px;
    border: 2px solid #ffffff32;
    margin-top: 5px;
    margin-bottom: 3px;
    font-size: 15px;
    box-sizing: border-box;
    outline: none;
    padding: 5px;
    font-family: lato, sans-serif;
    transition: 0.3s;
    color: white;
}

.accout-lable{
    color: rgb(255, 255, 255);
    font-size: 20px;
    text-align: center;
    font: lato, sans-serif;
    font-weight: 700;
}

.headline{
    color: white;
    font-size: 18px;
    font: lato;
    font-weight: 700;
    text-align: center;
    padding-top: 20px;
    text-transform: uppercase;
}
.headline_tut{
    color: white;
    font-size: 14px;
    font: lato;
    padding-top: 15px;
    margin-left:15px;
}
.headline_tut a{
    color:#ceaa5b;
}

.headline_login{
    color: white;
    font-size: 20px;
    font: lato;
    font-weight: 700;
    text-align: center;
    padding-top: 120px;
    text-transform: uppercase;
}
.mb-3 .form-control{
    display: block;
    width: 100%;
    background-color: #353535;
    border-radius: 5px;
    border: 2px solid #ffffff32;
    margin-top: 5px;
    margin-bottom: 3px;
    font-size: 15px;
    box-sizing: border-box;
    outline: none;
    padding: 5px;
    font-family: lato, sans-serif;
    transition: 0.3s;
    color: white;
}
.mb-3 #nic_read{
    font-weight: 400;
    font-size: 15px;
}
.form_bk_index{
    background-color: #242424;
    border-radius: 12px;
    margin: 20px 10px 20px 10px;
}
.form_bk_login{
    background-color: #242424;
    border-radius: 12px;
    margin: 10px;
    padding: 5px;
    width: 100%;
}
.us{
    display: block;
    width: 100%;
    background-color: #353535;
    border-radius: 5px;
    border: 2px solid #ffffff11;
    margin-top: 5px;
    margin-bottom: 3px;
    font-size: 16px;
    box-sizing: border-box;
    outline: none;
    padding: 5px;
    font-family: lato, sans-serif;
    transition: 0.3s;
    color: rgba(255, 255, 255, 0.508);
}
::Placeholder{
    color: rgb(155, 155, 155);
}

.showps{
    margin-left: 20px;
    display: flex;
    align-items: center;
}
.showps label{
    color: rgb(245, 245, 245);
    font-size: 14px;
    font-weight: 400;
}

.chek{
    width: 15px;
    height: 15px;
    margin: 8px;
}

.mb-3 input[type=text]:focus {
    border: 2px solid #FFFFFFB3;
}
.mb-3 input[type=password]:focus {
    border: 2px solid #FFFFFFB3;
}
.mb-3 input[type=tel]:focus {
    border: 2px solid #FFFFFFB3;
}
.mb-3 textarea[type=text]:focus {
    border: 2px solid #FFFFFFB3;
}
.mb-3 .us[type="text"]:focus{
    border: 2px solid #ffffff11;
}

.des{
    color: #FFFFFFBA;
    font-size: 13px;
    font-weight: 400;
}
.buttons{
    display: flex;
    justify-content: center;
    align-items: center;
}
.btn{
    font-size: 16px;
    padding: 8px 20px;
    margin: 15px;
    border-radius: 10px;
    color: #ffffff;
    background-color: #CEAA5B;
    border-style: hidden;
}

.fail{
    font-size: 16px;
    color: red;
    background-color: rgb(255, 177, 177);
    border-radius: 8px;
    font-family: lato, sans-serif;
    margin-top: 15px;
    padding: 15px;
    margin-bottom: 10px;
}
.success{
    font-size: 16px;
    color: green;
    background-color: rgb(172, 255, 172);
    border-radius: 8px;
    font-family: lato, sans-serif;
    margin-top: 15px;
    padding: 15px;
    margin-bottom: 10px;
}

.rounded-circle{
    margin: 10px;
    padding: 3px;
    background: linear-gradient(40deg, #405de6,
    #5851db,
    #833ab4,
    #c13584,
    #e1306c,
    #df1d1d);
   border-radius: 70px;
   width: 90px;
   height: 90px;
}
.img_baack{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}  
  
.img_baack_cover{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 8px;
}
.img_baack_galle{
    background-color: rgb(51, 51, 51);
    padding: 8px;
    border-radius: 10px;
    margin: 3px;
}
.rounded-circle_galley{
    padding: 2px;
    background: linear-gradient(40deg, #405de6,
    #5851db,
    #833ab4,
    #c13584,
    #e1306c,
    #df1d1d);
    border-radius: 10px;
    margin-top: 5px;
    width: 80px;
    height: auto;
}
.rounded-circle_cover{
   border-radius: 10px;
   width: 180px;
   height: auto;
}
.cover_img{
  height: 75px;
  margin-top: 5px;
  border-radius: 10px;
  overflow: hidden;
  width: 180px;
  background: linear-gradient(40deg, #405de6,
  #5851db,
  #833ab4,
  #c13584,
  #e1306c,
  #df1d1d);
  outline: solid 2px #ffffff70 ;
}
.logo{
    padding-top: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.theme-items{
    color: #CEAA5B;
    font-size: 16px;
    margin: 15px;
    font-weight: 700;
    display: block;
    align-items: center;
}
.theme-list{
    color: rgb(255, 255, 255);
    font-size: 18px;
    margin-top: 10px;
    margin-left: 10px;
}
.theme-list a{
    color: white;
    font-size: 15px;
    font-weight: 400;
}
.theme-list a:hover{
    color: #CEAA5B;
}
.items{
    display: flex;
    padding-bottom: 10px;
    align-items: center;
}

.radio{
    width: 17px;
    height: 17px;
}
.btn-2-rectangle-1 {
    height: 35px;
    border-radius: 10px;
    width: auto;
    font-size: 15px;
    align-items: center;
    justify-content: center;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    background: linear-gradient(90deg,#d5135a,#f05924);
  }
.btn-2-rectangle-2 {
    height: 35px;
    border-radius: 10px;
    width: auto;
    font-size: 15px;
    align-items: center;
    justify-content: center;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    color: #000;
    background: linear-gradient(90deg,#cdde0f,#f4df1d);
}
.btn-2-rectangle-3 {
    height: 35px;
    width: auto;
    border-radius: 10px;
    font-size: 15px;
    align-items: center;
    color: #000;
    justify-content: center;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    background: linear-gradient(90deg,#ffdd00,#ffff30);
}
.btn-2-rectangle-4 {
    height: 35px;
    width: auto;
    border-radius: 10px;
    color: #000;
    font-size: 15px;
    align-items: center;
    justify-content: center;
    display: flex;
    padding-left: 10px;
    padding-right: 10px;
    background: linear-gradient(90deg,#0ed328,#2bf843);
}

.btn-2-rectangle-white{
    color: #ffffff;
    font-size: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    width: auto;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(0, 0, 0);
}

.btn-2-rectangle-black{
    color: #000000;
    font-size: 15px;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-left: 10px;
    padding-right: 10px;
    width: auto;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: rgb(255, 255, 255);
}

.red{
    background: linear-gradient(180deg,rgb(255, 0, 0),rgb(255, 137, 137));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.orange{
    background: linear-gradient(180deg,rgb(255, 145, 0),rgb(255, 189, 104));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.lblue{
    background: linear-gradient(180deg,rgb(0, 221, 255),rgb(155, 242, 255));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.dblue{
    background: linear-gradient(180deg,rgb(0, 98, 255),rgb(119, 171, 255));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.pink{
    background: linear-gradient(180deg,rgb(253, 127, 255),rgb(254, 173, 255));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.green{
    background: linear-gradient(180deg,rgb(0, 212, 0),rgb(88, 255, 88));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}
.purple{
    background: linear-gradient(180deg,rgb(212, 0, 255),rgb(231, 110, 255));
    width: 35px;
    height: 40px;
    border-radius: 6px;
    margin-left: 5px;
    margin-right: 5px;
}

.gallsection{
    display: flex;
    margin-top: 5px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.gallsection_index{
    display: flex;
    margin-top: 5px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.gallsection_cover{
    display: flex;
    margin-top: 15px;
    width: 230px;
}
.custom-file-upload_index{
    color: rgb(255, 255, 255);
    width: 100px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    margin: 8px;
    background: #414141; 
    border-radius: 5px; 
    display: inline-block;
    padding: 5px 12px;
    cursor: pointer;
    overflow: hidden;
}
.custom-file-upload_index:hover{
    background-color: #ffffffce;
    color: #000;
}
.custom-file-upload{
    color: rgb(255, 255, 255);
    width: 80px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    margin: 8px;
    background: #414141; 
    border-radius: 5px; 
    display: inline-block;
    padding: 5px 12px;
    cursor: pointer;
}

.custom-file-upload_pp{
    color: rgb(255, 255, 255);
    width: 120px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    margin: 8px;
    background: #414141; 
    border-radius: 5px; 
    display: inline-block;
    padding: 6px 12px;
    cursor: pointer;
}
.custom-file-upload_index_pp{
    color: rgb(255, 255, 255);
    min-width: 100px;
    max-width: 140px;
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    border: 2px solid #ffffff7a;
    margin: 8px;
    background: #414141; 
    border-radius: 5px; 
    display: inline-block;
    padding: 5px 12px;
    overflow: hidden;
    cursor: pointer;
}
.custom-file-upload_index_pp:hover{
    background-color: #ceaa5b71;
}
.custom-file-upload_cover{
    color: rgb(255, 255, 255);
    font-size: 14px;
    font-weight: 400;
    text-align: center;
    margin: 8px;
    background: #414141; 
    border-radius: 5px; 
    display: block;
    height: auto;
    padding: 6px 10px 10px 10px;
    overflow: hidden;
    cursor: pointer;
}
.img_remove_icon{
    height: 16px;
    width: 16px;
    margin-left: 7px;
    justify-content: center;
    align-items: center;
}
  
.remove_bk{
    color: rgb(0, 0, 0);
    font-size: 15px;
    font-weight: 400;
    display: flex;
    width: 100%;
    margin-top: 5px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.remove_bk_cover{
    color: rgb(0, 0, 0);
    font-size: 15px;
    font-weight: 400;
}
.rm{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}
#Erase_1, #Erase_2, #Erase_3, #Erase_4, #Erase_5, #Erase_6,#Erase_7, #Erase_8, #Erase_9, #Erase_10, #Erase_11, #Erase_12{
    display: block;
    width: 100px;
    background-color: #353535;
    border-radius: 5px;
    border: 2px solid #ffffff32;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 15px;
    font-weight: 400;
    box-sizing: border-box;
    outline: none;
    padding: 5px;
    font-family: lato, sans-serif;
    transition: 0.3s;
    color: white;
}
#tag_index, #tag_index_1, #tag_index_2, #tag_index_3, #tag_index_4, #tag_index_5, #tag_index_6, #tag_index_7, #tag_index_8, #tag_index_9, #tag_index_10, #tag_index_11, #tag_index_12{
    display: block;
    width: 90%;
    background-color: #353535;
    border-radius: 5px;
    border: 2px solid #ffffff32;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 15px;
    font-weight: 400;
    box-sizing: border-box;
    outline: none;
    padding: 5px;
    font-family: lato, sans-serif;
    transition: 0.3s;
    color: white;
}
.recommendation{
    color: #FFFFFFBA;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 10px;
    width: auto;
    border-radius: 10px;
    padding: 10px;
    background: rgb(57, 57, 57);
}
.recommendation a{
    color: rgb(255, 255, 255);
    text-decoration:none
}
.image_02, .image_01, .image_03, .image_04, .image_05, .image_06, .image_07, .image_08, .image_09, .image_10, .image_11, .image_12{
    background-color: rgb(182, 182, 182);
    border-radius: 8px;
    padding: 3px;
    padding-bottom: 7px;
    margin: 2px;
}

.image_13{
    background-color: rgb(182, 182, 182);
    border-radius: 8px;
    padding: 3px;
    padding-bottom: 7px;
    display: block;
    margin-top: 10px;
    width: 100%;
}
.charactors{
    width: auto;
    display: flex;
    justify-content: right;
    margin-top: 10px;
    color: #f1f1f1;
    font-size: 13px;
    font-weight: 400;
    margin-right: 10px;
}
.switch {
    position: relative;
    display: inline-block;
    width: 50px;
    height: 23px;
    margin-bottom: 10px;
}
  
.switch input { 
    opacity: 0;
    width: 0;
    height: 0;
}
  
.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #02db10b5;
    -webkit-transition: .4s;
    display: flex;
    align-items: center;
    transition: .4s;
}
.slider_2 {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #f41212b2;
    -webkit-transition: .4s;
    transition: .4s;
    display: flex;
    align-items: center;
}
  
.slider:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 2.5px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}
.slider_2:before {
    position: absolute;
    content: "";
    height: 18px;
    width: 18px;
    left: 4px;
    bottom: 2.6px;
    background-color: rgb(255, 255, 255);
    -webkit-transition: .4s;
    transition: .4s;
}
  
input:checked + .slider {
    background-color: #cccccc66;
}  
input:checked + .slider:before {
    background-color: #49ff07;
}
.correct{
    width: 14px;
    height: 14px;
    padding-left: 8px;
}
.yes{
    align-items: center;
    color: #ffffff57;
    font-size: 15px;
    font-weight: 400;
    margin-left: 10px;
}
input:focus + .slider {
    box-shadow: 0 0 1px #cccccc66;
}
  
input:checked + .slider:before {
    -webkit-transform: translateX(23px);
    -ms-transform: translateX(23px);
    transform: translateX(23px);
}
input:checked + .slider_2 {
  background-color: #cccccc66;
} 
.close{
    width: 16px;
    height: 16px;
    padding-left: 7px;
}

input:checked + .slider_2:before {
   background-color: #ff0037;
}
input:focus + .slider_2 {
    box-shadow: 0 0 1px #cccccc66;
}
input:checked + .slider_2:before {
    -webkit-transform: translateX(23px);
    -ms-transform: translateX(23px);
    transform: translateX(23px);
}
  
  /* Rounded sliders */
.slider.round {
    border-radius: 34px;
} 
.slider.round:before {
    border-radius: 50%;
}  

  /* Rounded sliders */
.slider_2.round {
    border-radius: 34px;
}
.slider_2.round:before {
    border-radius: 50%;
}
.gallery_img{
    background: rgb(0, 0, 0);
    color: white;
    width: 80%;
    border-radius: 8px;
    border: 0px solid;
    font-size: 14px;
    font-weight: 400;
    padding: 5px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 8px;
}

.detais_section{
    background-color: #242424;
    border-radius: 12px;
    margin-right: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
    
}
.social_media_section{
    background-color: #242424;
    border-radius: 12px;
    margin-right: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
}
.gallery_section{
    background-color: #242424;
    border-radius: 12px;
    margin-right: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;

}
.color_section{
    background-color: #242424;
    border-radius: 12px;
    margin-right: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;

}
.acc_index{
    background-color: rgba(0, 0, 0, 0.401);
    padding: 7px 0px 20px 0px;
    margin: 0px 5px 0px 5px;
    border-top: 3px solid rgb(255, 255, 255);
}
.social_index{
    padding: 7px 0px 20px 0px;
    border-top: 3px solid rgb(255, 255, 255);
    background: linear-gradient(180deg, #242424, #242424);
}
.account_data_section{
    background-color: #242424;
    border-radius: 12px;
    margin-right: 3px;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    margin-top: 10px;
    width: auto;

}
.main_menu {
    height: 100%;
    background-color: #3c3c3c;
    border-radius: 10px;
    margin: 10px 0px;
    margin-right: 10px;
    padding: 8px;
} 
.main_menu a{
    color: white;
} 
.menu_icons svg{
    color: rgb(0, 0, 0);
    width: 20px;
    height: 20px;
    border: rgb(255, 255, 255) 2px solid;
    background-color: rgb(255, 255, 255);
    border-radius: 50%;
    padding: 5px;
    margin: 15px 0px;
}
.main_section{
    display: flex;
}

.agreements1{
    margin-left: 20px;
    display: flex;
    align-items: center;
    padding-top: 15px;
    padding-bottom: 15px;
}
.agreements2{
    margin-left: 20px;
    display: flex;
    align-items: center;
    padding-bottom: 15px;
}

.agreements1 .box{
    color: rgb(251, 251, 251);
    font-size: 15px;
    font-weight: 400;
}
.agreements2 .box{
    color: rgb(251, 251, 251);
    font-size: 15px;
    font-weight: 400;
}
.checkbox{
    width: 15px;
    height: 15px;
    margin-right: 8px;
}
.gallery_selection{
    font-size: 15px;
    font-weight: 400;
    align-items: center;
    display: flex;
    height: 30px;
}
input[type='radio']:after {
    width: 14px;
    height: 14px;
    border-radius: 15px;
    background-color: #5f5f5f;
    content: '';
    display: inline-block;
    border: 2px solid white;
}

input[type='radio']:checked:after {
    width: 14px;
    height: 14px;
    border-radius: 15px;
    background-color: #f6b322;
    content: '';
    display: inline-block;
    border: 2px solid #ffffff;
}



#preloader{
    background: #000000;
    background-size: 5%;
    height: 100%;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    position: fixed;
    z-index: 100;
}
.icon_background1{
    display: flex;
    justify-content: center;
    align-items: center;
}
.wait{
    font-size: 17px;
    color: white;
    padding-top: 10px;
}
.custom-loader {
    width: 100px;
    height: 100px;
    display: grid;
    color:#F4F4F4;
    background: radial-gradient(farthest-side, currentColor calc(100% - 12px),#0000 calc(100% - 10px) 0);
    -webkit-mask:radial-gradient(farthest-side,#0000 calc(100% - 26px),#000 calc(100% - 24px));
    border-radius: 50%;
    animation: s9 2s infinite linear;
  }
  .custom-loader::before,
  .custom-loader::after {    
    content:"";
    grid-area: 1/1;
    background:
      linear-gradient(currentColor 0 0) center,
      linear-gradient(currentColor 0 0) center;
    background-size: 100% 20px,20px 100%;
    background-repeat: no-repeat;
  }
  .custom-loader::after {
     transform: rotate(45deg);
  }
  
  @keyframes s9 { 
    100%{transform: rotate(1turn)}
  }

.main_top_menu{
    display: none;
}
.login_body{
    display: block;
} 
.form{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 60vh;
}
.navigation_menu{
    display: flex;
    justify-content: center;
}
.navigation_menu lable{
    background-color: #ceaa5b41;
    width: 20%;
    padding: 10px;
    text-align: center;
    font-size: 14px;
    color: white;
    font-family: lato, sans-serif;
    display: flex;
    align-items: center;
}
#details_menu{
    background: #CDAB5B;
    font-weight: 700;
}
.navigations_btn{
    display: flex;
    padding: 10px;
}
.next_btn{
    display: flex;
    padding: 10px;
    width: 50%;
    justify-content: end;
    align-items: center;
}
.back_btn{
    display: flex;
    padding: 10px;
    width: 50%;
    justify-content: start;
    align-items: center;
}
.next_btn svg{
    width: 17px;
    height: 17px;
    padding-left: 5px;
}
.next_btn lable{
    display: flex;
    align-items: center;
    background: #cdab5b8e;
    font-size: 15px;
    color: #fff;
    padding: 5px 15px 5px 20px;
    border-radius: 8px;
}
.back_btn svg{
    width: 17px;
    height: 17px;
    padding-right: 5px;
}
.back_btn lable{
    display: flex;
    align-items: center;
    background: #cdab5b8e;
    font-size: 15px;
    color: #fff;
    padding: 5px 20px 5px 15px;
    border-radius: 8px;
}
.pp img{
    border:2px solid #ffffff75; 
    width:90px; 
    height:90px; 
    margin-bottom:10px; 
    border-radius:70%;
}
#brhh_coverr{
    border-radius:10px; 
    border:2px solid #ffffff75; 
    width:100%; 
    height:120px; 
    display:none; 
    margin-bottom:10px; 
    margin-top:10px; 
    overflow:hidden;
}
.image_02 img, .image_01 img, .image_03 img, .image_04 img, .image_05 img, .image_06 img, .image_07 img, .image_08 img, .image_09 img, .image_10 img, .image_11 img, .image_12 img{
    width: 90px;
    margin-bottom: 5px;
    border-radius: 8px;
    border: 2px solid rgb(255, 255, 255);
}
#Remove_1, #Remove_2, #Remove_3, #Remove_4, #Remove_5, #Remove_6, #Remove_7, #Remove_8, #Remove_9, #Remove_10, #Remove_11, #Remove_12{
    width: 75px;
    margin-bottom: 5px;
    border-radius: 8px;
    border: 0px solid rgba(255, 0, 0, 0);
}

.loading_bar_pp, .loading_bar_cover{
    margin-bottom: 10px;
}
.bar{
    height: 6px;
    width: 100%;
    background: #80808073;
    border-radius: 10px;
}
.bar_bk{
    width:100%;
    display: flex;
    justify-content: center;
}
.bar_gallery{
    height: 6px;
    border-radius: 10px;
    background:black;
    width: 80%;
}
.progress{
    background: linear-gradient(90deg, #ADF7F2, #15AAFF);
    height: 100%;
    width: 0%;
    border-radius: 10px;
}


.upload_image_index_pp, .upload_image_index_cover{ 
    font-size: 14px;
    font-weight: 400;
    background-color: rgb(0, 0, 0);
    color: white;
    border-radius: 8px;
    cursor: pointer;
    padding-top: 4px;
    padding-bottom: 4px;
    border: rgba(255, 255, 255, 0.388) 2px solid;
    transition: 0.3s;
    margin: 5px;
}
.upload_image_index_pp:hover, .upload_image_index_cover:hover{
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    border: rgb(0, 149, 255) 2px solid;
}

.sucessful_upload svg{
    width: 14px;
    height: 14px;
    padding-right: 5px;
}
.sucessful_upload_gallery svg{
    width: 14px;
    height: 14px;
    padding-right: 5px;
}
.sucessful_upload{
    color: rgb(0, 211, 25);
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 5px;
    padding-bottom: 5px;
}    
.sucessful_upload_gallery{
    color: rgb(0, 107, 12);
    font-size: 13px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: 5px;
    padding-bottom: 5px;
} 
.us{
    font-size: 18px;
}


.lds-ring {
    display: inline-block;
    position: relative;
    width: 18px;
    height: 18px;
}
.lds-ring div {
    box-sizing: border-box;
    display: block;
    position: absolute;
    width: 18px;
    height: 18px;
    border: 2.5px solid #fff;
    border-radius: 50%;
    animation: lds-ring 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;
    border-color: #fff transparent transparent transparent;
}
.lds-ring div:nth-child(1) {
  animation-delay: -0.45s;
}
.lds-ring div:nth-child(2) {
  animation-delay: -0.3s;
}
.lds-ring div:nth-child(3) {
  animation-delay: -0.15s;
}
@keyframes lds-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.id_conform{
    width: 100%;
    display: flex;
    justify-content: center;
}
.id_conform label{
    background-color: white;
    color: #000000;
    display: flex;
    width: 50%;
    justify-content: center;
    font-size: 14px;
    padding: 3px;
    border-radius: 8px;
    border: 2px solid #fff;
    cursor: pointer;
    transition: 0.4s;
}
#divid{
    padding-bottom: 20px;
}