/* ----------------------------------------------------------------------------
   # Created by: ThemeShifters
   # Date: October 4, 2013
   # Website: http://themeshifters.com
   # Main Stylesheet for Vinto HTML5 Template that is being sold on ThemeForest
   # Version: 1.1
   ---------------------------------------------------------------------------- */

/* Table of Content
==================================================
	# Default
	# Typography
	# Color Settings
	# Buttons
	# Form
	# CSS3
	# Shapes
	# Shapes with Icons
	# Buttons with Icons
	# DiamondSlider
	# Layout
	# Header
	# Header Logo
	# Project Item
	# Popup Window
	# Columns
	# Depth BG
	# Main Navigation
	# Separator
	# Carousel
	# Slider
	# Services
	# Team
	# Price Package
	# Bottom Arrow
	# Big Logo
	# Testimonials
	# Blog Posts
	# Pagination
	# Sidebar & Widgets
	# Ajax Loaders	
	# Lists
	# NProgress Spinner
	# Progress Bar
	# Misc.
	# Resets
	# Media Queries
*/

/*	==================================================
	# Default
	================================================== */
	html {
	    -webkit-font-smoothing: antialiased;
	}
	body {
		font-family: 'Roboto', Arial;
		font-weight: 300;
		color: #636363;
	}
	a:focus {
		outline: 0px;
	}
	a:hover,
	a:focus {
		text-decoration: none;
	}

/*	==================================================
	# Typography
	================================================== */
	h1,
	h2,
	h3,
	h4,
	h5,
	h6,
	.package-header,
	.special-font,
	.tagline {
		font-family: 'brandon-grotesque', 'Open Sans';
		font-weight: 800;
		color: #3d3d3d;
		text-transform: uppercase;
		}
	.logo {
		font-size: 45px;
		text-transform: uppercase;
		font-family: 'brandon-grotesque', 'Open Sans';
		font-weight: 400;
	}
	.main-nav {
		font-family: 'brandon-grotesque', 'Open Sans';
		font-weight: 400;
		
	}
	.section-title {
		margin: 100px 0 60px;
		font-size: 46px;
		text-transform: uppercase;
	}
	.sub-title {
		font-size: 14px;
		padding: 15px;
		background: #f10425;
		color: #fff;
		display: inline-block;
		margin: 20px 0 40px;
		font-weight: 600;
	}
	.tagline {
		font-weight: 600;
		font-size: 20px;
		line-height: 40px;
		margin-bottom: 40px;
	}
	h3 {
		font-size: 20px;
		margin: 35px 0 25px;
	}
	p {
		line-height: 25px;
		margin-bottom: 20px;
	}
	.normal-font,
	.normal-font li {
		font-family: 'Roboto', Arial!important;
		text-transform: lowercase!important;
		font-weight: 300!important;
	}

/*	==================================================
	# Color Settings
	================================================== */
	a {
		color: #f00423;
	}
	a:hover,
	a:focus {
		color: #000;
		text-decoration: none;
	}
	.font-white h1,
	.font-white h2,
	.font-white h3,
	.font-white h4,
	.font-white h5,
	.font-white h6,
	.font-white a:hover,
	.font-white a:focus {
		color: #fff;
	}

/*	==================================================
	# Buttons
	================================================== */
	.btn {
		font-family: 'brandon-grotesque', 'Open Sans';
		font-weight: 400;
		font-size: 13px;
		text-transform: uppercase;
		border: none;
		padding: 10px 18px;
		letter-spacing: 2px;
		border-radius: 2px;
	}
	.btn {
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}

	.btn-primary,
	.btn-primary.disabled,
	.btn-primary[disabled],
	fieldset[disabled] .btn-primary,
	.btn-primary.disabled:hover,
	.btn-primary[disabled]:hover,
	.btn-primary.disabled:focus,
	.btn-primary[disabled]:focus,
	fieldset[disabled] .btn-primary:focus,
	.btn-primary.disabled:active,
	.btn-primary[disabled]:active,
	fieldset[disabled] .btn-primary:active,
	.btn-primary.disabled.active,
	.btn-primary[disabled].active,
	fieldset[disabled] .btn-primary.active {
		background-color: #f00423;
		border-color: #f00423;
	}
	.btn-primary:hover,
	.btn-primary:focus,
	.btn-primary:active,
	.btn-primary.active,
	.open .dropdown-toggle.btn-primary {
		background-color: #000;
		border-color: #000;
	}

	.btn-border,
	.btn-border.disabled,
	.btn-border[disabled],
	fieldset[disabled] .btn-border,
	.btn-border.disabled:hover,
	.btn-border[disabled]:hover,
	.btn-border.disabled:focus,
	.btn-border[disabled]:focus,
	fieldset[disabled] .btn-border:focus,
	.btn-border.disabled:active,
	.btn-border[disabled]:active,
	fieldset[disabled] .btn-border:active,
	.btn-border.disabled.active,
	.btn-border[disabled].active,
	fieldset[disabled] .btn-border.active {
		border: 1px solid #636363;
		color: #636363;
		background: none;
	}
	.btn-border:hover,
	.btn-border:focus,
	.btn-border:active,
	.btn-border.active,
	.open .dropdown-toggle.btn-border {
		color: #f00423;
		border-color: #f00423;
	}
	.border-white {
		border-color: #fff;
		color: #fff;
	}

