@charset "utf-8";
/* CSS Document */

html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {
	margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;text-decoration:none;}
	/*-------------------------------
	FONT OPTOINS--
	font-family: 'Bitter', serif;
	font-family: 'Open Sans', sans-serif;
	--------------------------------*/

	/*-------------------------------
	CHANGEABLE CODE BELOW HERE
	---------------------------------*/
	a {
		transition: background .2s ease-in;
		-moz-transition: background .2s ease-in;
		-webkit-transition: background .2s ease-in;
		text-decoration: none;
	}

	.header {
		width:100%
	}

	/*----------- STICKY FOOTER STYLES START -------------*/
	html {
		position: relative;
		min-height: 100%;
	}
	body {
		/* Margin bottom by footer height */
		margin-bottom:50px;
		font-family: 'Open Sans', sans-serif;
		color: #333;
		font-size: 14px;
	}
	.footer {
		position: absolute;
		bottom: 0;
		width: 100%;
		/* Set the fixed height of the footer here */
		height: 50px;
		background-color: #333;
	}
	/*----------- STICKY FOOTER STYLES END -------------*/
	.container{
		margin:0px;
		padding: 20px 20px;
		text-align: left;
	}
	li {
		list-style-type: none;
	}
	.header,.portfolio,.contact {
		max-width: 1400px;
		margin: 0 auto;
	}
	.portfolio,.contact{
		padding: 0px 130px 0px;
		font-size: 12px;
		line-height: 20px;
	}
	.portfolio {
		margin-bottom: 70px;
	}
	.header{
		position: relative;
		padding: 80px 130px 0px;
		z-index: 999;
		background-color: none;
		overflow: hidden;
	}
	.container{
	}
	h1{
		font-family: 'Bitter', serif;
		text-transform: lowercase;
		border-bottom: 1px solid #DCDCDC;
		padding-bottom: 15px;
		margin-bottom: 40px;
		display: inline-block;
		font-size: 26px;
	}
	.contact h1 {
		margin-bottom: 30px;
		color:#333;
	}
	h2,h3{
		font-family: 'Open Sans', sans-serif;
		font-weight: 600;
		font-size: 14px;
	}
	.gold {
		color:#DAA520;
	}
	.gray {
		color:#333;
	}
	.no-wrap {
		white-space: nowrap;
	}
	.header .name {
		font-size: 30px;
		font-family: 'Bitter', serif;
		display: inline-block;
		border-bottom: 1px solid #DCDCDC;
		padding-bottom: 10px;
		margin-bottom: 12px;
		margin-top: 30px;
		color: #333;
	}
	.header .title {
		font-size: 14px;
		color:#DAA520;
	}
	.header .logo-header {
		width: 945px;
		position: absolute;
		opacity: .10;
		left: -260px;
		top: -340px;
		z-index: -1;
	}
	.header .logo-header,.sidebar-logo-header,.header.pages .logo-header {
		width: 40px;
		height: auto;
		top: 30px;
		right: 40px;
		position: fixed;
		opacity: 1;
		left: auto;
	}
	.portfolio .work{
		color:#fff;
		float:left;
	}
	.portfolio .work a {
		color: #a0a0a0;
		text-decoration: none;
		text-align: left;
		width: 100%;
		display: inline-block;
		font-size: 12px;
		margin-bottom: 40px;
	}
	.portfolio .work a h2 {
		color: #daa628;
		margin-bottom: 4px;
		font-weight: 200;
	}
	.portfolio .work a .work-item{
		width:100%;
		height:300px;
		margin-bottom: 14px;
		border:0px solid #fff;
		text-align: center;
		transition: all 0.5s;
		-webkit-transition: all 0.5s; /* Safari */
		position: relative;
		background-size: cover;
		background-position:center;
	}
	.portfolio .work a:hover .work-item{
		border:8px solid #fff;
	}
	.portfolio .work a .work-item div{
		display: none;
		position: absolute;
		top: 0;
		bottom:0;
		left:0;
		right: 0;
		text-align: center;
		font-weight: 600;
		font-size: 22px;
		vertical-align: middle;
		background-image:url("../img/bg-30.png");
		padding-top: 120px;
		opacity: .0;
		color:#fff;
	}
	.portfolio .work a:hover .work-item div{
		display: block;
		opacity:1;
	}
	.contact li {
		margin-bottom: 20px
	}
	.contact .info .social{
		margin-top:20px;
	}
	.contact .info .social a img{
		width: 30px;
		height:auto;
		margin-right: 12px;
		opacity: .6;
		transition: all .5s;
		-webkit-transition: all .5s; /* Safari */
	}
	.contact .info .social a:hover img{
		opacity: 1;
	}
	.contact a.resume {
		border:2px solid #333;
		background: none;
		padding: 15px;
		margin-top: 30px;
		display: block;
		transition: all .3s;
		-webkit-transition: all .3s; /* Safari */
		color:#333;
		display: inline-block;
		text-decoration: none;
	}
	.contact a.resume:hover {
		background: #DAA520;
		border:2px solid #DAA520;
		color:#fff;
	}
	.footer {
	}
	.footer .container {
		width: 100%;
		color:#DAA520;
		text-align: center;
		font-size: 10px;
		padding-bottom:0px;
	}

	/*------------EXTRA PAGES STYLES ---------------*/
	.header {
		padding-top: 100px;
	}
	.header .nav-mobile .back,.header .nav-desk .back {
		font-size: 40px;
		color: #DCDCDC;
		position: fixed;
		left: 40px;
		top: 24px;
		transition: all .3s;
		border: 2px solid #DCDCDC;
		padding: 1px 9px;
		border-radius: 100px;
		width: 45px;
		height: 45px;
	}
	.header .nav-mobile .back:hover, .header .nav-desk .back:hover {
		color: #DAA520;
		border: 2px solid #DAA520;
	}
	.header.pages img {
		width: 100%;
		margin-bottom: 20px;
	}
	.container-fluid .sidebar,
	.header .nav-desk .title {
		-webkit-transform: rotate(270deg);
		-moz-transform: rotate(270deg);
		-o-transform: rotate(270deg);
		-ms-transform: rotate(270deg);
		transform: rotate(270deg);
		position: fixed;
		top: 50%;
		right: -30px;
		font-size: 12px;
		color: #575757;
		font-family: 'Bitter', serif;
	}
	.header .nav-mobile {
		background: #fff;
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		height: 60px;
		z-index: 999;
		text-align: center;
		font-family: 'Bitter', serif;
		color:#333;
		font-size:22px;
		border-bottom: 1px solid #efefef;
		display: none;
	}
	.header .nav-mobile .back {
		font-size: 20px;
		top: 14px;
		left: 20px;
		padding: 3px 0px;
		width: 30px;
		height: 30px;
		border: 2px solid #dcdcdc;
	}
	.header.index a {
		display: none;
	}
	.header .nav-mobile img.logo-header {
		width: 32px;
		position: fixed;
		top: 11px;
		right: 18px;
	}
	.header .nav-mobile p{
		margin-top:14px;
		display: inline-block;
		border-bottom: 1px solid #dadada;
		font-size: 13px;
		padding-bottom: 2px;
	}
	.header .nav-mobile .title {
		color:#DAA520;
		font-family: 'Open Sans', sans-serif;
		font-size: 8px;
		margin-top: 2px;
	}

	.header .title {
		margin-bottom: 40px;
		font-size: 14px;	}

		@media (min-width: 1550px),
		@media (max-width: 1550px) {

		}

		@media (max-width: 1200px) {
			.container {
				padding: 20px 80px;
			}

		}

		@media (max-width: 992px) {
			.header .logo-header {
				display: block;
			}
			.portfolio,.contact{
				padding: 30px 20px 0px;
			}
			.portfolio {
				margin-bottom: 0px;
			}

			.header {
				padding: 60px 20px 0px;
			}
			.header.index {
				padding-top: 50px;
			}
			.sidebar-logo-header,.container-fluid .sidebar,.header .nav-desk {
				display: none;
			}
			.header .nav-mobile {
				display: block;
			}
			.header.index .index-name-title {
				display:none;
			}

		}

		@media (max-width: 768px) {
			.contact .info {
				margin-top: 60px;
			}

		}