/*------------------------------------------------------------------
[Master Stylesheet]

Project: ONION template	
Version: 1.0
Last change: 04/07/2015
Author: ShindiriStudio
-------------------------------------------------------------------*/

/* ---------------- Table of contents ----------------------	

	1. BASE
	2. LOADER
	3. HEADER
	4. MENU
	5. INDEX PAGE
	6. WORK PAGE
	7. SINGLE PROJECT PAGE
	8. BLOG ARCHIVE PAGE
	9. BLOG POST PAGE
	10. ABOUT US PAGE
	11. SERVICES PAGE
	12. CONTACT PAGE
	13. FOOTER
	14. COLOR SWITCHER
	15. RESPONSIVE DESIGN

/* --------------------------------------------------------	*/


/************************* */
/* 1. BASE */
/************************* */
@font-face{font-family:"futura";src:url("fonts/futura.eot");src:url("fonts/futura.eot?#iefix") format("eot"),url("fonts/futura.woff") format("woff"),url("fonts/futura.ttf") format("truetype"),url("fonts/futura.svg#webfontfuvdSzbb") format("svg");font-weight:normal;font-style:normal}

.port {
padding-top:10px; 
padding-left:0px;"
}

.portf {
	display: block; 
}

.tt {
	margin-right:20px;
	font-size:13px;
	margin-bottom:13px;
	vertical-align:middle;
	display:inline-block;
	font-family: 'Futura', serif;
	text-transform:uppercase;
	letter-spacing:2px;
}

.tata {
	display:inline-block; 
	line-height:53px; 
	margin-right:20px;
		font-size:28px;
}

.tutu {
	font-size:28px;
	line-height:60px;
}

.titi {
	max-width:1920px;
	border-bottom:2px solid #000;
}

.long {
	max-width:1920px;
}

body {
	padding: 0;
	margin-left:10px;
	margin-right:10px;
	
	height: 100%;
	font-family: 'Futura', sans-serif;
	font-weight: 300;
	font-size:16px;
	color: #222222;
	line-height: 28px;
}

a, button {
    outline: medium none !important;
    text-decoration: none !important;
}

b, strong {
    font-weight: 600;
}

p{
	margin:0;
	font-size:18px;
	color:#86827F;
	line-height:38px;
}

ul {
    margin: 0;
    padding: 0;
}

ul, li, ol {
    list-style-type: none;
}

img {
    height: auto;
    max-width: 100%;
}

h1, h2, h3, h4, h5, h6{
	font-family: 'Futura', sans-serif;
	font-weight: 800;
	color:#222222;
	
}

h1{	
	color:#fff;
	font-size:55px;
	line-height:78px;
	margin:4px auto 15px;
}

h1 span{
    box-decoration-break: clone;
}

h2{
	color:#fff;
	font-size:45px;
	line-height:55px;
	margin:10px 0 20px;
}

h3{
	font-size:30px;	
	line-height:35px;
	margin:10px 0 0;
}

.subtitle{
	font-family: 'Futura', serif;
	font-size:18px;
	color:#fff;
	
	
}

.subtitle.small{
	font-size:22px;
	
	
}

.subfont{
	font-family: 'Futura', serif;
	text-transform:uppercase;
	letter-spacing:1px;
}

::selection {
	color:#fff;
}

::-moz-selection {
	color:#fff;
}

#main{
	padding-top:72px;
}

.col-centered{
    float: none;
    margin: 0 auto;
}

.btn {
	position:relative;
	color: #fff;
	font-family: 'Merriweather', serif;
	font-size:18px;
	font-weight:300;
	text-align:left;
	cursor: pointer;
	padding: 12px 70px 10px 35px;
	margin:0;
	border:1px solid #fff;
	border-radius:52px;
	display: inline-block;
	overflow:hidden;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	transform: skew(0deg);
    -o-transform: skew(0deg);
    -moz-transform: skew(0deg);
    -webkit-transform: skew(0deg);
}

.btn:hover{
	border-color: transparent;
}

.btn:hover .icon-arrow,
.btn.dark .icon-arrow{
	background-position:0 -17px;
}

.btn.dark:focus .icon-arrow{
	background-position:0 0;
}

.btn:focus{
	background-color:#fff;
	color:#222222;
}

.btn:after {
    background-color: #fff;
    content: "";
	width: 0;
    height: 102%;    
    position: absolute;
    top: 0;
	left: -10px;
    transition: all 320ms ease 0s;
	-o-transition: all 320ms ease 0s; 
	-ms-transition: all 320ms ease 0s; 
	-moz-transition: all 320ms ease 0s; 
	-webkit-transition: all 320ms ease 0s;     
	z-index:-1;
	transform: skew(-15deg);
    -o-transform: skew(-15deg);
    -moz-transform: skew(-15deg);
    -webkit-transform: skew(-15deg);
}

.btn:hover:after {
    width: 125%;
}

