/* BASIC ELEMENTS */

.hidden{
	display: none;
}

.visible{
	display: block;
}

*{
	font-family: georgia, times new, times new roman, serif;
	color: #444;
	margin: 0px;
	padding: 0px;
	line-height: 140%;
	border: 0px none;
}

body {
	padding: 0px;
	margin: 0px;
	text-align: center;
	height: 100%;
	font-size: 10pt;
}

body, #middle{
	background: #fff;
}

a, .highlight a, .quote a, .title a{
	color: #69b4f8;	
	text-decoration: underline;
}

a:hover, .highlight a:hover, .quote a:hover, .title a:hover{
	color: #2089f5;	
	text-decoration: underline;
}

.date, .comment, .image .comment, .size{
	font-size: 90%;
}

sub, sup { font-size: 80%; }

h2{
	font-size: 160%;
}

h3{
	font-size: 130%;
}

h2 *, h3 *{
	font-size: 100%;
}

#title, #title * {
	font-size: 30pt;
	font-weight: bold;
	text-align: center;
}

#header, #header * {
	font-size: 100%;
	text-align: center;
}

#pages div, #pages div a {
	font-size: 105%;
	line-height: 120%;
}

#menu div, #menu div * {
	font-size: 115%;
	line-height: 100%;
}

#menu div{
	margin-left: 2px;
	margin-right: 2px;
}

img{
	border: 0px none;
	margin: 0px;
}

body, div, p, li, .field{
	text-align: left;
}

div{
	margin: 0px;
}

p{
	margin-bottom: 14px;
}

ul, ol{
	margin-bottom: 14px;
	margin-left: 6%;
	width: 94%;
	float: left;
}

li{
	margin-bottom: 4px;
}

h1{
	display: none;
}

h2{
	padding: 0px;
	margin: 0px;
	margin-top: 22px;
	margin-bottom: 14px;
}

h3{
	padding: 0px;
	margin: 0px;
	margin-top: 18px;
	margin-bottom: 14px;
}

div > h2:first-child, div > #placeholder:first-child, div > h3:first-child, h3 + h2, h2 + h3, div > p:first-child, div > div:first-child{
	margin-top: 0px;
}

/* SPACER */

.spacer{
	float: left;
	width: 100%;
	margin: 0px;
	margin-top: 5px;
	margin-bottom: 20px;
	border-bottom: #ddd 1px solid;
}

/* HIGHLIGHT */

.highlight{
	margin: 0px;
	margin-bottom: 20px;
	width: 95%;
	float: left;
	padding: 2%;
	padding-left: 3%;
	padding-right: 3%;
	background: #e8e8e8;
}

/* QUOTE */

.quote{
	background-image: url('../graphics/quoteLeft.png'), url('../graphics/quoteRight.png');
	background-position: 6% 0%, 98% 0%;
	background-repeat: no-repeat, no-repeat;
	margin-top: 0px;
	margin-bottom: 15px;
	min-height: 27px;
	color: #888;
	width: 76%; 
	float: left;
	padding-right: 10%;
	padding-left: 14%;
	padding-top: 2px;
	padding-bottom: 0px;
	font-style: italic;
}

@media screen and (device-pixel-ratio: 2),
	screen and (-webkit-device-pixel-ratio: 2){
	.quote{
		background-image: url('../graphics/quoteLeft@2x.png'), url('../graphics/quoteRight@2x.png');
		background-size: 21px 22px, 21px 22px;
	}
}

.quote *, .quote strong, .quote b, .quote i, .quote em{
	color: #888;
}

#title{
	padding-top: 15px;
	padding-bottom: 5px;
}

#header{
	padding-bottom: 5px;
}

#title, #title *{
	color: #444;
	cursor: pointer;
	line-height: 100%;
}

#menu{
	margin-top: 15px;
	margin-bottom: 0px;
	text-align: center;
}

#menu div{
	display: inline-block;
	font-weight: bold;
	vertical-align: middle;
	padding: 0px;
}

#menu div, #menu div.active{
	line-height: 100%;
	margin-bottom: 4px;
}

#menu div a{
	color: #bbb;
	text-decoration: none;	
}

#menu div.active a{
	color: #444;
	text-decoration: none;	
}

#bottom div, #bottom p{
	margin: 0px;
	padding: 0px;
	margin-bottom: 5px;
}

#bottom div, #bottom p, #bottom p strong, #bottom p b, #bottom p i{
	color: #444;
	text-align: center;
}

#pages div{
	padding-top: 8px;
	padding-bottom: 8px;
}

#pages div, #pages div *{
	font-weight: bold;
	color: #bbb;
	text-decoration: none;
}

#pages div.active, #pages div.active *{
	color: #444;
}

/* RSS/SOCIAL LINKS */

#links div, #links div b{
	font-family: verdana, sans;
	font-size: 100%;
}

#links{
	padding: 0px;
	margin-top: 0px;
	margin-bottom: 18px;
	width: 100%;
	color: #bbb;
}

#links div{
	cursor: pointer;
	display: inline-block;
	padding: 4px;
	padding-top: 2px;
	margin-right: 7px;
	margin-bottom: 7px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	color: #fff;
	font-weight: normal;
	line-height: 100%;
}

