@import url(../../css/common.css);
@import url(/css/lightbox.css);
@import url(../../css/common_sm.css);

#article h3 {
  clear: right;
}

#article ul {
  margin-bottom: 1em !important;
}

#article .image a img {
  border-style: solid;
  border-width: 3px;
}

#article .image a:link img,
#article .image a:visited img {
  border-color: #fff;
}

#article .image a:hover img,
#article .image a:active img {
  border-color: #f99;
}

#fresheyepedia {
  clear: both;
  margin-top: 1.2em;
}

@media print {
  #fresheyepedia {
    display: none;
  }
}

#article p span.caption {
  display: block;
  color: #111;
  font-size: 90%;
  text-indent: 0;
  padding-left: .5em;
  border-left: double 3px #778;
  margin-left: 2.2223em; margin-bottom: 1.5em;
}

@media (max-width: 767px) {
	#main {
		margin: 10px 0 0;
	}
	#main h1 {
		border-width: 0;
		font-size: 14pt;
		margin: 0 0 10px;
		padding: 0 8px;
	}
	#main #article h1 {
		padding: 0;
	}
	#webservices ul {
		margin: 0 0 10px; 
		padding: 0;
		font-size: middle;
		text-align: left;
	}
	#webservices ul li {
		margin-left: 8px;
	}
	#webservices ul li:first-child {
		margin-left: 0;
	}
	#summary {
		padding: 0 8px;
	}
	#article {
		margin: 0;
		padding: 0 8px;
	}
	#article h2 {
		background-color: transparent;
		font-size: 100%;
		color: #222;
		margin: 0.5rem 0 0; padding: 0;
	}
	#article img {
		max-width: 100%; height: auto;
	}
	#article p span.caption {
		border-left: none;
		margin: 0;
		padding: 10px;
		background-color: #f3f3f3;
	}
	#article ul {
		padding-left: 1em;
	}
	#article dd {
		margin-left: 1em;
	}
	#article dd + dt,
	#article dt + dt {
		margin-top: .5em;
	}
	#article dt {
		font-weight: bold;
		color: #222;
	}
	#fresheyepedia {
		display: none;
	}
	#appendix {
		padding: 0 8px;
		border: none;
	}
	#appendix h2 {
		margin: 0 0 10px;
		padding: 4px 0 0;
		color: #222;
		background-color: transparent;
		font-size: 100%;
		border-bottom: 1px solid #ccc;
	}
	#appendix ul {
		margin: 0 0 10px;
		padding: 0;
	}
	#appendix ul li {
		display: block;
		margin: 0 0 0.3em;
	}
}