@charset "UTF-8";

.mainImg{
    background-image: url(../img/release/release-main.jpg);
}
#wrapper{
    position: relative;
    z-index: 3;
}

#footer{
    z-index: 3;
}

#years{
    margin-top: 20px;
}

#years .tabs{
    border: thin solid #ccc;
    padding: 10px;
    display: block;
    text-align: center;
    width: 980px;
    margin: 20px auto;
}

#years .tabs li{
    display: inline-block;
    font-size: 1.5rem;
    margin: 0 8px;
}

#years .tabs li a{
    color: #aaa;
    font-style: italic;
}

#years .tabs li a.on{
    color: #fff;
}

#years .tabs li a:hover{
    color: #fff;
}

#panels{
    width: 100%;
}

.panel-e h2{
    background-color: #ccc;
    display: block;
    color: #2d3547;
    text-align: left;
    font-size: 2rem;
    font-weight: bold;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
}

.panel-e h2{
    padding-left: 10px;
}

.panel-e h2 span{
    width: 980px;
    margin: 0 auto;
    text-align: left;
    display: block;
}

.panel-e .section{
    width: 980px;
    margin: 0 auto;
    margin-bottom: 60px;
}

.panel-e .section table tr td, .panel-e .section table tr th{
    padding: 10px 0px  10px 0px;
    color: #fff;
    font-size: 1.4rem;
    vertical-align: top;
}

 .panel-e .section table tr th{
     width: 130px;
     font-weight: normal;
 }

.panel-e .section table tr td a{
    color: #fff;
}

/*responsive*/
@media only screen and (min-width:980px) and (max-width:1024px) {
.mainImg {
	height: 50%;
}
}
@media only screen and (max-width:979px) {

.mainImg {
	height: 60%;
}
h1 {
	padding-top: 20%;
	line-height: 1;
}
h1 > span {
	line-height: 2;
}

#years{
    box-sizing: border-box;
    padding: 10px;
    width: 100%;
}
#years .tabs{
    width: 100%;
    box-sizing: border-box;
}

#years ul li{
     margin-left:20px;
     margin-right: 20px;
    padding-top:10px;
    padding-bottom: 10px;
 }
#panels{
    width: 100%;
}

.panel-e .section{
    width: 100%;
    box-sizing: border-box;
}

.panel-e h2 span{
    width: 100%;
}

.panel-e .section table tr td, .panel-e .section table tr th{
    display: block;
}

 .panel-e .section table tr th{
     width: 100%;
     font-weight: normal;
     padding-bottom: 0px;
 }

.panel-e .section table tr td{
    padding-bottom: 30px;
}


}

@media only screen and (max-width:399px) {
    .mainImg{
        height: 50%;
    }
}

@media only screen and (max-width:767px) and (orientation: landscape) {
.mainImg {
	height: 70%;
}
h1 {
	padding-top: 0;
}

}