@import url(https://fonts.googleapis.com/css?family=Poppins:300,400);

body, html {
	height:100%;
  background:#ece3db;
  font-family: 'Poppins', sans-serif !important;
  font-size:1em;
  text-shadow: rgba(0,0,0,.01) 0 0 1px;
  -webkit-font-smoothing: antialiased;
}

fieldset {
  margin:0;
  padding:0;
  border:none;
}

a {
  color:#42276d;
}

h1 {
  font-size:1.8em;
  font-weight:400;
  font-family: 'Poppins', sans-serif !important;
}

h2 {
  font-size:1.4em;
  font-weight:400;
  font-family: 'Poppins', sans-serif !important;
}

h3 {
	font-size:1.3em;
  font-weight:400;
  font-family: 'Poppins', sans-serif !important;
}

.invalid {
  margin-top:15px;
  border:1px solid #eca9b8;
  padding:10px;
  border-radius:3px;
  background:#eca9b8;
  color:#444 !important;
  font-size:1em !important;
}

.valid {
  margin-top:15px;
  border:1px solid #00FF00;
  padding:10px;
  border-radius:3px;
  background:#BCF5A9;
  color:#444 !important;
  font-size:1em !important;
}

div.api-code {
  background:#444;
  border-radius:5px;
  color:#fff;
  min-height:20px;
  padding:25px;
  font-family:verdana;
 word-wrap:break-word;
}

div.api-code p {
  font-size:0.9em !important;
}

div.api-code .api-green {
  color:#01DF01;
}

div.api-code .api-value {
  color:orange;
}

div.top-menu {
  background:#42276d;
  min-height:35px;
}

div.top-menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

div.top-menu ul li {
  display: block;
  min-width: 80px;
	padding-left:10px;
	padding-right:10px;
  float:left;
  text-align:center;
  padding-top:5px;
  height:35px;
  border-bottom:5px solid #FFDC68;
}

div.top-menu .li-first {
  border-bottom:5px solid #ECA9B8;
}

div.top-menu .li-second {
	border-bottom:5px solid #9ec9c4;
}

div.top-menu .li-third {
  border-bottom:5px solid #9099B2;
}

div.top-menu ul li a {
  color:#fff;
  font-weight:400;
}

div.front {

  min-height:100px;
  padding-bottom:50px;
  border-bottom:1px solid #ccc;
}

div.container {
  min-height:250px;
	overflow:auto;
}

div.container .row .four {
  min-height:250px;
  margin-top:90px;
  max-width:350px !important;
  min-width:350px !important;
}

div.container .row .four p {
  color:#444;
  font-size:1.2em;
  text-align:center
}

div.header-logo {
  text-align:center;
  margin-bottom:40px;
}

div.header-logo img {
  width:40px;
  vertical-align: middle;
}

.input-label {
    position: absolute;
    left: 15px;
    top: 14px;
    color: #444;
    cursor: default;
}

.fieldset-login {
  position: relative;
  margin-top: 0px;
}

.input {
  height:40px !important;
  padding:8px !important;
  padding-left:90px !important;
  border:1px solid #ccc;
  -webkit-appearance: none;
  border-radius:3px !important;
}

select {
	background-color: #fff;
	    font-family: inherit;
	    border: 1px solid #ccc;
	    -webkit-border-radius: 2px;
	    -moz-border-radius: 2px;
	    -ms-border-radius: 2px;
	    -o-border-radius: 2px;
	    border-radius: 2px;
	    -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
	    -moz-box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
	    box-shadow: inset 0 1px 2px rgba(0,0,0,0.1);
	    color: rgba(0,0,0,0.75);
	    margin-top: 1px;
	    font-size: 14px;
	    padding-left: 4px;
	    height: 32px;
	    width: 320px;
	    -webkit-transition: all 0.15s linear;
	    -moz-transition: all 0.15s linear;
	    -o-transition: all 0.15s linear;
	    transition: all 0.15s linear;
}


.submit {
  height:40px;
  padding:8px;
  margin-top:15px;
  color:#fff;
  background:#42276d;
  font-size:1.2em;
  width:100%;
  border-radius:3px;
  border:none;
  cursor:pointer;
  font-weight:600;
  -webkit-transition: background .5s ease-out;
  -moz-transition: background .5s ease-out;
  -o-transition: background .5s ease-out;
  transition: background .5s ease-out;
  -webkit-appearance: none;
}

.submit:hover {
  background:#6C528B !important;
}

.forgot {
  text-align:left !important;
  margin-top:10px;
}

.forgot a {
  color:#444;
  font-size:0.8em !important;
}

.forgot a:hover {
  text-decoration: underline;
}

div.logo {
  margin-top:70px;
  text-align:center
}

div.logo img {
  width:90px;
}

div.logo p {
  font-size:0.8em !important;
}

@media only screen and (max-width: 48em) {

  div.container .row .four {
    margin-top:40px;
  }

  div.logo {
    margin-top:80px;
    margin-bottom:20px;
  }

}

.top-impersonate {
	padding:10px;
	min-height:30px;
	color:#fff;
	background:#FE2E2E;
}