:root {
  --themeWhite: #ffffff;
  /*--themeBackground: #e7f9ff;*/
  --themeBackground:#f5fdff;
  --themeGray: #F7F7F7;
  --themeGrayDark: #e1dfdf;
  --themeBlueHover: #0E86D4;
  /*--themeBlue: #055C9D;*/
  --themeBlue: #293a4a;
}

html {
  scroll-behavior: smooth;
}

body{

}


.si{
	font-family: "Noto Serif Sinhala", Arial, Verdana, Geneva, Helvetica, sans-serif;
}


.main{
	margin-bottom: 20px;
}

.main .card-header{
  background: var(--themeBlue);
  color: var(--themeWhite);
}

.main .card-header .card-title{
  letter-spacing: 0.7px;
}


/*  ############################# */
/*  Bootstrap Form                */
/*  ############################# */

.form-group label{
  font-size: 14px;
  font-weight:500;
  margin-bottom: 2px;
  margin-top: 10px;
}



.sub_hr_tag{
      border-top: 1px solid var(--themeGrayDark);
}

.form-buttons button{
	  background: var(--themeBlue);
    color: var(--themeWhite);
    border-color: var(--themeBlue);
    text-transform: uppercase;
    border-radius: 3px;
    letter-spacing: 1px;
    padding-top: 7px;
    padding-bottom: 7px;
    font-weight: 500;
    font-size: 14px;
}

.form-buttons button:hover{
    opacity: 90%;
}

.form-buttons button:focus{
    box-shadow: none !important;
    outline: 0;
}



/* Input styles */

.form-control{
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.5px;
    height: unset;
}

.form-control:focus{
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
}



small{
	font-size: 68%;
}

.card .card-title{
  font-size: 16px;
  font-weight: bold;
}

.alert{
  font-size: 14px;
}

.alert button:focus{
  outline: none;
}