/*------------------------------------------------------------------------------
  DESCRIPTION: Multimedia page CSS file for SDCCD Newscenter web site.
               This goes on every article page. This defines the different 
               CSS elements on the multimedia page..
  
  AUTHOR:      David Joynson
  
  HISTORY:     20150414 -  WO 3089113 DJ
------------------------------------------------------------------------------*/
/*--- Elements ---*/
h3 a {
  color: #008996;
  text-decoration: none;
}
h3 a:hover {
  color: #FCB040;
}
video:-webkit-full-screen {
  background-color: #000000;
}
video:-moz-full-screen {
  background-color: #000000;
}
video:-ms-fullscreen {
  background-color: #000000;
}
video:fullscreen {
  background-color: #000000;
}

/*--- Classes ---*/
h2.mmh2 {
   margin-bottom: 13px;
}
.mmdate {
  float: left;
  font-size: 8pt;
  height: 20px;
}
.mmdownload, .videodownload {
  float: right;
  font-size: 8pt;
  height: 20px;
  font-style: italic;
  font-weight: bold;
  margin-right: 10px;
}
.mmdownload a, .videodownload a {
  color: #008996;
}
.mmdownload  a:hover, .videodownload a:hover {
  color: #FCB040;
}
.mmmorevidsbtn {
  width: 355px;
  height: 20px;
  margin-bottom: 30px;
}
.mmmorevidsbtn a {
  width: 152px;
  height: 20px;
}
.mmmorevidsbtn a img {
  float: left;
  height: 18px;
  width: 152px;
}
.mmitembox {
  margin-bottom: 20px;
  width: 355px;
  min-height: 254px;
  overflow: auto;
  
}
.mmitemtitle {
  float: left;
  color: #008996;
  margin-bottom: 5px;
  font-weight: bold;
  width: 100%;
  min-height: 18px;
}
.mmvideo, .mmphoto {
  float: left;
  width: 355px;
  height: 200px;
  margin: 0px auto 0px auto;
  position: relative;
  overflow: hidden;
  /*background-color: #00ffff;*/
}
.mmwrap {
  width: 355px;
  float: left;
  height: 200px;
  text-align: center;
}
.phogalcap {
  float: left;
  width: 150px;
  height: 100px;
}
.phogalitem {
  width: 140px;
  height: 100px;
  float: left;
/*  border: 1px solid black;*/
  text-align: center;
}
.phogalitem img {
  margin: auto;
}
.phogalwrap{
  width: 140px;
  height: 150px;
  float: left;
}
.videodate {
  float: left;
  font-size: 8pt;
  height: 20px;
  margin-left: 10px;
}
.videodesc {
  float: left;
  margin-left: 10px;
  max-height: 150px;
  min-height: 20px;
  overflow: hidden;
  width: 370px;
}
.videoitembox {
  margin-bottom: 20px;
  width: 735px;
  min-height: 200px;
  overflow: auto;
  /*background-color: #dddddd;*/
}
.videoitemtitle {
  float: left;
  color: #008996;
  margin-bottom: 5px;
  margin-left: 10px;
  font-weight: bold;
  width: 370px;
  min-height: 18px;
}
.videowrap {
  width: 355px;
  float: left;
  height: 200px;
  text-align: center;
}

/*--- IDs ---*/
#phogaltitle {
  color: #008996;
  font-family: Arial,Helvetica,sans-serif;
  font-size: 20pt;
  font-weight: bold;
  min-height: 50px;
  margin-bottom: 15px;
/*  padding-left: 10px;*/
  max-width: 585px;
}
#divide {
  float: left;
  width: 1px;
  min-height: 100px;
  background-color: #000000;
  margin: 0px 5px 0px 5px;
}
#flikr {
  margin: 0px auto 10px auto; 
  text-align: center;
}
#flikr a {
  color: #008996;
  text-decoration: none;
  font-weight: bold;
}
#flikr a:hover {
  color: #FCB040;
}
#gallerywrap {
  max-width: 565px;
}
#leftcolumn {
  float: left;
  width: 355px;
  min-height: 100px;
  padding: 0px 5px 0px 5px;
/*  overflow: auto;*/
  
  /*background-color: #0066ff;*/
}
#rightcolumn {
  float: left;
  width: 359px;
  min-height: 100px;
  padding: 0px 5px 0px 0px;
  overflow: auto;
  
  /*background-color: #add8e6;*/
}