/* ************************************************************************************************************************************ */
/* layout	common                                               														update 	  20.02.16
/* file 	layout_01/design.css		                      															version    1.00/20
/* 																																		*/
/* **************************************** Copyright by beratungscenter.net - Reinhard Lange ***************************************** */
/* ------------------------------------------------------------------------------------------------------------------------------------	*/


/* ----------------------------------------------------------------------------------------------------------------- 1.00/20 - 23.12.15 */
::selection				{color:white;background:#cc0000;text-shadow:none;} 
::-moz-selection		{color:white;background:#cc0000;text-shadow:none;}

*, *:after, *:before	{box-sizing:border-box;}
body, html 				{margin:0;padding:0;font-size:100%;}
body					{font-family:sans-serif;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after	{content:'';display:table;}
.clearfix:after 					{clear:both;}

body 					{margin:0;padding:0;}
	
.container-colors 		{border:0px solid orange;margin:0% auto;}
/* ----------------------------------------------------------------------------------------------------------------- 1.00/00 - 15.01.16 */
/*
// demo		-> the dark side of the moon  
// link		-> http://codepen.io/Twixes/pen/xZejZY
*/

body {
	background-color: #222;
}
canvas {
	position: absolute;
	top: calc( 50% - 200px );
	left: calc( 50% - 50px );
}
div {
	position: absolute;
	top: calc( 50% - 200px );
	left: calc( 50% - 300px );
	width: 230px;
	height: 400px;
	padding: 20px 10px 20px 10px;
	text-align: right;
	background-color: #181818;
	font-family: Verdana;
	color: #ddd;
}
div h1 {
	font-size: 20px;
}
div img {
	width: 200px;
	margin-right: 15px;
	margin-top: 20px;
}
div p:nth-of-type(3){
	font-size: 12px;
}
 
/* ---------------------------------------------------------------------------------------------------------------- 1.00/20 - 23.12.15 */
/*.wrapper				{margin:0 auto;border:0px solid red;}*/
/*.container			{position:relative;margin:16px 16px 16px 16px;border:0px solid orange;}*/

/*main					{margin:16px;border:1px dashed black;}*/
.main_outer				{margin:16px;border:0px solid green;}
.main_inner				{margin:16px;border:0px dotted red;}

/* footer */
footer					{position:fixed;left:0;right:0;bottom:0;max-width:100%;margin:0 auto;background:rgba(255, 255, 255, 0.10);
							border:1px solid #ccc;border-width:1px 0 0 0;z-index:99999;
							text-align:center;}
footer p				{font-family:'Titillium Web',arial;font-display:swap;font-size:1.05em;font-weight:100;margin:0;padding:4px 0;}

.footer-link a			{color:#8D8D8D !important;text-decoration:none;underline:none;background:none;}
.footer-link a:hover	{color:#fff !important;text-decoration:none !important;}

/* -------------------------------------------------------------------------------------------------------------------------------- END */
/* ************************************************************************************************************************************ */