style.css revision 27b2ac15d8015fcdd3a940b10e788f408903670e
/*! DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS HEADER.
Copyright © 2011 ForgeRock AS. All rights reserved.
The contents of this file are subject to the terms
of the Common Development and Distribution License
(the License). You may not use this file except in
compliance with the License.
You can obtain a copy of the License at
http://forgerock.org/license/CDDLv1.0.html
See the License for the specific language governing
permission and limitations under the License.
When distributing Covered Code, include this CDDL
Header Notice in each file and include the License file
at http://forgerock.org/license/CDDLv1.0.html
If applicable, add the following below the CDDL Header,
with the fields enclosed by brackets [] replaced by
your own identifying information:
"Portions Copyrighted [year] [name of copyright owner]"
*/
body,form,fieldset,p,ul,li,h1,h2,h4,img {
border: 0;
margin: 0;
padding: 0;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
background-color: #f2f2f2;
color: #5a646d;
}
h1 {
color: #626d75;
font-size: 20px;
}
h2 {
color: #626d75;
font-size: 17px;
}
li {
list-style: none;
}
img a {
border: 0;
}
a,a:link,a:visited {
color: #000;
text-decoration: none;
}
a:hover {
text-decoration: underline;
}
table a:hover {
text-decoration: none;
}
a.bold {
font-weight: 700;
}
a.orange {
color: #f36e09;
}
a.gray {
color: #626d75;
}
a.ice {
color: #0e99b8;
}
a.nodecorate {
text-decoration: none;
}
a.hrefInput {
float: left;
padding: 9px 0 0 12px;
}
a.buttonOrange {
background-color: #F36E09;
border-radius: 5px;
color: #FFFFFF;
cursor: default;
display: inline-block;
font-size: 11px;
font-weight: 700;
line-height: 13px;
padding: 9px 10px;
text-align: center;
}
a.buttonOrange:hover {
text-decoration: none;
}
input,select {
float: left;
border: 1px solid #dbdbdb;
height: 30px;
background: #fff;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
font-size: 15px;
color: #5a646d;
width: 221px;
padding: 0 10px 0 10px;
}
input[type=radio] {
margin-top: 1px;
margin-left: 20px;
width: 20px;
margin-bottom: 0px;
height: 15px;
width: 20px;
}
select {
padding: 0 0 0 10px;
}
@
-moz-document url-prefix () {select { padding:5px0010px;
}
}
input:hover,select:hover { /* border: 1px solid #f36e09;*/
border: 1px solid #f3851e;
}
/*
input:focus {
background-color: #ffad66;
border: 1px solid #f36e09;
color: #ffffff;
}
*/
select {
width: 243px;
}
input[type=checkbox] {
height: 20px;
width: 20px;
}
input.readOnly {
padding: 2px 10px 0 11px;
border: none;
}
select[disabled] {
color: #93A4B6;
border: #fff;
-webkit-appearance: none;
}
/*
table {
margin: 15px 0 15px 0;
border-collapse: collapse;
}
table th, table td {
text-align: left;
padding: 5px 30px 5px 5px;
vertical-align: baseline;
}
*/
.nonvisible {
color: #fff;
}
input.button {
height: 31px;
border: 0;
font-size: 11px;
font-weight: 700;
width: auto;
color: #FFF;
padding: 0 10px 1px;
}
input.actionButton {
width: 114px;
}
input.orange {
background-color: #f36e09;
margin-right: 1px;
}
input.gray {
background-color: #5a646d;
margin-right: 2px;
}
input.ashy {
background-color: #C2C2C2;
margin-right: 2px;
}
input.textFieldGray {
color: #b6b8bc;
}
form.form {
padding: 20px;
}
form label {
display: block;
width: 200px;
float: left;
text-align: right;
color: #626d75;
font-weight: 700;
font-size: 17px;
padding: 7px 10px 0 0;
}
form label.light {
font-weight: normal;
}
form span.ok {
color: #75a929;
font-weight: 700;
padding: 7px 0 0 13px;
}
form span.error {
color: #f3851e;
font-weight: 700;
padding: 7px 11px 0 13px;
}
form div.validationMessage {
color: #f3851e;
padding-top: 8px;
margin: 0 0 10px 463px;
}
form div.inputValidationMessage {
margin: 0px 0px 10px 363px;
color: #f3851e;
padding-top: 7px;
}
form div.fields {
clear: both;
}
div.field {
height: 50px;
clear: both;
}
form div.groupField {
}
form div.groupFieldInputs {
}
form div.groupFieldErrors {
padding: -6px;
border: 1px solid #dbdbdb;
width: 245px;
}
form div.groupFieldErrorsRule {
clear: both;
}
form div.groupFieldErrors span {
float: left;
padding: 0 7px 0 5px;
width: 10px;
height: 10px;
}
form div.groupFieldErrors label {
float: left;
font-size: 13px;
text-align: left;
width: 215px;
margin: 0;
padding: 0;
}
#container {
width: 1024px;
margin: 0 auto;
}
#loginContainer {
width: 800px;
padding: 50px;
margin: 0 auto;
}
#bg {
background-color: #f9f9f9;
}
#header {
height: 103px;
}
#header-short {
height: 80px;
}
#header-short-description {
text-align: right;
margin: 66px 18px 0 0;
}
#logo-short {
padding: 20px 0 20px 0;
}
#logo {
padding: 20px 0 20px 16px;
}
#footer {
margin: 10px 0 10px 0;
background: url(../images/footer_bg.png) repeat-x #f2f2f2;
}
#footer-content {
padding: 45px 0 45px 0;
width: 1024px;
margin: 0 auto;
text-align: center;
font-size: 11px;
color: #696e72;
}
#loginBox {
position: absolute;
margin-left: 830px;
width: 515px;
padding-top: 34px;
background: url('../images/login-register-bg.png') no-repeat top right;
min-height: 75px;
}
#loginForm {
float: left;
width: 416px;
padding: 10px 2px 0 9px;
}
#loginForm input {
margin-right: 5px;
font-weight: 700;
}
#loginForm input:focus {
background: #f9f9f9;
}
#loginForm input.field {
width: 147px;
}
.login_toggle {
background-color: #fff;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px;
box-shadow: 0 0 5px #888;
}
#loginRemember {
clear: both;
display: none;
height: 25px;
padding: 10px 5px 2px 0;
}
#loginForm input.checkbox {
width: auto;
height: auto;
}
#loginContent {
float: right;
display: none;
margin: 44px 25px 0 0;
}
#loginContent span {
padding: 0 20px 0 20px;
color: #32353e;
font-size: 15px;
}
#loginRegister {
margin-left: 8px;
padding-top: 10px;
float: left;
}
.menu {
height: 40px;
background: url(../images/menu_bg.png) repeat-x;
font-size: 16px;
clear: left;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
}
#menu ul,#menu ul li {
display: block;
list-style: none;
margin: 0;
padding: 0;
}
#menu ul.menu li {
background: url(../images/menu-next.png) no-repeat right;
height: 40px;
}
#menu ul.menu a:link,#menu ul.menu a:visited {
display: block;
text-align: center;
color: #f9f9f9;
padding: 10px 20px 10px 20px;
}
#menu ul.menu li.active {
background: url(../images/menu-bg-orange.png) repeat-x;
}
#menu ul.menu li.active:first-child {
-webkit-border-top-left-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-moz-border-radius-bottomleft: 5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
#submenu {
display: block;
clear: both;
height: 30px;
background-color: #f7f7f7;
border-left: 1px solid #D5D5D5;
border-right: 1px solid #D5D5D5;
border-bottom: 1px solid #D5D5D5;
margin-left: 3px;
margin-right: 3px;
font-size: 15px;
}
#submenu ul li {
height: 30px;
}
#submenu ul li a,#submenu ul li a:visited {
display: block;
text-align: center;
color: #f36e09;
padding: 3px 8px 4px 8px;
margin: 3px 5px 0 5px;
}
#submenu ul li a:hover,#submenu ul li.active a {
background-color: #F98624;
color: #F9F9F9;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
text-decoration: none;
}
#navi {
clear: both;
height: 40px;
border-bottom: 1px solid #e6e6e6;
margin-bottom: 30px;
font-size: 11px;
}
#nav-content {
font-size: 14px;
float: left;
padding: 13px 0 7px 15px;
}
img.navi-next {
margin: -3px 12px 0 12px;
}
#content {
margin: 15px 15px 25px 0;
}
#contentMainImage {
text-align: center;
}
#registration {
width: 780px;
margin: auto;
}
#selectPictureLink {
padding-left: 0;
width: 227px;
}
#registration form {
padding: 15px;
}
#registration form input {
display: block;
width: 206px;
font-size: 15px;
}
#registration form input.check {
margin-left: 210px;
width: auto;
border: 0;
margin-top: 5px;
}
#registration form input.button {
margin-left: 210px;
font-size: 11px;
width: 114px;
}
#registration form label.check {
width: auto;
padding: 6px 0 0 5px;
margin-right: -2px;
}
#registration form select {
width: 228px;
}
#profile {
width: 940px;
}
#profile img {
display: block;
margin: 10px 0 10px 0;
}
#profile h2 {
width: 200px;
margin-bottom: 15px;
}
#profile input[type=text] {
width: 218px;
}
#profile form div.validationMessage {
clear: both;
margin: 0 0 0 170px;
}
#profile form div.field {
height: 70px;
width: 433px;
}
#profile form label {
width: 150px;
}
#profileData {
margin-top: 50px;
}
#messages div {
width: 360px;
position: fixed;
margin-left: -180px;
top: 10px;
left: 50%;
text-align: center;
font-size: 14px;
line-height: 14px;
padding: 5px;
border: 1px solid #a6a8ad;
background: #F9F9F9;
}
#messages span {
padding: 0 20px 0 10px;
}
.confirmMessage { /* background-color: #f6e37a;*/
color: #6ec563;
}
.errorMessage { /* background-color: #f6e37a;*/
color: #fd0000;
}
.textLabelValign {
padding-top: 9px;
}
.clear {
clear: both;
}
.hide {
display: none;
}
.floatRight {
float: right;
}
.floatNone {
float: none;
}
.alignRight {
text-align: right;
}
.alignLeft {
text-align: left;
}
.center {
margin: auto;
}
.border {
border: 1px solid red;
}
.marginLeft {
margin-left: 5px;
}
.marginRight {
margin-right: 5px;
}
.shadowFrame {
margin-top: 10px;
background-color: #fff;
border: 1px solid #e6e6e6;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
padding: 15px;
}
.radious {
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
form span,#logo,#menu ul li {
float: left;
}
.floatLeft {
float: left;
padding: 0;
}
#dialog {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1;
background-image: url('../images/overlay.png');
}
#dialogFrame {
position: fixed;
width: 100%;
z-index: 2;
}
#dialogContainer {
position: relative;
width: 600px;
height: 400px;
margin: 0 auto;
border: 1px solid #5a646d;
background-color: #fff;
padding: 10px 15px 10px 15px;
}
#dialogCloseCross {
width: 16px;
height: 16px;
position: absolute;
top: 0;
right: 0;
padding: 15px 15px 0 0;
}
#dialogContent {
height: 350px;
overflow: auto;
padding: 0 10px 0 0;
}
#dialogContent form {
padding: 15px;
}
#dialogContent p {
padding: 8px 0 8px 0;
}
#dialogActions {
margin-top: 12px;
text-align: right;
}
.orange {
color: #f36e09;
}
.gray {
color: #626d75;
}
.bold {
font-weight: bold;
}
#popup {
display: none;
position: absolute;
}
#popupContent {
background: #fff;
border: 1px solid #5a646d;
padding: 10px;
}
#popup ul {
list-style: none;
}
.pictureSelected {
border: 5px solid #f36e09;
}
.pictureNotSelected {
border: 5px solid #fff;
}
.hidden {
visibility: hidden;
}
.dialog {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 4;
background-image: url('../images/overlay.png');
}
.dialogCloseCross {
width: 16px;
height: 16px;
position: relative;
float: right;
}
.dialogContainer {
overflow: auto;
z-index: 5;
margin: 0 auto;
background: #fff;
border: 1px solid #5a646d;
padding: 15px;
}
.dialogContent form {
padding: 15px;
}
.dialogContent p {
padding: 8px 0 8px 0;
font-size: 14px;
}
.dialogActions {
margin-top: 12px;
text-align: right;
}
#sortable {
list-style-type: none;
margin: 0;
padding: 0;
}
#sortable a {
text-decoration: none;
}
#sortable li,li.ui-draggable {
position: relative;
margin: 0 15px 15px 0;
float: left;
text-align: center;
/*border: 1px solid black;*/
background-color: #fff;
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px #888;
box-shadow: 0 0 5px #888;
}
#sortable li:hover {
background-color: #F68600;
}
#sortable li div.ui-state-item,li.ui-draggable div.ui-state-item {
border: 1px solid #c1c1c1;
margin: 3px;
width: 177px;
height: 65px;
}
#sortable li.ui-state-needsApproval {
background-color: #C2C1B5;
}
#sortable li span.link,li.ui-draggable span.link {
color: #616c75;
text-decoration: none;
display: block;
}
#sortable li.ui-state-app-approved span {
color: #66CC33;
}
#sortable li.ui-state-app-rejected span {
color: #ff0000;
}
#sortable li.ui-state-app-pending span {
color: #f36e09;
}
h2.underline {
border-bottom: 2px solid #5d5d5d;
margin-bottom: 15px;
font-size: 20px;
font-weight: 600;
}
h2.sortableWidth {
width: 986px;
}
h2.bold {
font-weight: 600;
}
h2.head {
font-size: 20px;
}
.marginRight20 {
margin-right: 20px;
}
label.head {
font-size: 18px;
font-weight: 600px
}
label.short {
width: 120px;
}
label.checkbox {
font-weight: normal;
width: auto;
position: relative;
padding: 4px 0 0 24px;
line-height: 16px;
float: left;
font-size: 14px;
}
label.checkbox input[type="checkbox"] {
position: absolute;
left: 0;
top: 0;
width: auto;
display: inline-block;
}
#notifications h3 {
margin-bottom: 5px;
outline: none;
}
#notifications h3 img {
float: left;
margin-right: 15px;
}
#notifications h3 a {
display: block;
font-size: 15px;
}
#notifications #items {
height: 310px;
overflow-x: auto;
padding-right: 10px;
margin-bottom: 10px;
overflow-x: hidden;
}
.itemLeftIdent {
margin-left: 40px;
}
.radiousTopLeft {
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
border-top-left-radius: 5px;
}
.radiousTopRight {
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
border-top-right-radius: 5px;
}
.block {
display: block;
}
.paddingVertical40 {
padding: 40px 0 40px 0;
}
div.itemize {
margin: 0 15px 15px 0;
float: left;
text-align: center;
background-color: white;
-moz-box-shadow: 0 0 5px #888;
-webkit-box-shadow: 0 0 5px #888;
box-shadow: 0 0 5px #888;
}
div.appItem {
border: 1px solid #c1c1c1;
margin: 3px;
padding-top: 26px;
width: 178px;
height: 39px;
text-align: center;
}
.gradientLinearGray {
background-image: linear-gradient(left top, #fcfcfc 0%, #ededed 53%);
background-image: -o-linear-gradient(left top, #fcfcfc 0%, #ededed 53%);
background-image: -moz-linear-gradient(left top, #fcfcfc 0%, #ededed 53%);
background-image: -webkit-linear-gradient(left top, #fcfcfc 0%, #ededed 53%);
background-image: -ms-linear-gradient(left top, #fcfcfc 0%, #ededed 53%);
}
a.ui-item-href .ui-state-close,li.ui-draggable div.ui-state-close {
display: none;
}
a.ui-item-href:hover .ui-state-close {
position: absolute;
top: 0;
right: 0;
background-color: #424242;
border: 2px solid white;
font-weight: bold;
font-size: 10px;
-webkit-border-radius: 35px;
-moz-border-radius: 35px;
border-radius: 35px;
color: white;
height: 15px;
width: 15px;
line-height: 13px;
text-align: center;
display: block;
}
div.underline {
border-bottom: 2px solid #5d5d5d;
margin-bottom: 15px;
width: 986px;
}
.appsBoxMarginBottom {
margin-bottom: 5px;
}
#apps, #dashboard {
width: 1000px;
margin-left: 15px;
margin-right: 15px;
}