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

  Template Name: Go.arch 
  Description: Go.arch  - Architecture HTML Template
  Author: Murren
  Author URI: http://themeforest.net/user/murren20
  Version: 1.0
  
  1.  Global

      1.1 General
      1.2 Typography
      1.3 Fields
      1.4 Buttons
      1.5 Icons
      1.6 Loader
      1.7 Content styles

  2.  Header 

      2.1 Brand
      2.2 Vertical Panel
      2.3 Navbar Desctop
      2.4 Navbar Desctop Affix
      2.5 Navbar Mobile
      2.6 Navbar Mobile Affix
      

  3.  Main

      3.1 Slider

  4.  About

      4.1 Services
      4.1 Object map

  5.  Projects

      5.1 Project Carousel
      5.2 Magnific popup
      5.3 Project Details

  6.  Experience
  7.  Clients
  8   Blog

      8.1 Blog Details
      8.2 Widgets
      8.3 Widget Recent Post

  9.  Contacts  
  10. Footer
  11. Responsive styles

      11.1 Min width: 768px
      11.2 Min width 992px
      11.3 Min width 1200px 
      11.4 Max height 480px

    
    
/*-------------------------------------------------------------------------------
  1. Global
-------------------------------------------------------------------------------*/



/* 1.1 General */


/* ------------------------------------------------------------------------------- */
/*  5. Products
/* ------------------------------------------------------------------------------- */



.bg-projects{
  position: relative;
  background-size: cover;
 
}

.project{
  padding: 0;
  overflow: hidden;
}

.project figure{
  position: relative;
 
  height: 445px;
}

.project figure img{
  display: block;
   opacity: 100%;
    height: 100%;
 
  -webkit-transition: all 8s linear;
  -o-transition: all 8s linear;
  transition: all 8s linear;
}