.btn span{
	display:inline-block;
	transform: skew(0deg);
    -o-transform: skew(0deg);
    -moz-transform: skew(0deg);
    -webkit-transform: skew(0deg);	
}

.btn .icon-arrow {
	position: absolute;
	background:url(images/btn-arrow.png) 0 0;
	display:block;
	width:28px;
	height:17px;	
	top:16px;
	right: 30px;
	z-index: 1;
}

.btn:focus .icon-arrow {
	background-position:0 -17px;
}

.btn.dark{
	background-color:#fff;
	color: #222222;
	border-color: #222222;	
}

.btn.dark:hover{
	color:#fff;
	border-color:transparent;
}

.btn.dark:hover .icon-arrow{
	background-position:0 0;
}

.btn.dark:after,
.btn.dark:focus {
    background-color: #222222;
	color:#fff;
}

.background-overlay {
	background-image: url("images/pattern.png");
    bottom: 0;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.no-padding {
	padding: 0 !important;
}

.no-margin {
	margin: 0;
}


/***************** */
/* 2. LOADER */
/***************** */
#loader-container {
	position: fixed;
	display: table;
	width: 100%;
	height: 100%;
	min-height: 100%;
	overflow-x: hidden;
	overflow-y: hidden;
	vertical-align: middle;
	background: #fff;
	z-index: 99999;
}

.loader-content {
	position: relative;
	display: table-cell;
	vertical-align: middle;
	z-index: 3;
	text-align: center;
}

.loader {
	position: relative;
	margin: 0 auto;
	text-indent: -9999em;
	-webkit-animation: load8 1s infinite linear;
	animation: load8 1s infinite linear;
}

.loader,
.loader:after {
	border-radius: 50%;
	width: 100px;
	height: 100px;
}

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

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


/************************* */
/* 3. HEADER  */
/************************* */


#header{
   /*background-color: #f2f2f2;*/
	background-color: #fff;
	position: fixed;
	top:0;
    width: 100%;
    z-index: 100;
    padding-top:0px;
	padding-left:0px;
	padding-right:20px;
	padding-bottom:0px;
	
	
}

#header.no-background{
	background-color:transparent;
}

.logo{
	position: relative;
    float: left;
    overflow: hidden;
	padding: 21px 0px;    	
}



#btn-menu {
	position: relative;
	cursor:pointer;
    float: right;
    margin: 5px 10px 0;    
	width:90px;
	height:22px;
	line-height:22px;
	padding: 21px 0px;
	display:block;
}

#btn-menu .title{
	font-size:18px;
	font-weight:600;
	color:#1e1d1d;	
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;	
}

#btn-menu .line {
    background:#39393b;
	width:24px;
	position:absolute;
    height:3px;
    right:0;   
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	
}

#btn-menu .line1 {
    top: 21px;
}

#btn-menu .line2 {
    top: 30px;
}

#btn-menu .line3 {
    top: 39px;
}


/************************* */
/* 4. MENU  */
/************************* */
.menu {
	background:#222222;
	position: fixed;
	width: 375px;
    height: 100%;
	padding-right:40px;
	top:72px;   
    right: -375px;   
    z-index: 999;
    transition: all 150ms linear;
    -o-transition: all 150ms linear;
    -ms-transition: all 150ms linear;
    -moz-transition: all 150ms linear;
    -webkit-transition: all 150ms linear;
}

.menu.slide {
	right:0;
}

.btn-menu-close{
	background:#222222;
	position:fixed;
	top:0;
	right:-72px;
	width:72px;
	height:72px;
	text-align:center;
	cursor:pointer;
	z-index: 999;
    transition: all 150ms linear;
    -o-transition: all 150ms linear;
    -ms-transition: all 150ms linear;
    -moz-transition: all 150ms linear;
    -webkit-transition: all 150ms linear;
}

.btn-menu-close.slide{
	right:0;
}

.btn-menu-close i{
	vertical-align:middle;
	color:#fff;
	font-size:22px;
	margin-top:26px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
}

.menu-list{
	margin:0 0 15px;
}

.menu-list li a{
	color:#86827f;
	font-size:18px;
	line-height:34px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	padding: 5px 5px 5px 5px;
	display:block;
	cursor:pointer;
}

.menu-list2 li a{
	color:#86827f;
	font-size:15px;
	line-height:34px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	padding: 5px 5px 5px 5px;
	cursor:pointer;
}

.menu-list2 li{
	
	color:#86827f;
	font-size:15px; 
	line-height:84px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	padding: 5px 5px 5px 5px;
	cursor:pointer;
	display:inline-block;
	text-transform:uppercase;
	letter-spacing:1px;
	
}

ul.list-inline {
  text-align: center;
}

.menu-list li a.menu-title{
	color:#fff;
	font-size:18px;
	font-weight:700;

}

.menu-logo{
	margin:45px 0 20px;
}

.menu-text{
	font-size:14px;
	line-height:25px;
	letter-spacing:0.35px;
	color:#86827f;
}

