/*--beginning of general structure --*/
@import url(https://fonts.googleapis.com/css?family=Roboto%20Slab);
body {
 margin: 1em;
 text-align: center;
 color: #000;
 background: #465454;
 font: 1.0em verdana, arial, helvetica, sans-serif;
 }
#wrapper {

 margin: 0 auto;
 padding: 0;
 text-align: left;
 color: #000;
 background: #a9cac9;
 background: #d4e4e4;
 border:  #9d080d .2em solid;

}
#subwrapper {
  margin: 0 auto;
  padding: 0;
  text-align: left;
  background: transparent url(images/CardinalGhost.png) no-repeat;
  background-attachment: scroll;
  position: relative;
  background-position: 95% 85%;
}
#header {
 background: transparent;
 //*border-top: #9d080d solid 1.3em;*//
 }
#subheader {
  padding: 50px 0 0 100px;
}
.readmore, .example{
  font: italic 100% Verdana, Arial, Helvetica, sans-serif;
  color: #9d080d;
  background: transparent;
  text-decoration: none;
}

.clear {
  clear: both;
}
.clearright {
  clear: right;
}
.clearleft {
  clear: left;
}
/*--end of general structure - beginning of navigation area  --*/
#primarynav{
 float: left;
 width: 17%;
 padding: 0 0 3% 9%;
 background: transparent;
}

ul#primarynavigation{
 font-family: "Roboto Slab";
 list-style-type: none;
  padding: 80px 10px 20px;
 margin: 0;


 }
ul#primarynavigation li{
 background: transparent;
 padding: 0 0 1em 0;
 margin: 0;
}
ul#primarynavigation li a:link, ul#primarynavigation li a:visited {
 color: #000;
 text-decoration: none;

 }

ul#primarynavigation li a:hover{
 font-weight: bold;
 color: #9d080d;
 text-decoration: none;
}
ul#primarynavigation li a#current{
 font-weight: bold;

}
img#cardiLogo {
   width: 60%;
}

/*--end of navigation area - beginning of main content area --*/
#content {
 float: left;
 width: 65%;
 text-align: left;
 background: transparent;
 padding: 0;
 margin: 30px 0 15px;

 }
#content h1 {
 font-family: "Roboto Slab";

 margin: 0;
 color: #9d080d;
 background: transparent;
 padding: 5px;
 font-variant: small-caps;
 font-weight: normal
}
#content h1#cmsH1 {
    text-align: left;
    padding-left: 40px;
}

#content h1#resourcehead {
  padding-bottom: 20px;
}

#content h2 {
 font-family: "Roboto Slab";
 font-weight: normal;
 color: #9d080d;
 background: transparent;

 text-align: center;
 padding: 30px 20px 20px;
 margin: 0;
 }
#content h2#contactPageSlogan {
 color: #9d080d;
 background: transparent;
 font-size: 105%;
 text-align: center;
 padding: 10px 20px 20px;
 margin: 0;
 }
#content p {
 color: #000;
 background: transparent;
 font-size: 95%;
 line-height: 140%;
 margin: 0;
 padding: 15px 40px 7px 45px;
 }

 #content p#columnfirst {
  float: left;
  width: 145px;
  padding: 5px 10px 25px 45px;
  font-size: 70%;
}
#content p.columnmid {
  float: left;
  width: 145px;
  font-size: 70%;
  padding: 5px 10px 25px 10px;
}
#content p#columnlast {
  float: left;
  width: 145px;
  font-size: 70%;
  padding: 15px 45px 25px 10px;
}
#content p.questions {
font: menu;
font-size: medium;
font-weight: 500;
font-style: italic;
line-height:1.8;
}

#content ul {
  padding: 7px 40px 10px 55px;
  margin: 0;
}
#content ul li {
  padding-bottom: 10px;
  list-style-position: inside;
}
#content ul#indexPage, #content ul#resources, #content ul#training, #content ul#common, #content ul.multilists {
  padding: 0 40px 0 70px;
  margin: 0;
}
#content ul#indexPage li, #content ul#resources li,  #content ul#common li, #content ul.multilists li  {
  list-style:  outside url(images/inkBottle.gif);
  padding: 2px;
  margin: 0;
  line-height: 140%;
  font-size: 95%;
}
#content ul.multilists li ul {
  padding: 0 1em;
}

