/*
Theme Name: doitory 1.0
Theme URI: http://www.doitory.com
Author: Anett Wassmann
Author URI: http://www.buddelsand.de
Description: doitory Theme
Version: 3.0
License: all rights reserved
License URI:
Tags: 
Text Domain: doitory
*/

/* ------- color scheme ------- 

	darkblue:	#2cb1ae
	lightblue:	#81e1df
	darkred:	#ff8585
	lightred:	#ffc1c1
	background:	#f2f2f2
	light:		#fff

*/

/* ------- preset ------- */

	/* ------- Reset default browser CSS ------- !important: do not change but check update */
		/* http://meyerweb.com/eric/tools/css/reset/ 
		   v2.0 | 20110126
		   License: none (public domain)
		*/
		html, body, div, span, applet, object, iframe,
		h1, h2, h3, h4, h5, h6, p, blockquote, pre,
		a, abbr, acronym, address, big, cite, code,
		del, dfn, em, img, ins, kbd, q, s, samp,
		small, strike, strong, sub, sup, tt, var,
		b, u, i, center,
		dl, dt, dd, ol, ul, li,
		fieldset, form, label, legend,
		table, caption, tbody, tfoot, thead, tr, th, td,
		article, aside, canvas, details, embed, 
		figure, figcaption, footer, header, hgroup, 
		menu, nav, output, ruby, section, summary,
		time, mark, audio, video {
			margin: 0;
			padding: 0;
			border: 0;
			font-size: 100%;
			font: inherit;
			vertical-align: baseline;
		}
		/* HTML5 display-role reset for older browsers */
		article, aside, details, figcaption, figure, 
		footer, header, hgroup, menu, nav, section {
			display: block;
		}
		body {
			line-height: 1;
		}
		ol, ul {
			list-style: none;
		}
		blockquote, q {
			quotes: none;
		}
		blockquote:before, blockquote:after,
		q:before, q:after {
			content: '';
			content: none;
		}
		table {
			border-collapse: collapse;
			border-spacing: 0;
		}
		
	/* border-box-reset */
		html {
		  box-sizing: border-box;
		}
		*, *:before, *:after {
		  box-sizing: inherit;
		}
	
/* ------- structure ------- */

		body {
			margin: 0;
			color: #333;
			background: #e3e3e3;
			font-family: 100% Arial, Helvetica, sans-serif;
			font-size: 1.0em;
			font-weight: 100;
			line-height: 1.6em;
			width: 100%;
			overflow: auto;
			overflow-x: hidden;
		}
		.wrap {
			display: block;
			width: 100%;
			max-width: 100%;
			margin: 0;
		}
		#page {
			/*
			display: grid;
			grid-template-rows: 336px 1fr 336px;
			grid-gap: 10px;
			*/
		}
		.section-single {
			max-width: 620px;
			margin: 0 auto;
		}
		
		/* --- fallback: no-grid layout --- */
			.sidebar {
				display: inline-block;
			}
			.section-row,
			.sidebar-center,
			.sidebar-inpost {
				width: 100%;
				overflow-x: hidden;
			}
			.section-col {
				width: 306px;
			}
			@media screen and (max-width: 619px) {
				.section-col,
				.section-row {
					margin: 5px auto;
				}
			}
		
