/*--------------------------------------------------
    [TRANSITION]
----------------------------------------------------*/
/* Cubic Bezier Transition */
/***
***/
/* logo page */
.og-logo {
  /* background-color: #666 !important; */
  background-image: url('../images/bg.jpg');
background-repeat: no-repeat;
background-size: cover;
  min-height: 100vh;
}

.og-logo .logo {
  margin: 5px auto 2px auto;
  padding: 8px;
  text-align: center;
}


.og-box  { 
  margin: 0 auto;
  margin-bottom: 0px;
  padding: 30px;
  padding-top: 20px;
  padding-bottom: 15px;
  -webkit-box-shadow:0 0 4px #999;
  -moz-border-box-shadow:0 0 6px #999;
  -ms-border-box-shadow:0 0 6px #999;
  -o-border-box-shadow:0 0 6px #999;
  box-shadow:0 0 6px #999;
  -webkit-border-radius: 7px;
  -moz-border-radius: 7px;
  -ms-border-radius: 7px;
  -o-border-radius: 7px;
  border-radius: 7px;
}



/* footer copyright */
.og-logo .copyright {
  text-align: center;
  margin: 0 auto;
  padding: 10px;
  color: #eee;
  font-size: 13px;
}
.output{
  background-color: #fff;
  color: red;
  padding: 10px;
}

@media (max-width: 480px) {
  /***
  Login page
  ***/
  .og-logo .logo {
    margin-top: 10px;
  }

  .og-logo .content {
    padding: 30px;
    width: 222px;
  }

  .og-logo .content h3 {
    font-size: 22px;
  }

  .og-logo .checkbox {
    font-size: 13px;
  }
}