/*
Author: Office of Advancement / Web Communications
Description: HealthLeader Website Cascading Style Sheet.

healthLeaderStyles.css

*/

/* reset styles
----------------*/
div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  vertical-align: baseline;
  background: transparent; }

/* display html5 elements as block elements
--------------------------------------------*/
article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary {
  display: block;
  }

/* global styles
-----------------*/

::-moz-selection { background: #BD4F19; color: #fff; text-shadow: none; }

::-webkit-selection  { background: #BD4F19; color: #fff; text-shadow: none;}

::selection { background: #BD4F19; color: #fff; text-shadow: none; }


html {
  overflow-y: scroll;
  background: #FFF;
  }

body {
  font: normal 100% Arial, Verdana, Geneva, sans-serif;
  color: #334;
  line-height: 1.3;
  margin: 0;
  position: relative;
  }

h1 {
  font-size: 2em;
  }
h2 {
  font-size: 1.5em;
  }
h3 {
  font-size: 1.3em;
  }
h4 {
  font-size: 1.2em;
  }
h5 {
  font-size: 1.15em;
  }
h6 {
  font-size: 1em;
  }
h1, h2, h3, h4, h5, h6 {
  color: #332B1E;
  font-family: Verdana, Geneva, sans-serif;
  font-weight: normal;
  margin: .8em 0;
  }

p {
  font-size: .9em;
  margin: 1em 0;
  }

a {
  /*color: #069;*/
  color:#007EA3;
  text-decoration: none;
  }
a:hover {
  text-decoration: underline;
  }

ul li, ol li {
  margin: 0 0 .8em 3em;
  font-size:0.9em;
  line-height:1.5em;
  }

dt {
  font-weight: bold;
  margin: .5em 0;
  }
dd {
  margin: 0 0 .5em;
  }

pre, code {
  font: normal normal normal 13px/normal consolas, 'andale mono', 'lucida console', monospace;
  }

small {
  font-size: .8em;
  display: block;
  }

figure {
  border: 1px solid #CCC;
  display: inline-block;
  margin: .5em;
  padding: .2em;
  padding-bottom: 0;
  }
figure img {
  width: 100%;
  }
figcaption {
  font-size: 95%;
  margin-bottom: -.3em;
  }

img {
  max-width: 100%;
  }

blockquote, q {
  quotes: none;
  }
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
  }
nav ul {
  list-style: none;
  }
ins {
  text-decoration: none;
  color: #000;
  background-color: #FF9;
  }
mark {
  font-style: italic;
  font-weight: bold;
  color: #000;
  background-color: #FF9;
  }
del {
  text-decoration: line-through;
  }
abbr[title], dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
  }
table {
  border-collapse: collapse;
  border-spacing: 0;
  }
hr {
  margin: 1em 0;
  padding: 0;
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #CCC;
  clear: both;
  }
input, select {
  vertical-align: middle;
  }
.story-photo {
  border: 1px solid #CCC;
  display: inline-block;
  margin: .5em;
  padding: .2em;
  padding-bottom: 0;
  vertical-align: baseline;
  float:right;
  }
.mast {font-size:0.7em;margin-top:0px;}
  }

/* target template styles
--------------------------*/
body.home {}
body.post {}

/* .content-wrapper styles
---------------------------*/
.content-wrapper {
  max-width: 62em;
  margin: 0 auto;
  padding: 0 .5em;
  }

/* .header styles
------------------*/
.header {
  border-bottom: 1px solid #CCC;
  position: relative;
  overflow: auto;
  }
.header h1 {
  font-size: 2.7em;
  font-style: italic;
  font-weight: normal;
  margin: 0;
  }
.header h1 a {
  color: #BD4F19;
  }
.header h1 a span {
  font-style: normal;
  text-transform: uppercase;
  color: #000;
  }
.header h1 a:hover, .header h1 a:hover span {
  text-decoration: none;
  color: #007EA3;
  }
.header h2 {
  font: normal .7em Arial, Helvetica, sans-serif;
  border-bottom: 1px solid #CCC;
  line-height: 140%;
  margin: -.7em 0 .5em;
  padding-bottom: 1em;
  }

.header p.language{float:right;font-size:0.7em; margin:1em 0.7em 0 0;}

.search {
  margin: .48em .2em .2em;
  position: relative;
  z-index: 999;
  width: 0%;
  }
.search label {
  display: none;
  }
.search #english-search-box {
  padding: .2em .3em .1em 1.7em;
  }

