body {
  background-image: url("JoinBackgroundPic.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
  height: 100vh;
  margin: 0;
  padding: 0;
}

.Title h1 {
  text-transform: uppercase;
  font-family: "Courier New", serif;
  font-size: 40px;
  color: white;
  letter-spacing: 5px;
  text-align: center;
}

.BigBox {
  background-color: rgba(0,0,0,0.7);
  height: inherit;
  top: 0 !important;
  width: inherit; 
  display: flex;
  justify-content: center;
  align-items: center;
}

.ActualContainer {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  height: auto;
  width: 30%;
}

.LoginContainer {
  width: 100%;
  height: 100%;
}

p {
  color: red;
  font-family: "Courier New", serif;
  padding: 0;
  margin: 0;
}

form {
  background-color: white;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

form h2 {
  font-family: "Open Sans",Helvetica,Arial,sans-serif !important;
  color: black;
  font-size: 25px;
  font-weight: 100 !important;
  padding-top: 10%;
  margin: 0;
}

input[type=text], input[type=password] {
  width: 100%;
  padding: 12px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  font-family: "Courier New", serif;
}
button {
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
  font-family: "Courier New", serif;
}



.goBack {
  width: auto;
  padding: 10px 18px;
  background-color: black;
  font-family: "Courier New", serif;
  float: left;
}

.container {
  display: flex;
  flex-direction: column;
  background-color: white;
  width: 80%;
  justify-content: center;
  align-items: center;
  height: auto !important;
}

.payment {
  width: auto;
  padding: 10px 18px;
  background-color: black;
  font-family: "Courier New", serif;
  float: right;
}
b {
  font-family: "Courier New", serif;
}


/* style the container */
.container {
  padding: 20px 0 30px 0;
}

input,
.btn {
  width: 100%;
  padding-top: 12px;
  padding-bottom: 12px;
  border: none;
  border-radius: 4px;
  margin: 5px 0;
  display: inline-block;
  font-size: 17px;
  line-height: 20px;
  text-decoration: none;
}

.facebook {
  background-color: #3B5998;
  color: white;
  font-family: "Archivo Medium", sans-serif;
}

.twitter {
  background-color: #55ACEE;
  color: white;
  font-family: Roboto,arial,sans-serif;
  width: auto;
}

input[type=submit] {
  background-color: #4CAF50;
  color: white;
  cursor: pointer;
}

input[type=submit]:hover {
  background-color: #45a049;
}

a {
  text-decoration: none;
  color: white;
}

a:visited{
  color: white;
}

.fb-login-button, .twitter, .g-signin2 {
  margin-bottom: 15px;
  height: 30px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}

.FooterLinks {
  list-style-type: none;
  font-family: "Open Sans",Helvetica,Arial,sans-serif;
  font-size: 14px;
  margin-top: 10%;
  text-align: center;
  padding: 0;
}

.FooterLinks li {
  display: inline-block;
  color: white;
} 


.Link:hover {
  text-decoration: underline;
}

.container2 {
  padding-bottom: 10%;
  -webkit-transition-duration: 0.2s;
  transition: 0.2s;
}

.container2:hover {
  opacity: 0.8;
}

.abcRioButtonBlue {
  height: 50px !important;
  width: 100% !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}

.abcRioButtonIcon {
  height: 100% !important;
  padding-top: 17px !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 10% !important;
}

.abcRioButton {
  overflow: visible !important;
}

.abcRioButtonContents {
  font-size: 17px !important;
  padding-left: 20%;
}

.abcRioButtonContentWrapper {
  display: flex !important;
  align-items: center !important;
}

._51mx {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  width: 100% !important;
  padding-top: 12px !important;
}

tbody {
  height: 50px !important;
}

._5h0f {
  font-size: 17px !important;
  font-family: Roboto,arial,sans-serif !important;
}

._xvm, ._5h0c, ._5h0f, ._5h0i {
  width: 100% !important;
  max-width: 100% !important;}
}

.plugin, .plugin button, .plugin input, .plugin label, .plugin select, .plugin td, .plugin textarea {
  font-size: 17px !important;
}

body.plugin {
  font-family: Roboto, sans-serif !important;
  overflow: visible !important;
}