/*	==================================================
	# Form
	================================================== */
	textarea {
		resize: none;
	}
	.form-control {
		display: block;
		width: 100%;
		height: 38px;
		font-weight: 300;
		padding: 6px 12px;
		margin-bottom: 16px;
		line-height: 1.428571429;
		color: #5a5a5a;
		vertical-align: middle;
		background-color: #f4f4f4;
		background-image: none;
		border: none;
		border-radius: 2px;
		-webkit-box-shadow: none;
		box-shadow: none;
		-webkit-transition: background ease-in-out .15s;
		transition: background ease-in-out .15s;
	}
	.form-control:focus {
		border-color: #fff;
		-webkit-box-shadow: none;
		box-shadow: none;
		background: #e9e9e9;
	}
	textarea.form-control {
		padding: 10px 12px;
	}

	/** form control: dark version */
	.form-control.form-dark {
		color: #bbb;
		background-color: #3e3e3e;
	}
	.form-control.form-dark:focus {
		background: #303030;
	}

	.form-success {
		display: none;
		padding: 15px;
		margin-top: 40px;
		color: #fff;
		background: #f00423;
	}
	input.error,
	textarea.error {
		border: 1px solid #f00423;
	}
	.contact-form .loading {
		display: none;
		background: #000;
		background: url(assets/img/ajax_loader.gif) no-repeat;
		width: 25px;
		height: 25px;
		margin-top: 15px;
	}

/*	==================================================
	# CSS3
	================================================== */	
	a,
	img,
	.package-header {
		-webkit-transition: all 0.3s ease;
		-moz-transition: all 0.3s ease;
        -ms-transition: all 0.3s ease;
        -o-transition: all 0.3s ease;
		transition: all 0.3s ease;
	}
	.shape.diamond,
	.btn-icon {
		-webkit-transform: rotate(45deg); 
		-moz-transform: rotate(45deg);
		transform: rotate(45deg); 
		-o-transform: rotate(45deg); 
		-ms-transform: rotate(45deg);
		-webkit-border-radius: 10px;
		border-radius: 10px;

		/** fix for android browser */
		border-top-left-radius: 10px;
		border-top-right-radius: 10px;
		border-bottom-left-radius: 10px;
		border-bottom-right-radius: 10px;
	}
	.btn-icon {
		-webkit-border-radius: 4px;
		border-radius: 4px;

		/** fix for android browser */
		border-top-left-radius: 4px;
		border-top-right-radius: 4px;
		border-bottom-left-radius: 4px;
		border-bottom-right-radius: 4px;
	}
	.shape.diamond img,
	.shape.diamond .item-hover,
	.shape .fa,
	.btn-icon .fa {
		-webkit-transform: rotate(-45deg); 
		-moz-transform: rotate(-45deg);
		transform: rotate(-45deg); 
		-o-transform: rotate(-45deg); 
		-ms-transform: rotate(-45deg);
	}

	/** animations - add-on for animate.css */
	.no-delay {
		-webkit-animation-delay: .1s;
		-moz-animation-delay: .1s;
		animation-delay: .1s;

		-webkit-animation-duration: .5s;
  		animation-duration: .5s;
	}
	.delayed {
		-webkit-animation-delay: .3s;
		-moz-animation-delay: .3s;
		animation-delay: .3s;
	}
	.no-opacity {
		opacity: 0;
		transform-style: preserve-3d;
		-webkit-transform-style: preserve-3d;
	}
	.ie9 .no-opacity {
		opacity: 1.0;
	}

	/** ThemeShifters slideInUp */
	@-webkit-keyframes ts-slideInUp {
		0% {
			opacity: 0;
			-webkit-transform: translateY(100%);
			transform: translateY(100%);
		}
		100% {
			opacity: 1;
			-webkit-transform: translateY(0);
			transform: translateY(0);
		}
	}
	@keyframes ts-slideInUp {
		0% {
			opacity: 0;
    		-webkit-transform: translateY(100%);
    		-ms-transform: translateY(100%);
    		transform: translateY(100%);
  		}
  		100% {
  			opacity: 1;
    		-webkit-transform: translateY(0);
    		-ms-transform: translateY(0);
    		transform: translateY(0);
  		}
	}
	.ts-slideInUp {
  		-webkit-animation-name: ts-slideInUp;
  		animation-name: ts-slideInUp;
  		opacity: 1;
	}

/*	==================================================
	# Shapes
	================================================== */
	.shape.center {
		margin: auto;
	}
	.shape.diamond {
		display: block; 
		width: 110px;
		height: 110px;
		overflow: hidden; 
		position: relative;
		margin-top: 25px;
		margin-bottom: 55px;
	}
	.shape.diamond img {
		box-shadow: #000 0em 0em 0em;
	}
	.shape.diamond img,
	.shape.diamond .item-hover {
		position: relative; 
		overflow: hidden; 
		top: -22px; 
		left: -22px;
		right: -22px;
		bottom: -22px;
		max-width: 140%;
		text-align: center;
	}
	.shape.diamond.small {
		width: 95px;
		height: 95px;
	}
	.shape.diamond.small img,
	.shape.diamond.small .item-hover {
		top: -20px;
		bottom: -20px;
		left: -20px;
		right: -20px;
	}
	.shape.diamond.extra-small {
		width: 44px;
		height: 44px;
	}
	.shape.diamond.extra-small img,
	.shape.diamond.extra-small .item-hover {
		top: -10px;
		bottom: -10px;
		left: -10px;
		right: -10px;
	}

	/* margin fix for sidepull */
	.pull-right .shape.diamond {
		margin-right: 22px;
	}
	.pull-right .shape.diamond.small {
		margin-right: 20px;
	}

