﻿@font-face {
   font-family: 'GT America';
   src: url("https://cdn.catglobe.com/fonts/GTAmerica/1.0/GT-America-Standard-Regular.ttf") format("truetype");
}

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
   transition: background-color 5000s ease-in-out 0s;
}

body {
   font-family: 'GT America', Arial, sans-serif;
   font-weight: 400;
   font-size: 15px;
   line-height: 24px;
   color: #373739;
}

#loginbody {
   margin: 0 auto;
   padding: 20px;
   border: 1px solid #ccc;
   border-radius: 25px;
   background: #fff;
   padding: 20px 40px;
   color: #505050;
   width: 300px;
   display: flex;
   flex-direction: column;
   align-items: center;
}

@media (max-width: 500px) {
   form {
      padding: 10px;
   }
}

#loginLogo {
   content: url(https://voxmeter.catglobe.com/ol/Images/GetImage.aspx?rid=37afc2a3-68eb-4e59-9b84-3ccbaa24c57a);
}

#loginbody .subtitle {
   font-weight: bold;
   font-size: 120%;
   margin-top: 10px;
   margin-bottom: 50px;
}

form input {
   background: none;
   border-radius: 0;
   border-top: none;
   border-left: none;
   border-right: none;
   border-bottom: 1px solid #ccc;
   outline: none;
   width: 90%;
   padding: 0 10px;
   margin: 0 auto 20px;
}

   form input::placeholder {
      font-weight: bold;
      opacity: 0.7;
   }

form .forgot {
   width: 100%;
   text-align: right;
   margin-bottom: 20px;
}

   form .forgot a {
      color: #888;
   }

form .submit button {
   width: 200px;
   background: #ccc;
   cursor: pointer;
   font-weight: bold;
   color: #fff;
   font-size: large;
}

form .support {
   margin-top: 40px;
   font-size: 90%;
}

form .catglobe-logo {
   width: 150px;
   content: url(https://voxmeter.catglobe.com/ol/Images/GetImage.aspx?rid=8ce94b14-61ce-45e0-98c6-64ec771078b1);
   margin: 0 auto;
}

a.mail {
   color: rgb(80,80,80);
   text-decoration: none;
}

form .submit-container {
   width: 100%;
   text-align: center;
   height: 120px;
}

form .invalid {
   width: 100%;
   text-align: center;
   height: 120px;
}

form .invalid-forgot {
   margin-top: 20px;
}

   form .invalid-forgot a {
      color: #888;
   }
