/**********************************************************
				Authentication Styles
**********************************************************/
#account-creation_form .id_state,
#account-creation_form .dni,
#account-creation_form .postcode {
  display: block; }

#create-account_form {
  min-height: 297px; }
  #create-account_form p {
    margin-bottom: 8px; }
  #create-account_form .form-group {
    margin: 0 0 20px 0; }

#login_form {
  min-height: 297px; }
  #login_form .form-group {
    margin: 0 0 3px 0; }
    #login_form .form-group.lost_password {
      margin: 14px 0 15px 0; }
      #login_form .form-group.lost_password a {
        text-decoration: underline; }
        #login_form .form-group.lost_password a:hover {
          text-decoration: none; }

#login_form .form-control, #create-account_form .form-control {
  max-width: 271px; }

/** User registration disclaimer **/
.popover-container { background-color: #2980b9; border-radius: 16px; color: #e3fbff; cursor: default; display: inline-block; font-family: 'Helvetica',sans-serif; font-size: 18px; font-weight: bold; height: 30px; line-height: 30px; position: relative; text-align: center; width: 30px; }
.popover-container .popover { background-color: rgba(0, 0, 0, 0.85); border-radius: 5px; bottom: 42px; box-shadow: 0 0 5px rgba(0, 0, 0, 0.4); color: #fff; display: none; font-size: 10px; font-family: 'Helvetica',sans-serif; line-height: 20px; padding: 7px 10px; position: absolute; width: 800px; left: calc(100% - 255px); z-index: 4; }
.popover-container .popover:before { border-top: 7px solid rgba(0, 0, 0, 0.85); border-right: 7px solid transparent; border-left: 7px solid transparent; bottom: -7px; content: ''; display: block; left: 240px; margin-left: -7px; position: absolute; }
.popover-container:hover .popover { display: block; animation: fade-in .3s linear 1, move-up .3s linear 1; display: block; -webkit-animation: fade-in .3s linear 1, move-up .3s linear 1; -moz-animation: fade-in .3s linear 1, move-up .3s linear 1; -ms-animation: fade-in .3s linear 1, move-up .3s linear 1; }

@media only screen and (max-width: 800px) {
	.popover-container .popover { width: 320px; left: calc(100% - 95px); line-height: 15px;} 
  
  .popover-container .popover:before { border-top: 7px solid rgba(0, 0, 0, 0.85); border-right: 7px solid transparent; border-left: 7px solid transparent; bottom: -7px; content: ''; display: block; left: 80px; margin-left: -7px; position: absolute; }
}

@media only screen and (max-width: 480px) {
  .popover-container .popover { width: 320px; left: calc(100% - 95px); line-height: 15px;} 
  
  .popover-container .popover:before { border-top: 7px solid rgba(0, 0, 0, 0.85); border-right: 7px solid transparent; border-left: 7px solid transparent; bottom: -7px; content: ''; display: block; left: 80px; margin-left: -7px; position: absolute; }
}

@keyframes fade-in { from { opacity: 0; }
  to { opacity: 1; } }
@-webkit-keyframes fade-in { from { opacity: 0; }
  to { opacity: 1; } }
@-moz-keyframes fade-in { from { opacity: 0; }
  to { opacity: 1; } }
@-ms-keyframes fade-in { from { opacity: 0; }
  to { opacity: 1; } }
@keyframes move-up { from { bottom: 30px; }
  to { bottom: 42px; } }
@-webkit-keyframes move-up { from { bottom: 30px; }
  to { bottom: 42px; } }
@-moz-keyframes move-up { from { bottom: 30px; }
  to { bottom: 42px; } }
@-ms-keyframes move-up { from { bottom: 30px; }
  to { bottom: 42px; } }