.flashBTN{ width:200px; padding:15px;border:solid 1px gray;}


/*=============== input ===========  */
input[type=text], input[type=date],input[type=password], input[type=email], input[type=number], select, textarea {  font-size:12pt;  width: 90%; max-width:500px;   padding: 12px 20px;    margin: 8px 0;
  display: inline-block;    border: 1px solid #ccc;    border-radius: 4px;    box-sizing: border-box; font-family:"bahig"}


select:focus {  background-color: #e0e0e0;}

input:focus , select:focus, textarea:focus { border: 1px solid #777;}


input[type=submit] {  width: 90%; max-width:500px;    background-color: darkgreen;   color: white;
  padding: 14px 20px;   margin: 8px 0;   border: none;   border-radius: 4px;   cursor: pointer; }

input[type=submit]:hover {    background-color: black; color:white; transition:0.3s }

.lable {width: 90%; max-width:500px;   padding: 0 3px;    display: inline-block; box-sizing: border-box; text-align:right;}
.error{ background-color: brown;  color:white; border-width:  0 ;  padding: 0; }




/*=============== button ===========  */

.button {	border:1px solid black!Important;
	background:black!Important;
	display:inline-block!Important;
	padding:8px 20px!Important;
	margin: 0 10px!Important;
	vertical-align:middle!Important;
	overflow:hidden!Important;
	text-decoration:none!Important;
	color:white!Important; 
	text-align:center!Important;
	cursor:pointer!Important;
	white-space:nowrap!Important;
	transition:0.3s!Important; }
.button:hover { background:black; color: white!Important;  padding:8px 30px!Important; margin: 0 0px!Important;}


.emptyblackbutton { border:1px solid black!Important;
  display:block!Important;
  padding:5px 0!Important;
  vertical-align:middle!Important;
  text-decoration:none!Important;
  color:black!Important; 
  text-align:center!Important;
  cursor:pointer!Important;
  transition:0.2s!Important; }
.emptyblackbutton:hover { background:black; color: white!Important;}




.buttons {	border:1px solid black;
	background:black;
	display:inline-block;
	padding:8px 20px;
	margin: 0 10px;
	vertical-align:middle;
	overflow:hidden;
	text-decoration:none;
	color:white; 
	text-align:center;
	cursor:pointer;
	white-space:nowrap;
	transition:0.3s;}
.buttons:hover{ background:black; color: white; }


.eshahbutton {
  background-color: white; 
  color: black; 
  border: 2px solid #008CBA;
  padding: 10px;
  width:60px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 18px;
  font-weight:bold;
  margin: 4px 4px;
  -webkit-transition-duration: 0.4s; /* Safari */
  transition-duration: 0.4s;
  cursor: pointer;
}

.eshahbutton:hover {
  background-color: #008CBA;
  color: white;
}





/*=============== completed reading bible submit button ===========  */

 /*//////font awesome//////*/
.fa,.fab,.fal,.far,.fas{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:inline-block;font-style:normal;font-variant:normal;text-rendering:auto;line-height:1}

.fa-check-circle:before{content:"\f058"}

.far{font-weight:400}@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:auto;src:url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.eot");src:url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.eot?#iefix") format("embedded-opentype"),url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.woff2") format("woff2"),url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.woff") format("woff"),url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.ttf") format("truetype"),url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.8.2/css/../webfonts/fa-solid-900.svg#fontawesome") format("svg")}

.fa,.far,.fas{font-family:"Font Awesome 5 Free"}.fa,.fas{font-weight:900}



.mybtn-outline {
direction: ltr;
  font-weight: bold;
  background-color: #ffffff;
  border-style: solid;
  border-width: 3px;
  padding: 0;
  outline: 0;
  display: inline-flex!Important;
  overflow: hidden!Important;
  cursor: pointer;
  transition: all 300ms ease-in-out;
}
.mybtn-outline i, .mybtn-outline span {
  width: 100%!Important;
  display: block!Important;
  padding: 0.7rem!Important;
  margin: 0;
  box-sizing: border-box!Important;
  flex-shrink: 0!Important;
}



.mybtn-outline i {
  margin-left: -100%!Important;
  transition: margin-left 300ms ease-in-out!Important;
}
.mybtn-outline:hover {
  color: #ffffff;
  background-color: #404040;
}
.mybtn-outline:hover i {
  margin-left: 0!Important;
}


.mybtn-outline.button-success {
  color: #4A235A;
  border-color: #4A235A;
}
.mybtn-outline.button-success:hover {
  color: #ffffff;
  background-color: #4A235A;
}
.mybtn-outline.button-success:focus {
  box-shadow: 0 0 0 0.3rem #4A235A;
}

/*=============== END completed reading submit button ===========  */