/* ------- elements ------- */
	/* fonts */
	
	/* headlines */
		.loop-header .title,
		.post-item .title,
		.widget-title {
			display: block;
			width: 100%;
			font-weight: 600;
			line-height: 1.6em;
			font-size: 1.2em;
			font-weight: 600;
			text-align: center;
			background: #2cb1ae;
			color: #fff;
			border-top-left-radius: 3px;
			border-top-right-radius: 3px;
			border-bottom: 3px solid #fff;
		}
		#page-content-post-links .title,
		.widget_doitorysharewidget .widget-title {
			background: #ff8585;
		}
		
	/* links */
		a,
		a:visited,
		a:focus,
		a:active {
			color: #2cb1ae;
			text-decoration: none;
		}
		a:hover {
			color: #2cb1ae;
			text-decoration: underline;
		}
		
	/* pagination */
	
		#pagination {
			display: block;
			margin: 1em auto;
			width: 100%;
			text-align: center;
		}
		#pagination .page-numbers {
			display: inline-block;
			color: #fff;
			background: #2cb1ae;
			border: 2px solid #fff;
			-webkit-box-shadow: -1px 3px 4px #999;
			-moz-box-shadow: -1px 3px 4px #999;
			box-shadow: -1px 3px 4px #999;
			max-width: 200px;
			border-radius: 1.8em;
			line-height: 1.2em;
			font-size: 1.2em;
			padding: 0.4em 0.8em;
			margin: 0.5em 0;
		}
		#pagination .page-numbers:hover {
			background: #ff8585;
			text-decoration: none;
		}
		#pagination .current {
			font-weight: 600;
			background: #ff8585;
		}
		