.menu-social{
	margin: 20px 0;
}

.menu-social li{
	display: inline-block;
	margin-left:15px;
}

.menu-social li a{
    border: 2px solid #fff;
    border-radius: 50%;
    display: inline-block;
    font-size: 16px;
	color:#fff;
	width: 32px;
    height: 32px;
    line-height: 30px;
    text-align: center;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
}

.mCSB_scrollTools {
    bottom: 0;
    height: auto;
    left: 0;
    position: absolute;
    right: auto;
    top: 0;
    width: 16px;
}

.mCSB_inside > .mCSB_container {
    margin-right: 0;
}

.mCSB_scrollTools {
	opacity:1;
    width: 6px;
}

.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    border-radius: 0;
    width: 6px;
}

.mCSB_scrollTools .mCSB_draggerRail {
    background-color: #444444;
}

.mCSB_scrollTools .mCSB_draggerRail {
	border-radius:0;
    width: 6px;
}


/************************* */
/* 5. INDEX PAGE  */
/************************* */
.full-slide.slide1{
	position:relative;
	display:table;
	background:url("images/background/background1.jpg") repeat center top;
	background-size:cover;
}

.full-slide.slide2{
	position:relative;
	display:table;
	background:url("images/background/background2.jpg") repeat center top;
	background-size:cover;
}

.full-slide.slide3{
	background:url("images/background/background3.jpg") repeat center top;
	background-size:cover;
}

.full-slide-content{
	padding-bottom:10px;
}


/************************* */
/* 6. WORK PAGE  */
/************************* */
.home{
	position:relative;
	display:table;
	width:100%;
	color:#fff;	
	background-size:cover !important;
}

.projects{
	background:url("images/portfolio/main.jpg") center top;
}

.home-text-content{
	display:table-cell;
	vertical-align:middle;
	margin:0 auto;
}

.portfolio .portfolio-container {
    margin:0;
	padding:0;
	max-width:100%;
}

.portfolio .portfolio-content {
	display:none;
}

.portfolio .portfolio-item{
    margin:0;
	padding:0;
	margin-bottom:0x;
	overflow:hidden;
}

.portfolio .portfolio-item:hover > .hover-item{
	opacity:1;
}

.portfolio img{
	max-width:100%;
    height:auto;
}

.portfolio .hover-item{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	opacity:0;	
	transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;	 
}

.portfolio .hover-item .hover-content{
	width:100%;
	height:100%;
	display:table;
}

.portfolio .hover-item .hover-content .hover-content-alignCenter{
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}

.load-more-work{
	position:relative;
	padding:30px 0;
	background-color:#fff;
	z-index:1;
}

.load-more-work.border-top{
	border-top:1px solid #dcdcdc;
	margin-top:-1px;
}

.load-more{
	display:table;
	margin:0 auto;
	padding:0;
	border:none;
	background-color:#fff;
}

.load-more:hover .icon{
	background-color:#fff;
}

.load-more .icon{
	display:block;
	width:52px;
	height:52px;
	margin:0 auto; 
	border-radius:50%;
	text-align:center;
	line-height:52px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
}

.load-more .icon i{
	color:#fff;
	font-size:24px;
	line-height:52px;
}

.load-more .icon-title{
    font-size:16px;
    font-weight:800;
	color:#86827f;
}

.fast {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
}

.slow {
  -webkit-animation-duration: 1.1s;
  animation-duration: 1.1s;
}

@-webkit-keyframes showInUp {
  0% {
    -webkit-transform: translateY(150px);
    transform: translateY(150px);
	-ms-transform: translateY(150px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
	-ms-transform: translateY(0);
  }
}

@keyframes showInUp {
  0% {
    -webkit-transform: translateY(150px);
    transform: translateY(150px);
	-ms-transform: translateY(150px);
  }

  100% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
	-ms-transform: translateY(0);
  }
}

.showInUp {
  -webkit-animation-name: showInUp;
  animation-name: showInUp;
}


/************************* */
/* 7. SINGLE PROJECT PAGE */
/************************* */
.project-info{
	padding:4% 5%;
}

.project-info .subtitle{
	color:#ee257b;
}

.project-info h2{
	color:#333333;
	margin:0 0 30px;
}

.project-info .btn{
	margin-top:40px;
}

.project-pagination .project-pagination-content{
	width:100%;
	height:200px;
	line-height:200px;
	padding:0px;
	float:right;
	
	
}

.project-pagination-content .prev-project,
.project-pagination-content .next-project {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#FFF;
	font-size:16px;
	color:#86827f;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	font-family: 'Futura', sans-serif;
	letter-spacing:1px;
	
	
}

.project-pagination .project-pagination-content3{
	width:100%;
	height:60px;
	line-height:80px;
	padding:0px;
	float:right;
	
	
}


.project-pagination-content3 .prev-project,
.project-pagination-content3 .next-project {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:#FFF;
	font-size:18px;
	color:#86827f;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	
	
}


