/* 600px & up */

html,body {
	font-size: 15px;
}

section.page {
	min-height: 100%;
}

/* header */
.Header .wrapper { position: relative; }
.Header .title {
	display: inline-block;
	text-align: left;
	margin: 0;
}
.Header .icon-menu {
	display: none;
}
.Header nav {
	display: inline-block;
	top: 0; left: auto !important; right: 0;
}
.Header nav [class^="icon-"]:before {
	color: rgba(145,145,145,0.3);
	-webkit-transition: color 0.4s;
	        transition: color 0.4s;
}
.Header nav li {
	float: left;
}
.Header nav a {
	background: none;
	min-width: 0;
}
.Header a { color: #999; }
.Header a:hover , .Header nav [class^="icon-"]:hover:before,
.Header a:active, .Header nav [class^="icon-"]:active:before { color: #ddd; }


/* home */
.page.home {
	background: #000 url(../img/interface/home-bg.jpg) center center no-repeat;
	min-height: 100%;
}
.page.home .brand {
	background: url(../img/logo.png) center top no-repeat;
	background-color: transparent;
	margin-top: 200px; padding: 75px 0 0;
	opacity: 0.7;
}
.page.home h1 {
	border: 0;
	opacity: 0.75;
}
.page.home h2 {
	border: 0;
	opacity: 0.4;
}

@-webkit-keyframes bubbles {
	0%, 100% { background-color: rgba(255,255,255,0.9); box-shadow: 0 0 15px rgba(255,255,255,0.5), inset -2px 2px 1px rgba(255,255,255,0.9), inset -5px 4px 10px #fff }
	40% {   background-color: rgba(255,255,255,0.7); box-shadow: 0 0 15px rgba(204,248,201,0.3), inset -2px 2px 1px rgba(255,255,255,0.7), inset -5px 4px 10px #ccf8c9; }
	60% {   background-color: rgba(255,255,255,0.8); box-shadow: 0 0 15px rgba(203,248,248,0.4), inset -2px 2px 1px rgba(255,255,255,0.8), inset -5px 4px 10px #caf7f7;}
	80% {   background-color: rgba(255,255,255,0.9); box-shadow: 0 0 15px rgba(237,211,243,0.5), inset -2px 2px 1px rgba(255,255,255,0.9), inset -5px 4px 10px #ecd2f2;}
}
@keyframes bubbles {
	0%, 100% { background-color: rgba(255,255,255,0.9); box-shadow: 0 0 15px rgba(255,255,255,0.5), inset -2px 2px 1px rgba(255,255,255,0.9), inset -5px 4px 10px #fff }
	40% {   background-color: rgba(255,255,255,0.7); box-shadow: 0 0 15px rgba(204,248,201,0.3), inset -2px 2px 1px rgba(255,255,255,0.7), inset -5px 4px 10px #ccf8c9; }
	60% {   background-color: rgba(255,255,255,0.8); box-shadow: 0 0 15px rgba(203,248,248,0.4), inset -2px 2px 1px rgba(255,255,255,0.8), inset -5px 4px 10px #caf7f7;}
	80% {   background-color: rgba(255,255,255,0.9); box-shadow: 0 0 15px rgba(237,211,243,0.5), inset -2px 2px 1px rgba(255,255,255,0.9), inset -5px 4px 10px #ecd2f2;}
}
section.page.skills .tags span {
	-webkit-animation: bubbles 5s linear infinite;
	        animation: bubbles 5s linear infinite;
}
section.page.skills .tags span:nth-child(2n) {
	-webkit-animation: bubbles 7s ease infinite;
	        animation: bubbles 7s ease infinite;
}
section.page.skills .tags span:nth-child(3n) {
	-webkit-animation: bubbles 9s ease-in infinite;
		    animation: bubbles 9s ease-in infinite;
}

section.page.skills {
	background-image:
		radial-gradient(rgba(255,255,255,0.05), rgba(155,192,210,0.03) 40px, transparent 20px),
		radial-gradient(rgba(255,255,255,0.05), rgba(192,210,155,0.03) 50px, transparent 10px),
		radial-gradient(rgba(255,255,255,0.05), rgba(210,155,192,0.03) 70px, transparent 20px),
		radial-gradient(rgba(255,255,255,0.05), rgba(155,192,210,0.03) 90px, transparent 40px);
	background-size: 427px 427px, 542px 542px, 660px 660px, 790px 790px;
}

/* Footer */
.Footer .copyright .medium {
	display: inline;
}