:root {
    --gray-clr: #F7F7F7;
    --green-clr: #59AE4B;
    --simpliix-red-clr: #ED1C24;
    --white-clr: #fff;
    --black-clr: #000;
    --primary-clr: #59AE4B;
    --dark-clr: #48514B;
}

body, html {
  height: 100%;
  font-family: Arial, Helvetica, sans-serif;
  background:var(--gray-clr);
}

* {
  box-sizing: border-box;
}

.labels {
    font-weight:normal;
    color:var(--black-clr)!important;
}
.bg-img {
    height: 100%;
    width: 100%;
    position: relative;
    /*background-color:#f3f3f3 !important;*/
}

/* Add styles to the form container */
.container {
      margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 30%;
}

/* Full-width input fields */
input[type=text], input[type=password] {
  width: 100%;
  padding: 15px;
  margin: 5px 0 15px 0;
  border: none;
  background: var(--white-clr);
  border: 1px solid var(--black-clr);
}

input[type=text]:focus, input[type=password]:focus {
  background-color: #ddd;
  outline: none;
}

/* Set a style for the submit button */
.btn {
    color: white;
    padding: 2px;
    border: none;
    cursor: pointer;
    width: 200px;
    opacity: 1;
    font-size: 32px;
    border-radius: 12px;
    background-color: var(--primary-clr);
    transition: 0.3s;
    margin-bottom: 5px;
}

.btn2 {
    background-color: transparent;
    color: var(--black-clr)!important;
    text-decoration: underline;
    border: none;
    cursor: pointer;
    font-size: 16px;
}

.btn:hover {
  background-color:var(--dark-clr);
}

body
{
 overflow-x:hidden;
  overflow-y:hidden;
  margin: 0px;
}

.bg-img span {color: #ed1c24}
.container h1 {color: black !important;text-align:center;font-size:5vw;margin-bottom:15px;}

.actions{text-align:left;}
.actions label{color:black; padding: 0 4px;}
/*.container .labels{color:white;}*/
 .container a{color:white;text-align:center;}

 .contactmain
{
position: fixed;
z-index: 10002;
top: 0px;
left: 0px;
vertical-align: middle;
text-align: center;
width: 100%;
height: 100%;
opacity: 0.7;
filter: alpha(opacity=70);
/*background-color: Gray;*/
background-image: none;
background-repeat: no-repeat;
display: block;
/*border: solid 1px black;*/
padding: 250px 0 0 0;
}

/************* Responsive *******************/
@media(max-width:768px) {
    .container {
        width:90%;
    }
        .container h1 {
            font-size:4em;
        }
}


/************* NOTIFICATION *******************/
#NotificationDiv  
{
/*min-width: 240px;
max-width:600px;*/
width:90%;
height: auto;
padding: 0.5em;            
position:absolute;
top:3px;
z-index:10000;
text-align:center;
}  

.success 
{
background-color:rgb(188, 245, 188);
color:darkgreen;
border:1px solid rgb(124, 221, 119);
}

.error
{
background-color:rgb(255, 129, 129);
color:#ffffff;
border:rgb(226, 83, 83);
}

.warning
{
background-color:rgb(255, 234, 168);
color:rgb(130, 98, 0);
border:rgb(255, 194, 55);   
}

.info
{
background-color:rgb(120, 197, 231);
color:rgb(255, 255, 255);
border:rgb(59, 173, 214); 
}      
   
/************* END NOTIFICATION ************/