@import url("//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,700italic,400,300,700");
html, body {
	height: 100%;
}
body{
	font-family: "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
}
body > section {
	width: 100%;
	xmin-height: 100%;
	padding: 6em 0;
	box-sizing:  border-box;
	position: relative;
	z-index: 1;
}

body > section:nth-child(2n),
body > footer {
	border-top: solid 1px rgba(0,0,0,0.05);
	border-bottom: solid 1px rgba(0,0,0,0.05);

	background-color: #fff;
	background-image:
		linear-gradient(45deg, rgba(0,0,0,0.05) 25%, transparent 25%, transparent 75%, rgba(0,0,0,0.05) 75%),
		linear-gradient(45deg, rgba(0,0,0,0.05) 25%, transparent 25%, transparent 75%, rgba(0,0,0,0.05) 75%);
	background-size: 50px 50px;
	background-position: 0 0, 25px 25px;

}

#site-footer p {
	padding: 0;
	margin: 0;
}
#site-footer {
	padding: 2em;
	background: #333;
	color: #fff;
}
h1 {
	margin-bottom: 1em;
}
.navbar.navbar-fixed-top {
	background: #fff;
	background: rgba(255,255,255,0.97);
	border-bottom: solid 1px rgba(0,0,0,0.1);
}
.my-name {
	font-size: 60px;
	margin-top: 0;
	margin-bottom: 0;
}
.my-title{
	font-size: 30px;
}
.section-about {
	padding-top: 10em;
}

.section-work .item {
	position: relative;
	overflow: hidden;
	height: 0;
	padding-bottom: 90%;
	background-size: 100% auto;
	width: 100%;
	margin-bottom:  30px;
}

.section-work .item img,
.section-work .item a {
	overflow: hidden;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
}
.section-work .item img {
	width: 100%;
}
.section-work .item a {
	display: none;
	background: rgba(255,255,255,0.1);
	padding-top: 50%;
	margin-top: -25%;
	text-align: center;
	line-height: 1;
	font-size:  100px;
color: #fff;
text-shadow: 0 0 10px rgba(0,0,0,0.5);
}
.section-work .item:hover a {
	display: block;
}
ul.tags {
	overflow: hidden;
	margin: 0 -5px;
	padding: 0;
}
ul.tags li {
	float: left;
	list-style: none;
	margin: 5px;
}
.carousel-inner .item .wrapper {
	position: relative;
	height: 0;
	padding-bottom: 70%;
	overflow: auto;
}
.carousel-inner .item .wrapper img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
}
.carousel-controls {
	position: relative;
	margin-top: 10px;
	height: 30px;
	color: #000;
}
.carousel-controls .carousel-indicators {
	top: 0.25em;
	bottom: 0;
}
.carousel-control,
.carousel-control:hover {
	color: #000;
	text-shadow: none;
}
.carousel-control.right,
.carousel-control.left {
	background-image: none;
}
.carousel-indicators li {
	border-width: 3px;
	border-color: #000;
	opacity: 0.3;
}
.carousel-indicators li,
.carousel-indicators li.active {
	width: 16px;
	height: 16px;
	border-radius: 16px;
	margin: 2px 0 0;
}
.carousel-indicators li.active {
	opacity: 1;
}
.carousel-indicators li:hover {
	opacity: 1;
}
.modal .close {
	font-weight: normal;
	font-size: 300%;
	line-height: 0.6;
	opacity: 1;
}
.modal p {
	font-size: 130%
}
.contact-form .text-success,
.contact-form .loading,
.contact-form .text-danger,
.contact-form.thanks .form-wrapper {
	display: none;
}
.contact-form.error .text-danger,
.contact-form.thanks .text-success {
	display: block;
}
.contact-form.loading .loading {
	display: inline;

}
@media (min-width: 768px) {

	.modal-dialog.modal-full {
		width:auto;
		margin: 15px;
	}
}
.progress-bar {
    transition: width 1.6s ease;
}
.section-skillsets.not-loaded .progress-bar {
	width: 5% !important;
}