
/* Media Photos */
.mp, .mp-wrapper, .mp-photo{
  position: relative;
  width: 100%;
  height: 450px;
}
.mp{
  background-color: #000;
}
.mp-wrapper{
  overflow: hidden;
}
.mp-categories{
  width: 100%;
  min-height: 120px;
  position: relative;
  margin: 0;
  z-index: 500;
  background: transparent url("../images/mp-background.png");
  overflow: visible;
  left: 0;
  top: 0;
}
.mp-photo{
  position: absolute;
  left: 0;
  top: 0;
  height: 450px;
  overflow: hidden;
  z-index: 10;
}
.mp-photo img{
  position: absolute;
  left: 0;
  top: 0;
}
.mp-photoinfo{
  width: 90%;
  min-height: 20px;
  position: absolute;
  top: 0;
  left: 5%;
  /*border: 1px solid blue;*/
}
.mp-toolbar{
  width: 100%;
  height: 80px;
  position: absolute;
  left: 0;
  bottom: 0;
  /*border: 1px solid green;*/
}
.mp-thumbs{
  width: 700px;
  left: 10px;
  top: 5px;
  position: absolute;
  /*border: 1px solid gray;*/
  overflow: hidden;
}
.mp-thumbs, .mp-thumbs .mp-thumbs-left, .mp-thumbs .mp-thumbs-right,
.mp-thumbs .mp-thumbs-items, .mp-thumbs .mp-thumbs-wrapper{
  height: 60px;
}
.mp-thumbs .mp-thumbs-left, .mp-thumbs .mp-thumbs-right{
  width: 32px;
  float: left;
  cursor: pointer;
  /*background-color: #333;*/
}
.mp-thumbs .mp-thumbs-left a, .mp-thumbs .mp-thumbs-right a{
  display: block;
  width: 32px;
  height: 32px;
  background-image: url("../images/control-bar.png");
  background-repeat: no-repeat;
  cursor: pointer;
  text-indent: -9999px;
  margin-top: 14px;
}
.mp-thumbs-left a{
  background-position: 0 -256px;
}
.mp-thumbs-right a{
  background-position: 0 -288px;
}
.mp-thumbs-left a.disable, .mp-thumbs-left a.disable:hover{
  background-position: -32px -256px;
  cursor: default;
}
.mp-thumbs-right a.disable, .mp-thumbs-right a.disable:hover{
  background-position: -32px -288px;
  cursor: default;
}

.mp-thumbs .mp-thumbs-items{
  width: 636px;
  float: left;
  position: relative;
  overflow: hidden;
}
.mp-thumbs .mp-thumbs-wrapper{
  width: 2000em;
}
.mp-thumbs .mp-thumb{
  float: left;
  padding: 5px;
  margin-right: 10px;
  cursor: pointer;

  opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
}
.mp-thumbs .mp-thumb-current{
  opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
}
.mp-thumbs .mp-thumb img{
  max-width: 50px;
  max-height: 50px;
  border: 1px solid #fff;
}

.mp-loader{
  position: absolute;
  width: 48px;
  height: 48px;
  left: 50%;
  top: 50%;
  margin-left: -24px;
  margin-top: -24px;
  background: transparent url("../images/mc-loader.png") no-repeat 0 0;
}

/**
 * CONTROL BAR
 */
.mp-buttons{
  position: absolute;
/*  left: 720px;
  top:   30px;*/
}
.mp-buttons ul{
  margin: 0;
  padding: 0;
  padding-right: 10px;
  list-style: none;
}
.mp-buttons ul li{
  display: block;
  float: left;
}
.mp-buttons ul li a{
  display: block;
  width: 32px;
  height: 32px;
  background-image: url("../images/control-bar.png");
  background-repeat: no-repeat;
  cursor: pointer;
  text-indent: -9999px;
}
  /* buttons normal */
.mp-btn-play a{
  background-position: 0 0;
}
.mp-btn-stop a{
  background-position: 0 -32px;
}
.mp-btn-categories a{
  background-position: 0 -64px;
}
.mp-btn-categories-close a{
  background-position: 0 -96px;
}
.mp-btn-repeat a{
  background-position: 0 -128px;
}
.mp-btn-random a{
  background-position: 0 -160px;
}
.mp-btn-next a{
  background-position: 0 -192px;
}
.mp-btn-prev a{
  background-position: 0 -224px;
}
.mp-btn-fullscreen a{
  background-position: 0 -320px;
}

  /* buttons active */