/*	==================================================
	# Shapes with Icons
	================================================== */
	.shape.dark {
		background: #3d3d3d;
		color: #fff;
	}
	.shape-icon {
		text-align: center;
		line-height: 134px;
	}
	.shape .fa {
		display: inline-block;
		position: relative;
		font-size: 50px;
	}
	.shape-icon.small {
		line-height: 112px;
	}
	.shape-icon.small .fa {
		font-size: 42px;
	}

/*	==================================================
	# Buttons with Icons
	================================================== */
	.btn-icon {
		background-color: #f3f2f2;
		color: #3d3d3d;
		display: inline-block;
		margin: 0 8px 13px 5px;

		width: 30px;
		height: 30px;
		padding: 0;
		font-size: 16px;
		line-height: 29px;
		backface-visibility: hidden;
	}
	.btn-icon-white {
		background-color: #fff;
	}
	.btn-icon:hover,
	.btn-icon:focus {
		background-color: #f00423;
		color: #fff;
	}
	.btn-icon .fa {
		display: inline-block;
	}

/*	==================================================
	# DiamondSlider
	================================================== */
	.diamondslider {
		position: relative;
		z-index: 60;
	}
	.diamondslider .diamond-viewport {
		position: relative;
		overflow: hidden;
	}
	.diamondslider .slides {
		z-index: 60;
		margin: 0;
		padding: 0;
		position: relative;
		-webkit-transition: -webkit-transform 700ms ease; /* Changed here */ 
     	-moz-transition: -moz-transform 700ms ease;
       	-o-transition: -o-transform 700ms ease;
		transition: transform 700ms ease;
	}
	.diamondslider .shape {
		margin: 0;
		position: absolute;
		display: none;
		-webkit-transition: -webkit-all 700ms ease; /* Changed here */ 
     	-moz-transition: -moz-all 700ms ease;
       	-o-transition: -o-all 700ms ease;
		transition: all 700ms ease;
	}
	.diamondslider .shape.active {
		z-index: 50;
	}
	
	/** DiamondSlider: Direction Navigation */
	.diamond-dir-nav {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	.diamond-dir-nav > li {
		width: 9px;
		height: 15px;
		background: url(assets/img/diamondslider/direction_nav.png);
		position: absolute;
		top: 50%;
		margin-top: -8px;
		opacity: 0.7;
	}
	.nav-white .diamond-dir-nav > li {
		background-image: url(assets/img/diamondslider/direction_nav_white.png);
		opacity: 1.0;
	}
	.diamond-dir-nav > .inactive {
		opacity: 0.1!important;
	}
	.diamond-dir-nav > .inactive a {
		cursor: default;
	}
	.diamond-dir-nav .diamond-prev-nav {
		left: 0;
	}
	.diamond-dir-nav .diamond-next-nav {
		background-position: 100% 0;
		right: 0;
	}
	.diamond-dir-nav > li a {
		display: block;
		width: 100%;
		height: 100%;
	}

	/** DiamondSlider: Category Navigation */
	.diamond-filter {
		position: relative;
		margin-bottom: 60px;
	}
	.diamond-filter ul {
		list-style: none;
		padding: 0;
		margin: 0;
		display: block;
		text-align: center;
		font-weight: 400;
	}
	.diamond-filter ul > li {
		display: inline-block;
		text-transform: uppercase;
		font-size: 13px;
		margin: 0 15px;
	}
	.diamond-filter ul > li a {
		color: #3d3d3d;
	}
	.diamond-filter.font-white ul > li a {
		color: #fff;
	}
	.diamond-filter ul > li a:hover,
	.diamond-filter ul > .active a,
	.diamond-filter.font-white ul > li a:hover,
	.diamond-filter.font-white ul > .active a {
		color: #f00423;
	}

	/** Item Hover */
	.item-hover {
		background: rgba(240, 4, 35, 0.75);
		position: absolute!important;
		z-index: 80;
		display: none;
		overflow: hidden;
		font-size: 13px;
		width: 140%;
		height: 140%;
	}
	.small .item-hover {
		font-size: 12px;
	}
	.item-hover span {
		display: block;
		color: #fff;
	}
	.item-hover .hover-title {
		/*margin-top: 37.3134%;*/
		margin-top: -30%;
		font-weight: 500;
		padding: 0 20px;
	}
	.item-hover .hover-action {
		margin-top: 3.7313%;
		font-style: italic;
	}

	/** when item hover is set to show */
	.item-hover.show {
		display: block;
	}
	.item-hover.show .hover-title {
		margin-top: 37.3134%;
	}

/*	==================================================
	# Layout
	================================================== */
	.header-type {
		font-size: 13px;

		top: 0;
		left: 0;
		right: 0;
		z-index: 999;
		position: fixed;
	}
	.separator-type,
	.title-type {
		position: relative;
	}
	.footer-type {
		background: #fff;
		color: #5c5c5c;
		font-size: 12px;
		padding: 15px 0;
	}

	.page-type .container {
		padding-bottom: 90px;
	}
	.title-type .container {
		padding: 110px 0;
	}
	.title-type .section-title {
		margin: 0;
	}

	.black-bg {
		background-color: #000;
	}
	.grey-bg {
		background-color: #f4f4f4;
	}
	.grey2-bg {
		background-color: #f3f2f2;
	}

	/** home **/
	#home {
		background: url(demo/bg/home-bg.png) bottom no-repeat #000;
	}
	#home .container {
		padding-bottom: 210px;
	}

	/** about **/
	#about-us {
		background: url(demo/bg/about-bg.png) 
		background-position: top; no-repeat 
		background-repeat: no-repeat;
		#fff;
	}
	#about-us .container {
		padding-top: 30px;
	}

	/** services **/
	#services .container {
		padding-bottom: 380px;
	}

	/** portfolio **/
	#portfolio {
		background-image: url(demo/bg/portfolio-bg.png);
		background-position: top;
		background-repeat: no-repeat;
	}
	#portfolio .container {
		padding-top: 30px;
	}

	/** team **/
	#team {
		background-image: url(demo/bg/about-bg.png);
		background-position: top;
		background-repeat: no-repeat;
	}
	#team .container {
		padding-bottom: 200px;
	}

	/** pricing **/
	#pricing {
		background-image: url(demo/bg/pricing-bg.png);
		background-position: top;
		background-repeat: no-repeat;
	}
	#pricing .container {
		padding-top: 40px;
	}

	/** blog **/
	#content {
		padding-top: 100px;
		padding-bottom: 50px;
	}

