/*-------------------------Buttons-----------------------*/
.btns{
    padding: .5rem;
    border: 0px;

}



/*-------------------------Buttons Color-----------------------*/
.btns-primary{
    background-color: rgba(0, 110, 255, 0.893);
    color:white;
    padding: .5rem;
    border: 0px;
}
.btns-danger{
    background-color: rgba(255, 0, 0, 0.847);
    color:white;
    padding: .5rem;
    border: 0px;
}
.btns-success{
    background-color: rgba(0, 255, 179, 0.893);
    color:white;
    padding: .5rem;
    border: 0px;
}
.btns-dark{
    background-color: rgba(3, 8, 16, 0.893);
    color:white;
    padding: .5rem;
    border: 0px;
}
.btns-warning{
    background-color: rgba(255, 208, 0, 0.893);
    color:rgb(0, 0, 0);
    padding: .5rem;
    border: 0px;
}
.btns-info{
    background-color: rgba(68, 214, 255, 0.895);
    color:rgb(255, 255, 255);
    padding: .5rem;
    border: 0px;
}
.btns-light{
    background-color: rgb(255, 255, 255);  
    color:rgb(12, 12, 12);
    padding: .5rem;
    border: 0px;
}




/*-------------------------Shadow-----------------------*/
.shadow-1{
    filter: drop-shadow(1px 1px 1px black);
}

.shadow-2{
    filter: drop-shadow(2px 2px 1px black);
}

.shadow-3{
    filter: drop-shadow(3px 3px 1px black);
}

.shadow-4{
    filter: drop-shadow(4px 4px 1px black);
}

.shadow-5{
    filter: drop-shadow(5px 5px 1px black);
}

.shadow-6{
    filter: drop-shadow(6px 6px 1px black);
}

.shadow-7{
    filter: drop-shadow(7px 7px 1px black);
}



/*-------------------------Border-----------------------*/

.border-1{
    border: 1px solid;
}
.border-2{
    border: 1.5px solid;
}
.border-3{
    border: 2px solid;
}
.border-4{
    border: 2.5px solid;
}
.border-5{
    border: 3px solid;
}
.border-6{
    border: 3.5px solid;
}
.border-7{
    border: 4px solid;
}


/*-------------------------Border-----------------------*/


.border-primary{
    border-color: rgba(0, 110, 255, 0.893);
   
 }
 .border-danger{
     border-color: rgba(255, 0, 0, 0.847);
   
 }
 .border-success{
     border-color: rgba(0, 255, 179, 0.893);
 
 }
 .border-dark{
     border-color: rgba(3, 8, 16, 0.893);
  
 }
 .border-warning{
     border-color: rgba(255, 208, 0, 0.893);
    
 }
 .border-info{
     border-color: rgba(68, 214, 255, 0.895);
     
 }
 .border-light{
     border-color: rgb(255, 255, 255);  
   
 }



 /*-------------------------Background Color-----------------------*/

 .background-primary{
    background-color: rgba(0, 110, 255, 0.893);
   
}
.background-danger{
    background-color: rgba(255, 0, 0, 0.847);
   
}
.background-success{
    background-color: rgba(0, 255, 179, 0.893);
   
}
.background-dark{
    background-color: rgba(3, 8, 16, 0.893);
   
}
.background-warning{
    background-color: rgba(255, 208, 0, 0.893);
   
}
.background-info{
    background-color: rgba(68, 214, 255, 0.895);
   
}
.background-light{
    background-color: rgb(255, 255, 255);  
}