#content ul.multilists li ul li{
  padding:0;
  list-style-image: none;
  list-style-type: square;
}
.read-more-state {
  display: none;
}

.read-more-target {
  opacity: 0;
  max-height: 0;
  font-size: 0;
  transition: .25s ease;
}

.read-more-state:checked ~ .read-more-wrap .read-more-target {
  opacity: 1;
  font-size: inherit;
  max-height: 999em;
}

.read-more-state ~ .read-more-trigger:before {
  content: 'Show more information';
}

.read-more-state:checked ~ .read-more-trigger:before {
  content: 'Show less';
}

.read-more-trigger {
  cursor: pointer;
  display: inline-block;
  padding: 0 .5em;
  color: #666;
  font-size: .9em;
  line-height: 2;
  border: 1px solid #ddd;
  border-radius: .25em;
}
#content ul.multilists li ol li {
    list-style: decimal;
    padding: .3em 0;
    line-height: 120%;
}
#content ul.multilists li ol li ul li {
    list-style-type: square;

}
.read-more-trigger {
  cursor: pointer;
  display: inline-block;
  padding: 0 .5em;
  color: #666;
  font-size: .9em;
  line-height: 2;
  border: 1px solid #ddd;
  border-radius: .25em;
}

 #content ul#training li {
  list-style:  outside url(images/inkBottle.gif);
  padding: 2px;
  margin: 0;
  font-size: 100%;
  vertical-align: top;
  font-weight: bold;
}
#content a:link, #content ul#resources a:link,#content a:visited, #content ul#resources a:visited {
  text-decoration: none;
  font-size: 98%;
  font-weight: bold;
  color: #9d080d;
}
#content a:hover, #content ul#resources a:hover {
   text-decoration: underline;
}
#content ul#training li ul.sublist, #content ul#resources li ul.sublist {
  font-size: 100%;
  padding: 0 0 10px;
  margin: 0;

}


#content ul#training li ul.sublist li, #content ul#resources li ul.sublist li{
  list-style: disc inside none;
  vertical-align: baseline;
  padding: 0;
  margin: 0;
  font-size: 90%;
 font-weight: normal;
}
#content ul#resources li ul.sublist li {
  font-size: 100%;
  list-style-position: outside;
  margin-left: 20px;
}

#content ul#resources li ul.sublist li a:link {
  font-size: 105%;
}


#sidebar{
 float: left;
 width: 17%;
 padding: 0 1% 3% 10%;
 background: transparent;
 margin-top: -15%;
}
#sidebar p{
font: 80% Verdana, Arial, Helvetica, sans-serif;
padding: 2px 0;
margin: 0;
}
#sidebar h2 {
  font: bold 100% verdana, arial, helvetica, sans-serif;
  padding: 4px 0;
  margin: 0;
  color:#9d080d;
}
#sidebar h3 {
  font: bold 90% verdana, arial, helvetica, sans-serif;
  padding: 4px 0;
  margin: 0;
  color: #000;
  font-variant: small-caps
}
/*--beginning of contact form specific--*/
form#contactus {
  padding: 0;
  margin: 0;
}
form#contactus input[type=text]{
 margin: 0 0 .3em;
 width:90%;
 padding: 7px;
 border-radius:5px;
 border:1px solid #9d080d;
 background: #cfe3e2;

}
form#contactus input#subject {
 width: 89%;
}

form#contactus textarea#comments{
width:95%;
padding: 7px;
margin: 0 0 .3em;
border:1px solid #9d080d;
border-radius:5px;
resize:none;
background: #cfe3e2;
}
form#contactus fieldset {
    margin-left: 2em;
}




form#contactus ul {
  font-size: 95%;
  text-align: left;
  padding: 10px;
  margin: 0;
}
form#contactus li {
  padding: 5px
}
.g-recaptcha {
    float: right;
    width:50%;
}

#feedback {
    padding: 40px 0 30px;
   min-height: 55%;
}
p#finalfeedback {
  color: #9d080d;
  font-style: italic;
}
#content p.resourcesPara {
  padding-bottom: 25px;
  padding-top: 20px;
}

h4#feedbacktitle {
  color: #000;
  text-align: center;
  font-variant: small-caps;
}
h5#feedbacksubtitle {
  color: #9d080d;
  text-align: left;
  padding-left: 20px;
}
blockquote {
  font-size: 95%;
  color: #777;
  font-style:italic}