.prev-project2,
.next-project2 {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	line-height:20px;
	font-size:12px;
	color:#86827f;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
	
	
}

.project-pagination-content .prev-project i,
.project-pagination-content .next-project i{
	padding-left:15px;
}

.project-pagination-content .prev-project:hover, .prev-project2:hover,
.project-pagination-content .next-project:hover, .next-project2:hover {
	color:#fff;
}

#video-player{
	background:url("images/background/video.jpg") repeat center top;	
	min-height:600px;
}

.video-overlay{
	z-index:1;
}

.player-controls {
	position: absolute;
	z-index: 2;
	top:50%;
	margin-top:-45px;  
	width: 100%;
	text-align: center; 
}

.player-controls a {
	cursor:pointer;
	display: inline-block;
	width: 90px;
	height: 90px;
	line-height: 90px;
	border-radius: 50%;
	text-align: center;
	color: #fff;
	background-color: rgba(255, 255, 255, 0.5);
	transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
    -o-transition: all 200ms linear;	
}

.player-controls a i {
	font-size: 24px;	
}

.player-controls a:hover {
    background-color: rgba(255, 255, 255, 0.7);
}


/************************* */
/* 8. BLOG ARCHIVE PAGE */
/************************* */
.blog-archive{
	background:url("images/background/background4.jpg") center top;
	padding:0 90px;
}

.blog-archive h1{
	padding-left:15px;
}

.post-info,
.post-info a{
	color:#62605a;
	font-style:italic;
	font-size:16px;
	padding-bottom:4px;
}

.post-info i{
	font-size:8px;
	padding:0 12px;
}

.post-text{
	font-size:20px;
	padding:10px 0 25px;
}

.post-category{
	font-size:14px;
	border-bottom:4px solid rgba(7, 6, 6, 0.05);
	display: table;
    padding-bottom: 10px;
}

.post-category a:hover{
	text-decoration:underline !important;
}

.blog-post-content{
	display:none;
}

.post-wrapper{	
	display:table;
	width:100%;
	height:540px;
	padding:0 90px;
	border-right:1px solid #DCDCDC;
	border-bottom:1px solid #DCDCDC;
	transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;	 
}

.post-wrapper:hover .post-info, 
.post-wrapper:hover .post-info a, 
.post-wrapper:hover .post-info i,
.post-wrapper:hover .post-text,
.post-wrapper:hover .post-category,
.post-wrapper:hover .post-category a,
.post-wrapper:hover .post-arch-title a{
	color:#fff;
	transition: all 250ms ease-in-out;
    -o-transition: all 250ms ease-in-out;
    -ms-transition: all 250ms ease-in-out;
    -moz-transition: all 250ms ease-in-out;
    -webkit-transition: all 250ms ease-in-out;
}

.post-wrapper-text{
	display:table-cell;
	vertical-align:middle;
}

.post-arch-title,
.post-arch-title a{
	font-size:40px;
	font-weight:800;
	color:#333;	
	text-transform:uppercase;
	line-height:55px;
	margin:0 0 20px;	
}

.post-arch-title a{
	margin:0;
}

.social-share{
	position:relative;
	width:100%;
}

.social-share:after {
    background-color: rgba(7, 6, 6, 0.05);
    content: "";
	width: 240px;
    height: 4px;    
    position: absolute;
    bottom: -4px;
	left: 0;
}

.right-sidebar{
	padding: 80px 15px 0 50px;
}

.right-sidebar.post-sidebar{
	padding-top:20px;
	border-left:1px solid #dcdcdc;
}

.widget{
	text-align:left;
	margin-bottom:50px;
}

.widget .widget-title{
    font-size: 22px;
	font-weight:800;
	color:#fff;
	text-transform:uppercase;
    line-height: 35px;
	display:table;
    margin: 10px 0 25px;
	padding: 5px 12px;	
}

.widget .widget-post{
	margin-bottom:40px;
}

.widget .post-info, 
.widget .post-info a{
	font-size:12px;
	line-height:16px;
}

.widget .widget-post-title{
	line-height:24px;
}

.widget .widget-post-title a{
    color: #333;
    display: block;
    font-size: 16px;
    font-weight: 800;
    margin-bottom: 8px;
	transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;	
}

.widget p{
   font-size: 14px;
   line-height: 22px;	
}

.widget .search-form {
    margin-bottom: 60px;
    position: relative;
}

.widget input.search{
    border: 1px solid #595959;
    border-radius: 2px;
    color: #333;
    font-size: 16px;
    outline: none;
    padding: 10px;
    position: relative;
    width: 100%;    
}

.widget .search-button{
	background: none;
    border: none;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 5px;
    color: #333;
    font-size: 14px;
	width: 15%;
    height: 100%;
    outline: none;
    position: absolute;
	top: 0;
    right: 0;
    text-align: center;    
}