/*-------------------------Text Color-----------------------*/

   
.color-primary{
    color: rgba(0, 110, 255, 0.893);
   
  }
  .color-danger{
    color: rgba(255, 0, 0, 0.847);
   
  }
  .color-success{
    color: rgba(0, 255, 179, 0.893);
   
  }
  .color-dark{
    color: rgba(3, 8, 16, 0.893);
   
  }
  .color-warning{
    color: rgba(255, 208, 0, 0.893);
   
  }
  .color-info{
    color: rgba(68, 214, 255, 0.895);
   
  }
  .color-light{
    color: rgb(255, 255, 255);  
  }
  

  /*-------------------------Margin-----------------------*/

  .margin-1{
    margin:1rem;
  }
  .margin-2{
    margin:2rem;
  }
  .margin-3{
    margin:3rem;
  }
  .margin-4{
    margin:4rem;
  }
  .margin-5{
    margin:5rem;
  }
  .margin-6{
    margin:6rem;
  }
  .margin-7{
    margin:7rem;
  }


    /*-------------------------margin-top----------------------*/

    .margin-t1{
        margin-top:1rem;
      }
      .margin-t2{
        margin-top:2rem;
      }
      .margin-t3{
        margin-top:3rem;
      }
      .margin-t4{
        margin-top:4rem;
      }
      .margin-t5{
        margin-top:5rem;
      }
      .margin-t6{
        margin-top:6rem;
      }
      .margin-t7{
        margin-top:7rem;
      }
    
  /*-------------------------margin-bottom----------------------*/

  .margin-b1{
    margin-bottom:1rem;
  }
  .margin-b2{
    margin-bottom:2rem;
  }
  .margin-b3{
    margin-bottom:3rem;
  }
  .margin-b4{
    margin-bottom:4rem;
  }
  .margin-b5{
    margin-bottom:5rem;
  }
  .margin-b6{
    margin-bottom:6rem;
  }
  .margin-b7{
    margin-bottom:7rem;
  }


  
    /*-------------------------margin-left----------------------*/

    .margin-l1{
        margin-left:1rem;
      }
      .margin-l2{
        margin-left:2rem;
      }
      .margin-l3{
        margin-left:3rem;
      }
      .margin-l4{
        margin-left:4rem;
      }
      .margin-l5{
        margin-left:5rem;
      }
      .margin-l6{
        margin-left:6rem;
      }
      .margin-l7{
        margin-left:7rem;
      }

      
    /*-------------------------margin-right----------------------*/

    .margin-r1{
        margin-right:1rem;
      }
      .margin-r2{
        margin-right:2rem;
      }
      .margin-r3{
        margin-right:3rem;
      }
      .margin-r4{
        margin-right:4rem;
      }
      .margin-r5{
        margin-right:5rem;
      }
      .margin-r6{
        margin-right:6rem;
      }
      .margin-r7{
        margin-right:7rem;
      }

  /*-------------------------Padding-----------------------*/

  .padding-1{
    padding:1rem;
  }
  .padding-2{
    padding:2rem;
  }
  .padding-3{
    padding:3rem;
  }
  .padding-4{
    padding:4rem;
  }
  .padding-5{
    padding:5rem;
  }
  .padding-6{
    padding:6rem;
  }
  .padding-7{
    padding:7rem;
  }


     /*-------------------------Padding-top----------------------*/

     .padding-t1{
        padding-top:1rem;
      }
      .padding-t2{
        padding-top:2rem;
      }
      .padding-t3{
        padding-top:3rem;
      }
      .padding-t4{
        padding-top:4rem;
      }
      .padding-t5{
        padding-top:5rem;
      }
      .padding-t6{
        padding-top:6rem;
      }
      .padding-t7{
        padding-top:7rem;
      }


         /*-------------------------padding-bottom----------------------*/

   .padding-b1{
    padding-bottom:1rem;
  }
  .padding-b2{
    padding-bottom:2rem;
  }
  .padding-b3{
    padding-bottom:3rem;
  }
  .padding-b4{
    padding-bottom:4rem;
  }
  .padding-b5{
    padding-bottom:5rem;
  }
  .padding-b6{
    padding-bottom:6rem;
  }
  .padding-b7{
    padding-bottom:7rem;
  }


        /*-------------------------Padding-left----------------------*/

        .padding-l1{
            padding-left:1rem;
          }
          .padding-l2{
            padding-left:2rem;
          }
          .padding-l3{
            padding-left:3rem;
          }
          .padding-l4{
            padding-left:4rem;
          }
          .padding-l5{
            padding-left:5rem;
          }
          .padding-l6{
            padding-left:6rem;
          }
          .padding-l7{
            padding-left:7rem;
          }
          
          
          /*-------------------------Padding-right----------------------*/
    
       .padding-r1{
        padding-right:1rem;
      }
      .padding-r2{
        padding-right:2rem;
      }
      .padding-r3{
        padding-right:3rem;
      }
      .padding-r4{
        padding-right:4rem;
      }
      .padding-r5{
        padding-right:5rem;
      }
      .padding-r6{
        padding-right:6rem;
      }
      .padding-r7{
        padding-right:7rem;
      }
    

    /*-------------------------Sizing-----------------------*/



    .size-1{
        font-size: small;
    }
    .size-2{
        font-size:medium;
    }
    .size-3{
        font-size:large;
    }
    .size-4{
        font-size:x-large;
    }
    .size-5{
        font-size:xx-large;
    }
  

      /*-------------------------Width-----------------------*/

      .width-10{
        width:10%;
      }
      .width-20{
        width:20%;
      }
      .width-30{
        width:30%;
      }
      .width-40{
        width:40%;
      }
      .width-50{
        width:50%;
      }
      .width-60{
        width:60%;
      }
      .width-70{
        width:70%;
      }
      .width-80{
        width:80%;
      }
      .width-90{
        width:90%;
      }
      .width-100{
        width:100%;
      }


       /*-------------------------height-----------------------*/

       .height-10{
        height:100px;
      }
      .height-15{
        height:150px;
      }
      .height-20{
        height:200px;
      }
      .height-25{
        height:250px;
      }
      .height-30{
        height:300px;
      }
      .height-35{
        height:350px;
      }
      .height-40{
        height:400px;
      }
      .height-45{
        height:450px;
      }
      .height-50{
        height:500px;
      }
      .height-55{
        height:550px;
      }
      .height-60{
        height:600px;
      }

      
      /*-------------------------Alignment-----------------------*/

      .align-left{
        text-align: left;
        align-items: left;
      }
      .align-center{
        text-align: center;
        align-items: center;
      }
      .align-right{
        text-align: right;
        align-items: right;
      }


       
      /*-------------------------Card-----------------------*/
    .card-1{
        box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
     }

     .card-2{
        box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
     }

     .card-3{
        box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
     }

     .card-4{
        box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
     }

     .card-5{
        box-shadow: rgba(50, 50, 93, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
     }

     .card-6{
        box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
     }
     
     .card-7{
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;
     }

     .card-8{
        box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;
     }

     .card-9{
        box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
     }

     .card-10{
        box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
     }


     


 /*-------------------------Input-----------------------*/

 .input{
padding-left:1rem;
width: 100%;
height: 35px;
border-radius: 2px;

 }

 input:focus{
    border-color: rgb(165, 234, 255);
    outline: 2px;
   
 }

 /*-------------------------bold-----------------------*/
.bold {
    font-weight: bold;
}

/*-------------------------container-----------------------*/
.container{
    width: 80%;
    align-items: center;
margin-left:7rem;
}

@media only screen and (max-width: 1100px) {
    .container{
    margin-left:6rem;
    }
  }
  
  @media only screen and (max-width: 900px) {
    .container{
    margin-left:5rem;
    }
  }

  @media only screen and (max-width: 750px) {
    .container{
    margin-left:3.7rem;
    }
  }



@media only screen and (max-width: 700px) {
  .container{
    margin-left:0rem;
    width: 100%;
  }
}


.container-fluid{
    left: 0;
    right: 0;
}