A complete client-side browser application for an OAuth3 issuer implementation.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 

446 lines
14 KiB

@font-face { font-family: Brown Bold; font-weight: bold; src: url('../fonts/Brown-Bold.otf'); }
@font-face { font-family: Brown Regular; src: url('../fonts/Brown-Regular.otf'); }
@font-face { font-family: Brown Light; src: url('../fonts/Brown-Light.otf'); }
@font-face { font-family: Myriad Pro; src: url('../fonts/Myriad-Pro_31655.ttf'); }
* {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
html, body {
font-family: 'Brown Regular', Brown Regular, "Helvetica Neue", Helvetica, Arial, sans-serif;
background-color: #282828;
color: #FFFFFF;
}
input.emailInput::placeholder {
font-family : Brown Regular;
font-size : 14px;
line-height : 16px;
color : #666666;
color : rgb(102, 102, 102);
opacity : 0.5;
filter: alpha(opacity=50) progid:DXImageTransform.Microsoft.Alpha(opacity=50) ;
}
input.js-authn-otp-code::placeholder {
font-size : 17px;
line-height : 16px;
letter-spacing : 1.02px;
color : #999999;
color : rgb(153, 153, 153);
text-align: center;
}
input.js-authn-otp-code {
font-size : 17px;
line-height : 16px;
letter-spacing : 1.02px;
text-align: center;
}
input.js-authn-otp-code {
font-size : 14px;
line-height : 16px;
}
p {
font-size: 14px;
line-height: 19px;
color: #E6E6E6;
color: rgb(230, 230, 230);
}
.text-left{
line-height: 1.42857143;
text-align: left;
}
.text-center{
line-height: 1.42857143;
text-align: center;
}
.dap-bordered {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
h4, h5{
color: #F2F2F2;
}
a{
color: #333333;
}
.checkbox{
text-align: left;
}
fieldset{
text-align: left;
}
.check{
/*background-image: url('../images/unpressed-check.png');*/
background-position: 5%, 50%;
background-repeat: no-repeat;
padding-right: 5px;
}
/*====== BUTTONS =========*/
.btn, button{
font-family : 'Brown', "Helvetica Neue", Helvetica, Arial, sans-serif;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #CCCCCC;
color : rgb(204, 204, 204);
}
.btn-default{
font-family : Brown;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
width: 100%;
max-width : 240px;
color : #1A1A1A;
color : rgb(26, 26, 26);
background : -moz-linear-gradient(50% 0% -90deg,rgba(242, 242, 242, 1) 0.13%,rgba(236, 236, 236, 1) 46.26%,rgba(222, 222, 222, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0.0013,rgba(242, 242, 242, 1) ),color-stop(0.4626,rgba(236, 236, 236, 1) ),color-stop(1,rgba(222, 222, 222, 1) ));
background : -o-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#DEDEDE' ,GradientType=0)";
background : linear-gradient(180deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
}
.btn-default:active{
font-family : Brown;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #666666;
color : rgb(102, 102, 102);
background : #E6E6E6;
background : rgba(230, 230, 230, 1);
border-style : Solid;
border-color : #B3B3B3;
border-color : rgba(179, 179, 179, 1);
border-width : 1px;
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
outline: none;
}
.btn-default:hover{
font-family : Brown;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #1A1A1A;
color : rgb(26, 26, 26);
outline: border-color : #B3B3B3;
outline: rgba(179, 179, 179, 1);;
background : -moz-linear-gradient(50% 0% -90deg,rgba(242, 242, 242, 1) 0.13%,rgba(236, 236, 236, 1) 46.26%,rgba(222, 222, 222, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0.0013,rgba(242, 242, 242, 1) ),color-stop(0.4626,rgba(236, 236, 236, 1) ),color-stop(1,rgba(222, 222, 222, 1) ));
background : -o-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#DEDEDE' ,GradientType=0)";
background : linear-gradient(180deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
}
.btn-default:focus{
font-family : Brown;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #666666;
color : rgb(102, 102, 102);
outline: #E6E6E6;
background : #E6E6E6;
background : rgba(230, 230, 230, 1);
border-style : Solid;
border-color : #B3B3B3;
border-color : rgba(179, 179, 179, 1);
border-width : 1px;
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
}
.btn-default:active:focus{ /*click event*/
outline: none;
font-family : Brown;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #FDA53E;
color : rgb(253, 165, 62);
background : -moz-linear-gradient(50% 0% -90deg,rgba(242, 242, 242, 1) 0.13%,rgba(236, 236, 236, 1) 46.26%,rgba(222, 222, 222, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -webkit-gradient(linear,50% 0% ,50% 100% ,color-stop(0.0013,rgba(242, 242, 242, 1) ),color-stop(0.4626,rgba(236, 236, 236, 1) ),color-stop(1,rgba(222, 222, 222, 1) ));
background : -o-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2', endColorstr='#DEDEDE' ,GradientType=0)";
background : linear-gradient(180deg, rgba(242, 242, 242, 1) 0.13%, rgba(236, 236, 236, 1) 46.26%, rgba(222, 222, 222, 1) 100%);
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F2F2F2',endColorstr='#DEDEDE' , GradientType=0);
}
.btn-primary:visited{
border-color: none;
}
.btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary{
background-color: #1A1A1A;
color: #FDA53E;
border-color: #000000;
}
.btn-primary:focus, .btn-primary.focus{
border-color: black;
outline: none;
}
.btn-primary:active:hover, .btn-primary.active:hover, .open>.dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open>.dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open>.dropdown-toggle.btn-primary.focus{
background-color: #1A1A1A;
outline: none;
border-color: #000000;
color: #ACACAC;
}
.btn-primary, .btn.disabled{
background : -moz-linear-gradient(50% 1.03% -90deg,rgba(36, 36, 36, 1) 0%,rgba(19, 19, 19, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(36, 36, 36, 1) 0%, rgba(19, 19, 19, 1) 100%);
background : -webkit-gradient(linear,50% 1.03% ,50% 101.8% ,color-stop(0,rgba(36, 36, 36, 1) ),color-stop(1,rgba(19, 19, 19, 1) ));
background : -o-linear-gradient(-90deg, rgba(36, 36, 36, 1) 0%, rgba(19, 19, 19, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(36, 36, 36, 1) 0%, rgba(19, 19, 19, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#242424', endColorstr='#131313' ,GradientType=0)";
background : linear-gradient(180deg, rgba(36, 36, 36, 1) 0%, rgba(19, 19, 19, 1) 100%);
left : 19px;
top : 506px;
width : 100%;
height : 40px;
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#242424',endColorstr='#131313' , GradientType=0);
width: 100%;
max-width: 280px;
margin-top: 10px;
padding-top: 10px;
padding-bottom: 10px;
font-weight : bold;
font-size : 12px;
line-height : 19.57px;
letter-spacing : 1.44px;
text-transform : uppercase;
color : #CCCCCC;
color : rgb(204, 204, 204);
}
/*text-transform: uppercase;
background : -moz-linear-gradient(50% 1.03% -90deg,rgba(59, 59, 59, 1) 0%,rgba(35, 35, 35, 1) 100%);
background : -webkit-linear-gradient(-90deg, rgba(59, 59, 59, 1) 0%, rgba(35, 35, 35, 1) 100%);
background : -webkit-gradient(linear,50% 1.03% ,50% 101.8% ,color-stop(0,rgba(59, 59, 59, 1) ),color-stop(1,rgba(35, 35, 35, 1) ));
background : -o-linear-gradient(-90deg, rgba(59, 59, 59, 1) 0%, rgba(35, 35, 35, 1) 100%);
background : -ms-linear-gradient(-90deg, rgba(59, 59, 59, 1) 0%, rgba(35, 35, 35, 1) 100%);
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#3B3B3B', endColorstr='#232323' ,GradientType=0)";
background : linear-gradient(180deg, rgba(59, 59, 59, 1) 0%, rgba(35, 35, 35, 1) 100%);
border-radius : 6px;
-moz-border-radius : 6px;
-webkit-border-radius : 6px;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3B3B3B',endColorstr='#232323' , GradientType=0);
}*/
.btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus{
border-color: black;
outline: none;
}
.btn-primary:hover{
border-color: black;
}
.btn-primary{
color: #CCCCCC;
background-color: #1A1A1A;
border-color: black;
}
/*====== INPUT =========*/
.form-control{
height : 39px;
}
.form-control:focus, .form-control:active, .form-control{
height: 39px;
border-color: #ACACAC;
-webkit-box-shadow: none;
box-shadow: none;
}
.input-group .form-control:first-child:first-child>{
background : #E6E6E6;
background : rgba(230, 230, 230, 1);
width : 100%;
min-width: 278px;
height : 39px;
border-radius : 4px;
-moz-border-radius : 4px;
-webkit-border-radius : 4px;
}
/*=====================*/
.well{
background : #F2F2F2;
background : rgba(242, 242, 242, 1);
max-width: 323px;
margin-left: auto;
margin-right: auto;
margin-bottom: 50px;
width: 100%;
min-width : 299px;
border-radius : 12px;
-moz-border-radius : 12px;
-webkit-border-radius : 12px;
box-shadow : 0px 10px 6px rgba(0, 0, 0, 0.6);
filter: progid:DXImageTransform.Microsoft.dropshadow(OffX=0, OffY=10, Color='#000000') ;
}
.well input {
background : #E6E6E6;
background : rgba(230, 230, 230, 1);
width: 100%;
max-width : 282px;
border-radius : 4px;
-moz-border-radius : 4px;
-webkit-border-radius : 4px;
margin-left: auto;
margin-right: auto;
}
.well li.list-group-item {
background-color: #E6E6E6;
width: 100%;
max-width : 282px;
margin-left: auto;
margin-right: auto;
}
.btn-back {
margin: 0;
float: left;
width: 39px;
height: 40px;
}
.checkbox label {
padding-left: 0px;
}
.modal-title {
font-family : Brown Bold;
font-weight : bold;
font-size : 18px;
color : #1A1A1A;
color : rgb(26, 26, 26);
}
.modal-body input, .modal-body select {
background: #E6E6E6;
background: rgba(230, 230, 230, 1);
}
/*Daplie Device*/
label.cloud-device {
display: inline-block;
position: relative;
padding: 1%;
}
label.cloud-device > input {
visibility: hidden;
position: absolute;
}
.not-selected {
content: url("../images/server-icon.png");
margin: auto;
}
.is-selected{
content: url("../images/selected-server.png");
}
.welcome-text {
font-family : Brown Regular;
font-size : 14px;
line-height : 19px;
color : #E5E5E5;
color : rgb(229, 229, 229);
max-width: 250px;
text-align: center;
padding-bottom: 30px;
}
.org-title {
padding-top: 70px;
font-family : Brown Bold;
font-weight : bold;
font-size : 18px;
line-height : 35.6px;
color : #62A8A1;
color : rgb(98, 168, 161);
}
.dap-input {
width : 280px;
height : 39px;
margin-left: auto;
margin-right: auto;
}
.dap-centered-div.dap-space-on-top.form-group {
text-align: center;
}
form.twelve-digit-code, .js-authn-otp-code {
text-align: center;
}
img.sponsored-by-logo {
margin-top: 70px;
width: 81px;
height: 81px;
}
.code-sent-text {
font-size : 14px;
line-height : 19px;
color : #E5E5E5;
color : rgb(229, 229, 229);
margin-bottom: 0;
}
.email-address {
color: #808080;
}
.code-lasts-text {
font-family : Brown Regular;
font-size : 11px;
line-height : 19px;
color : #666666;
color : rgb(102, 102, 102);
text-align: center;
margin-bottom: 5px;
}
.dap-remember-me {
font-family : Brown Light;
font-size : 14px;
color : #E6E6E6;
color : rgb(230, 230, 230);
vertical-align: middle;
}
.almost-done-text {
font-family : Brown Regular;
font-size : 14px;
line-height : 19px;
color : #E5E5E5;
color : rgb(229, 229, 229);
max-width: 180px;
text-align: center;
}
.sign-out-text {
padding-top: 70px;
}
.js-authorization-decision {
text-align: center;
}
.pb-40 {
padding-bottom: 40px;
}
span.dap-small-text.js-scope-desc.noselect {
font-family : Brown;
font-size : 14px;
line-height : 19px;
color : #808080;
color : rgb(128, 128, 128);
}
.error-msg {
color: #FDA748;
}