@font-face {
    font-family: opensans-light;
    src: url(../fonts/OpenSans-Light.ttf);
}@font-face {
    font-family: opensans-bold;
    src: url(../fonts/OpenSans-Bold.ttf);
}
*, *:before, *:after {
  box-sizing: border-box;
}

html, body {
  height: 100%;
  width: 100%;
background-color:#207bd8;
  font-family: opensans-light !important;
      overflow-y: auto;
    overflow-x: hidden;
     background: url('../images/Background.png') no-repeat;
    background-size: cover;
    
}
.help-block{
	font-size: 10px;
    color: red;
}
.dashboard{
	background: #4e54c8;  /* fallback for old browsers */
background: -webkit-linear-gradient(to right, #8f94fb, #4e54c8);  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to right, #8f94fb, #4e54c8); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
#login-button{
	    cursor: pointer;
    /* margin: 0px 57px; */
    width: 100%;
    background: url(../images/login_btn_bg.png) no-repeat;
    box-shadow: none;
    border: 0px;
    height: 41px;
    background-size: cover;
    color: white;
    font-weight: bold;
}
.top-container{
background:url('../images/Background.png') no-repeat;
  background-size: cover;	
}
.second-container .panel-body p{
	       margin: 0 7px;
    font-size: 15px;
    width:89%;
   /* width: width: 75%;;*/
    color: black;
	
}
.second-container .panel-body p.payments{	     
    width: 50%;
}
.price-right{
	float: right;
	text-align: right;
}  
.panel-title-total-top{
	font-size: 11px;
    background: #e6a201;
}
.panel-top-titles h4{
	font-family: opensans-bold;
}
.price-right-amount{ 
	padding: 0 17px 0px;
	text-align: right;
}
.second-container .panel-body{
	    background: #edba3b;
       margin: 20px 12px;
}
.panel-top-titles{
	width: 50%;
    float: left;
    background: #e6a201; 
   /* height: 70px;*/
    padding: 6px 12px;
}
.panel-middle-titles{
	width: 100%;
    float: left;
    background: #e6a201; 
 
    padding: 6px 12px;
}
.panel-middle-titles h5{
	    padding: 0px 0px 0px;
    font-size: 14px;
    margin: 1px 6px;
    font-weight: bolder;
    width: 52%;
    color: black;
    border-bottom: 1px solid black;
    font-family: opensans-light;
}
.top-buffer { margin-top:15px;   }
.top-buffer h4{   
 font-family: 'opensans-light';
    font-size: 43px;
    margin-bottom: 0px;
    line-height:1  }
.top-buffer-normal { margin-top:20px; }
.second-container{
	
}
.container {
  padding: 0px 0;
  height: 100%;
      position: relative;
  width: 100%;
  
  color: #fff;
  font-family: "Comfortaa", "Helvetica", sans-serif;
}

.mobile_wraper {
  
  /* background: #124db1;*/
 
}
.login {   
  max-width: 100%;
  min-height: 800px;
 position: relative;
  /*overflow-y: scroll;*/
/*  margin: 30px auto;
padding: 0px 50px;   */
  
 
}
.login input{
	    height: 37px;
    font-size: 20px;
    border-radius: 0px;
        font-family: 'opensans-light';

}

.login-icon-field {
      height: 250px;
    width: 100%;
    padding-top: 82px;
        margin-bottom: 130px;
    /*margin-top: 71px;*/
  /*background-color: red;*/
}
.login-icon-field img{
	width: 127px;  
}
.login-icon-field h6{
	padding: 14px 45px;
	color: white;	
}

.login-icon {
  margin: 50px 65px;
}

.login-form {
 padding: 0px 59px 0px;
    height: 67px;
    width: 100%;
}

.row {
  /*display: none;*/
}

.username-row {
 position: relative;
    height: 38px;
}

.password-row {
  position: relative;
  height: 40px;
 /* background-color: grey;
  border-bottom: 1px solid;*/
}

.password-icon,
.user-icon {
  margin: 5px;
}
.user-details p{ 
	width: 100% !important;
	padding: 0px 15px 0;
	    margin: 1px;
}
.user-details p .mesage_c a{ 
	color: #edba3b;margin-left: 7px;
}
.user-details p .mesage_c{ 
	float: right;
}
.panel-notification .panel-title{
	padding: 0px 0px 5px;
    font-size: 16px;
    margin: 8px 9px 0px 8px;   
    border-bottom: 1px solid white;
       font-family: opensans-bold; 
}
.panel-notification .notificatio-subject{
	padding: 0px 0px 5px;
    font-size: 14px;
    margin: 8px 9px 0px 8px;   
    font-family: opensans-light;
    color: black;
}
.panel-notification{
	max-height: 400px;
	overflow-y: scroll;
}
.panel-notification .notificatio-body{	
    
    margin: 8px 9px 0px 8px !important;
    font-size: 14px !important;
    width: 94% !important;
    font-family: opensans-light;
    color: black !important;
    border-bottom: 1px solid white;
}
.password-icon .key-path,
.user-icon .user-path{
  fill: rgba(10,10,10,0);
  stroke: #fff;
  stroke-width: 3.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
  stroke-dasharray: 300;
  stroke-dashoffset: 300;
  -webkit-animation: dash 3s .3s linear forwards;
  animation: dash 3s .3s linear forwards;
}

.user-icon .user-path {
  -webkit-animation: dash 3s .8s linear forwards;
  animation: dash 3s .8s linear forwards;
}
.panel-heading p{
	font-size: 18px;
	font-weight: bold;
}
.panel-title{
	padding: 0px 0px 5px;
	     font-size: 19px;
    margin: 8px 9px 0px 8px;
    font-weight: bolder;
    border-bottom: 1px solid white;
     font-family: opensans-bold;
}
.panel-title-second{
	    padding: 0px 0px 0px;
    font-size: 16px;
    margin: 2px 10px;
    font-weight: bolder;
    width: 105px;
    color: black;
    border-bottom: 1px solid black;
    font-family: opensans-light;
}
.panel-box-right{
	width: 43%;
}
.panel-inner-title{
	    width: 130px;
    text-align: left;
    font-size: 12px;
    color: black;
    font-weight: bolder;
    font-family: opensans-bold;
    border-bottom: 1px solid #232323;
        margin-bottom: 0px;
}
.footer-container a{
	    width: 277px;
    border: 1px solid #4f8fd8;
    background: #03368c;
}
.footer-container p{
	font-size: 13px;
    margin: 0px;
    color: #83addc;
}

input:focus,
button:focus {
  outline: none;
}

input::-webkit-input-placeholder {
  color: rgba(255,255,255,.4);
}

input::-moz-placeholder {
  color: rgba(255,255,255,.4);
}

.call-to-action {
  margin: 22px 0;
  height: 130px;
  width: 100%;
  /*background-color: blue;*/
}


button:hover {
  background-color: #26d69a;
}

button:active {
  background-color: #1eaa7a;
}

p { 
	  font-family: 'opensans-light';
  display: inline-block;
  width: 200px;
 /* margin: 0 20px;*/
  font-size: 1rem;
  /*color: rgba(255,255,255,.4);
  background-color: yellow;*/
}

p a {
  color: #fff;
}

label,
p a:hover {
  -webkit-cursor: pointer;
  cursor: pointer;
}

@-webkit-keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}

@keyframes dash {
  to {
    stroke-dashoffset: 0;
  }
}
@media screen and (min-width: 320px) and (max-width: 767px) and (orientation: landscape) {
  /*html {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
  }*/
}