/**
  * Title: style.css
  * Purpose: Styles for Lehigh's SAML login page
  * repurposed from previous SAML base.css written by Bobby Siegfreied rrs207@lehigh.edu
**/

/* ========================== FONTS =========================== */
/* import open web fonts (THESE COMMANDS MUST BE FIRST AT ALL TIMES) */
@import url('https://fonts.googleapis.com/css?family=Droid+Sans:400,700');
@import url("https://fonts.googleapis.com/css?family=Ropa+Sans:400,400italic");
@import url("mediaqry.css");

* {
  margin:0;
  padding:0;
}


/* ------------------- global -------------------- */
body {
  background:#ffffff;
  font:100 1.1em helvetica, arial, sans-serif;
}

/* ------------------ branding ------------------- */
#branding-wrapper {
  background:#502d0e;
  color:#ffffff;
  display:block;
  width:100%;
  height:25px;
  position:relative;
  padding:2px 0;
}

#branding {
  display:block;
  height:25px;
  margin:0 auto;
}
#branding h1 {
  font:normal 1.3em 'Ropa Sans', helvetica, arial, sans-serif;
}


/* ------------------- content ------------------- */
#content-wrapper {
  background:#ffffff;
  color:#000000;
  display:block;
  width:100%;
}

#content {
  display:block;
  margin:35px auto 0;
  padding:0;
}

/* headings */
#content h1 {
  color:#502d0e;
  font:400 2.3em 'Ropa Sans', helvetica, arial, sans-serif;
  margin:20px 10px 5px;
}
#content h2 {
  color:#502d0e;
  font:400 1.8em 'Ropa Sans', helvetica, arial, sans-serif;
  margin:20px 10px 1px;
}
#content h3 {
  color:#341c07;
  font:400 1.5em 'Ropa Sans', helvetica, arial, sans-serif;
  margin:35px 10px 0;
}
#content h4 {
  color:#341c07;
  font:400 1.1em helvetica, arial, sans-serif;
  margin:20px 10px 0;
}
#content h5 {
  color:#341c07;
  font:400 1em helvetica, arial, sans-serif;
  margin:15px 10px 0;
}

/* paragraphs, lists, items */
#content p {
  font-size:.9em;
  color:#333333;
  line-height:1.4em;
  margin:10px 10px 15px 15px;
}
  #content p.logintext {
    text-align:center;
  }

#content ul,
#content ol {
  font-size:.9em;
  color:#333333;
  margin:7px 10px 20px 60px;
}
#content li {
  line-height:1.4em;
  margin:0 0 .2em 0;
}
#content hr {
  height:0px;
  border:0;
  border-bottom:1px solid #d4d4d4;
  margin:20px auto;
  width:90%;
}

/* links */
#content a {
  color:#4e75bb;
  text-decoration:none;
}
#content a:hover {
  background:none;
  color:#304b7e;
  text-decoration:underline;
}

/* custom */
#content .error-info {
  background-color:#ffd5d5;
  color:#8e1717;
  border:1px solid #ff9898;
  margin: 5px auto 45px;
  font-size: .9em;
}
  #content .error-info h2 {
    color:#8e1717;
    font:400 1.3em helvetica, arial, sans-serif;
    margin-left:14px;
  }
  #content .error-info p {
    color: #8e1717;
  }

#content .trackidtext {
  background-color:#fff7e0;
  color:#a6610c;
  border:1px solid #ffe293;
  padding: .6em;
  margin: .4em;
}

#content .trackidtext .trackid {
  border: 1px solid #ccc;
  background: #eee;
  color:#000;
  margin: .4em;
  padding: .4em;
  font-family: monospace;
  font-size: 1.3em;
  display:inline-block;
}

/* ------------------ footer --------------------- */
#footer-wrapper {
  display:block;
  width:100%;
  min-height:60px;
}

#footer {
  display:block;
  margin:0 auto;
  padding:0;
}
#footer p {
  font-size:.7em;
  margin:5px 0;
  text-align:center;
}


/* ------------------- forms --------------------- */
/* containers */
span.field {
  margin:7px 5px 14px;
  vertical-align:top;
}
span.full {
  display:block;
}
span.inline {
  display:inline-block;
}
span.readonlyfield {
  background: #e8ebed;
  margin:0;
  font-size:1.1em;
  color: #576366;
  padding: 8px 10px;
  outline: 0;
  border: 1px solid #e8ebed;
  border-radius: 5px;
  box-shadow: 0;
  display:block;
}