/*--end of contact form specific--*/
/*--end of main content area - beginning of footer area --*/
#footer {
 margin: 0 auto;
 text-align: left;
 font-size: 80%;
 color: #808080;
 background: transparent;
 //*border-bottom: #9d080d 1.3em solid;*//
}
#footer p{
 margin: 0;
 font-size: 70%;
 padding: 10px 0 60px 70px;
}
ul#secnavigation {
 margin: 0;
 padding: 10px 0 0;
 width: 50%;
 color: #808080;
 background: transparent;
 float: right;
 font-size: 80%;
 list-style-type: none;
}
ul#secnavigation li {
  display: inline;
}
ul#secnavigation li a:link, ul#secnavigation li a:visited{
 color: #808080;
 background: transparent;
 text-decoration: none;
 text-align: center;
 }
ul#secnavigation li a:hover{
 color: #9d080d;
 background: transparent;
 text-decoration: underline;
  }
/*--end of footer area --*/

@media (max-width: 600px) {
#wrapper {
 width: 90%;

}
#subwrapper {
  margin: 0 auto;
  padding: 0;
  text-align: left;
  background: transparent url(images/CardinalGhost.png) no-repeat fixed center;
  position: relative;
  background-size: 75%;
  background-position: center;
}
#header {
 background: transparent;
 border-top: #9d080d solid .5em;
 }

img#cardiLogo {
    width: 100%;
}
#subheader {
  padding: 1em 0 0 1em;
}
#primarynav{
 width: 100%;
 float: none;
 background: transparent;
 margin: 0;
 padding: 0;
}
ul#primarynavigation{
font: 110% verdana, arial, helvetica, sans-serif;
 list-style-type: none;
  padding: 1em;
 margin: 0;
 }
ul#primarynavigation li{
 background: transparent;
 padding: 0 20% 0 0;
 margin: .5em;
 border-bottom: .1em #9d080d solid;
}
#content {
 float: none;
 width: 100%;
 text-align: left;
 background: transparent;
 padding: 0;
 margin: 0;

 }
 #content p {
 line-height: 110%;
 margin: 0;
 padding: 15px 10px 7px 10px;
 }
 #content ul.multilists {
 padding: 0 10px 0 25px;
 font-size: 95%;
 }

 #content ul.multilists li{
 line-height: 110%;
 padding: 1px;
 }
#content ul.multilists li ol {
    padding:0 0 0 10px;
}

#content ul.multilists li ol li ul li{
    padding:.1em 0;
    line-height:100%;
}

 #sidebar{
 position: inherit;
 left: 0;
 top: 0;
 width: 100%;
 padding: 0;
 margin: 1em;
 background: transparent;
}
#sidebar p{
font: 80% Verdana, Arial, Helvetica, sans-serif;
padding: 2px 0;
margin: 0;
}
#sidebar h2 {
  font: bold 100% verdana, arial, helvetica, sans-serif;
  padding: 4px 0;
  margin: 0;
  color:#9d080d;
}
#sidebar h3 {
  font: bold 90% verdana, arial, helvetica, sans-serif;
  padding: 4px 0;
  margin: 0;
  color: #000;
  font-variant: small-caps
}
/*--beginning of contact form specific--*/
form#contactus {
  padding: 0;
  margin: 0;
}
#content form#contactus p {
  line-height: 120%;
 margin: 0;
 padding: 0;
 }
form#contactus ul {
  font-size: 95%;
  text-align: left;
  padding: 10px;
  margin: 0;
}
form#contactus li {
  padding: 5px
}
.g-recaptcha {
    float: none;
    width:100%;
}
#feedback {
    padding: 40px 0 30px;
   min-height: 10em;
}
p#finalfeedback {
  color: #9d080d;
  font-style: italic;
}

#content p.resourcesPara {
  padding-bottom: 25px;
  padding-top: 20px;
}
h2#contactForm {
 text-align:left;
}

h4#feedbacktitle {
  color: #000;
  text-align: center;
  font-variant: small-caps;
}
h5#feedbacksubtitle {
  color: #9d080d;
  text-align: left;
  padding-left: 20px;
}
blockquote {
  font-size: 95%;
  color: #777;
  font-style:italic}
/*--end of contact form specific--*/
    }