/*=============== toggle switch button ===========  */
.toogle-switch {
  position: relative!Important;
  display: inline-block!Important;
  width: 40px!Important;
  height: 20px!Important;
}

.toogle-switch input { 
  opacity: 0!Important;
  width: 0!Important;
  height: 0!Important;
}

.toogle-slider {
  position: absolute!Important;
  cursor: pointer!Important;
  top: 0!Important;
  left: 0!Important;
  right: 0!Important;
  bottom: 0!Important;
  background-color: #ccc!Important;
  -webkit-transition: .4s!Important;
  transition: .4s!Important;
}

.toogle-slider:before {
  position: absolute!Important;
  content: "";
  height: 16px!Important;
  width: 16px!Important;
  left: 2px!Important;
  bottom: 2px!Important;
  background-color: white!Important;
  -webkit-transition: .4s!Important;
  transition: .4s!Important;
}

input:checked + .toogle-slider {
  background-color: #2196F3!Important;
}

input:focus + .toogle-slider {
  box-shadow: 0 0 1px #2196F3!Important;
}

input:checked + .toogle-slider:before {
  -webkit-transform: translateX(20px)!Important;
  -ms-transform: translateX(20px)!Important;
  transform: translateX(20px)!Important;
}

/* Rounded sliders */
.toogle-slider.round {
  border-radius: 10px!Important;
}

.toogle-slider.round:before {
  border-radius: 50%!Important;
}




.blackglossyCSSButtonbutton 
{
    /* General  */


    /* Size */
  height: 40px;
  min-width: 160px;
  margin: 0 10px;


    /* Fill */
  background-color: #333;
  background-origin: border-box;
  background-image:  -webkit-gradient(linear,  0% 100%,  0%   0%,  color-stop(0.000, hsla(0.0, 0.0%, 20.0%, 1.00)) , color-stop(0.505, hsla(0.0, 0.0%, 10.0%, 1.00)) , color-stop(0.507, hsla(0.0, 0.0%, 20.0%, 1.00)) , color-stop(1.000, hsla(0.0, 0.0%, 30.0%, 1.00)) ); /* Saf4+, Chrome */
  background-image:  -webkit-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Chrome 10+, Saf5.1+ */
  background-image:     -moz-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* FF3.6 */
  background-image:      -ms-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* IE10 */
  background-image:       -o-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Opera 11.10+ */
  background-image:          linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Standards Compliant */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#FF4C4C4C, EndColorStr=#FF4C4C4C); /* IE6 to IE9 */
  zoom: 1;


    /* Stroke  */
  border: 0px solid hsla(0.0, 0.0%, 0.0%, 1.00);
  -moz-border-radius: 0px; /* FF1-3.6 */
  -webkit-border-radius: 0px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
  border-radius: 0px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */


    /*  Label  */
  color: hsla(0.0, 0.0%, 100.0%, 1.00);
    font-size: 0.9rem;
  text-align: center;
  text-shadow: 0px -1px 0px hsla(0.0, 0.0%, 0.0%, 1.00);


    /*  Shadow & Inner Shadow */
  box-shadow:0px 1px 2px hsla(0.0, 0.0%, 0.0%, 0.50),inset 0px 1px 0px hsla(0.0, 0.0%, 100.0%, 0.15);


    /*  Opacity  */
  opacity: 1.000;

}







.blackglossyCSSButtonbutton:Hover, 
.blackglossyCSSButtonbutton:active, 
.blackglossyCSSButtonbutton:focus
{
    /* General  */
  cursor: pointer;

    /* Size */



    /* Fill */
  background-color: transparent;
  background-origin: border-box;
  background-image:  -webkit-gradient(linear,  0% 100%,  0%   0%,  color-stop(0.000, hsla(0.0, 0.0%, 25.0%, 1.00)) , color-stop(0.505, hsla(0.0, 0.0%, 15.0%, 1.00)) , color-stop(0.507, hsla(0.0, 0.0%, 25.0%, 1.00)) , color-stop(1.000, hsla(0.0, 0.0%, 35.0%, 1.00)) ); /* Saf4+, Chrome */
  background-image:  -webkit-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Chrome 10+, Saf5.1+ */
  background-image:     -moz-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* FF3.6 */
  background-image:      -ms-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* IE10 */
  background-image:       -o-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Opera 11.10+ */
  background-image:          linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Standards Compliant */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#FF595959, EndColorStr=#FF595959); /* IE6 to IE9 */
  zoom: 1;


    /* Stroke  */
  border: 0px solid hsla(0.0, 0.0%, 0.0%, 1.00);
  -moz-border-radius: 0px; /* FF1-3.6 */
  -webkit-border-radius: 0px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
  border-radius: 0px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */


    /*  Label  */
  color: hsla(0.0, 0.0%, 100.0%, 1.00);
    font-size: 0.9rem;
  text-align: center;
  text-shadow: 0px -1px 0px hsla(0.0, 0.0%, 0.0%, 1.00);


    /*  Shadow & Inner Shadow */
  box-shadow:0px 1px 2px hsla(0.0, 0.0%, 0.0%, 0.50),inset 0px 1px 0px hsla(0.0, 0.0%, 100.0%, 0.15);


    /*  Opacity  */
  opacity: 1.000;

}