/*	==================================================
	# Header
	================================================== */
	.header-type .header-inner {
		text-transform: uppercase;
		padding: 0;
		background-color: rgba(0, 0, 0, 0.4);
background:rgba(0, 0, 0, 0.4);

		position: relative;
		z-index: 999;
		
	}
	.header-box {
		position: absolute;
		left: 0;
		right: 0;
		z-index: 100;
	}
	.header-box-inner {
		padding: 45px 0;
		background: #000;
		background: rgba(23,22,22,0.98);
	}
	.header-box-inner.opened {
		display:block;
	}
	.header-box-inner.closed {
		display: none;
	}
	.header-box-trigger {
		width: 32px;
		height: 14px;
		background: url(assets/img/trigger-headerbox-arrow.png);
		display: block;
		position: absolute;
		bottom: -14px;
		left: 50%;
		margin-left: -16px;
		cursor: pointer;

		color: #fff;
		font-size: 8px;
		line-height: 6px;
		text-align: center;
	}
	.header-box-trigger.trigger-light {
		background: url(assets/img/trigger-headerbox-arrow-light.png);
	}

/*	==================================================
	# Header Logo - edit: v1.1
	================================================== */
	.logo {
		margin: 20px 0;
	}
	.logo,
	.logo a {
		height: 20px;
		display: block;
	}
	.logo img {
		height: 100%;
	}

