body {
    font-family: 'Poppins', sans-serif;
    background-color: #fff;
}

#container {
    height: 100vh;
    width: 98%;
}
.row {
    margin: 0;
    padding: 0;
    height: 100%;
}
.row .left, .row .right {
    margin: 0;
    padding: 0;
}
.row .left {
    height: 200px;
    background-color: #052C3F;
}
.container-title {
    font-size: 1.5rem;
    font-weight: bold;
    color: #fff;
}
.container-subtitle {
    font-size: 1.5rem;
    color: #fff;
}
.container-copy {
    font-size: 1rem;
    color: #fff;
}
.container-copy a {
    color: #95D9D0;
	font-weight: bold;
}
.inside-container {
    position: relative;
    width: 100%;
    height: 100%;
}
.container-logo {
    position: absolute;
    top: -3rem;
    right: 1rem;
}
.container-logo img {
    width: 140px;
}
.container-prompt {
    width: 100%;
    text-align: center;
    font-size: 1.5rem;
    font-weight: bold;
}
.container-hint {
    width: 100%;
    font-size: 1.15rem;
    text-align: center;
}
.container-input {
    width: 100%;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 1rem;
}
.container-input .list-group-item {
    cursor: pointer;
    border: 1px solid rgba(#9faeb5, 0.5);
    margin-bottom: .25rem;
}
.container-input .list-group-item .item-title {
    font-weight: bold;
    font-size: 1rem;
}
.container-input .list-group-item .item-description {
    margin-top: .25rem;
}
.container-input .list-group-item:hover {
    background-color: rgba(#9faeb5, 0.5);
}

.api {
    margin-left: 3rem;
    margin-right: 0;
}
.api a {
    color: #0A587E;
    text-decoration: underline;
}
.api .intro p,.api .intro h2 {
    color: #052C3F;
    font-size: 1.2rem;
    font-weight: 600;
	text-align: center;
    width: 80%;
}
.api div.error {
    color: #721c24;
    background-color: #f8d7da;
    border-color: #f5c6cb;
    text-align: center;
    width: 80%;
}
.api ul {
    padding-inline-start: 0;
	list-style: none;
}
.api .attrEntry,.api .entry-item {
	margin-bottom: .8rem;
}
.api .attrEntry label,.api .entry-item label {
    display: none;
}
.api .attrEntry label#true_option {
    display: inline-block;
    margin-left: 0.8rem;
    margin-right: .25rem;
}
.api .attrEntry label[for=extension_termsOfUse] {
	display: inline-block;
}
.api .attrEntry input.textInput,.api .entry-item input[type=text],.api .entry-item input[type=email],.api .entry-item input[type=password] {
    width: 80%;
    height: 2.5rem;
}
.api .entry-item div.password-label
{
    margin-top: 0.5rem;
}
.api .attrEntry input[type=checkbox] {
    width: unset;
    transform: scale(1.5);
    margin-left: 0.2rem;
}
.api .attrEntry .helpLink,.api .divider,.api .create {
    display: none;
}
.api .buttons button {
    margin-right: 2rem;
    width: 80%;
    padding: .25rem;
    background-color: #027587;
    border: none;
    border-radius: .25rem;
    color: #fff;
    height: 3rem;
}
.api .buttons button.verifyCode {
	margin-bottom: 1rem;
}
.api div.verificationSuccessText {
    width: 26rem;
    margin-bottom: 1rem;
}
.api .buttons button.changeClaims {
	display: none;
}

@media (min-width: 768px) {
    .api {
        margin-left: 0;
        margin-right: 0;
    }
    #container .row .left {
       height: 100%;
   }
   .inside-container {
       padding-top: 8rem;
       padding-left: 6rem;
   }
   .container-logo {
       position: absolute;
       top: 1rem;
       right: 1rem;
   }
   .container-logo img {
       width: 180px;
   }
   .container-title {
       font-size: 2rem;
   }
   .container-subtitle {
       margin-top: 1rem;
       font-size: 1.5rem;
   }
   .container-copy {
       font-size: 1.25rem;
   }
   .container-input {
       width: 100%;
       padding-left: 2rem;
       padding-right: 7rem;
       padding-top: 5rem;
   }
   .container-input .list-group-item {
       margin-bottom: 1.25rem;
   }
   .container-input .list-group-item .item-title {
       font-size: 1.25rem;
   }
}

@media (min-width: 1025px) {
    .api {
        margin-left: 10rem;
        margin-right: 7rem;
    }
}