.search .button {
  text-indent: -999em;
  border: 0;
  margin: .5em .3em;
  position: absolute;
  top: 0;
  left: 0;
  cursor: pointer;
  height: 1.2em;
  width: 1.5em;
  background: #FFF url(/index/gfx/search-logo.jpg) .2em .1em no-repeat;
  }
.button, .subscribe #cc-optin, .spanish-subscrice #cc-optin {
  -webkit-appearance: none;
  -webkit-border-radius: 0;
  }
.subscribe, .spanish-subscribe {display: none;}

.subscribe label, .spanish-subscribe label{
  font-size: .9em;
  font-weight: bold;
  display: block;
  }
 .subscribe #cc-optin, .spanish-subscribe #cc-optin{
  padding: .55em;
  }
.subscribe .button, .spanish-subscribe .button{
  border: 0;
  border-radius: 0;
  margin: 0;
  cursor: pointer;
  }

/* main navigation styles
------------------------------------------*/
#nav-wrap { margin-top: 20px; }

/* menu icon */
#menu-icon { display: none; /* hide menu icon initially */ }

#main-nav, #main-nav li { margin: 0; padding: 0; }

#main-nav li { list-style: none; float: left; }

/* nav link */

#main-nav a { font-size: 1.4em; font-weight:normal; padding: 7px 15px; display: block; color: #666; background: #fff; border-right: 1px solid #ccc; margin-bottom:1em;}

#main-nav .last a { border-right: none; }

#main-nav a:hover { text-decoration:none; color:#333;}

/* nav dropdown */

#main-nav ul { background: #fff;  position: absolute; border: solid 1px #ccc; display: none; /* hide dropdown */ width: 200px; }

#main-nav ul li { float: none; margin: 0; padding: 0; }

#main-nav li:hover > ul { display: block; /* show dropdown on hover */ }

/* pagination styles */
#pagination {list-style: none; float: left; display: inline;}