.widget ul li:before {
    content: "\f067";
    font-family: "FontAwesome";
	font-size:13px;
    margin-left: 0;
	padding-right:5px;
    top: 0;
}

.widget li{
	padding:0;
	transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;		
}

.widget li:hover{
	padding-left:2px;
}

.widget li a{
	color: #333;
    font-size: 18px;
    font-weight: 800;
    text-transform: uppercase;
	transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;	
}

.widget a.tag-link{
	display: inline-block;
	text-decoration: none;
	transition: all 0.2s ease-in-out;
	-moz-transition: all 0.2s ease-in-out;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	font-size: 18px;
	color: #333;
	text-transform:uppercase;
	font-weight:800;
}


/************************* */
/* 9. BLOG POST PAGE */
/************************* */
.post{
	padding:30px 0 0;
}

.post .container{
	padding:0 200px;
}

.post-padding{
	padding-right:50px;
}

.intro-text{
	font-size:24px;
}

.social-share p{
	font-size:14px;
	margin:40px 0;
}

.social-share p a{
	font-weight:600;
	padding:0 5px;
	border-right:1px solid #86827f;
}

.social-share p a:last-child{
	border-right:none;
}

.social-share p a:hover{
	text-decoration:underline !important;
}

.tags{
	text-align:left;
}

.tags::after{
	background-color:transparent;
}

.tags p{
	margin:0;
}

.post-author{
	border-top:1px solid #dfdad8;
	padding-top:50px;
	margin:45px 0 90px;
}

.post-author .author-image img{
    border-radius: 50%;
	width:96px;
	height:auto;
}

.post-author .author-info {
	padding:0 0 0 30px;
}

.post-author .author-name {
    display: block;
    font-size: 18px;
    font-weight: 600;
    margin: 0;
    padding: 0 0 5px;
}

.post-author .author-info ul{
	margin-top:20px;
}

.post-author .author-info ul li{
	display: inline-block;
	margin-right: 35px;
}

.post-author .author-info ul li a{
	color: #62605a;
	font-size: 18px;
	transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-webkit-transition: all 0.3s ease;
}

.comments-content{
	border-top:2px solid #dfdad8;
	padding-top:25px;
}

.post-subtitle{
    font-size: 18px;
    font-weight: 600;
}

.discussion-trigger{
	cursor:pointer;
}

.discussion{
	display:none;
}

.comments{
	margin-top:40px;
}

.comment{
	margin-bottom:30px;
	padding-bottom:30px;
	border-bottom:1px solid #dfdad8;
}

.comment:last-child{
	border-bottom:none;
}

.comment .comment-title{
	color: #86827f;
	font-size:22px;
}

.comment p{
	font-size:16px;
	padding-top:10px;
}

.comment-author{
	margin-top:15px;
}

.comment-author .comment-author-image,
.comment-author .comment-info{
	display: table-cell;
	vertical-align: top;	
}

.comment-author .comment-author-image{
	padding-right: 25px;
}

.comment-author .comment-author-image img{
	border-radius: 50%;
	width: 46px;
	height:46px;
}

.comment-info span{
	display:block;
	font-size:14px;
	line-height:24px;
}

.comment-info .comment-author-name{
	font-weight:600;
}

.comment-info .comment-reply{
    display: block;
    font-size: 14px;
    font-weight: 600;
    margin-top: 15px;
}

.comment-info .comment-reply:hover,
.comment-info .comment-reply:focus{
	text-decoration:underline !important;
}

.comments-form-content{
	border-top:1px solid #dfdad8;
	padding-top:30px;
	margin-top:50px;
}

#comments-form{
	margin-top:30px;
}

.recommended-posts-content{
	background-color: #fafafa;
	margin:55px 0 0;
	padding:55px 0;
}

.recommended-post{
	margin:50px 0;
}

.recommended-post .post-info, 
.recommended-post .post-info a {
    padding-bottom: 0px;
	line-height:16px;
}

.recommended-post .post-arch-title{
	line-height: 28px;
	margin-bottom:0;
}

.recommended-post .post-arch-title a{
	font-size:28px;
	line-height: 24px;
}

.recommended-post .post-text {
    font-size: 16px;
	padding:20px 0 15px;
}



/************************* */
/* 10. ABOUT US PAGE */
/************************* */
.text-wrapper{
	display:table;
	height:600px;
	padding:45px 90px;
}

.text{
	display:table-cell;
	vertical-align:middle;
}

.text p{
	color:#fff;
}

.about-image{
    background: url("images/about/about1.jpg") no-repeat center;
	background-size:cover;
    height: 100%;
	min-height:600px;
}

.team-item{
	position:relative;
	overflow:hidden;
}

.team-item:hover .hover-team-item{
    transform: translate(0,-60%);
    -webkit-transform: translate(0,-60%);
    -o-transform: translate(0,-60%);
    -moz-transform: translate(0,-60%);
}

.team-item img{
	width:100%;
	height:auto;
	transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out; 
}