/*	==================================================
	# Project Item
	================================================== */
	.project-item {
		padding: 130px 0;
	}
	.project-item .container {
		position: relative;
	}
	.project-media img {
		max-width: 100%;
	}
	.project-media .project-img {
		margin: 0 0 30px;
	}
	.project-media,
	.project-media .slider,
	.project-media .project-img {
		border-radius: 6px!important;
		-webkit-border-radius: 6px!important;
		overflow: hidden;
	}

	/** style one **/
	.style-one .project-media {
		margin-left: 50px;
	}
	.style-one .project-content {
		margin-left: 15px;
	}

	/** style two **/
	.style-two .project-media,
	.style-two .project-content {
		margin: 0 50px;
	}
	.style-two .project-media {
		margin-bottom: 40px;
	}

	.project-title {
		margin: 0 0 25px;
	}

	/** project navigation */
	.project-nav {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	.project-nav .exit {
		position: absolute;
		top: 0;
		right: 0;
		z-index: 50;
	}
	.project-nav .exit a {
		display: block;
		width: 30px;
		height: 30px;
		background: #d8d8d8;
		text-align: center;
		line-height: 30px;

		border-radius: 4px;
		-webkit-border-radius: 4px;

		color: #fff;
	}
	.project-nav .exit a:hover {
		background: #aaa;
	}
	.project-nav .prev a,
	.project-nav .next a {
		background: url(assets/img/diamondslider/direction_nav.png);
		opacity: 0.3;
		display: block;
		width: 9px;
		height: 15px;
		position: absolute;
		top: 50%;
		z-index: 50;
		margin-top: -8px;
	}
	.project-nav .prev a {
		left: 0;
	}
	.project-nav .next a {
		background-position: 100% 0;
		right: 0;
	}
	.project-nav .prev a:hover,
	.project-nav .next a:hover {
		opacity: 0.7;
	}
	.project-nav .disabled a,
	.project-nav .disabled a:hover {
		opacity: 0.2;
		cursor: default;
	}

/*	==================================================
	# Popup Window
	================================================== */
	.tsp-wrap {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1043;
		width: 100%;
		height: 100%;
		background: #fff;
		overflow-x: hidden;
		overflow-y: scroll;
		outline: none !important;
  		-webkit-backface-visibility: hidden;
	}
	.tsp-container {
	    -webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	    width: 100%;
	    height: 100%;
	    top: 0;
	    left: 0;
	    padding: 0 8px;
	    position: absolute;
	    text-align: center;
	}
	.tsp-container:before {
		content: "";
		display: inline-block;
		height: 100%;
		vertical-align: middle;
	}
	.tsp-content {
	    display: inline-block;
	    margin: 0 auto;
	    position: relative;
	    text-align: left;
	    vertical-align: middle;
	    z-index: 1045;
	    cursor: auto;
	    width: 100%;
	}

/*	==================================================
	# Columns
	================================================== */
	.col-xtra-1 {
		float: left;
		padding: 0 15px;
		position: relative;
		min-height: 1px;
	}
	.col-xtra-1 {
		width: 17.5%;
	}
	.col-xtra-offset-1 {
		margin-left: 5%;
	}
	.col-xtra-offset-4 {
		margin-left: 20%;
	}


/*	==================================================
	# Embedded Media
	================================================== */
	embed, iframe, object, video {
		max-width: 100%;
	}


/*	==================================================
	# Depth BG
	================================================== */
	.depth-type {
		position: relative;
		z-index: 0;
	}
	.depth-type .container {
		position: relative;
		z-index: 10;
	}
	.depth-bg {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background-repeat: no-repeat;
		background-position: bottom;
		overflow: hidden;
		z-index: 0;
	}
	.depth-bg .depth-img {
		position: absolute;
		bottom: 0;
		z-index: -100;
		left: 50%;
		margin-left: -401px;
	}
	.depth-bg .depth-slider {
		z-index: -100;
	}
	.depth-bg .depth-texture {
		display: block;
		background: url(assets/img/texture-dark.png);
		position: absolute;
		top: 0;
		bottom: 0;
		width: 100%;
		z-index: 50;
	}
	.depth-bg .depth-texture.light {
		opacity: 0.7;
	}
	.depth-bg .depth-bg-img {
		display: block;
		background-repeat: no-repeat;
		background-position: bottom;
		width: 100%;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		position: absolute;
		z-index: 100;
	}

	
/*	==================================================
	# Main Navigation - edit: v1.1
	================================================== */
	.main-nav li {
		margin: 0 0 1em 0;
	padding: 0;
		float: left;
		
	}
	.main-nav li a {
		color: #fff;
		padding: 20px 15px;

	}
	.nav > li > a:hover,
	.nav > li > a:focus,
	.nav > .current-menu-item > a {
		color: #f00423;
		background: none;
		
	}
	.nav > li .sub-menu {
		display: none;
		position: absolute;
		width: 180px;

		list-style: none;
		margin: 0;
		padding: 0;

		background: #000;
	}
	.nav > li > .sub-menu li {
		position: relative;
	}
	.nav > li > .sub-menu .sub-menu {
		position: absolute;
		width: 180px;
		left: 180px;
		top: 0;
	}
	.nav li:hover > .sub-menu {
		display: block;
	}
	.nav > li > .sub-menu li,
	.nav > li > .sub-menu a {
		float: none;
		display: block;
		color: #888;
		padding: 0 15px;
	}
	.nav > li > .sub-menu a {
		padding: 10px 0;
		font-size: 11px;
		border-top: 1px solid #222;
	}
	.nav > li > .sub-menu a:hover {
		color: #fff;
	}

	/** mobile navigation */
	#trigger-mobile-nav {
		width: 20px;
		height: 20px;
		background: none;
		display: none;
		position: absolute;
		right: 15px;
		top: 20px;
		cursor: pointer;
		line-height: 0;
		color: #fff;
	}
	#trigger-mobile-nav .fa {
		font-size: 20px;
	}

/*	==================================================
	# Separator
	================================================== */
	.separator-type .container {
		padding: 175px 0;
	}
	.separator-type.carousel-type .container {
		padding: 100px 0;
	}
	.separator-type .tagline {
		color: #fff;
	}

	/** parallax */
	.parallax {
		background-attachment: fixed!important;
		background-position: center;
		background-repeat: repeat;
		background-size: cover;

		position: absolute;
		top: 0;
		bottom: 0;
		width: 100%;

		z-index: -10;
	}

	/** textures */
	.texture:after {
		content: "";
		display: block;
		background: url(assets/img/texture-dark.png);
		position: absolute;
		top: 0;
		bottom: 0;
		width: 100%;
		z-index: -10;
	}

/*	==================================================
	# Carousel
	================================================== */
	.carousel {
		margin: 10px 0 30px;
	}
	.carousel .carousel-item {
		text-align: center;
	}
	.carousel img {
		display: inline-block;
		opacity: 0.25;
	}
	.carousel .carousel-item:hover img {
		opacity: 1.0;
	}
	.carousel-wrapper {
		margin: 0 50px;
	}

	/** prev/next navigation */
	.owl-controls .owl-buttons div {
		width: 9px;
		height: 15px;
		background: url(assets/img/diamondslider/direction_nav.png);
		position: absolute;
		top: 50%;
		margin-top: -8px;
		opacity: 0.2; 
	}
	.nav-white .owl-controls .owl-buttons div {
		background: url(assets/img/diamondslider/direction_nav_white.png);
	}
	.owl-controls .owl-buttons div:hover {
		opacity: 0.7;
	}
	.nav-white .owl-controls .owl-buttons div:hover {
		opacity: 1.0;
	}
	.owl-controls .owl-buttons .owl-next,
	.owl-controls .owl-buttons .owl-next:hover {
		background-position: 100% 0!important;
	}
	.owl-controls .owl-buttons .owl-prev {
		left: -50px;
	}
	.owl-controls .owl-buttons .owl-next {
		right: -50px;
	}
	.owl-controls .owl-buttons .disabled {
		display: block;
		opacity: 0.1;
	}