/* form styles */
.msg {
    background-color: #EFEFEF;
    background-image: url("/dotAsset/3426016.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    border: 1px solid #E2E2E2;
    font-family: Verdana;
    font-size: 12px;
    line-height: 1.4em;
    margin-bottom: 15px;
    padding: 10px 10px 10px 34px;
}


/* .content styles
-------------------*/
.content {
  }

/* .article styles
-------------------*/
.article {
  border-bottom: 1px solid #CCC;
  margin: .5em 0 1em;
  }
.article a:link {text-decoration:underline;}
.article h1 {
  font-weight: normal;
  color: #BD4F19;
  margin: 0 0 5px;
  letter-spacing:-1px;
  }
.article h1 a {color: #BD4F19;text-decoration:none !important;}
.article hgroup h2 {
  font-size: 1.2em;
  font-weight: normal;
  letter-spacing:-1px;
  color: #666;
  margin: -.2em 0 0;
  letter-spacing:-1px;
  }
.article h2 {
  color: #000;
  line-height: 130%;
  margin: 1em 0 0;
  letter-spacing:-1px;
  }
.article h4 {
  font-size: .7em;
  }
.article aside {
  border: 1px solid #CCC;
  padding: .5em;
  background: #EAEAEA;
  }
.article aside h2 {
  margin: 0 0 .5em;
  }
.article ul, .article ol {
  font-size: 1em;
  margin: 0 0 .5em;
  }
.article aside ul, .article aside ol {
  font-size: .9em;
  margin: 0 0 .5em;
  }
.article aside ul ul, .article aside ol ol {
  margin: 0 0 0 2em;
  }
.byline {
  font-size: .7em;
  color: #555;
  }
span.amp {
   font-family:Baskerville,"Goudy Old Style","Palatino","Book Antiqua",serif;
   font-size:110%;
   font-style:italic;
}
.pullquote {
    float: right;
    font-family: Georgia,"Times New Roman",Times,serif;
    font-size: 1.4em;
    font-weight: normal;
    letter-spacing: -1px;
    margin-left: 1em;
    width: 300px;
}
.headerLARGE {
  font-family: "Times New Roman", Times, serif;
  font-size: 1.7em;
  padding: 0px;
  margin: 0px;
  line-height: 1em;
}

#healthtopic
  {
  float: left;
  width: 195px;
  font-weight: bold;
  padding: 0px;
  margin: 0px 20px 0px 0px;
  height: 40px;
 }
.line {
  border-top: 1px solid #CCCCCC;
  padding-top: 0px;
  padding-right: 0;
  padding-bottom: 0px;
  padding-left: 0;
  margin-right: 0px;
  margin-bottom: 0px;
  margin-left: 0px;
  height: 10px;
  margin-top: 0px;
}

.videoWrapper {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 */
  padding-top: 25px;
  height: 0;
}
.videoWrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* .healthtopics-a2z
------------------*/
.healthtopicsa2z ul{margin:0px; background-color:#fff;}
.healthtopicsa2z li{list-style-type:none; margin:0px;}

/* blue nav bar*/
#socialNav { display: block; margin-top:-13px; margin-bottom: 1em; height:45px; width:100%; background: #007293; /* Show a solid color for older browsers */ background: -moz-linear-gradient(#007293, #006380); background: -o-linear-gradient(#007293, #006380); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#007293), to(#006380)); /* Older webkit syntax */ background: -webkit-linear-gradient(#007EA4, #006380); color: #373737; }

/*top social media navigation*/

#socialNav ul { font-size: .8em; list-style: none; margin: 1em 1em; padding: .5em 0; text-align: right; white-space: nowrap; }

#socialNav li { display: inline; margin: 0; }

#socialNav ul a { text-decoration: none; padding: 2em 1em 1em 1.5em; color: #80BFD1; padding-left: 27px; text-shadow: 1px 1px 1px #00475B; }

#socialNav ul li a:hover { color: #FFFFFF; }

* html #mainNav ul li { margin: 0; }

#socialNav ul li #gs { display: inline; margin: 1em 0 0 5em; }

/*icons for social media navigation*/

#itunes a { background: url(/index/gfx/apple-icon.png) left 18px no-repeat; }

#itunes a:hover { background: url(/index/gfx/apple-icon-over.png) left 18px no-repeat; }

#facebook a { background: url(/index/gfx/facebook-icon.png) left 18px no-repeat; }

#facebook a:hover { background: url(/index/gfx/facebook-icon-over.png) left 18px no-repeat; }

#twitter a { background: url(/index/gfx/twitter-icon.png) left 18px no-repeat; }

#twitter a:hover { background: url(/index/gfx/twitter-icon-over.png) left 18px no-repeat; }

/*search styles*/

:focus {/* remember to define focus styles! */ outline: 0; }

.bluesearch { padding:5px 15px 5px 30px; background: url(/index/gfx/search.png) no-repeat 8px 6px; }

.rounded { border-radius:10px; -moz-border-radius:10px; -webkit-border-radius:10px; }

#gs input[type=text]  { border:1px solid #007293; background-color:#D1E9EF; color:#007293; }
#gs input[type=text]:focus, textarea:focus { background-color: #fff; -webkit-transition-duration: 400ms; -webkit-transition-property: width, background; -webkit-transition-timing-function: ease; -moz-transition-duration: 400ms; -moz-transition-property: width, background; -moz-transition-timing-function: ease; -o-transition-duration: 400ms; -o-transition-property: width, background; -o-transition-timing-function: ease; width:20em; }

#search input#searchsubmit, #btnG { display: none; }


/*end  */

/* .healthtopics a-z
-----------------*/
.healthtopics{
  padding: 1em 4em 1em 0;
  display:block;
  border-bottom: 1px solid #ccc;
}

.healthtopics h3
{font-size:1em; font-weight:bold;margin:0;padding:0;}

.healthtopics p {margin:0;padding:0 0 1em 0;}
.healthtopics p a.readmore {background-color:#069; padding:0.5em; color:#fff; font-size:0.75em;}


/* .recent-stories styles
-------------------------*/
.recent-stories {
  border-bottom: 1px solid #CCC;
  }
.recent-stories h1 {
  font-size: 1.3em;
  font-weight: normal;
  margin: .3em 0 .5em;
  letter-spacing:-1px;  
}
.recent-stories h2 {
  font-size: 0.8em;
  font-weight:bold;
  }
.recent-stories article h1 {
  font-size: 1.1em;
  font-weight: normal;
  margin: 0 0 -.5em;
  }
.recent-stories article p {
  font-size: .8em;
}
.recent-stories article {
  border-bottom: 1px dashed #999;
  margin-bottom: .8em;
  }
.recent-stories article:last-child {
  border: 0;
  }
.recent-stories figure {
  float: right;
  margin: .5em;
  }

/* .extras styles
------------------*/
.extras a {
  font-size: .8em;
  text-decoration:underline;
  }
.extras dl {
  margin: 0 0 1em 0;
  }
.extras dt {
  font-size: .9em;
  color: #333;
  border-bottom: 3px solid #007EA3;
  padding: .3em;
  background-color: #EAEAEA;
  }
.extras dd {
  font-size: .8em;
  border-bottom: 1px solid #CCC;
  padding: 0;
  }
.extras dl p.source{
  font-size: .7em;
  }
.extras dd a {
  font-size: inherit;
  }

.follow-us {
  display: block;
  overflow: auto;
  }
.follow-us dd {
  border-bottom: 0;
  float: left;
  padding: 0 1em 0 0;
  }
.follow-us span {
  display: none;
  }
.tweet{
  border-bottom: 1px dashed #ccc !important;
  font-size: .7em !important;
  padding: 0 0 1.5em 0 !important;
}


/* .footer styles
------------------*/
.footer {
  font-size: .8em;
  }
.footer p {
  font-size: .85em;
  }
.footer li {
  list-style-type: none;
  margin: 0;
  padding: .25em 0;
  }
.footer li a {
  display: block;
  }
.footer a:hover {
  color: #000;
  text-decoration: none;
  }
.footer figure {
  margin-bottom: 1em;
  padding: .3em;
  }
.footer figure {
  border: 0;
  margin: .8em 0 0;
  padding: 0;
  }
.footer figure img {
  float: left;
  margin: .3em .5em .3em 0;
  width: auto;
  }
.footer p.hon {text-align:center;}

/* media queries styles
------------------------*/

/* styles for viewport size 320px
----------------------------------*/
@media screen and (min-width: 320px) {

.float-right {
  float: right;
  margin: .5em 0 .5em .5em;
  width:40%;
}
.float-left {
  float: left;
  margin: .5em .5em .5em 0;
  width:40%;
  }
#socialNav span { display:none; }

#gs input[type=text] { width:6em; }

}

/* styles for viewport size 420px
----------------------------------*/
@media screen and (min-width: 420px) {
.header p.language{margin:1em 0.7em 0 0;}

.float-left {
  float: left;
  margin: .5em .5em .5em 0;
  width:40%;
  }
.article .image {
    float: right;
}  
.article .imageleft {
    float: left;
}
.article .spanishimage {
    float: left;
    margin-top:.6em;
} 
.recent-stories figure {float:none; margin:0.5em;}
}

@media screen and (max-width: 600px) {

.header { overflow: visible; }  

/* nav-wrap */
#nav-wrap { position: relative; }

/* menu icon */
#menu-icon { color: #fff; font-weight: bold; height: 30px; background: #006380 url(/index/gfx/menu-icon-white.png) no-repeat 10px center; padding: 8px 10px 0 42px; cursor: pointer; display: block; /* show menu icon */ }

#menu-icon:hover {  background-color: #007293; }

#menu-icon.active { background-color: #007293; }
  
/* main nav */

#main-nav { color: #fff; clear: both; position: absolute; top: 38px; width: 100%; background: #006684; display: none; /* visibility will be toggled with jquery */ }

#main-nav li { clear: both; float: none; margin: 0; }

#main-nav a, #main-nav ul a { font: inherit; background: none; display: inline; color: #FFF; border: none; }

#main-nav a:hover, #main-nav ul a:hover { background-color:#00485E; color: #FFF; }
  
/* dropdown */

#main-nav ul { width: auto; position: static; display: block; border: none; background: inherit; }

#main-nav li a { display:block; padding:.2em 1em; }

}
 @media screen and (min-width: 600px) {

  /* ensure #main-nav is visible on desktop version */
#main-nav { display: block !important; }

}

/* styles for viewport size 780px +
------------------------------------*/
@media screen and (min-width: 780px) {

.header {margin: 1em 0 1em 0;}

.header p.language{margin:7em 0.7em 0 0;}
hgroup {margin:1em 0 1em 0;border-bottom: 1px solid #ccc;}

.search {
  float: right;
  margin-top: .3em;
  width: auto;
  }

.search .button {
  left: .1em;
  }

.subscribe, .spanish-subscribe {
  display: block;
  position: absolute;
  top: 1.8em;
  right: .5em;
  width: 70px;
  }
.subscribe label, .spanish-subscribe label{
  font: bold .8em arial;
  color: #000;
  margin: .15em .5em 0 -27em;
  position: absolute;
  }
.subscribe #cc-optin, .spanish-subscribe #cc-optin {
  font-size: .7em;
  color: #555;
  border: 1px solid #CCC;
  -webkit-box-shadow: 2px 2px 3px #CCC;
  box-shadow: 2px 2px 3px #CCC;
  padding: 0 0 0 .5em;
  position: absolute;
  top: 0;
  right: 6.1em;
  z-index: 1;
  height: 26px;
  width: 250%;
  }
.subscribe .button, .spanish-subscribe .button{
  font-family: Arial;
  font-weight: bold;
  color: #FFF;
  border-left: 1px solid #AAA;
  -webkit-box-shadow: 1px 3px 3px #CCC;
  box-shadow: 1px 3px 3px #CCC;
  position: relative;
  top: 0;
  right: 0;
  z-index: 1;
  height: 27px;
  background: orange;
  }
.spanish-subscribe .button{
  font-family: Arial;
  font-size:.6em;
  font-weight: bold;
  color: #FFF;
  border-left: 1px solid #AAA;
  -webkit-box-shadow: 1px 3px 3px #CCC;
  box-shadow: 1px 3px 3px #CCC;
  position: relative;
  top: 0;
  right: 0;
  z-index: 1;
  height: 27px;
  background: orange;
  }

.content {
  position: relative;
  }
.article {
  border-bottom: 0;
  margin-right: .5em;
  float: left;
  width: 61.6%;
  }
.article .image {
  float: right;
  }
.recent-stories {
  border-bottom: 0;
  border-left: 1px solid #CCC;
  float: left;
  margin-top: .5em;
  padding-left: 1em;
  width: 35%;
  }
.extras {
  border-top: 1px solid #CCC;
  border-bottom: 1px solid #CCC;
  padding: 1em 0;
  position: relative;
  clear: both;
  }
.follow-us,
.extras dl:nth-child(2) {
  width: 35%;
  }
.follow-us dd {
  float: none;
  }
.follow-us span {
  display: inline;
  position: absolute;
  margin: .5em;
  }
.extras dl:nth-child(3) {
  /*border-left: 1px solid #CCC;*/
  /*padding-left: 1em;*/
  /*position: absolute;*/
  top: 1em;
  right: 0;
  width: 90%;
  }

.footer {
  margin: 1em 0 0;
  position: relative;
  height: 11em;
  }
.footer ul {
  text-align: center;
  display: block;
  }
.footer li {
  font-size: .9em;
  display: inline;
  }
.footer li a {
  display: inline;
  margin: 0 1em;
  }
.footer figure {
  position: absolute;
  bottom: 1.8em;
  width: 70%;
  }
.footer p.hon {
  position: relative;}

.footer p {
  position: absolute;
  bottom: 0;
  }
.uthealth-logo {
  position: absolute;
  bottom: 2em;
  right: 1em;
  }

/* .post styles
----------------*/
.post .article {
  width: 71.5%;
  }
.post .extras {
  border: 0;
  border-left: 1px solid #CCC;
  float: left;
  margin: .5em 0 0;
  padding: 0 0 0 1em;
  clear: right;
  width: 25%;
  }
.post .follow-us,
.post .extras dl:nth-child(2) {
  width: auto;
  }
.post .extras dd img {
  float: right;
  padding: 0 0 .5em .5em;
  }
.post .extras dd:nth-child(2) {
  border: 0;
  padding-bottom: 1em;
  }
.post .extras dd:last-child {
  border: 0;
  }
.post .extras dd {
  border: 0;
  }
.post .footer {
  clear: both;
  }
  }

/* styles for viewport size 960px +
------------------------------------*/
@media screen and (min-width: 960px) {

.header p.language{margin:7em 0.7em 0 0;}

.content {
  border-bottom: 1px solid #CCC;
  display: inline-block;
  padding-bottom: 1em;
  }
.article {
  float: left;
  width: 58%;
  }
.recent-stories {
  float: left;
  padding: 0 .8em;
  width: 20%;
  }
.recent-stories h1 {
  display: none;
  }
.recent-stories figure {
  float:none;
  margin: .5em;
  }
.extras {
  float: left;
  border: 0;
  border-left: 1px solid #CCC;
  margin: .6em 0 0;
  padding: .4em 0 0 1em;
  position: relative;
  clear: right;
  }

.extras dl:nth-child(3) {
  border-left: 0;
  padding-left: 0;
  position: relative;
  width: auto;
  margin-bottom: 2.5em;
  }
.article aside h2 {font-size: 1.2em;}

.article aside p {font-size: 0.8em;}

.follow-us, .extras dl:nth-child(2) {
 width: auto;
}
.follow-us dd {
 float: left;
}
.follow-us span {
 display: none;
}
 .footer {
 clear: both;
}
 #socialNav span {
display:inline;
}

#gs input[type=text] { width:10em; }

.footer {
  clear: both;
  }
}
.skip {
  font: bold 10px Arial, Helvetica, sans-serif;
  color: #FFF;
  float: left;
  margin-left: -100px;
  padding: 0 3px 3px 3px;
  background: #930;
  }
.skip:hover {
  background: #CCC;
  }