/* ------- parts ------- */		
		
	/* HEADER */			
		#header {
			width: 100%;
			margin: 0;
			background: #fff;
			-webkit-box-shadow: -1px 1px 4px #999;
			-moz-box-shadow: -1px 1px 4px #999;
			box-shadow: -1px 1px 4px #999;
			position: fixed;
			z-index: 600;
		}
			#navbar {
				display: block;
				width: 100%;
				line-height: 48px;
				position:relative;
			}
			#menu-navbar {
				display: block;
				width: 100%;
				margin: 0;
				list-style: none;
			}
				#menu-navbar .menu-branding,
				#menu-navbar .menu-item {
					display: inline-block;
					margin: 0;
					height: 48px;
					vertical-align: top;
					text-align: center;
				}
					#menu-navbar .menu-branding {
						background: #2cb1ae;
						color: #fff;
						position: relative;
						width: 100px;
						margin-right: 24px;
					}
						#header-logo {
							color: #fff;
							font-weight: bold;
						}
						#header-logo:hover {
							color: #fff;
							text-decoration: none;
						}
						#header-logo:before, #header-logo:after {
							content: '';
							position: absolute;
							right: -24px;
							border-right: 24px solid transparent;
						}
						#header-logo:after {
							top: 0;
							border-top: 25px solid #2cb1ae;
						}
						#header-logo:before {
							bottom: 0;
							border-bottom: 25px solid #2cb1ae;
						}
					#menu-navbar .menu-item {
						background: #fff;
					}
						#menu-navbar .menu-item>a {
							display: block;
							padding: 12px;
							width: 48px;
							height: 48px;
							font-size: 24px;
							color: #ff8585;
						}
							#menu-navbar .menu-item a:hover {
								text-decoration: none;
								color: #ff8585;
							}
						#menu-item-user .avatar {
							vertical-align: top;
							border-radius: 50%;
						}
					#navbar ul.sub-menu {
						display: none;
						position:absolute;
						padding:0;
						top: 125%;
						width: 300px;
						left: 10%;
						list-style: none;
						background: none;
						z-index: 610;
						margin: 0;
						height: auto;
						-webkit-box-shadow: -1px 1px 4px #999;
						-moz-box-shadow: -1px 1px 4px #999;
						box-shadow: -1px 1px 4px #999;
						border-top-left-radius: 3px;
						border-top-right-radius: 3px;
					}
						#navbar .sub-menu-title,
						#navbar .sub-menu-item {
							display: block;
							padding: 0.5em 1em;
							line-height: 1.2em;
							color: #2cb1ae;
						}
						#navbar .sub-menu-title {
							background: #2cb1ae;
							color: #fff;
							font-weight: bold;
							border: 3px solid #fff;
							border-top-left-radius: 3px;
							border-top-right-radius: 3px;
						}
						#navbar .sub-menu-item {
							background: #fff;
							color: #2cb1ae;
							border-bottom: 1px solid #f2f2f2;
						}
						#navbar .sub-menu-item>a {
							font-size: 1.0em;
						}
							#menu-item-categories select {
								width: 90%;
								margin: 0 auto;
							}
							#menu-item-loginform-form label {
								display: block;
								font-size: 0.8em;
							}
		#headerspacer {
			width: 100%;
			margin-top: 0;
			height: 54px; /* 54px + margin */
		}
	/* PAGE */			
		#page {
			display: block;
			min-height: 600px;
			background: none;
			font-size: 1.0em;
		}
	/* HEADER */

	/* SEARCH */
					#content .search {
						display: block;
						margin: 0.5em auto;
						background: #fff;
						border-radius: 7px;
						border: 1px solid #ddd;
						-webkit-box-shadow: -1px 3px 4px #999;
						-moz-box-shadow: -1px 3px 4px #999;
						box-shadow: -1px 3px 4px #999;
						width: 96%;
					}
	/* LOOP */
		.section-loop {
			margin: 1em auto;
			-webkit-column-gap: 6px; /* Chrome, Safari, Opera */
			-moz-column-gap: 6px; /* Firefox */
			column-gap: 6px;
			padding: 0 auto;
			text-align: center;
		}
			@media screen and (min-width: 1566px) {
				/* min: 6+306+6+306+6+306+6+306+6+306+6 = 1566 */
				.section-loop {
					width: 1566px;
					-webkit-column-count: 5; /* Chrome, Safari, Opera */
					-moz-column-count: 5; /* Firefox */
					column-count: 5;
				}
			}
			@media screen and (min-width: 1254px) and (max-width: 1565px) {
				/* min: 6+200+6+200+6+200+6+200+6 = 850 */
				/* max: 6+306+6+306+6+306+6+306+6 = 1254 */
				.section-loop {
					width: 1254px;
					-webkit-column-count: 4; /* Chrome, Safari, Opera */
					-moz-column-count: 4; /* Firefox */
					column-count: 4;
				}
			}
			@media screen and (min-width: 942px) and (max-width: 1253px) {
				/* min: 6+180+6+180+6+180+6 = 580 */
				/* max: 6+306+6+306+6+306+6 = 942 */
				.section-loop {
					width: 942px;
					-webkit-column-count: 3; /* Chrome, Safari, Opera */
					-moz-column-count: 3; /* Firefox */
					column-count: 3;
				}
			}
			@media screen and (min-width: 630px) and (max-width: 941px) {
				/* min: 6+150+6+150+6 = 330 */
				/* max: 6+306+6+306+6 = 630 */
				.section-loop {
					width: 630px;
					-webkit-column-count: 2; /* Chrome, Safari, Opera */
					-moz-column-count: 2; /* Firefox */
					column-count: 2;
				}
			}	
			@media screen and (max-width: 629px) {
				/* min: 6+306+6 = 326 */
				.section-loop {
					width: 326px;
					-webkit-column-count: 1; /* Chrome, Safari, Opera */
					-moz-column-count: 1; /* Firefox */
					column-count: 1;
				}
			}
		.loop-item,
		.sidebar-inloop,
		.sidebar-inpost {
			display: inline-block;
			position: relative;
			margin-top: 5px;
			margin-bottom: 5px;
			border-radius: 3px;
			border: 3px solid #fff;
			background: #fff;
			box-shadow: -1px 3px 4px #999;
			border-radius: 3px;
			vertical-align: top;
		}
			.loop-header,
			.sidebar-inloop,
			.post-preview-dia {
				width: 306px;
				height: 299px;
				overflow: hidden;
			}
			.loop-header .content,
			.loop-header .description {
				margin: 2%;
			}
				.sidebar-inloop .widget {
					width: 300px;
					height: 290px;
				}
					.loop-item .title,
					.sidebar-inloop .widget-title,
					.sidebar-inpost .widget-title {
						height: 37px;
					}
			.post-preview-dia .post-thumbnail {
				border-radius: 3px;
				margin: 0;
				height: 250px;
				width: 300px;
			}
			.post-preview-dia .post-thumbnail img {
				margin: auto;
				width: 100%;
				height: 100%;
			}
			.post-preview-dia .post-title {
				display: block;
				width: 300px;
				height: 40px;
				text-align: center;
				line-height: 1.2em;
				font-size: 1.0em;
				overflow: hidden;
			}
			.post-labels {
				display: block;
				position: absolute;
				top: 10px;
				right: -1px;
				background: none;
				margin: 0;
				text-align: right;
				font: small-caps 130%/100% "Times New Roman", Times, serif;
				line-height: 1.0em;
				font-size: 1.0em;
				font-weight: 100;
				overflow: hidden;
				width: 100%;
			}
				.post-label {
					margin-bottom: 3px;
					position: relative; 
					width: 100%; 
					height: 3em;
				}
					.post-label-acquisition {
						position: absolute;
						top: 1em;
						right: -5px;
						padding: 0.3em;
						color: #f2f2f2;
						background: #ff8585;
						border-right: 5px solid #ffc1c1;
					}
					.post-label-acquisition:before, .post-label-acquisition:after {
						content: '';
						position: absolute;
						left: -0.9em;
						border-left: 1em solid transparent;
					}
					.post-label-acquisition:before {
						top: 0;
						border-top: 1em solid #ff8585;
					}
					.post-label-acquisition:after {
						bottom: 0;
						border-bottom: 1em solid #ff8585;
					}
					.post-label-acquisition span {
						display: block;
						font-size: 3em;
						font-weight: 600;
					}
		.post-preview-nail {
			width: 106px;
			height: 106px;
		}
		.post-item {
			margin: 1em auto;
			display: inline-block;
			position: relative;
			border-radius: 3px;
			border: 3px solid #fff;
			width: 100%;
			background: #fff;
			box-shadow: -1px 3px 4px #999;
			border-radius: 3px;
			vertical-align: top;
		}
			.post-item .title {
				height: 37px;
				border-bottom: 3px solid #fff;
			}
			.post-item .content,
			.post-item .description {
				margin: 2%;
			}
			.post-item .thumbnail img {
				width: 100%;
				height: auto;
			}
		.field-item {
			width: 100%;
			border-bottom: 1px solid #f2f2f2;
		}
			.field-label {
				display: inline-block;
				width: 100px;
				margin: 1% 2% 1% 2%;
				font-weight: bold;
			}
			.field-content {
				display: inline-block;
				margin: 1% 2% 1% 2%;
			}
		.section-author .post-item .button {
			margin-right: 12px;
		}
		.widget {
			width: 100%;
		}
			.widget ul {
				display: block;
				width: 100%;
				margin: 0;
				padding: 0;
			}
				.widget li {
					display: block;
					width: 100%;
					margin: 0;
					padding: 0;
					border-top: 1px solid #f2f2f2;
					border-bottom: 1px solid #f2f2f2;
				}
					.widget li a {
						margin: 0;
						padding: 0 0 0 3%;
					}
			.textwidget {
				width: 100%;
				height: auto;
			}
		
	/* DOITORY SHARE WIDGET */
	
		.widget_doitorysharewidget {
			background: #2cb1ae;
			color: #fff;
		}
		.doitoryshare-widget {
			padding: 6%;
			height: 250px;
			text-align: justify;
		}
				
				#doitoryshare_bookmarklet,
				#doitoryshare_bookmarklet:focus,
				#doitoryshare_bookmarklet:hover,
				#doitoryshare_bookmarklet:active,
				#doitoryshare_bookmarklet:visited {
					display: block;
					margin: 2% 20%;
					font-size: 1.2em;
					line-height: 1.8em;
					border: 3px double #2cb1ae;
					text-align: center;
					background: #fff;
					color: #2cb1ae;
					text-decoration: none;
					border-radius: 5px;
					font-weight: 600;
					padding: 0.5em;
				}
				
	/* FOOTER */	
		#footer {
			margin: 0;
			width: 100%;
			color: #aaa;
			clear: both;
			font-size: 0.8em;
		}
			#footer a {
				color: #aaa;
				text-decoration: none;
			}
			#footer a:focus,
			#footer a:active,
			#footer a:hover {
				color: #aaa;
			}	
			#footer a:hover {
				text-decoration: none;
			}
			
			#copyright {
				display: block;
				width: 100%;
				text-align: center;
			}