@import url('https://fonts.googleapis.com/css?family=PT+Serif:400,400i');

@font-face {
    font-family: 'dineng';
    src: url('fonts/dineng.eot');
    src: url('fonts/dineng.eot?#iefix') format('embedded-opentype'), url('fonts/dineng.woff2') format('woff2'), url('fonts/dineng.woff') format('woff'), url('fonts/dineng.ttf') format('truetype'), url('fonts/dineng.svg#dinschriftregular') format('svg');
    font-weight:normal; font-style:normal;
}

html {-webkit-box-sizing:border-box; box-sizing:border-box;}
*, *:before, *:after {-webkit-box-sizing:inherit; box-sizing:inherit;}
* {margin:0; padding:0; list-style-type:none;}

/* CSS reset */

ol, ul {list-style:none; margin-bottom:2em;}
li {margin:1em 0;}
h1, h2, h3, h4, h5, h6 {font-size:100%; font-weight:normal; margin:0;}

/* General Styles */

body {font:400 16px/1.5 'PT Serif', Georgia, serif; background:#222; color:#ccc;}
.clearfix:after {content:''; display:table; clear:both;} /* CSS Tricks */
a {text-decoration:none;}
a:focus, a:active {outline:0;}

/* Top bar Style */

.top {font:normal 11px/24px sans-serif; width:100%; background:#000; opacity:0.9; text-transform:uppercase; z-index:9999; position:fixed; top:0; left:0;
	   -moz-box-shadow:1px 0px 2px #000; -webkit-box-shadow:1px 0px 2px #000; box-shadow:1px 0px 2px #000;}
.top a {padding:0px 10px; letter-spacing:1px; color:#ddd; display:block; float:left;}
.top a:first-child {margin-left:15px;}
.top a.grey {color:#666;}
.top a:hover {color:#fff;}
.top span.right {float:right;}
.top span.right a {float:none; display:inline;}
.top span.right a.current {font-weight:700; color:#fff;}

/* Content */

#credit_wrap {max-width:1200px; width:100%; height:100%; position:relative; top:0; left:0; margin:0 auto;}
#credhead    {width:100%; padding:30px; margin:50px 0; display:block; text-align:center;}
#credhead h1 {width:100%; padding:0 0 1em; margin:0; font:400 2.25em dineng, sans-serif; color:#fff; text-shadow:1px 1px 1px rgba(0,0,0,0.3);}
#credhead p  {width:100%; padding:0 0 1em; margin:0; font-size:1.25em; color:#ddd;}
#credhead a  {color:#ccc; text-decoration:none;}
#credhead a:hover {color:#eee;}

.main_cred   {width:100%; padding:0 2.2em; position:relative; font-size:1.125em; margin:60px 0;}
.main_cred a {color:#ee7575; border-bottom:1px solid;}
.main_cred a:hover {color:#eee; border-bottom:1px solid;}
.main_cred h2 {font-size:1.1111em; padding-top:0; margin-top:-5px;}
.credits_col_left {position:relative; width:40%; float:left;  padding:0 0.66em; text-align:right;}
.credits_col_rite {position:relative; width:60%; float:right; padding:0 1.12em 3em; text-align:left; border-left:1px solid #666;}
.credits_col_rite p:nth-child(1) {margin-top:-2px; padding-top:0;} 
.credits_col_rite > a + p {margin-bottom:2em;}
.last {padding-bottom:0; margin-bottom:0 !important;}

@media screen and (max-width: 520px) {
	.main_cred h2 {margin:1em 0 .5em;}
   .credits_col_left, .credits_col_rite { float:none; width:100%; }
	.credits_col_left {border-bottom:1px solid #666; padding-right:0;}
	.credits_col_rite {border:0; padding:0 0 3em 0;}
   .credits_col_rite p:nth-child(1) {margin-top:1em; padding-top:0;} 
	section {margin-bottom:3em;}
}