/*	==================================================
	# Slider
	================================================== */
	.slider {
		margin: 0 0 30px;
	}
	/** prev/next navigation */
	.slider .owl-controls .owl-buttons div {
		width: 30px;
		height: 30px;
		background: url(assets/img/slider_nav_white.png);
		position: absolute;
		bottom: 15px;
		top: auto;
		opacity: 0.25;
	}
	.slider .owl-controls .owl-buttons div:hover {
		opacity: 1.0;
	}
	.slider .owl-controls .owl-buttons .owl-next,
	.slider .owl-controls .owl-buttons .owl-next:hover {
		background-position: 100% 0!important;
	}
	.slider .owl-controls .owl-buttons .owl-prev {
		left: 15px;
	}
	.slider .owl-controls .owl-buttons .owl-next {
		right: 15px;
	}

/*	==================================================
	# Services
	================================================== */
	.service {
		margin: 30px 0;
		position: relative;
		z-index: 10;
	}
	.service-title {
		margin: 30px 0 35px;
	}
	.service.bottom-arrow {
		padding: 0 37px 20px;
	}

/*	==================================================
	# Team
	================================================== */
	#diamondslider-team {
		margin-top: 45px;
	}

	/** team tabs */
	.team-panes {
		margin-top: 40px;
	}
	.team-pane {
		display: none;
	}
	.team-function {
		font-size: 13px;
		color: #f00423;
		text-transform: uppercase;
		font-weight: 400;
		line-height: 16px;
		margin-bottom: 50px;
	}
	.team-button {
		margin-top: 20px;
	}

	/** team member page */
	.team-title {
		margin: 0 0 15px;
	}

/*	==================================================
	# Price Package
	================================================== */
	.price-package {
		margin: 30px 0;
		position: relative;
		z-index: 10;
	}
	.package-header {
		background: #3d3d3d;
		color: #fff;
		padding: 20px 30px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
	}
	.price-package:hover .package-header {
		background: #000;
	}
	.package-header .name {
		font-size: 20px;
	}
	.price {
		display: inline-block;
		position: relative;
		margin: 15px 0;
	}
	.price .sign {
		font-size: 22px;
		font-weight: 400;
		position: absolute;
		top: 0;
		left: 0;
	}
	.price .number {
		font-size: 62px;
		font-weight: 600;
		line-height: 62px;
		padding-left: 15px;
	}
	.price .period {
		font-size: 11px;
		font-weight: 800;
	}
	.package-header .info {
		opacity: 0.3;
		font-size: 10px;
	}
	.package-features ul {
		list-style: none;
		padding: 15px 0;
	}
	.package-features li {
		padding: 10px 10px;
	}
	.package-features li:hover {
		background: #f3f2f2;
	}