.team-item:hover img{
    transform: translate(0,-20%);
    -webkit-transform: translate(0,-20%);
    -o-transform: translate(0,-20%);
    -moz-transform: translate(0,-20%); 
}

.team-item .hover-team-item{
    background-color: #f5f6f8;
	width: 100%;
    height: 100%;
	position: absolute;
    left: 0;
	padding:20px 35px 35px;
	transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out; 
}

.hover-team-item h3{
	font-size:20px;
}

.team-item .job-position,
.our-testimonials .job-position{
	display:block;
	font-size:14px;
	color:#62605a;
	padding:2px 0 20px;
}

.team-item ul.social {
    margin: 25px 0 0;
}

.team-item ul.social li {
    display: table-cell;
}

.team-item ul.social li a {
    color: #333333;
    font-size: 18px;
    margin-right: 30px;
	transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
}

.team-text{
	padding:90px;
	background-color:#f2f2f2;
}

.team-text h2,
.team-text p{
	color:#333333;
	margin-top:0;
}

.row-same-height {
	display: table;
	width: 100%;
	height: 100%;
	table-layout: fixed;
}

.col-full-height {
	height: 100%;
	vertical-align: middle;
	display: table-cell;
	float: none;
}

.our-testimonials p {
    font-size: 24px;
	font-style:italic;
}

.our-testimonials .name {
	display:block;
	font-size:14px;
	line-height:14px;
	font-weight:600;
	padding-top: 20px;
}

.owl-carousel{
	padding:45px 90px;
}

.owl-theme .owl-controls .owl-page span {
    border: 2px solid #62605a;
	width: 12px;
    height: 12px;
	margin-bottom:0;
    opacity: 1;   
}

.quotation{
	text-align:center;
}

.quotation i{
	font-size:65px;
	color:#fff;
}


/************************* */
/* 11. SERVICES PAGE */
/************************* */
.services-image{
    background: url("images/services/service1.jpg") no-repeat center;
	background-size:cover;
    height: 100%;
	min-height:600px;
}

.service-content{
	background-color:#fff;
	padding:90px 40px;
	text-align:center;
}

.service-content.border{
	border-right:1px solid #DCDCDC;
	border-bottom:1px solid #DCDCDC;		
}

.service-content .icon{
	display:block;
	width:75px;
	height:75px;
	margin:0 auto 30px;
	border-radius:50%;
	text-align:center;
	line-height:75px;
}

.service-content .icon i{
	color:#fff;
	font-size:28px;
	line-height:73px;
}

.service-content p{
	padding:25px 0;
}


/************************* */
/* 12. CONTACT PAGE */
/************************* */
#map-canvas {
	width: 100%;
    height: 100%;
	min-height:600px;
}

.contact-text-wrapper{
	background-color:#fff !important;
}

.contact-text h2{
	color:#333333;
}

.contact-text p{
	color:#86827F;
}

.contact-text .contact-information{
	color:#333333;
}

.contact-text a:hover{
	text-decoration:underline !important;
}

.form{
	padding:57px 90px;
}

#form{
	margin-top:150px;
}

#form input,
#comments-form input, 
#form textarea,
#comments-form textarea{
    border:1px solid #222222;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    color:#222222;
    font-size:16px;
    height:auto;
	width:100%;
    letter-spacing:0.5px;
    margin-bottom:18px;
    outline:none;
    padding:10px 15px 10px;   
	transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -webkit-transition: all 300ms linear;
}

#form textarea,
#comments-form textarea{
	height:185px;
}

#form .required:after,
#comments-form .required:after {
    content: "Required field";
    font-size: 14px;
	color:#E74C3C;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 25px;
    top: 10px;
    transition: all 0.2s ease 0s;
    z-index: 15;
}

#form .required.error:after,
#comments-form .required.error:after{
    opacity: 1;
}

.notification{
	display:none;
	cursor:pointer;
}


/************************* */
/* 13. FOOTER */
/************************* */
footer { 
    max-width: 1920px;
	border-top: 2px solid #000;
	display:block;
	padding:40px 15px;
	clear:both;
	
}

footer.sticky {
	position: fixed;
	bottom:0;
	z-index: 100;
}

footer p{
	font-size:14px;
	line-height:30px;
}

footer ul{
	float:right;
}

footer ul li {
    display: inline-block;
	margin-left:25px;
}

footer ul li:first-child {
	margin-left:0;
}

footer ul li a{
	color:#62605a;
	font-size:18px;
    transition: all 200ms linear;
    -o-transition: all 200ms linear;
    -ms-transition: all 200ms linear;
    -moz-transition: all 200ms linear;
    -webkit-transition: all 200ms linear;
}


/************************* */
/* 14. COLOR SWITCHER */
/************************* */
.color-switcher {
    background-color: #fff;
    border: 1px solid #e5e5e5;
	padding:10px;
    position: fixed;
    top: 150px;
    transition: all 0.4s ease 0s;
    width: 200px;
    z-index: 1001;
}

