@charset "utf-8";
/* Created by Rafaël De Jongh.
** Author URL: https://www.rafaeldejongh.com/
** This code is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
Content Table:
--------------
- Reset
- Body
- MediaQueries
- Links
- Scrollbar
- Selection

Reset
------------------*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}
/*Custom Font Icons 
//Can be removed
------------------*/
@font-face{
	font-family:'cg';
	src:url('fonts/cg.eot?51goeb');
	src:url('fonts/cg.eot?51goeb#iefix') format('embedded-opentype'),
		url('fonts/cg.ttf?51goeb') format('truetype'),
		url('fonts/cg.woff?51goeb') format('woff'),
		url('fonts/cg.svg?51goeb#cg') format('svg');
	font-weight:normal;
	font-style:normal;
}
[class^="icon-"], [class*=" icon-"]{
	font:normal normal normal 14.5px/1 cg;
	speak:none;
	line-height:1;
	text-transform:none;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
}
.icon-artstation:before{content:"\e900"}
.icon-gamebanana:before{content:"\e901"}
/*Body
------------------*/
html{
	height:100%;
	-webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	        box-sizing:border-box;
	-webkit-background-clip:padding-box;
	   -moz-background-clip:padding-box;
	        background-clip:padding-box;
}
body{
	font-family:"Raleway", sans-serif;
	text-shadow:0 1px 1px rgba(0,0,0,.4);
	line-height:1.6;
	color:#fff;
	background-color:#1b1a1f;
	/*PHP Dynamic Background
	background-image:url("../images/bg/bg.php");
	*/
	background-image:url("../images/bg.jpg");
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment:fixed;
	background-position:center center;
	height:100%;
	position:relative;
	-webkit-touch-callout:none;
	-webkit-user-select:none;
	-khtml-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
}
/*Content
------------------*/
main::before{
	content:"";
	width:610px;
	height:310px;
	position:absolute;
	top: 20px;
	left:-5px;
	top:-5px;
	z-index:-1;
	background:-moz-linear-gradient(-45deg, rgba(115,115,115,.1) 0%, rgba(115,115,115,.09) 9%, rgba(115,115,115,0) 11%, rgba(115,115,115,0) 16%, rgba(115,115,115,.1) 21%, rgba(115,115,115,.09) 37%, rgba(115,115,115,0) 41%, rgba(115,115,115,0) 47%, rgba(115,115,115,.09) 48%, rgba(115,115,115,.1) 49%, rgba(115,115,115,.1) 54%, rgba(115,115,115,.08) 55%, rgba(115,115,115,0) 57%, rgba(115,115,115,0) 60%, rgba(115,115,115,.1) 64%, rgba(115,115,115,.09) 76%, rgba(115,115,115,0) 80%, rgba(115,115,115,.01) 81%, rgba(115,115,115,.1) 84%, rgba(115,115,115,.1) 100%);
	background:-webkit-linear-gradient(-45deg, rgba(115,115,115,.1) 0%,rgba(115,115,115,.09) 9%,rgba(115,115,115,0) 11%,rgba(115,115,115,0) 16%,rgba(115,115,115,.1) 21%,rgba(115,115,115,.09) 37%,rgba(115,115,115,0) 41%,rgba(115,115,115,0) 47%,rgba(115,115,115,.09) 48%,rgba(115,115,115,.1) 49%,rgba(115,115,115,.1) 54%,rgba(115,115,115,.08) 55%,rgba(115,115,115,0) 57%,rgba(115,115,115,0) 60%,rgba(115,115,115,.1) 64%,rgba(115,115,115,.09) 76%,rgba(115,115,115,0) 80%,rgba(115,115,115,.01) 81%,rgba(115,115,115,.1) 84%,rgba(115,115,115,.1) 100%);
	background:linear-gradient(135deg, rgba(115,115,115,.1) 0%,rgba(115,115,115,.09) 9%,rgba(115,115,115,0) 11%,rgba(115,115,115,0) 16%,rgba(115,115,115,.1) 21%,rgba(115,115,115,.09) 37%,rgba(115,115,115,0) 41%,rgba(115,115,115,0) 47%,rgba(115,115,115,.09) 48%,rgba(115,115,115,.1) 49%,rgba(115,115,115,.1) 54%,rgba(115,115,115,.08) 55%,rgba(115,115,115,0) 57%,rgba(115,115,115,0) 60%,rgba(115,115,115,.1) 64%,rgba(115,115,115,.09) 76%,rgba(115,115,115,0) 80%,rgba(115,115,115,.01) 81%,rgba(115,115,115,.1) 84%,rgba(115,115,115,.1) 100%);
	overflow:hidden;
}
main::after{
	content:"";
	width:610px;
	height:310px;
	position:absolute;
	z-index:-2;
	left:-5px;
	top:-5px;
	background-repeat:no-repeat;
	background-size:cover;
	background-attachment:fixed;
	background-position:center center;
	/*PHP Dynamic Background
	background-image:url("../images/bg/bg.php");
	background-image:-webkit-linear-gradient(90deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg/bg.php");
	background-image:-moz-linear-gradient(90deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg/bg.php");
	background-image:linear-gradient(0deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg/bg.php");
	*/
	background-image:url("../images/bg.jpg");
	background-image:-moz-linear-gradient(90deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg.jpg");
	background-image:-webkit-linear-gradient(90deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg.jpg");
	background-image:linear-gradient(0deg, rgba(100,100,100,.2), rgba(100,100,100,.2)), url("../images/bg.jpg");
	-webkit-filter:blur(5px);
	-moz-filter:blur(5px);
	-o-filter:blur(5px);
	-ms-filter:blur(5px);
	filter:blur(5px);
	overflow:hidden;
}
main{
	width:600px;
	height:300px;
	left:calc(50% - 300px);
	top:30%;
	position:absolute;
	-webkit-border-radius:4px;
	   -moz-border-radius:4px;
	        border-radius:4px;
	-webkit-box-shadow:0 10px 30px rgba(0,0,0,.6);
	   -moz-box-shadow:0 10px 30px rgba(0,0,0,.6);
	        box-shadow:0 10px 30px rgba(0,0,0,.6);
	border:1px solid rgba(12, 11, 11, 0.377);
	padding:20px;
	text-align:center;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box; 
	-webkit-transition:box-shadow .3s ease-in-out;
	   -moz-transition:box-shadow .3s ease-in-out;
	        transition:box-shadow .3s ease-in-out;
	overflow:hidden;
}
main:hover{
	cursor:move;
	-webkit-box-shadow:0 10px 32px rgba(0,0,0,.7);
	   -moz-box-shadow:0 10px 32px rgba(0,0,0,.7);
	        box-shadow:0 10px 32px rgba(0,0,0,.7);
}
main:active{
	cursor:move;
	-webkit-box-shadow:0 10px 50px rgba(0,0,0,.9);
	   -moz-box-shadow:0 10px 50px rgba(0,0,0,.9);
	        box-shadow:0 10px 50px rgba(0,0,0,.9);
}
main h1:before{
	content:"\2013";
	margin-right:5px;
}
main h1:after{
	content:"\2013";
	margin-left:5px;
}
main h1{
	font-size:2.7em;
	color: black;
	text-transform:uppercase;
	text-align:center;
	width:calc(100% + 10px);
	margin-top:20px;
	font-weight:200;
}
main h2{
	color: black;
	margin-top:.5em;
	font-weight:400;
	font-size:1.1em;
	text-align:center;
}
main h3{
	color: black;
	margin-top:.1em;
	font-weight:100;
	font-size:1em;
	text-align:center;
}
/*Icons
------------------*/
i{margin:2em 0.4em}
i:before{
	font-size:2em;
	display:block;
	border:1px solid #fff;
	padding:1rem;
	border-radius:100%;
	min-width:32px;
	min-height:32px;
	-webkit-box-shadow:0 1px 3px rgba(0,0,0,.4);
	   -moz-box-shadow:0 1px 3px rgba(0,0,0,.4);
	        box-shadow:0 1px 3px rgba(0,0,0,.4);
}
a i:before{
	-webkit-transition:all .3s ease;
	   -moz-transition:all .3s ease;
	     -o-transition:all .3s ease;
	        transition:all .3s ease;
}
a:hover i:before{background-color:rgba(255,255,255,.15)}
/*FadeInOnLoad
------------------*/
@-webkit-keyframes fadeIn{from{opacity:0}to{opacity:1}}
@-moz-keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
main{
	opacity:0;
	-webkit-animation:fadeIn ease-in 1;
	   -moz-animation:fadeIn ease-in 1;
	        animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards;
	   -moz-animation-fill-mode:forwards;
	        animation-fill-mode:forwards;
	-webkit-animation-duration:.5s;
	   -moz-animation-duration:.5s;
	        animation-duration:.5s;
	-webkit-animation-delay:.4s;
	   -moz-animation-delay:.4s;
	        animation-delay:.4s;
}
/*MediaQueries
------------------*/
@media screen and (max-width:630px){
	main::before,main::after{
		width:102%;
		height:102%;
		width:calc(100% + 10px);
		height:calc(100% + 10px);
	}
	main{
		width:80%;
		height:auto;
		margin:auto;
		display:inline-block;
		left:10%;
	}
	main h1:before,main h1:after{display:none}
}
@media screen and (max-width:500px){main h1{font-size:8vw}}
@media screen and (max-width:450px){main{top:30%}}
@media screen and (max-width:410px){main{top:30%}}
@media screen and (max-width:320px){main{top:30%}i{margin:.6em .5em}}
/*Links
------------------*/
a{
	color:black;
	text-decoration:none;
	-webkit-transition:all .3s ease;
	   -moz-transition:all .3s ease;
	     -o-transition:all .3s ease;
	        transition:all .3s ease;
}
a:visited, a:active, a:hover{color:#fff}
/*Scrollbar
------------------*/
::-webkit-scrollbar{width:12px;height:12px;background:#121212}
::-webkit-scrollbar-thumb{background:#900}
::-webkit-scrollbar-corner{background:#1a1a1a}
/*Selection
------------------*/
::selection{color:#fff;background-color:#900}
::-moz-selection{color:#fff;background-color:#900}