/* /sso/css/rp.css */

/*

colours
-------
#0095b6 :   headings
#c61a2a :   red border
#c6e6f1 :   light blue highlight
#544B8F :   purple
#C72C4C :   red search button
#FDB926 :   orange login button
#0092CF :   RA header blue
#136B95 :   header blue
#333333 :	articles header
*/

/* Global styles to be applied to all pages ---------------------------------------------------- */
#error {
	background-color : red;
}

body {
    font: 14px Arial, Helvetica, "Trebuchet MS", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Tahoma, sans-serif;
}

html, body {
    /* height: 100%; */
}

body {
    margin: 0;
    padding: 0;
    color: #333333;
}

.noShib {
    margin: 10px;
    background: white;
    overflow: hidden;
}

#cas-page {
	margin: 0 auto;
	width: 90%;
	padding: 20px;
    background: none repeat scroll 0 0 #FFFFFF;
}

.noShib #cas-page {
    width: auto;
    overflow: hidden;
}

#cas-page.main {
    background-image: none;
}

#cas-header-inner {
    margin: 0 auto;
    position: relative;
    overflow: visible;
}

.loginError {
    margin:0 auto;
    padding-bottom:20px;
    color:#f00;
}

#cas-header { background: #fff;  height:40px;}

#page.site-RA #header {    background: #fff;}

#cas-header,
#cas-header a {  color: #fff; font-weight:normal;}
#cas-header-inner { padding:0 23px 0 10px; }

div#logo {  color: #0095b6; height: 36px;  background: url(../images/header-logo.png) 0 0 no-repeat;text-indent: -9999px;}

#logo a {  display: block;  width: 245px;  height: 36px;  cursor: pointer;}
.site-RA #logo {    background: url(../images/header-logo-ra.png) 0 0 no-repeat; width: 350px;}


a {
    color: #544B8F;
    text-decoration: none;
    font-weight: bold;
}

a:hover {
    text-decoration: underline;
}

.chosen-container a {
    font-weight: normal;
    font-size : 14px;
}

/* reset all heading margins for cross browser consistency */
h1 {
    font-size: 2.5em;
}

h1, h2 {
    margin-top:0;
    padding-top:0;
}

h2 {
    margin-bottom: 0;
    font-size: 2em;
}

h2 > a {
    color:#fff;
}

h2 > a.sidelink {
    float: right;
    font-size: 0.55em;
    font-weight: normal;
    color: #fff;
}

hr {
    clear: both;
    height: 1px;
    margin: 0;
    padding: 0;
    border: 0;
}

ul {
    list-style-type: none;
    padding: 0;
}

.hidden {
    display:none
}

::-webkit-input-placeholder {
    font-style:italic;
}

::-moz-placeholder {
    font-style:italic;
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    font-style:italic;
}

:placeholder-shown {
     font-style:italic;
}

button, input, select, textarea {
    font-size: 100%;
    margin: 0;
    vertical-align: baseline;
    *vertical-align: middle;
}

button,
input[type="button"],
input[type="reset"],
input[type="submit"] {
    cursor: pointer;
    -webkit-appearance: button;
    *overflow: visible;
    border:0;
}

.search.content select, #search button, .modal-actions button,
.actions select, .action-buttons select, #tabs-2 select,
#annotationmenu button {
    border: 1px solid #7b7b7b;
    background-color: #f6f6f6;
    padding: 2px;
    margin: 2px 4px;
    color: black;
}


/*
 * Reset default cursor for disabled elements
 */
button[disabled],
input[disabled] {
    cursor: default;
}

input[type="checkbox"],
input[type="radio"] {
    box-sizing: border-box;
    padding: 0;
    margin: 5px 3px 0;
}
input.btn, button, a.btn, label.btn {
    background-color: #ff5000;
    color: #FFF;
    padding: 4px;
    font-weight: bold;
}

input.red.btn, button.red.btn {
    background: #C72C4C;
    padding:7px;
    *height:32px; /* IE7 to match input height */
}

input.red.btn.loading, button.red.btn.loading {
	color: #C72C4C;
	background: #C72C4C url("../images/loading.gif") no-repeat 50% 50%;
}

input.grey.btn, button.grey.btn {
	border: solid 1px #7b7b7b;
	background: #f6f6f6;
	color: #000;
    padding:5px;
}
a.login.btn {
    background: #FDB926;
}

a.login.btn:hover {
    text-decoration:none;
}
a.btn, label.btn {
    display: inline-block;
    text-align: center;
}

.advanced #search-button button {
    margin-top:4px;
}

@-moz-document url-prefix() {
    input.red.btn, button.red.btn
    {
        padding:6px;
    }
}

h1 span.pro {
    font-weight: normal;
}

span.error, div.error {
    color: #E00;
}

a.help {
    background-color: transparent; background-image: url("../images/help.png");
    background-repeat: no-repeat; border: 0 none; height: 24px; padding: 0; width: 24px;
    float:right;
    margin: 0;
}

/* modals ---------------------------------------------------------------------------- */
/*Hide proper UI button that we bizarrely ignore*/
.ui-button  {
	display:none
}

.ui-dialog-content ul {
    list-style-type: none;
}

.ui-dialog-content div.error p {
    margin: 5px 0;
}

.ui-dialog-content div.error ul {
    list-style-type: circle;
    margin: 0 0 0 20px;
}

.ui-dialog-content.rp-box {
    background-color: white;
}

#email-search-modal label, #edit-search-modal label, #person-profile-modal label {
    display: inline-block;
    width: 75px;
}

#email-search-modal .rp-tree label {
    width: 380px;
}