#links .rss{
	background: #ff7700;
	border: 2px solid #ffaa33; 
	padding-left: 5px;
	padding-right: 5px;
}

#links .facebook{
	background: #3B5998;
	border: 2px solid #6B89C8; 
	padding-left: 8px;
	padding-right: 9px;
}

#links .twitter{
	background: #3BCEFF;
	border: 2px solid #6BE0FF; 
	padding-left: 8px;
	padding-right: 8px;
}

#links .google{
	background: #333;
	border: 2px solid #777; 
	padding-left: 5px;
	padding-right: 5px;	
}

#links .linkedin{
	background: #238AB7;
	border: 2px solid #43BAD7; 
	padding-left: 5px;
	padding-right: 5px;
}

#links .vimeo_{
	background: #0DADD6;
	border: 2px solid #2DCDE6; 
	padding-left: 7px;
	padding-right: 7px;
	font-style: italic;
}

#links .sound_cloud{
	background: #FF5800;
	border: 2px solid #FF9840; 
	padding-left: 4px;
	padding-right: 4px;
}

#links .flickr{
	padding: 0px;
	padding-top: 1px;
	background: #ebebeb;
	border: 2px solid #dcdcdc; 
	padding-left: 4px;
	padding-right: 4px;
	color: rgb(0,99,220);
}

#links .flickr b{
	color: rgb(255,0,132);
	font-weight: normal;
}

#links .you_tube{
	color: #333;
	padding-left: 0px;
	padding-right: 0px;
}

.you_tube b{
	padding: 2px;
	padding-top: 1px;
	padding-left: 3px;
	padding-right: 3px;
	margin-left: 2px;
	background: rgb(243,45,45);
	border: 2px solid rgb(255,100,100);
	color: #fff;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	font-weight: normal;
}

/* NEWS */

.title{
	font-size: 130%;
	font-weight: bold;
}

.title *{
	font-size: 100%;
}

div.news p{
	margin-top: 0px;
}

#news{
	margin-top: 0px;
}

.news{
	margin-bottom: 18px;
}

.title{
	padding-bottom: 4px;
}

.date{
	padding-bottom: 6px;
	color: #999;
}

/* IMAGES & GALLERY */

#placeholder{
	padding: 0px;
	margin: 0px;
	margin-top: 25px;
}

.image{
	float: left;
	width: 100%;
	margin-top: 5px;
	margin-bottom: 18px;
}

.image img{
	max-width: 100%;
	margin: 0px;
}

.image .comment{
	margin-top: 5px;
}

.comment{
	margin-top: 3px;
}

.comment a{
	text-decoration: none;
}

.gallery{
	margin-top: -8px;
	margin-bottom: 20px;
	width: 100%;	
	float: left;
}

.gallery .preview{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; 
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1.0;		
}

.gallery .preview:hover, .gallery .selected{
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; 
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
	opacity: 0.5;
}

.gallery .preview, .gallery .selected{
	float: left;
	padding: 0px;
	margin: 0px;
	padding-right: 8px;
	padding-bottom: 3px; 
} 

.gallery .preview img, .gallery .selected img{

}

/* FORM ELEMENTS */

.field{
	font-size: 100%;
	width: 95%;
	max-width: 600px;
	padding: 2%;
	padding-left: 2.5%;
	padding-right: 2.5%;
	border: 2px solid #ccc;
	background: #f0f0f0;
	color: #888;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	margin-top: 3px;
	margin-bottom: 12px;
	-webkit-appearance: none;
}

.button{
	cursor: pointer; 
	display: inline-block; 
	border-radius: 4px; 
	-webkit-border-radius: 4px; 
	-moz-border-radius: 4px; 
	padding: 15px; 
	padding-top: 6px; 
	padding-bottom: 6px; 
	background: #444; 
	color: #fff;
}

/* AUDIO/VIDEO/DOWNLOAD ELEMENTS */

.object{
	padding-left: 35px;
}

.download, .audio, .video{
	margin-top: 0px;
	margin-bottom: 0px;
	width: 100%;
	float: left;
	padding-top: 12px;
	padding-bottom: 5px;
}

video{
	max-width: 100%;
	margin-top: 10px;
}

.download{
	background-image: url('../graphics/download.png');
	background-position: 3px 13px;
	background-repeat: no-repeat;
}

.audio{
	background: url('../graphics/audio.png');
	background-position: 1px 10px;
	background-repeat: no-repeat;
}

.video{
	background: url('../graphics/video.png');
	background-position: 0px 11px;
	background-repeat: no-repeat;
}

@media screen and (device-pixel-ratio: 2),
	screen and (-webkit-device-pixel-ratio: 2){
	.download{
		background-image: url('../graphics/download@2x.png');
		background-size: 15px 18px;
	}
	.audio{
		background-image: url('../graphics/audio@2x.png');
		background-size: 21px 21px;
	}
	.video{
		background-image: url('../graphics/video@2x.png');
		background-size: 23px 20px;
	}
}

/* PAGE BOTTOM PADDING */

#padder{
	width: 100%;
	float: left;
	height: 30px;
}
