body{
	font-family: 'Roboto', sans-serif;
	position:relative;
	background-image: url("../images/background.jpg");
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center; 
	background-size: cover;
	background-color:#1f1f1f;
	margin:0 auto;
}
.top{vertical-align:top;}
.mid{vertical-align:middle;}
ul li{list-style:none;
}
.col10,.col15,.col20,.col25,.col30,.col33,.col40,.col45,.col50,.col55,.col60,.col70,.col75,.col80,.col100{
	display:inline-block;
	box-sizing:border-box;
	margin-right:-4px;
	}
a{text-decoration:none;}
.col10{width:10%;}
.col15{width:15%;}
.col20{width:20%;}
.col25{width:25%;}
.col30{width:30%;}
.col33{width:33.333%;}
.col40{width:40%;}
.col45{width:45%;}
.col50{width:50%;}
.col55{width:55%;}
.col60{width:60%;}
.col65{width:65%;}
.col70{width:70%;}
.col75{width:75%;}
.col80{width:80%;}
.col100{width:100%;}

h1{
	color:white;
	margin-top:10px;
	margin-bottom:30px;
}
#menu li a{	
		transition: all 0.5s;
		display:block;
		border-radius:5px;
		}
#menu li a:hover{
				cursor:pointer;
}
#tpsites{
	margin:0 auto;
	text-align:center;
	padding:0;
}
#tpsites a{
	background-color:white;
	transition: all 0.5s;
	color:#333333;
	display:block;
	border-radius:5px;
	margin:5px;
	padding:5px;
	text-align:center;
	vertical-align:top;
	position:relative;
	height:80%;
}
#tpsites li {display:inline-block;
			height: 190px;
			line-height: 150px;
			}
#tpsites img{
 max-width: 100%;
  max-height:100%;
  display: inline-block;
  margin: 0;
  vertical-align: middle;
  transition:all 0.5s;
}
#tpsites a:hover .links{
	bottom:50px;
	opacity:1;
}
#tpsites a:hover img{
	-webkit-filter: blur(5px);
-moz-filter: blur(5px);
-o-filter: blur(5px);
-ms-filter: blur(5px);
filter: blur(5px);
}
.fab{
	color:white;
}
#header{
	margin-bottom:5px;
}
#logo{
	text-align:center;
	position:fixed;
	top:100px;
	left:10px;
}
h1:hover{
	cursor:default;
}
p:hover{
	cursor:default;
}
#text-box{
	background-color:white;
	height:60px;
	border-radius:5px;
	overflow:hidden;
	text-align:center;
	position:fixed;
	left:10px;
	top:300px;
	padding:5px;
	width:10%;
}
#movetxt {
    position: relative;
    -webkit-animation: moving 15s infinite;
    animation: moving 15s infinite linear;
	color:#333333;
}

::selection {
  background: #80deea; 
}
::-moz-selection {
  background: #80deea;
}
@-webkit-keyframes moving {
    0%   {top: 50px;}
	50%  {top: -120px;}
	100%  {top: 50px;}
}



#site{
	text-align:center;
}
#shop{
	color:#333333;
	background-color:white;
	line-height:50px;
	padding:16px;
	transition:all 0.5s;
}

#shop:hover{
	color:white;
	background-color:#333333;
}
#menu li a{
	color:#333333;
}
#menu{text-align:center;
		position:fixed;
		bottom:0px;
		border-radius:5px;
		opacity:0.9;
		z-index:1000;
		background-color:white;
		}
#menu li {display:inline-block;
		position:relative;
		}
#menu span{
	position:absolute;
	left:0px;
	bottom:-20px;
	opacity:0;
	transition: all 0.5s;
	left:50%;
	transform: translate(-50%, 0);
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
}
#menu a:hover{
		transform: translate(0, -20%);
		-webkit-transform: translate(0, -20%);
		-moz-transform: translate(0, -20%);
		-o-transform: translate(0, -20%);
}
#menu a:hover span{
		opacity:1;
}
#sites{
	position:fixed;
	left:0px;
	top:100px;
	text-align:center;
}
.links{
	position:absolute;
	bottom:-20px;
	left:50%;
	transform: translate(-50%, 0);
	-webkit-transform: translate(-50%, 0);
	-moz-transform: translate(-50%, 0);
	-o-transform: translate(-50%, 0);
	transition:all 0.5s;
	opacity:0;
	background-color:#333333;
	line-height:50px !important;
	width:100%;
	color:white;
	-webkit-box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
	-moz-box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
	box-shadow: 0px 10px 5px 0px rgba(0,0,0,0.75);
	}
#social{
	position:fixed;
	top:200px;
	left:10px;
}
.fab{
	transition:all 0.5s;
}
#social a:hover .fab{
	transform: scale(1, 1.2);
		-webkit-transform: scale(1, 1.2);
		-moz-transform: scale(1 1.2);
		-o-transform: scale(1 1.2);
}
footer{
	height:100px;
}