.hide-color-switcher {
    left: -200px;
}

.show-color-switcher {
    left: -1px;
}

.color-switcher a.switcher-button {
    background: #fff;
	border-top:#e5e5e5;
	border-right:#e5e5e5;
	border-bottom:#e5e5e5;
	border-left: transparent;
    border-style: solid solid solid none;
    border-width: 1px 1px 1px medium;
	border-radius:2px;
    color: #383839;
    cursor: pointer;
    font-size: 22px;
	width: 45px;
    height: 45px;
    line-height: 43px;
    position: absolute;
	top: 24px;
    right: -44px;
    text-align: center;    
}

.color-switcher .color-switcher-title{
	padding:0px 0 8px;	
}

.color-switcher .color-switcher-title:after {
    content: "";
    display: block;
    height: 1px;
    margin: 14px 0 0;
    position: relative;
    width: 20px;
}

.color-switcher .color-list a.color {
    cursor: pointer;
    display: inline-block;
    height: 25px;
    margin: 10px 0 0 1px;
    width: 25px;
}
	
.default-theme{
	background-color:#ee257b;
}

.emerald-theme{
	background-color:#2ecc71;	
}

.peter-river-theme{
	background-color:#3498db;	
}

.amethyst-theme{
	background-color:#9b59b6;	
}

.wet-asphalt-theme{
	background-color:#34495e;	
}

.green-sea-theme{
	background-color:#16a085;	
}

.nephritis-theme{
	background-color:#27ae60;	
}

.belize-hole-theme{
	background-color:#2980b9;	
}

.wisteria-theme{
	background-color:#8e44ad;	
}

.midnight-blue-theme{
	background-color:#2c3e50;	
}

.sun-flower-theme{
	background-color:#f1c40f;	
}

.carrot-theme{
	background-color:#e67e22;	
}

.alizarin-theme{
	background-color:#e74c3c;	
}

.concrete-theme{
	background-color:#95a5a6;	
}

.orange-theme{
	background-color:#f39c12;	
}

.pumpkin-theme{
	background-color:#d35400;	
}

.bordeaux-theme{
	background-color:#de3926;	
}

.asbestos-theme{
	background-color:#7f8c8d;	
}


/*** 15. RESPONSIVE DESIGN ***/
@media screen and (max-width: 1680px) {
	
.project-info {
    padding: 4% 5% 0% 5%;
}
/************************* */
/* ABOUT US PAGE */
/************************* */
.team-item .hover-team-item{
	padding: 0 20px;
}

.team-item:hover .hover-team-item{
    transform: translate(0,-72%);
    -webkit-transform: translate(0,-72%);
    -o-transform: translate(0,-72%);
    -moz-transform: translate(0,-72%);
}

.team-item:hover img{
    transform: translate(0,-30%);
    -webkit-transform: translate(0,-30%);
    -o-transform: translate(0,-30%);
    -moz-transform: translate(0,-30%); 
}

.team-item .job-position{
    font-size: 14px;
    padding: 2px 0 10px;
}

.hover-team-item p{
    font-size: 16px;
    line-height: 26px;
}

.team-item ul.social {
    margin: 15px 0 0;
}

}

@media screen and (max-width: 1280px) {
/************************* */
/* BLOG ARCHIVE PAGE */
/************************* */	
.right-sidebar{
	padding:40px 15px 0 15px;
}

.widget .widget-title {
    font-size: 20px;
    line-height: 36px;
    padding: 2px 8px;
}

.widget li a,
.widget a.tag-link{
	font-size:15px;
}

.widget ul li::before{
	font-size:12px;
}

/************************* */
/* BLOG POST PAGE */
/************************* */
.post-padding{
	padding-right:15px;
}

}


@media screen and (max-width: 991px) {
	
.project-info {
    padding: 4% 5% 0% 5%;
}

/************************* */
/* 1. BASE */
/************************* */
#main.custome-padding{
	padding-top:72px !important;
}


/************************* */
/* 3. HEADER  */
/************************* */
#header.custome-background{
	background-color:#f2f2f2 !important;
}
	
	
/************************* */
/* CONTACT PAGE */
/************************* */
#map-canvas {
    height: 450px;
	min-height:auto;
}

.form {
    padding: 0 45px 35px;
}

#form{
	margin-top:0;
}


/************************* */
/* BLOG POST PAGE */
/************************* */
.post .container{
	padding:0 100px;
}


/************************* */
/* BLOG ARCHIVE PAGE */
/************************* */
.post-arch-title,
.post-arch-title a{
	font-size:40px;
	line-height:50px;
}

.blog-archive{
	padding:0 45px;
}

.post-wrapper{	
	padding:0 45px;	 
}

.right-sidebar{
	padding:80px 30px 0;
}

.widget .widget-title {
    font-size: 22px;
    line-height: 35px;
    padding: 5px 12px;
}

.widget li a,
.widget a.tag-link{
	font-size:18px;
}