/*	==================================================
	# Bottom Arrow
	================================================== */
	.bottom-arrow {
		padding-bottom: 20px;
		margin-bottom: 0;
	}
	.bottom-arrow:after {
		content: "";
		display: block;
		background: url(assets/img/bottom-arrow-white.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 219px;
		height: 100px;
		position: absolute;
		bottom: -54px;
		z-index: -10;
		left: 0;
		right: 0;
	}

/*	==================================================
	# Big Logo
	================================================== */
	.big-logo {
		margin: 80px 0 60px;
	}

/*	==================================================
	# Testimonials
	================================================== */
	.testimonials-wrapper {
		margin: 0 40px;
	}
	.testimonial-content {
		background: #fff;
		padding: 35px;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		width: 660px;
		position: relative;
	}
	.testimonial-content:after {
		content: "";
		display: block;
		width: 0;
		height: 0;
		border-bottom: 8px solid transparent;
		border-left: 7px solid #fff;
		border-top: 7px solid transparent;
		top: 73px;
		right: -7px;
		position: absolute;
		z-index: 15;
	}
	.testimonial-author {
		margin: 35px 0 0;
	}

	/** prev/next navigation */
	.testimonials-wrapper .owl-controls .owl-buttons .owl-prev {
		left: -40px;
	}
	.testimonials-wrapper .owl-controls .owl-buttons .owl-prev {
		right: -40px;
	}

/*	==================================================
	# Blog Posts
	================================================== */
	.post {
		padding-bottom: 40px;
		border-bottom: 1px solid #f4f4f4;
		margin-bottom: 40px;
	}
	.post:last-child {
		padding-bottom: 0;
		border-bottom: 0;
	}
	.post-title {
		font-size: 36px;
	}
	.post-title,
	.post-title a {
		color: #3d3d3d;
	}
	.post-media {
		margin-bottom: 45px;
		border-radius: 4px;
		-webkit-border-radius: 4px;
		overflow: hidden;
	}
	.post-media img {
		width: 100%;
		height: 100%;
	}
	.post-header {
		margin-bottom: 25px;
	}

	/** post meta / comment meta */
	.post-meta,
	.comment-meta {
		margin-top: 25px;
	}
	.comment-meta {
		margin: 0 0 20px;
		border-bottom: 1px solid #f4f4f4;
	}
	.post-meta ul,
	.comment-meta ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	.post-meta ul li,
	.comment-meta ul li {
		float: left;
		margin-right: 15px;
	}
	.post-meta .fa,
	.comment-meta .fa {
		margin-right: 5px;
	}
	.post-meta a,
	.post-meta .fa,
	.comment-meta a,
	.comment-meta .fa {
		color: #636363;
		opacity: 0.5;
	}
	.post-meta li:hover,
	.post-meta a:hover,
	.comment-meta li:hover,
	.comment-meta a:hover {
		opacity: 1;
	}

	/** blog comments */
	.comments-area {
		margin-bottom: 50px;
	}
	.reply-title {
		padding-bottom: 40px;
		border-bottom: 1px solid #f4f4f4;
		margin-bottom: 35px;
	}
	.commentlist,
	.commentlist .children {
		list-style: none;
		padding: 0;
		margin: 0;
	}
	.commentlist .children {
		margin-left: 10%;
	}
	.commentlist > li {
		border-top: 1px solid #f4f4f4;
		padding-top: 15px;
		margin-bottom: 25px;
	}
	.commentlist > li:first-child {
		border: 0;
		padding-top: 0;
	}
	.comment-reply,
	.comment-reply a,
	.comment-reply .fa {
		color: #f00423;
		opacity: 1;
	}
	.comment-img {
		float: left;
		width: 65px;
		height: 65px;
	}
	.comment-meta {
		padding: 35px 0 15px 0;
	}
	.comment-meta,
	.comment-content {
		margin-left: 80px;
	}

	/** comment placement */
	.comment-respond {
		margin-top: 80px;
	}

/*	==================================================
	# Pagination
	================================================== */
	.pagination > li > a,
	.pagination > li > span {
		line-height: 1.5;
	}
	.pagination > .active > a,
	.pagination > .active > span,
	.pagination > .active > a:hover,
	.pagination > .active > span:hover,
	.pagination > .active > a:focus,
	.pagination > .active > span:focus {
		border-color: #f00423;
		background-color: #f00423;
	}

/*	==================================================
	# Sidebar & Widgets
	================================================== */
	.sidebar {
		padding-left: 40px;
	}
	/** main widget elements */
	.widget {
		margin-bottom: 45px;
	}
	.widget:last-child {
		margin-bottom: 0;
	}
	.widget-title {
		margin: 0 0 20px;
		padding-bottom: 20px;
		border-bottom: 1px solid #f4f4f4;
	}
	.header-box .widget-title {
		margin-bottom: 25px;
		padding-bottom: 0;
		border: 0;
	}
	.widget ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}

	/** categories widget */
	.widget ul li,
	.tagcloud a {
		font-family: 'brandon-grotesque', Arial, sans-serif;
		font-weight: 400;
		font-size: 13px;
		text-transform: uppercase;
		display: block;
		margin-bottom: 5px;
	}
	.widget ul li,
	.widget_categories a,
	.tagcloud a {
		color: #636363;
	}
	.widget_categories li .cat-count {
		padding: 0 5px;
		background: #f4f4f4;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		float: right;
	}
	.widget_categories li:hover,
	.widget li:hover a {
		color: #f00423;
	}
	.widget_categories li:hover .cat-count {
		background: #f00423;
		color: #fff;
	}

	/** tagcloud */
	.tagcloud a {
		padding: 5px 10px;
		border: 1px solid #636363;
		border-radius: 3px;
		-webkit-border-radius: 3px;
		display: inline-block;
		margin: 0 10px 10px 0;
	}
	.tagcloud a:hover {
		border-color: #f00423;
		color: #f00423;
	}

	/** recent entries */
	.widget_recent_entries .post-date {
		display: block;
		font-size: 11px;
		margin: 5px 0 15px;
	}

	/** twitter widget */
	.tweet_list > li {
		margin-bottom: 15px!important;
	}
	.tweet_text,
	.tweet_time {
		display: block;
	}
	.tweet_time {
		font-size: 11px;
		margin-top: 5px;
	}

/*	==================================================
	# Ajax Loaders
	================================================== */
	.ajax-preloader {
		background-image: url(assets/img/ajax_loader.gif);
		background-repeat: no-repeat;
		background-position: center;
		min-height: 30px;
	}

/*	==================================================
	# Lists
	================================================== */
	/** data table */
	.data-table {
		position: relative;
		width: 100%;
		list-style: none;
		padding: 0;
	}
	.data-table .data-type {
		font-weight: bold;
		width: 25%;
		display: block;
		float: left;
	}
	.data-table .data-content {
		display: block;
		width: 75%;
		padding-left: 5%;
		float: left;
	}
	.data-table > li {
		margin-bottom: 5px;
		overflow: hidden;
	}

