html ,body
{ 
  height: 100%;
  background: url(../images/system/background.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;  
}

@font-face {
  font-family: 'Anurati-Regular';
  src: url('../fonts/anurati-regular.otf');
  font-weight: normal;
  font-style: normal;
}

/* Navigation Bar */

.navbar {border-radius: 0; box-shadow: all;}

.navbar-new {
    background-color: #FFFFFF ;
    margin-bottom: 0;
	  border-top: 3px solid #2D51A3;
}

.navbar-new .navbar-brand,
.navbar-new .navbar-brand:hover,
.navbar-new .navbar-brand:focus {
    color: #FFFFFF;
	background:rgba(255,255,255,0.5);
}

.navbar-new .navbar-nav > li > a {
    color: #2D51A3;
	font-weight: bold;
}

.navbar-new .navbar-nav > li > a:hover,
.navbar-new .navbar-nav > li > a:focus {
    background-color: #2D51A3;
    color: #FFFFFF;
    border-color: rgba(255,255,255,0.4);
}

.account-btn
{
  color: #FFFFFF !important;
  background-color: #2D51A3;
}

.navbar-new .navbar-nav > .active > a,
.navbar-new .navbar-nav > .active > a:hover,
.navbar-new .navbar-nav > .active > a:focus {
    color: #FFFFFF;
/*    background-color: #AF264F;*/
}

.navbar-new .navbar-text {color: #FFFFFF;}
.navbar-new .navbar-toggle {border-color: #FFFFFF;}

.navbar-new .navbar-toggle:hover,
.navbar-new .navbar-toggle:focus {
    background-color: rgba(255,255,255,0.4);
}

.navbar-new .navbar-toggle .icon-bar {
    background-color: #2D51A3;
}

.navbar-new .navbar-toggle .icon-bar:hover {
    background-color: rgba(45,81,163,0.4);
}

/* Navigation Bar */

.navbar-brand {font-family: Anurati-Regular;}
.green {color: #14C06E;}
.red {color: #AF264F;}
.blue {color: #2D51A3;}
.white {color: #FFFFFF;}
.orange{color: #F16D54;};

section {}

#sec-home
{
	min-height: calc(100% - 40%);
	background-color: rgba(255,255,255,0.5);
}

#sec-account
{
  min-height: calc(100% - 25px);
  background-image: url(../images/system/wifisoft_logo.png);
  background-repeat: no-repeat;
  background-size: 25% 30%;
  background-position: 25% 50%;
}

@media screen and (max-width: 767px)
{
  #sec-account
  {
    background-image: none;
  }
}

#sec-footer
{
  background: #EEEEEE; /* #34495E */
  min-height: 200px;
}

#sec-copyright
{
  background: #F16D54; /* #2C3E50 */
  min-height: 25px;
  color: #FFFFFF;
}

input
{
  border: 0;
  outline: 1px solid #DDDDDD;
  box-shadow: none !important;
  padding: 5px 5px 5px 10px !important;
  min-width: 100%;
  width: auto;
}

::-webkit-input-placeholder{padding-left: 10px;}
::-moz-placeholder{padding-left: 10px;}
:-moz-placeholder{padding-left: 10px;}
:-ms-input-placeholder{padding-left: 10px;}

textarea:focus,
textarea.form-control:focus,
input.form-control:focus,
input[type=text]:focus,
input[type=password]:focus,
input[type=email]:focus,
input[type=number]:focus,
[type=text].form-control:focus,
[type=password].form-control:focus,
[type=email].form-control:focus,
[type=tel].form-control:focus,
[contenteditable].form-control:focus {
  /*-webkit-box-shadow: inset 0 -2px 0 #14C06E !important;
  box-shadow: inset 0 -2px 0 #14C06E !important;*/
  box-shadow: none !important; 
  
}

select
{
  border: 0;
  outline: 1px solid #DDDDDD;
  box-shadow: none !important;
  padding: 5px !important;
  min-width: 100%;
  width: auto;
}

select:focus,
select.form-control:focus {
  -webkit-box-shadow: inset 0 -2px 0 #2D51A3;
  box-shadow: inset 0 -2px 0 #2D51A3;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAMAAACelLz8AAAAJ1BMVEUhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISEhISF8S9ewAAAADHRSTlMAAgMJC0uWpKa6wMxMdjkoAAAANUlEQVR4AeXJyQEAERAAsNl7Hf3X6xt0QL6JpZWq30pdvdadme+0PMdzvHm8YThHcT1H7K0BtOMDniZhWOgAAAAASUVORK5CYII=);
}
select[multiple],
select.form-control[multiple] {
  background: none;
}

select * 
{
  background-color:#FFFFFF;
  color:#444444;
  border: none;
}

select *:hover
{
  background-color:transparent;
  color:#444444;
}

.panel {border-radius: 0px;}

.flexible {
  position:absolute;
  object-fit: cover;
  width: 100%;
  height: 100%;
  min-height: 100%;
}

.modal {text-align: center; padding: 0!important; border-radius: 0;}

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.modal-close
{
  font-size: 35px;
  float: right;
  margin-right: -32px;
  margin-top: -57px;
  color: #FFFFFF;
}

.col-nm-np{margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;}
.col-bordered{border: 1px; border-style: solid; border-color: #DDDDDD;}


.btn{border-radius: 0px ;}

.btn-green{color: #FFFFFF; background-color: #14C06E;}
.btn-green:hover{color: #FFFFFF; background-color: #18E07F;}

.btn-red{color: #FFFFFF; background-color: #AF264F;}
.btn-red:hover{color: #FFFFFF; background-color: #DD3061;}

.btn-black{color: #FFFFFF; background-color: #5D5651;}
.btn-black:hover{color: #FFFFFF; background-color: #666666;}

.btn-blue{color: #FFFFFF; background-color: #2D51A3;}
.btn-blue:hover{color: #FFFFFF; background-color: #3860BA;}

.btn-orange{color: #FFFFFF; background-color: #F16D54;}
.btn-orange:hover{color: #FFFFFF; background-color: #F97C66;}

.btn-account
{
  color: #F16D54;
  background-color: #FFFFFF;
  box-shadow: none; 
  border-top: 2px solid #F16D54;
  border-right: 2px solid #F16D54;
  border-bottom: 2px solid #F16D54;
  border-left: 2px solid #F16D54;
  min-width: 30%;
  font-weight: bold;
  letter-spacing: 5px;
}

.btn-account:hover{color: #FFFFFF; background-color: #F97C66;}

@media screen and (max-width: 767px)
{
  .btn-account
  {
    min-width: 100%;
    margin-bottom: 10px;
  }
}

.modal {
  text-align: center;
  padding: 0!important;
  border-radius: 0; 
}

.modal:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -4px;
}

.modal-dialog {
  display: inline-block;
  text-align: left;
  vertical-align: middle;
}

.modal-close::before
{
  content: url(../images/system/close.png);
  font-size: 35px;
  float: right;
  margin-right: -35px;
  margin-top: -50px;
  color: #FFFFFF;
}

.service-cols {padding: 5px 5px 5px 5px; background-color: #FFFFFF;	border: 2px solid #CCC;}
.service-cols:hover {border: 1px solid rgba(0,0,0,0.3);}
.pattern {background: url(../images/system/pattern.jpg); padding: 5px 5px 5px 5px;}
.distext{border: 2px dashed #444444;}
a
{
	letter-spacing: 1px;
}



.hr-blue {border-color:#2D51A3;}
.hr-orange {border-color:#F16D54;}

.green-tick::before
{
  content: url(../images/system/green-tick.png);
  align-content: center;
}

.red-cross::before
{
  content: url(../images/system/red-cross.png);
  align-content: center;
}

/*////////////////////////////////// Account Page CSS Starts Here /////////////////////////////////*/

#account-form
{
    min-height: calc(100% - 25px);
}

#account-form-container {
    height: auto;
    position: relative;
    bottom: 10px;
}

/*////////////////////////////////// Account Page CSS Starts Here /////////////////////////////////*/