.mp-btn-play a.active{
  background-position: -96px 0;
}
.mp-btn-stop a.active{
  background-position: -96px -32px;
}
.mp-btn-categories a.active{
  background-position: -96px -64px;
}
.mp-btn-categories-close a.active{
  background-position: -96px -96px;
}
.mp-btn-repeat a.active{
  background-position: -96px -128px;
}
.mp-btn-random a.active{
  background-position: -96px -160px;
}
.mp-btn-next a.active{
  background-position: -96px -192px;
}
.mp-btn-prev a.active{
  background-position: -96px -224px;
}
.mp-btn-fullscreen a.active{
  background-position: -96px -320px;
}

  /* buttons active */
.mp-btn-play a.active:hover{
  background-position: -128px 0;
}
.mp-btn-stop a.active:hover{
  background-position: -128px -32px;
}
.mp-btn-categories a.active:hover{
  background-position: -128px -64px;
}
.mp-btn-categories-close a.actie:hover{
  background-position: -128px -96px;
}
.mp-btn-repeat a.active:hover{
  background-position: -128px -128px;
}
.mp-btn-random a.active:hover{
  background-position: -128px -160px;
}
.mp-btn-next a.active:hover{
  background-position: -128px -192px;
}
.mp-btn-prev a.active:hover{
  background-position: -128px -224px;
}
.mp-btn-fullscreen a.active:hover{
  background-position: -128px -320px;
}

  /* buttons over */
.mp-btn-play a:hover{
  background-position: -64px 0;
}
.mp-btn-stop a:hover{
  background-position: -64px -32px;
}
.mp-btn-categories a:hover{
  background-position: -65px -64px;
}
.mp-btn-categories-close a:hover{
  background-position: -65px -96px;
}
.mp-btn-repeat a:hover{
  background-position: -64px -128px;
}
.mp-btn-random a:hover{
  background-position: -64px -160px;
}
.mp-btn-next a:hover{
  background-position: -64px -192px;
}
.mp-btn-prev a:hover{
  background-position: -64px -224px;
}
.mp-btn-fullscreen a:hover{
  background-position: -64px -320px;
}

  /* buttons disabled */
.mp-btn-play a.disable, .mp-btn-play a.disable:hover{
  background-position: -32px 0;
  cursor: default;
  display: none;
}
.mp-btn-stop a.disable, .mp-btn-stop a.disable:hover{
  background-position: -32px -32px;
  cursor: default;
  display: none;
}
.mp-btn-categories a.disable, .mp-btn-categories a.disable:hover{
  background-position: -32px -64px;
  cursor: default;
}
.mp-btn-repeat a.disable, .mp-btn-repeat a.disable:hover{
  background-position: -32px -128px;
  cursor: default;
}
.mp-btn-random a.disable, .mp-btn-random a.disable:hover{
  background-position: -32px -160px;
  cursor: default;
}
.mp-btn-next a.disable, .mp-btn-next a.disable:hover{
  background-position: -32px -192px;
  cursor: default;
}
.mp-btn-prev a.disable, .mp-btn-prev a.disable:hover{
  background-position: -32px -224px;
  cursor: default;
}
.mp-btn-fullscreen a.disable, .mp-btn-fullscreen a.disable:hover{
  background-position: -32px -320px;
  cursor: default;
}

/* Gallery */
.mp-categories-container{
  position: relative;
  overflow: auto;
  overflow-x: hidden;
}
.mp-categories ul, .mp-categories ul li{
  list-style: none;
  margin: 0;
  padding: 0;
}
.mp-categories ul.mp-category-wrapper{
  padding: 20px;
}
.mp-categories ul.mp-category-wrapper li{
  display: inline-block;
  margin-right: 20px;
  cursor: pointer;
  float: left;
}
.mp-categories ul.mp-category-wrapper li a{
  border: 2px solid grey;
  display: block;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  behavior:url(border-radius.htc);
}
.mp-categories ul.mp-category-wrapper li .mp-category-content{
  border: 1px solid #666;
  background-color: #333;
  padding: 5px;
  display: inline-block;
}
.mp-category-content .mp-category-thumb{
  border: 1px solid #666;
  margin-bottom: 10px;
}
.mp-category-content .mp-category-title{
  text-align: center;
  text-transform: uppercase;
  color: #999;
  font-weight: bold;
  font-size: .9em;
}
.mp-categories .mp-buttons{
/*  top: 10px;
  left: 930px;*/
  z-index: 550;
}

.mp-photo-fullscreen{
  padding: 10px;
  background-color: #333;
  border: 2px solid #666;
}
.mp-mask {
	position: absolute;
	opacity: 0.9;
	filter: alpha(opacity=90);
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=90);
	z-index: 999;
	background: #000;
  cursor : pointer;
}