/*	==================================================
	# NProgress Spinner
	================================================== */
	/* Make clicks pass-through */
	#nprogress {
	 	pointer-events: none;
	}

	#nprogress .bar {
	 	background: #000;

		position: fixed;
		z-index: 1100;
		top: 0;
		left: 0;

		width: 100%;
		height: 2px;
	}

	/* Fancy blur effect */
	#nprogress .peg {
	  	display: block;
	  	position: absolute;
	  	right: 0;
	  	width: 100px;
	  	height: 100%;
	  	box-shadow: 0 0 10px #000, 0 0 5px #000;
	 	opacity: 1.0;

	  	-webkit-transform: rotate(3deg) translate(0px, -4px);
	      	-ms-transform: rotate(3deg) translate(0px, -4px);
	          	transform: rotate(3deg) translate(0px, -4px);
	}

	/* Remove these to get rid of the spinner */
	#nprogress .spinner {
	  display: block;
	  position: fixed;
	  z-index: 1100;
	  top: 15px;
	  right: 15px;
	}

	#nprogress .spinner-icon {
		width: 18px;
		height: 18px;
		box-sizing: border-box;

		border: solid 2px transparent;
	 	border-top-color: #000;
	  	border-left-color: #000;
	  	border-radius: 50%;

	  	-webkit-animation: nprogress-spinner 400ms linear infinite;
	        	animation: nprogress-spinner 400ms linear infinite;
	}

	@-webkit-keyframes nprogress-spinner {
	  0%   { -webkit-transform: rotate(0deg); }
	  100% { -webkit-transform: rotate(360deg); }
	}
	@keyframes nprogress-spinner {
	  0%   { transform: rotate(0deg); }
	  100% { transform: rotate(360deg); }
	}

/*	==================================================
	# Progress Bar
	================================================== */
	.skill {
		margin-bottom: 3px;
		font-weight: bold;
	}
	.progress,
	.progress-bar {
		-webkit-box-shadow: none;
  		box-shadow: none;
	}
	.progress {
		border-radius: 3px;
		-webkit-border-radius: 3px;
		background-color: #f3f2f2;
		height: 30px;
	}
	.progress-bar {
		background-color: #f3052a;
	}

/*	==================================================
	# Misc.
	================================================== */
	.spacing {
		display: block;
		width: 100%;
	}

/*	==================================================
	# Resets
	================================================== */
	.top-margin-60 {
		margin-top: 60px;
	}
	.bottom-margin-60 {
		margin-bottom: 60px;
	}
	.no-margin-top {
		margin-top: 0;
	}
	.no-margin-bottom {
		margin-bottom: 0;
	}
	.no-padding-bottom {
		padding-bottom: 0!important;
	}

	/** 
	 *	Disable function classes 
	 */
	.disable-parallax {
		background-position: 0!important;
		background-attachment: scroll!important;
	}

/*	==================================================
	# Media Queries
	================================================== */
	@media screen and (min-width: 1900px){
		.depth-bg .depth-slider .owl-item img {
			width: 100%;
		}
	}

	@media screen and (max-width: 991px){
		/** mobile navigation */
		#trigger-mobile-nav {
			display: block;
		}
		.mobile-nav {
			width: 100%;
			margin-bottom: 20px;
			display: none;
			overflow-x: hidden;
			max-height: 420px;
		}
		.mobile-nav .nav li {
			float: none;
		}
		.mobile-nav .nav > li > a {
			font-size: 12px;
			border-top: 1px solid #333;
			padding: 10px 0;
		}
		.mobile-nav .nav > li:first-child > a {
			border-top: 0px;
		}

		/** mobile sub-menu - since v1.1 */
		.nav > li > .sub-menu,
		.nav > li > .sub-menu .sub-menu {
			display: block;
			position: static;
			width: 100%;
		}
		.nav > li > .sub-menu a,
		.nav > li > .sub-menu .sub-menu a {
			padding: 10px 15px;
			font-size: 11px;
		}
		/** end since v1.1 */

		/** disable header box */
		.header-box {
			display: none;
		}

		/** disable parallax functionality */
		.parallax {
			background-position: 0!important;
			background-attachment: scroll!important;
		}

		/** extra columns */
		.col-xtra-1 {
			width: 100%;
		}
		.col-xtra-offset-1,
		.col-xtra-offset-4 {
			margin-left: 0;
		}

		/** depth bg */
		.depth-type .container {
			padding-bottom: 90px!important;
		}
		.depth-bg .depth-img {
			display: none;
		}

		/** blog */
		.sidebar {
			padding-left: 15px;
		}

		/** disable bottom arrow */
		.bottom-arrow {
			padding-bottom: 0;
			margin-bottom: 30px;
		}
		.bottom-arrow:after {
			display: none;
		}
	}

	@media screen and (min-width: 768px) and (max-width: 991px){
		.container{
			width: 738px;
		}

		/** testimonials */
		.testimonial-content {
			width: 450px;
		}
	}

	@media screen and (max-width: 767px){
		/** testimonials */
		.testimonial-content {
			width: 100%;
		}
		.testimonial-thumb {
			margin-top: 30px;
		}

		/** project item */
		.style-one .project-media,
		.style-one .project-content,
		.style-two .project-media,
		.style-two .project-content {
			margin-left: 25px;
			margin-right: 25px;
		}
		.style-one .project-media,
		.style-two .project-media {
			margin-bottom: 40px;
		}
	}

	@media screen and (min-width: 480px) and (max-width: 767px){
		.container{
			width: 420px;
		}
	}

	@media screen and (max-width: 479px){
		.container{
			width: 290px;
		}

		/** fonts */
		.section-title {
			font-size: 34px;
		}
	}