#person-profile-modal ul {
    padding: 0;
}
#person-profile-modal label {
    font-weight:bold;
}

.ui-dialog-content input[type=text], .ui-dialog-content input[type=password] {
    display: inline-block;
    width: 200px;
}
.ui-dialog-content label.textarea {
    vertical-align: top; padding-top: 5px
}
.ui-dialog-content textarea {
    width: 200px;
}
.ui-dialog-content.rp-box { padding: 0 }
.ui-dialog-content div.buttons button { margin-left:.5em; font-family: Arial, Helvetica, sans-serif; }

.sign-in.rp-box { padding: 0 }
.sign-in label { display: inline-block; width: 70px }
.sign-in input[type=text], .sign-in input[type=password] { margin: 6px; width: 175px }

.rp-modal-padded li {
    margin: 5px 0;
}

.rp-modal #login-box .controls {
    padding:10px 0;
    text-align:right;
    border-top:1px solid #999;
}

/* modal dialogs: general styles --------------------------------------------------------- */

.rp-modal {
    border: solid 1px #a9a9a9;
    padding-bottom: 20px;
    background: #d7d7d7;
    font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif;
}

.rp-modal-title h4 {
    margin: 0;
    border-bottom: solid 3px #c4c4c1;
    padding: 5px 14px;
    background: #fafdfb;
    font-size: 1em;
    line-height: 1.2;
    font-weight: bold;
}

.rp-modal-content {
    padding: 10px 14px;
    background: #fff;
}

.modal-actions,
.rp-modal div.buttons {
    text-align: right;
    border-top: 1px solid #cbcbcb;
    border-bottom: 1px solid #cbcbcb;
    padding: 6px 9px;
    background: #fff;
}

.modal-actions button[disabled] {
    color: grey;
}

/* CAS login styles*/
/* Login Page --------------------------------------------------------------------------- */

#login-content {
    padding-right: 0;
    padding-top: 12px;
} 

#login-content h2 {
    border-bottom: 2px solid #c4c4c1;
    margin-bottom:0.8em;
    font-weight:normal;
    padding-bottom:0.3em;
}

#login-content a.larger-link {
    font-size:1.3em;
}

#login label {
    font-weight: bold;
    display: inline-block;
    width: 110px;
}

#login input {
    padding: 4px;
}

#login input#rememberMe {
    margin-right: 153px;
    text-align: left;
}

a#resetPassword, a#selfRegister {
    display:block;
    color: #544B8F;
    margin:15px 0;
}

#login-box fieldset {
    border: none;
    padding: 0;
    margin: 0 0 10px;
}

select#idpHostUrl {
    width : 100%;
}

#login-box div.section {
    margin : 10px 0;
}

#login-box > div {
    float: left;
    padding: 0;
    width: 350px;
}

#login-box div#shibboleth {
    margin: 0 20px 0 0;
}

#login-box > div.padLefttrue {
    border-left: 1px solid #E1E1E1;
    padding: 0 0 0 20px;
}

/*
 * If on a narrow (mobile) device then align the 2 parts of the login box vertically, rather than horizontally.
 * 810px was the point at which the 2 parts of the login box attempted to realign vertically (but poorly) so this
 * width was chosen for the tailored vertical adjustment
 */
@media only screen and (max-width: 810px) {
    #login-box > div {
        float: none;
    }

    #login-box > div.padLefttrue {
        border-left: none;
        padding: 0;
        border-top:1px solid #E1E1E1;
    }

    #login-box div#shibboleth {
        margin: 0 0 20px 0;
    }

    #cas-header-inner {
        width: 335px;
    }
}
/*
 * Additional content
 */

#additional-content {
    clear: both;
    float: left;
    margin: 20px auto;
    width: 100%;
}


/*
 * Learn more box
 */

#learn-more-box {
    background: url(../images/login-image.jpg) 50% 50%;
    padding: 50px 40px 40px;
    color: #333;
    border: 2px solid #c4c4c1;
    display: block;
}
#learn-more-box:hover {
  text-decoration: none;
}
#learn-more-box:hover .btn {
  text-decoration: underline;
}
#learn-more-box h2 {
    border: none;
    padding: 0;
}
#learn-more-box h3 {
    margin-top: .5em;
}
#learn-more-box .btn {
    background-color: #ff5000;
    display: inline-block;
    margin: 0;
    color: #FFF;
    font-weight: bold;
    line-height: normal;
    padding: 10px 20px;
    font-size: 150%;
}

label[for='rememberMe'] {
	margin-top: 4px;
}

/* footer note this is "Mobile first"--------------------------------------------------------------------------- */
#footer {
    padding:0;
    width: 100%;
    height: auto;
    border-top: solid 2px #777777;
    float:left;
}
    
#footer #site-info {
    padding-top: 10px;
    text-align: right;
}
    
#footer ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#footer ul li {
    display: inline;
}

#footer ul li:nth-child(odd), #footer p {
    float: left;
    clear: both;
}

#footer ul li:nth-child(even) {
    float: right;
    clear: right;
}


#footer a {
    color: #333;
    font-weight: normal;
    font-size: 14px;
}

@media (min-width: 768px) {
    #cas-page {
        width:768px;
    }
    
    #footer {
        margin: 0;
        padding: 0;
        width:768px;
    }
    
    #footer ul li:nth-child(odd) {
        float: left;
        margin-right: 1em;
        clear: none;
    }
    
    #footer ul li:nth-child(even) {
        float: left;
        margin-right: 1em;
        clear: none;
    }

    #footer ul li:last-child {
        margin-right: 0;
    }
    
    #footer p {
        float: left;
    }
    
    #footer a {
        font-weight: normal;
        font-size: 14px;
    }

}