.project figure:after{
  content:'';
  position: absolute;
  left: 0;
  top:0;
 
  height: 100%;
  background-color: #111;
  opacity: 0;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.project.project-light figure:after{
  opacity: 0;
   height: 100%;
}


    
.project figcaption{
  position: absolute;
  z-index: 1;
  left: 0;
  top:0;
  right:0;
  bottom:0;
  margin: 1.2em 3.6em;
}

.project-title{
  position: relative;
  top:0;
  left:0;
  margin:0;
  font-family: Roboto Condensed;
  font-weight: normal;
  font-size: 1.56em;
  line-height: 1.45;
  letter-spacing: 0.07em;
  color: #9DD0ED;
  text-transform: uppercase;
  -webkit-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}

.project-category{
	position: absolute;
	left: 0;
	bottom: 0;
	font-family: Roboto Condensed;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
	width: 100px;
	white-space: nowrap;

}
/*
.project-category a{
	
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}*/
	
.project-category2{
	position: absolute;
	left: 0;
	bottom: 0;
	font-family: Roboto Condensed;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
	margin-left: 3em;
	text-align:left;
	white-space: nowrap;

}
/*
.project-category2 a{
	
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
}*/





.project figure:hover:after{
  opacity: 0;
}

.project figure:hover img{
  -webkit-transform: scale(1.4);
  transform: scale(1.4);
}

.project figure:hover .project-title{
  top:20px;
  opacity: 100%;
}
/*
.project figure:hover .project-category{
  opacity: 0;
  letter-spacing: 2em;
}

.project figure:hover .project-category2{
  opacity: 0;
  letter-spacing: 2em;
}
*/
/*
.project-category{
	position: absolute;
	left: 0;
	bottom: 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
	width: 100px;
	white-space: nowrap;

}
.project-category2{
	position: absolute;
	left: 0;
	bottom: 0;
	font-family: 'Roboto Condensed', sans-serif;
	font-weight: normal;
	font-size: 13px;
	color: #fff;
	letter-spacing: 0.2em;
	-webkit-transform: rotate(-90deg);
	-ms-transform: rotate(-90deg);
	-o-transform: rotate(-90deg);
	transform: rotate(-90deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: -0.8em;
	margin-left: 3em;
	text-align:left;
	white-space: nowrap;

}
*/
.project-category a:hover{
 color: #F9A602;
	 font-size: 14px;
	 
}


.project-category2 a:hover{
 color: #F9A602;
	 font-size: 14px;
}

.project-category a {
 color: #fff;
	 font-size: 14px;
	 
}

.project-category2 a{
 color: #fff;
	 font-size: 14px;
}


.project figure:hover {
  opacity: 1;
  -webkit-transform: scale(1);
  -ms-transform:scale(1);
  -o-transform:scale(1);
  transform:scale(1);
}



/* 5.1 Carousel */



.owl-prev,
.owl-next{
  position: absolute;
  top:25%;
  
  font-family: Roboto Condensed;
  font-size:1em;
  letter-spacing: 0.10em;
  text-transform: uppercase;

  font-weight: bold;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 1;
}

.owl-prev:hover,
.owl-next:hover{
  opacity: 1;
  font-size:1.1em;

  font-weight: bold;
}

.owl-prev{
  left: 1em;
  padding-left: 25px;
/* background:url(../images/prev.png) left 50% no-repeat;*/
  background-size: 50%;
 
}

.owl-next{
  left: auto;
  right: 1em;
  padding-right: 25px;
  
 /* background:url(../images/next.png) right 50% no-repeat;*/
  background-size: 50
%;
}
 





/* 5.3 Project Details */
/*


.project-title-info{
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: bold;
  font-size: 2vmin;
  text-transform: uppercase;
  letter-spacing: 0.2em;
  margin-top: 2.2em;
  margin-left: -1.8em;
}

.project-title-info .project-info-item{
  display: inline-block;
  margin-left: 1.8em;
}

.project-details-item{
  position: relative;
}

.project-details-img{
  position: relative;
  padding: 0;
}

.project-details-info{
  background-color: #c5a47e;
  padding: 4.8em 3.1em 4.8em;
  color:#fff;
}

.project-details-title{
  position: relative;
  font-family: 'Roboto Condensed', sans-serif;
  font-weight: 400;
  font-size: 1.9em;
  line-height: 1.5;
  text-transform: uppercase;
  color: #9DD0ED;
  margin: 0 0 0.7em;
}

.project-details-title:before{
  content: '';
  position: absolute;
  bottom: -0.35em;
  width: 10em;
  border-top: 1px solid #ededed;
  left: -4.4em;
  width: 5.5em;
}

.project-details-descr{
  font-size: 1.1em;
  line-height: 1.62;
}

.project-details-descr p:last-child{
  margin-bottom: 0;
}

.project-details-item:nth-child(even) .project-details-info{
  right:0;
  left: auto;
  top:13%;
  background-color: #212121;
}

*/


/* ------------------------------------------------------------------------------- */
/*  6. Experience
/* ------------------------------------------------------------------------------- */



.experience{
  text-align: center;
  background-color: #FFFFFF;
  height: 400px;
  padding-top:45px;
}

.text-parallax {
	
  background: no-repeat 0 0;
  display: inline-block;
}

.text-parallax-content{
	font-family: Roboto Condensed;
	font-weight: 700;
	font-size: 21.8em;
	line-height: 1;
	overflow: hidden;
	margin-bottom: 0;
	color: #363636;
	mix-blend-mode: lighten;
	background-color: #FFFFFF;
}

.experience-info{
  position: relative;
  top: -0.75em;
  font-family: Roboto Condensed;
  font-size: 25px;
  line-height: 35px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  display: inline-block;
  text-align: left;
  margin:0 0 0 0.5em;
  
}

.text-primary {
	font-weight: 500;
	color: #F9A602;
	text-decoration:none
	}
	
@media (max-width: 479px) {	
	
.experience-info{
  position: relative;
  top: -0.75em;
  font-family: Roboto Condensed;
  font-size: 20px;
  line-height: 30px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  display: inline-block;
  text-align: left;
  margin:0 0 0 0.5em;
  
}
