#content{
  opacity:1;
  margin-top:0;
}

h2 span{
  display: inline-block;
  font-family:serif;
  font-size:200%;
  transform:scale(0.75,1) translate(-17%,0);
  text-shadow:0 0 5px #900,0 0 5px #900,0 0 10px #A03,0 0 20px #D05;
	margin-bottom:3%;
}
h3{
  padding:0.2%;
  padding-left:1.2%;
  border:3px #FFF solid;
  border-width:0 0 0 6px;
  background-color:rgba(255,0,100,0.4);
  font-size:110%;
	font-weight:normal;
  margin-bottom:1%;
}


.dlc{
	margin-top:2%;
	border:1px #333 solid;
	border-width:0 0 1px 0;
	padding:1.5%;
	padding-bottom:6%;
}

.dlc:last-child{
	border-width:0;
}

h4{
  font-size: 150%;
  margin-bottom:1%;
  color:#FFF;
	line-height:1.2;
}

h4 span{
	font-size:60%;
}


#dlc_menu{
	float:left;
	width:20%;
  position:relative;
  z-index:1;
}

ul{
	width:100%;
	list-style-type: none;
}

ul li{
	display:inline-block;
	width:100%;
}

ul li.p{
	background-color:#222;
  background:linear-gradient(to bottom,#222,#444);
  color:#FFF;
/*  margin-top:15%;*/
  padding:1% 4%;
}
ul li.menu{
	cursor:pointer;
  border:1px #333 dotted;
	border-width:0 0 1px 0;
  padding:6% 4%;
  background-color:rgba(0,0,0,0.5);
  position:relative;
}

ul li.menu:after{
  content:"";
  display:block;
  width:10px;
  height:10px;
  border:11px #555 solid;
  border-width:1px 1px 0 0;
  position:absolute;
  right:15px;
  top:50%;
  transform:rotate(45deg) translate(0,-50%);
  -ms-transform:rotate(45deg) translate(0,-50%);
}

ul li.new:before{
  content:"NEW";
  display:inline-block;
  background-color:#F00;
  color:#FFF;
  padding:0 5px;
  font-size:50%;
  vertical-align:1px;
  margin-right:5px;
  /*position:absolute;
  left:-30px;
  top:50%;
  transform:translate(0,-50%);
  -ms-transform:translate(0,-50%);*/
}


ul li.current{
	background-color:rgba(255,0,100,0.3) !important;
}


ul li:first-child{
	margin-top:0;
}

#dlc_list{
	float:right;
	width:74%;
}

.dlc_img{
	display:block;
	margin:3% auto;
	width:80%;
	max-width:400px;
	border:1px #222 solid;
}

.cap{
	width:100%;
  max-width:615px;
}


.dlc_info{
	border-collapse: collapse;
	width:100%;
	margin:1% 0;
	padding-bottom:4%;
}


.dlc_info th,.dlc_info td{border:1px #222 solid;padding:1% 3%;}
.dlc_info th{background-color:rgba(255,255,255,0.2);text-align: left;font-weight:normal;width:100px;}
.dlc_info td{background-color:rgba(255,255,255,0.1);}





/*----Media Query----*/
@media screen and (max-width:768px){
  #container{
    padding-top:145px;
  }

}
@media screen and (max-width:639px){
  #container{
    padding-top:95px;
  }
  ul li.menu:after{
    display:none;
  }
}


@media screen and (max-width:480px){
  #dlc_menu{
  	float:none;
  	width:100%;
    margin:5% auto;
  }

  ul li.p{
    display:none;
  }
  ul li.menu{
    width:32.0%;
    border:1px #555 solid;
    border-width:1px;
    text-align:center;
    background-color:rgba(255,255,255,0.7);
    color:#111;
    border-radius:3px;
    font-size:80%;
  }

  ul li.new:before{
    display:none;
  }
  ul li.current{
    color:#FFF;
  }
  #dlc_list{
  	float:none;
  	width:100%;
  }

  h2 span{
    font-size:160%;
  }
}

@media screen and (max-width:459px){
  h2 span{
    font-size:110%;
  }

  h4{
    font-size: 120%;
  }
}
