/* Typography - Garuda is a verdana substitute for Linux users
-------------------------------------------------------------- */
html {  }
body { width: 919px; font-size: 62.5%; color:#020000; margin: 0 auto; padding-top: 34px; background:#fff url(../images/bg/topbar.gif) repeat-x; }
/* scroll down for .fs-1, .fs-2, .fs-3, .fs-4 and .fs-5 */

/* font must also be set for the form elements in order to work correctly */
body, input, select, textarea { font-family: Verdana, Arial, Helvetica, Garuda, Sans-serif; }

h1 { font-size:1.8em; font-family: Georgia, serif; margin-bottom: 15px; font-weight: normal; }
h2 { font-size:2em; font-family: Georgia, serif; margin-bottom: 15px; font-weight: normal;}
h3 { font-size:2.2em; font-family: Georgia, serif;  }
h4, h5, h6 { font-size:1.2em; line-height:1.3;}

p      { font-size:1.1em; margin:0 0 1em; line-height: 1.5;}
    .content p {  max-width: 440px;} 
    #main p {padding-right:10px;}
p.last { margin-bottom:0; }
p.intro { font-weight: bold; }

a, a:active { color: #000; }
a:hover { color: #068CCF; }
a:focus { color: #035176; }

#content ul {max-width: 440px;}


.rss { float:left; padding-left: 20px; background: url(../images/icons/rss.png) no-repeat left center; margin-right: 20px; display:block; line-height: 14px; }
.rss:hover { background: url(../images/icons/rss-hover.png) no-repeat left center; }
.print { float:left; padding-left: 20px; background: url(../images/icons/print.png) no-repeat left center; display:block; line-height: 14px; }
.print:hover { background: url(../images/icons/print-hover.png) no-repeat left center; }
/*.pdf { padding-left: 20px; background: url(../images/icons/acrobat.png) no-repeat left center; display:block; height: 1.5em; }*/
a.external { padding-right:15px; background: url(../images/icons/external.png) no-repeat right center; }
a.external:hover { background: url(../images/icons/external-hover.png) no-repeat right center; }
  a.external span { display:none;}


/* List
-------------------------------------------------------------- */
.content_list { margin-left: 19px; margin-bottom: 1em; }
  .content_list li { font-size: 1.1em; line-height: 1.5; }
    ul.content_list li { list-style: url('../images/bullet.gif'); }
  .content_list li li { list-style: url('../images/bullet-small.gif'); font-size: 1em; margin-left: 12px;}

/* HTML horizontal hr
-------------------------------------------------------------- */
hr { border: 0; height:1px; background-color: #83c4e4; color: #83c4e4; margin: -5px 0 19px 0;}
  

/* Tables
-------------------------------------------------------------- */
table   { margin-bottom: 2em; width: 100%; }
th      { background: #B1C3D4; color: #474E54; }
td      { background: #C6DBEE ; text-align: center; }
tbody td { border-bottom: 1px solid #EEF7FF; }
td.empty { visibility:hidden; }
th,td   { padding:4px 10px 4px 0; }
caption { border-bottom: 1px solid #83c4e4; text-align: left; font-weight: bold; margin-bottom: 8px;}


/* Topbar
-------------------------------------------------------------- */
#topbar {}
	#topbar li { display: inline; padding-right: 4px; margin-right: 1px; border-right: 1px solid #fff; color: #fff; }
  #topbar li.last { border-right: 0; }
    #topbar li a { color: #fff; text-decoration: none; padding: 3px; padding-bottom: 1px; }
    #topbar li a:hover { color: #020000;  }
    #topbar li a:focus { color: #035176;  }
  #header_nav { position: absolute; left: 0; top:0; }
  #service_nav { position: absolute; right: 0; top:0;}


/* Branding
-------------------------------------------------------------- */
  #branding #payoff { position: absolute; bottom: 3px; left: 160px; font-style: italic; font-family: "Times New Roman", serif; font-size: 1.4em; color: #69AADD; font-weight: bold; }


/* Nav is navigation through links to the different hospitals, through use cases via a photo, through various search options and through the breadcrumbs
-------------------------------------------------------------- */

    #nav #main_nav li { float: left; list-style: none;}
      #nav #main_nav li a { font-size:11px; /* PX, OM TEKSTVERGROTEN TE VOORKOMEN */ display:block; background: url(../images/bg/main_nav.png) no-repeat top; width: 130px;  line-height: 29px; padding-left: 7px; text-decoration:none; }
      #nav #main_nav li a:hover, #nav #main_nav li a.current { background: url(../images/bg/main_nav-hover.png) no-repeat top; color: #fff; }
      #nav #main_nav li ul { background: #fff; display: none; padding:7px; background: url(../images/bg/main_nav-layer2.png) bottom no-repeat; width: 123px; }
      #nav #main_nav li.hover ul,
      #nav #main_nav li:hover ul { display:block; } /* selected browsers will, without javascript/.hover-class still display as block */
        #nav #main_nav li ul li { float: none; }
        #nav #main_nav li.hover ul li { background: none; }
          #nav #main_nav li ul li a { font-size:11px; /* PX, OM TEKSTVERGOTEN TE VOORKOMEN */ background-image:none; ; display: inline; line-height: 1.4; width: 123px; padding: 0;}
           #nav #main_nav li ul li a:hover { background: none; color: #0789CB; }
  #nav blockquote { height: 51px; position: absolute; bottom: 17px; right: 100px; background: url(../images/bg/quote.png); padding: 0 85px 0 15px; z-index: 0; }
    #nav blockquote a, a:active { color: #068CCF; }
    #nav blockquote a:hover { color: #035176; }
    #nav blockquote a:focus { color: #000; }
    #nav .speaker { font-size: 1.1em; font-family: Verdana, sans-serif; color: #068CCF; text-align: right; margin-top: 5px; }
    #nav .quote { font-size: 1.9em; font-family: Georgia, serif; color: #068CCF; position: relative; top: -15px; margin-bottom: 0; /* resetting the default for p, which is 1em */ text-align: right; }
    
  #nav #case { width: 680px; height: 133px; position: absolute; top: 30px; left: 0; }
    #nav #case_person { position: absolute; bottom: 0; right:0px; z-index: 50;}
    #nav #case .quote a { text-decoration:none; }

  #nav #quick_search h2 { margin-bottom: 2px; text-transform: lowercase; font-size: 2.2em; }
    #nav #quick_search fieldset {  margin-bottom: 3px; z-index:0;}

  #nav #direct_naar input { width: 220px; height: 13px; padding: 4px 5px; border:0; font-size: 11px; float: left; background: url(../images/bg/quicksearch.gif) no-repeat 0 0; color: #646567;  }
    #nav #direct_naar label { display: none; }
    #nav #direct_naar .search { float: left; background: url(../images/bg/search.png); border:0; width: 20px; height: 20px; text-indent: -9999px;}
    #nav #direct_naar #aandoeningen, #nav #direct_naar #specialismen, #nav #direct_naar #artsen { margin-bottom: 6px; }

  #nav #zoek { margin-top: 7px; }
    #nav #zoek h2 { margin-top:9px; }
    #nav #zoek label { display: none; }
    #nav #zoek input {width: 190px; height: 13px; padding: 4px 5px; border:0; font-size: 10px; float: left; background: url(../images/bg/quicksearch.gif) no-repeat 0 0; color: #646567;   }  
    #nav #zoek input.search { background: url(../images/bg/search.png); border:0; width: 20px; height: 20px; text-indent: -9999px; text-transform: capitalize;  }

    #nav #breadcrumb li { display: inline; background: url(../images/bg/breadcrumb.gif) no-repeat center right; padding-right: 10px; font-size: 0.9em;} 
      #nav #breadcrumb li.last { background: none; }


/* News-agenda
-------------------------------------------------------------- */

#news-agenda ul.tabs { width: 220px; overflow: hidden; position:relative; }
  #news-agenda .tabs li { width: 110px; height: 29px; float: left; list-style: none;  background: url(../images/bg/news-agenda_inactive.gif) no-repeat top left; }
    #news-agenda .tabs li.active { background: url(../images/bg/news-agenda_active.gif) no-repeat; }
      #news-agenda .tabs li.active a { cursor:default; }
      #news-agenda .tabs li.active a:hover, #news-agenda .tabs li.active a:focus { color: #000; }
  #news-agenda .tabs li a { display: block; padding:8px; text-decoration: none; }
#news-agenda .tabsContent { margin-top: 0; border-top: 0;  }
.clearer {clear: both;}

#news-agenda h4 a { text-decoration: none; font-weight: bold; font-size: 0.9em; }
#news_list li, #agenda_list li { list-style-type: none; } 

#news_article_date{float:left;line-height:1.5em;font-size:1.1em;font-style:italic;}

/* Teasers on the homepage 
-------------------------------------------------------------- */
#teasers { width:440px; overflow:hidden;  }
  #teasers_left { width: 215px; float: left; }
  #teasers_right { width: 215px; float: right; }

  .home .teaser .read_more { position: absolute; right: 10px; top : 110px;}
  .home .teaser h3 { font-family: Georgia, serif; font-size: 2.2em; font-weight: normal; line-height: 1.1em; }
  .home .teaser p { margin-top: 10px; }
  .home .teaser .teaser_thumb { width:77px; height: 77px;}
    
  /* Only if there is js, class="hover" is added, so no :hover needed */
.home .teaser.hover { background: #0789cb url('../images/bg/call-to-action-hover.gif') 146px 6px no-repeat; color: #fff; }
  .home .teaser.hover img.teaser_thumb { display:none; }
.js .teaser { cursor:pointer; } /* if there is js, the whole call to action is clickable  */


/* Subnav 
-------------------------------------------------------------- */
.subnav { z-index: 0; width: 220px; margin-right: 19px; margin-bottom: 19px; float:left; clear:left; /* because it will sit under the maincontent if the maincontent is shorter than the navigation */}
  .fixed .subnav { position: absolute; top: 53px; left:0; }
.subnav_title { padding-top:17px; width: 220px; margin-right: 19px; font-size: 1.8em; float: left;}
  .fixed .subnav_title { position: absolute; top: 0; left:0; }
.subnav li { list-style: none; }
.subnav li.first { border-top: 2px solid #068CCF; }
  .subnav li.current a { color: #068CCF; }
    .subnav li.current ul li a { color: #020000; }
    .subnav li.current ul li a:hover { color: #068CCF; }
  .subnav li.open a { background: url(../images/bg/subnav_open.gif) no-repeat center right; }
    .subnav li.open ul li a { background: none; } 
  .subnav li.closed a { background: url(../images/bg/subnav_closed.gif) no-repeat center right; }
    .subnav li.closed ul li a { background: none; }
  .subnav li a { display: block; border-bottom: 1px solid #83C4E4; padding: 3px 0; text-decoration: none; font-size: 1.1em;} 
  .subnav li ul { border-bottom: 1px solid #83C4E4; padding: 3px 0;}
    .subnav li ul li { background: url(../images/bg/subnav_dash.gif) 10px 8px no-repeat;  }
    .subnav li ul li:hover { background: url(../images/bg/subnav_dash-hover.gif) 10px 8px no-repeat;  }    
    .subnav li ul li a { border-bottom: 0; padding: 1px 0 1px 20px; }


/*  Content
-------------------------------------------------------------- */

#maincontent h3 { font-size: 1.1em; font-family: Verdana, Arial, Helvetica, Garuda, Sans-serif; font-weight: bold; }
	#maincontent h3 a { text-decoration:none; }
	#maincontent h3 a:hover { text-decoration: underline; }

.news_item { list-style: none; } 
.date { font-style: italic;}
 
.linklist { margin: 1em 0; }
.linklist li { list-style: none; font-size: 1.1em; line-height: 1.4; }

.results_list li { list-style: none; }
.attached { position: relative; top: -10px; }


#maincontent .content_options { overflow: hidden; height: 40px; margin-right: 20px;position:absolute;right:0px; }
  .content_options li { display: inline; }
    .content_options li a { text-transform: lowercase; text-decoration: none; } 
#aside .content_options { margin-right: 0; }
    
#wide_main { float: left; width: 643px; }

.photo_small { float:right; margin-left: 19px; margin-bottom: 10px; }
    .photo_small_right { float:right; margin-left: 19px;}
    .photo_small_left  { float:left; margin-right: 19px;}
    .photo_small_center {display: block; margin-left: auto; margin-right: auto; border: none; }
    .photo_small_clear {}
        .nocaption{margin-bottom: 10px;}

.photo_desc { font-style: italic;margin:0; }
.photo_desc-title { display:inline; font-size: 0.9em; color: #068CCF; font-style:normal;  font-weight: bold; text-transform: uppercase; }

#aside {}
#aside h3 { border-top: 2px solid #068CCF; border-bottom: 1px solid #068CCF; padding: 2px 0; font-size:1em; }
#aside h3.search { border-bottom:0; }
.aside_list { margin-bottom: 20px; clear: both; font-size: 1.1em; }
  .aside_list li { list-style: none; }
  .aside_list li a  { display: block; border-bottom: 1px solid #83C4E4; padding: 2px 0; text-decoration: none; }
  .aside_list em { color:#000; font-weight:bold; }
  .aside_list .open-more, .aside_list .close-more { display:block; margin: 0 auto; padding: 2px 94px; cursor:pointer;}

.multipage_nav a { margin-right: 0.9em; text-decoration: none; }  
.multipage_nav a:hover { text-decoration: underline; }
.multipage_nav a.current { font-weight: bold; }


/* Agenda
------------------------------------------------------------------------ */  
.agenda_month { font-size: 1.2em; font-family: Verdana, Arial, Helvetica, Garuda, Sans-serif; color: #068CCF; padding-top: 2px; border-top: 1px solid #068CCF; margin-top:20px; }
.agenda_list { margin-bottom: 40px; }
  .agenda_list li { list-style: none; }  


/* Alphatical overview
------------------------------------------------------------------------ */
.alphabet { color: #aaa; width:660px; }
.alphabetical { width: 207px; float: left; margin: 1em 0; }
  .alphabetical li { list-style:none; margin-bottom: 19px;  }
  .alphabetical li li { margin-bottom: 0; font-size: 1.1em; line-height: 1.4; }
  .alphabetical li a { text-decoration:none; }
  .alphabetical li a:hover { text-decoration: underline; }
.alphabetical_c1, .alphabetical_c2 { margin-right: 19px; } 

.hideColumn {display: none;}
.showColumn {} 


/* Alphatical overview
------------------------------------------------------------------------ */
#sitemap li { list-style:none; font-size: 1.1em; line-height: 1.5; font-weight: bold; }
  #sitemap li a { text-decoration: none;}
  #sitemap li li { margin-left: 10px; font-size: 1em; font-style: normal; font-weight: normal;  }
    #sitemap li li a { text-decoration: underline; } 
    #sitemap li li li { font-size: 1em; }
  #sitemap ol { margin-bottom: 19px; }
    #sitemap ol ol { margin-bottom: 0; }


/* Text sizing
-------------------------------------------------------------- */

body.fs-1 { font-size:52.5%; }
body.fs-2 { font-size:62.5%; } /* .fs-2 is default */
body.fs-3 { font-size:75%; }
  body.fs-3 #nav blockquote .quote { top: -25px; }
body.fs-4 { font-size:90%; }
 body.fs-4 #branding #payoff { font-size: 145%; }
  body.fs-4 #nav blockquote { font-size:85% }
	body.fs-4 #nav blockquote .quote { top: -25px; }
body.fs-5 { font-size:110%; }
  body.fs-5 #branding #payoff { font-size: 122%; }
  body.fs-5 #nav blockquote { font-size: 70%; }
    body.fs-5 #nav blockquote .quote { top:-25px; }
    body.fs-5 #teasers { font-size: 82%;}