.blackglossyCSSButtonbutton:Active , .glassActive 
{
    /* General  */


    /* Size */
 

    /* Fill */
  background-color: transparent;
  background-origin: border-box;
  background-image:  -webkit-gradient(linear,  0% 100%,  0%   0%,  color-stop(0.000, hsla(0.0, 0.0%, 25.0%, 1.00)) , color-stop(0.505, hsla(0.0, 0.0%, 15.0%, 1.00)) , color-stop(0.507, hsla(0.0, 0.0%, 25.0%, 1.00)) , color-stop(1.000, hsla(0.0, 0.0%, 35.0%, 1.00)) ); /* Saf4+, Chrome */
  background-image:  -webkit-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Chrome 10+, Saf5.1+ */
  background-image:     -moz-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* FF3.6 */
  background-image:      -ms-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* IE10 */
  background-image:       -o-linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Opera 11.10+ */
  background-image:          linear-gradient(0deg,  hsla(0.0, 0.0%, 25.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 15.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 25.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 35.0%, 1.00) 100.0% ); /* Standards Compliant */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#FF595959, EndColorStr=#FF595959); /* IE6 to IE9 */
  zoom: 1;


    /* Stroke  */
  border: 0px solid hsla(0.0, 0.0%, 15.0%, 1.00);
  -moz-border-radius: 0px; /* FF1-3.6 */
  -webkit-border-radius: 0px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
  border-radius: 0px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */


    /*  Label  */
  color: hsla(0.0, 0.0%, 100.0%, 1.00);
    font-size: 0.85rem;
  text-align: center;
  font-weight: 800;
  text-shadow: 0px -1px 0px hsla(0.0, 0.0%, 0.0%, 1.00);


    /*  Shadow & Inner Shadow */
  box-shadow:0px 1px 2px hsla(0.0, 0.0%, 0.0%, 0.25),inset 0px 0px 13px hsla(0.0, 0.0%, 0.0%, 0.75);


    /*  Opacity  */
  opacity: 1.000;

}

.blackglossyCSSButtonbutton[disabled]
{
    /* General  */


    /* Size */
  height: 40px;
  width: 160px;


    /* Fill */
  background-color: transparent;
  background-origin: border-box;
  background-image:  -webkit-gradient(linear,  0% 100%,  0%   0%,  color-stop(0.000, hsla(0.0, 0.0%, 20.0%, 1.00)) , color-stop(0.505, hsla(0.0, 0.0%, 10.0%, 1.00)) , color-stop(0.507, hsla(0.0, 0.0%, 20.0%, 1.00)) , color-stop(1.000, hsla(0.0, 0.0%, 30.0%, 1.00)) ); /* Saf4+, Chrome */
  background-image:  -webkit-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Chrome 10+, Saf5.1+ */
  background-image:     -moz-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* FF3.6 */
  background-image:      -ms-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* IE10 */
  background-image:       -o-linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Opera 11.10+ */
  background-image:          linear-gradient(0deg,  hsla(0.0, 0.0%, 20.0%, 1.00) 0.0% , hsla(0.0, 0.0%, 10.0%, 1.00) 50.5% , hsla(0.0, 0.0%, 20.0%, 1.00) 50.7% , hsla(0.0, 0.0%, 30.0%, 1.00) 100.0% ); /* Standards Compliant */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorStr=#FF4C4C4C, EndColorStr=#FF4C4C4C); /* IE6 to IE9 */
  zoom: 1;


    /* Stroke  */
  border: 1px solid hsla(0.0, 0.0%, 0.0%, 1.00);
  -moz-border-radius: 5px; /* FF1-3.6 */
  -webkit-border-radius: 5px; /* Saf3-4, iOS 1-3.2, Android <1.6 */
  border-radius: 5px 5px 5px 5px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */


    /*  Label  */
  color: hsla(0.0, 0.0%, 100.0%, 0.50);
  font-size: 16px;
  text-align: center;
  font-weight: bold;
  text-shadow: 0px -1px 0px hsla(0.0, 0.0%, 0.0%, 1.00);


    /*  Shadow & Inner Shadow */
  box-shadow:0px 1px 2px hsla(0.0, 0.0%, 0.0%, 0.50),inset 0px 1px 0px hsla(0.0, 0.0%, 100.0%, 0.15);


    /*  Opacity  */
  opacity: 1.000;

}



/* hide arrows in number inputs */
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}