@font-face {
  font-family: "Oxygen";
  src: url(../fonts/Oxygen-Regular.ttf);
}
@font-face {
  font-family: "OxygenBold";
  src: url(../fonts/Oxygen-Bold.ttf);
}
@font-face {
  font-family: "OxygenLight";
  src: url(../fonts/Oxygen-Light.ttf);
}
@font-face {
  font-family: "GemunuLibre-Bold";
  src: url(../fonts/GemunuLibre-Bold.ttf);
}
@font-face {
  font-family: "GemunuLibre-ExtraBold";
  src: url(../fonts/GemunuLibre-ExtraBold.ttf);
}
@font-face {
  font-family: "SourceSansPro-ExtraLight";
  src: url(../fonts/SourceSansPro-ExtraLight.ttf);
}
@font-face {
  font-family: "SourceSansPro-Light";
  src: url(../fonts/SourceSansPro-Light.ttf);
}

body, html {font-family:'Source Sans Pro',sans-serif;}
body{background:url('../images/logo-repeat.png') repeat center;}
h1{text-align:center;clear:both;}
h2{clear:both;padding:32px 0 20px;}
div#wrap div#header img{width:350px;margin:40px 0 0 50px;}
div#wrap div#content {}
div#wrap div#content div.project {padding:20px 20px 15px;}
div#projects {padding:10px 30px 20px;max-width:800px;margin:auto;}
div#projects h2 {margin-top:40px;text-align:center;}
div#projects img {width:180px;display:inline-block;float:left;margin-right:20px;}
div#projects div.project {clear:both;padding:20px 15px 20px;}
div#projects div.project h3, div#projects div.project p, div#projects div.project a {display:block;margin-left:210px;}
div#projects div.project a.image {margin-left:0;position:relative;top:3px;}
div#footer p{text-align:center;margin-top:30px;}
div#bar {font-size:190px;color:#e6f1f9;font-weight:bold;position:fixed;right:50px;top:0;width:50px;font-family:"Source Sans Pro", sans-serif;-webkit-transform: rotate(90deg);-moz-transform: rotate(90deg);-o-transform: rotate(90deg);-ms-transform: rotate(90deg);transform: rotate(90deg);}
div#placeholder{z-index:100;position:fixed;bottom:0;left:0;right:0;width:100%;height:60px;background:#54a0d5;text-align:center;line-height:60px;color:white;font-weight:bold;}
div#placeholder a,div#placeholder a:visited,div#placeholder a:hover,div#placeholder a:active{color:#2e4155;}
@media (max-width: 500px) {
	div#bar{display:none;}
	h1,h2,h3{text-align:center;clear:both;}
	div.project h3{clear:both;padding-top:20px;}
	div#projects div.project h3, div#projects div.project p, div#projects div.project a {margin-left:0;text-align:center;}
	div#projects div.project a.image{width:180px;margin:auto;}
	div#projects div.project a.image img{margin:auto;}
	div#placeholder{height:80px;line-height:32px;padding-top:15px;}

}
  
* {margin:0;padding:0;} 

html, body {height: 100%;font-family:"SourceSansPro-ExtraLight",sans-serif;font-size:16px;background:url('../images/brand-repeat.png') repeat;}

#wrap {min-height: 100%;background:url('../images/logo-repeat.png') repeat;}

#content {overflow:auto;
	padding-bottom: 130px;}  /* must be same height as the footer */

#footer {position: relative;
	margin-top: -130px; /* negative value of footer height */
	height: 130px;
	clear:both;} 

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}