.widget ul li::before{
	font-size:13px;
}


/************************* */
/* ABOUT US PAGE */
/************************* */
.row-same-height,
.col-full-height{
	display:inherit;
}

.about-image{
    height: 600px;
	min-height: auto;
}

.text-wrapper{
	height:500px;
	padding:0 45px;
}

.team-text {
    padding: 45px;
}

.team-item .hover-team-item{
	padding: 20px 35px 35px;
}

.team-item:hover .hover-team-item{
    transform: translate(0,-60%);
    -webkit-transform: translate(0,-60%);
    -o-transform: translate(0,-60%);
    -moz-transform: translate(0,-60%);
}

.team-item:hover img{
    transform: translate(0,-20%);
    -webkit-transform: translate(0,-20%);
    -o-transform: translate(0,-20%);
    -moz-transform: translate(0,-20%); 
}

.owl-carousel{
	padding:45px;
}

.quotation{
	display:none;
}


/************************* */
/* SERVICES PAGE */
/************************* */
.services-image{
    height: 600px;
	min-height:auto;
}

.service-content{
	padding:40px;
}


/************************* */
/* SINGLE PROJECT PAGE */
/************************* */
#video-player{
	min-height:450px;
}

	
/************************* */
/* FOOTER */
/************************* */
footer {
	text-align:center;
}

footer p{
	line-height:22px;
}

footer ul {
    float: none;
}

}

@media screen and (max-width: 767px) {
/************************* */
/* BASE */
/************************* */

.project-info {
    padding: 4% 5% 0% 5%;
}

.project-pagination .project-pagination-content{
	width:100%;
	height:100px;
	line-height:100px;
	padding:0px;
	float:right;
	
	
}

.port {
padding-top:20px; 
padding-left:0px;"
}

.portf {
	display:none; 
}

h1 {
    font-size: 32px;
    line-height: 51px;
}

.subtitle {
    font-size: 16px;
}

h2 {
    font-size: 24px;
    line-height: 32px;
}

p{
	line-height:36px;
}

.btn {
	font-size:16px;
    padding: 10px 60px 6px 25px;
}

.btn .icon-arrow {
    right: 25px;
    top: 12px;
}


/************************* */
/* HEADER  */
/************************* */
#header {
    padding-top:0px;
	padding-left:0px;
	padding-right:20px;
	padding-bottom:0px;
}

#btn-menu{
	width:24px;
}

#btn-menu .title{
	display:none;
}


/************************* */
/* MENU  */
/************************* */
.menu {
	min-height:100%;
	width: 100%;
	right:-100%;
	top:0;
	padding: 0 40px 0 0;
}

.btn-menu-close {
	width: 35px;
    height: 35px;
}

.btn-menu-close i {
    margin-top: 5px;
}

.menu-content {
    padding-bottom: 25px;
}


/************************* */
/* CONTACT PAGE */
/************************* */
#map-canvas {
    height: 300px;
}

.form {
    padding: 0 15px 30px;
}


/************************* */
/* BLOG POST PAGE */
/************************* */
.post .container{
	padding:0 15px;
}

.social-share{
	text-align:left;
}

.share-title{
	display:block;
}

.post-author .author-image img {
    margin-bottom: 10px;
}

.post-author .author-info {
    padding: 0;
}


/************************* */
/* BLOG ARCHIVE PAGE */
/************************* */
.blog-archive{
	padding:0;
}

.post-arch-title,
.post-arch-title a{
	font-size:30px;
	line-height:35px;
}

.post-wrapper{
	height:auto;
	padding:40px 15px;	 
}

.post-text {
    line-height: 30px;
}

.intro-text {
    font-size: 22px;
}

.right-sidebar{
	display:none;
}


/************************* */
/* SINGLE PROJECT PAGE */
/************************* */
.project-pagination-content .prev-project, 
.project-pagination-content .next-project {
    font-size: 14px;
	
}

#video-player{
	min-height:300px;
}


/************************* */
/* ABOUT US PAGE */
/************************* */
.text-wrapper{
	height:auto;
	padding:25px 15px 35px;
}

.about-image {
    height: 300px;
}

.team-item .hover-team-item{
	padding: 0 20px;
}

.team-text {
    padding: 35px 15px;
}

/************************* */
/* SERVICES PAGE */
/************************* */
.services-image {
    height: 300px;
}

.service-content{
	padding:40px 15px;
}


/************************* */
/* FOOTER */
/************************* */
footer {
    padding:10px;
}

footer ul,
footer img{
	display:none;
}

}

@media screen and (max-width: 580px) {

.project-pagination-content a.prev-project2, 
.project-pagination-content a.next-project2 {
    font-size: 10px;
}

  
.project-pagination .project-pagination-content {
    width: 100%;
    height: 60px;
    line-height: 60px;
    padding: 0px;
    float: right;
}

.portf {
	display: none; 
}

.port {
padding-top:20px; 
padding-left:0px;"
}