input,
select {
  background: #e8ebed;
  margin: 0;
  font-size:1.1em;
  color: #576366;
  width: 100%;
  padding: 8px 10px;
  outline: 0;
  border: 1px solid #e8ebed;
  -webkit-appearance:none;
  border-radius: 5px;
  box-shadow: 0;
  box-sizing: border-box;
}

input:focus,
select:focus {
  background: #fff;
  border-color: #d4d9dd;
  transition: 0.2s;
}

.button-secondary {

    border-radius: 6px;
  color:#ffffff;
  font:100 1em helvetica, arial, sans-serif;
  background: #213b70;

}
.button-secondary:active {
  background: #2b53a5;
  transition: 0.2s;
}

.button-secondary:focus {
  background: #2b53a5;
  transition: 0.2s;
}
.button-secondary:hover {
  background: #2b53a5;
  transition: 0.2s;
}

input[type='submit'] {
  padding:8px 25px;
  background: #213b70;
  border:1px solid #213b70;
  border-radius:6px;
  color:#ffffff;
  font:100 1em helvetica, arial, sans-serif;
  text-shadow:1px 1px 2px #333333;
  cursor:pointer;
  letter-spacing:1px;
  margin:25px auto 5px;
  display:block;
  min-width:200px;
}
input[type='submit']:hover,
input[type='submit']:focus,
input[type='submit']:active {
  background: #2b53a5;
  transition: 0.2s;
}

.pure-form-aligned .pure-control-group label.input-label {
    text-align: left;
  display:block;
  color:#73777a;
  font-size:.8em;
  margin:0 5px 2px 0;
}


/* ----------------- old default ------------------- */
/*

#error {
  background: pink;
  border: 1px solid #000;
  max-width: 400px;
}

*/
#error h2 {
  border: 0;
}

#languagebar {
  padding-left: 10px;
  padding-right: 10px;
}
#languagebar a:link, #languagebar a:visited {
  text-decoration: none;
  color: #777;
  border-bottom: 1px dotted #ccc;
  font-weight: normal;
}
#languagebar a:hover {
  text-decoration: none;
  color: #333;
  border-bottom: 1px solid #333;
}



.efieldlist {
  padding: .4em;
  margin: .8em;
  border-top: 1px solid #e6e6e6;
  border-left: 1px solid #e6e6e6;
}

.efieldlist.warning {
  background-color: #922;
  border: 1px solid #333;
  color: white;
}

.efieldlist.warning h5 {
  color: white;
}

.efieldlist h5 {
  font-weight: bold;
  color: #200;
  margin: .3em;
}

div.caution {
  background-color:  #FF9;
  background-image: url('icons/caution.png');
  background-repeat: no-repeat;
  border: thin solid #444;
  padding: .2em .2em .2em 60px;
  margin: 1em 0px 1em 0px;
}

th.rowtitle {
        text-align: left;
}
.enablebox table {
  border: 1px solid #eee;

  margin-left: 1em;
}
.enablebox.mini table {
  float: right;
}
.enablebox tr td {
  padding: .5px 1em 1px .5em;
  margin: 0px;
}
.enablebox {
  font-size: 85%;
}
.enablebox tr.enabled td {
  background: #eee;
}
.enablebox tr.disabled td {
  background: #ccc;
}

.metadatabox {
  overflow: scroll;
  border: 1px solid #eee;
  padding: 2px;
}
div.preferredidp {
  border: 1px dashed #ccc;
  background: #eee;
  padding: 2px 2em 2px 2em;
}


/* Attribute presentation in example page */
table.attributes {
  width: 100%;
  margin: 0px;
  border: 1px solid #bbb;
  border-collapse: collapse;
}

table.attributes td.attrname {
  text-align: right;
}

table.attributes tr.even td {
  background: #eee;
}

table.attributes tr td {
  border-bottom: 1px solid #bbb;
  border-left: 0px;
  border-right: 0px;
  background: #fff;
  padding-top: 5px;
  padding-left: 1em;
  padding-right: 1em;

  vertical-align: top;
}
table#table_with_attributes tr:last-child td {
  border-bottom: none;
}

fieldset.fancyfieldset {
  margin: 2em 1em 1em 0px;
  border: 1px solid #bbb;
}
fieldset.fancyfieldset legend {
  margin-left: 2em;
  padding: 3px 2em 3px 2em;
  border: 1px solid #bbb;
}