/*=================================================
1 - Portfolio 
=================================================*/

.ocp-container {
  background-color: #f7f7f7;
  padding: 61px 0 62px 0; 
  border-top: solid 1px #f1f1f1;
  border-bottom: solid 1px #f1f1f1;
}

/****** Portfolio ******/

.container-prjects-b {
  background: #fff;
  padding: 81px 0 54px 0;
}
.projects-view {
  margin: 20px 0 35px 0;
}
.projects-view .project-b-item .project-image {
 float: left;
 width: 50%;
 background: #8d8d8d;
}
.projects-view:after{
  clear: both;
  content: " ";
  display: table;
  height: 0;
  visibility: hidden; 
}
.projects-view .project-b-item .project-image img {
-webkit-transition: all .25s linear;
-moz-transition: all .25s linear;
-o-transition: all .25s linear;
transition: all .25s linear;
-webkit-transform: translateZ(0);
-moz-transform: translateZ(0);
-ms-transform: translateZ(0);
transform: translateZ(0);
}
.projects-view .project-b-item .project-b-des  {
position: relative;
float: right;
height: 313px;
width: 50%;
padding:40px 5px 10px 5px; 
background: #f5f5f5;
color: #272727;
text-align: center;
}

.projects-view .project-b-item:nth-child(even) div.project-image {
     float: right;
}
.projects-view .project-b-item:nth-child(even) div.project-b-des {
     float: left;
}

.projects-view .project-b-item .project-b-des .title-un {
  font-size: 24px;
text-transform: uppercase;
letter-spacing: 2px;
margin-bottom: 45px;
}
.projects-view .project-b-item .project-b-des .title-un-des { 
margin: 45px auto 20px auto;
}
.projects-view .project-b-item:nth-child(odd) .project-b-des:after {
top: 40%;
left: -14px;
position: absolute;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 24px 16px 24px 0;
border-color: transparent #f5f5f5 transparent transparent;
display: block;
}

.projects-view .project-b-item:nth-child(even) div.project-b-des:after {
top: 40%;
right: -14px;
position: absolute;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 24px 0 24px 16px;
border-color: transparent transparent transparent #f5f5f5;
display: block;
}

.project-b-link {
text-align: center;
color: #BBB;
font-size: 4em;
margin: 5px;
}

.projects-view .project-b-item .project-image:hover img {
 opacity: 0.5;
} 

/****** Portfolio filter ******/
.portfolio-container {
  padding: 46px 0;
}

.port-filter { 
  margin: 15px 0 28px 0;
}
.port-filter ul { margin:0 0 35px 0; padding:0; text-align: center;}
.port-filter ul li {
  display: inline-block;
  list-style: none;
  margin-right: 5px;
  margin-bottom: 20px;
}
.port-filter ul li a {
  color: #888888;  
  padding: 9px 16px !important;
  border:solid 1px #ececec;
  text-align: center;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  letter-spacing: 2px;
}
.port-filter ul li a:hover {
  color: #a67c52;
}
.port-filter ul li.active a {
  color: #fff;
  background: #a67c52;
  border-color: #ac3b35;
}

.portfolio-container .pagination-cm {
  text-align: center;
  margin: 15px 0 13px 0;
}

/****** Our creative portfolio container ******/


.col-3-portfolio .project-item {
  width: 370px; 
  margin:15px;
}



/****** classic portfolio  container ******/

.occp-container {
  background-color: #fff;
  padding: 61px 0 62px 0;  
}

.classic-portfolio {
    margin:0 -1%;
} 
.classic-portfolio .project-item {
  float: left;
  max-width: 100%;
}
.classic-portfolio .project-item .project-image:hover img {
opacity: .5;
} 
.classic-portfolio.col-2-portfolio {
  margin: 0 -15px;
}
.classic-portfolio.col-2-portfolio .project-item {
  width: 48%; 
  margin:4px 1% 32px 1% ;
}
 
.classic-portfolio.col-2-portfolio .overlay .actions li.project-details {
margin: 350% auto 0 auto;
}
.classic-portfolio.col-2-portfolio .project-item .project-image:hover .overlay li {
opacity: 1;
margin-top:73px !important;
} 
 
.classic-portfolio.col-3-portfolio {
  margin: 0 -15px;
}
.classic-portfolio.col-3-portfolio .project-item {
  width: 31.3333333333%; 
  margin:4px 1% 32px 1% ;
}

.classic-portfolio.col-3-portfolio .project-info h4 {
  margin-top: 18px !important;
}
.classic-portfolio.col-4-portfolio {
  margin: 0 -15px;
}
.classic-portfolio.col-4-portfolio .project-item {
  width: 23%; 
  margin:4px 1% 25px 1% ;
} 
.classic-portfolio.col-4-portfolio .project-item .project-info h4{
 font-size: 16px;
 letter-spacing: 2px;
 margin: 16px 0 13px 0;
}

.classic-portfolio.col-4-portfolio .overlay .actions li.project-details {
margin: 100% auto 0 auto;
}

.classic-portfolio .project-item .project-image, .projects-view .project-b-item .project-image {  
  position: relative;
  overflow: hidden; 
  background: #8d8d8d;

}
 .classic-portfolio .project-item .project-image:hover .overlay {
  opacity: 1;
}

 .classic-portfolio .project-item .project-image .pbt {
color: #fff;
border: solid 2px #fff;
padding: 9px 10px;
 }
.classic-portfolio .project-item .project-image:hover .overlay li {
  opacity: 1;
  margin-top:0;
} 
.classic-portfolio .project-item .project-info {
text-align: center;
margin-top: 30px;
}
.classic-portfolio .project-item .project-info h4 {
  margin: 20px 0 15px 0;
  text-transform: uppercase;
  font-weight: 600;
  letter-spacing: 4px;
}
.classic-portfolio .project-item .project-info h4 a {
 color: #5d5d5d;
}
.classic-portfolio .project-item .project-info h4 a:hover {
 color: #a67c52;
}
.classic-portfolio .project-item .project-info .project-cat {
  margin: 0 0 5px 0;padding: 0;list-style: none; letter-spacing: 2px;
}
.classic-portfolio .project-item .project-info .project-cat li {
  display: inline-block;
}
.classic-portfolio .project-item .project-info .project-cat a {
  color: #555555;
}
.classic-portfolio .project-item .project-info .project-cat a:hover {
  color: #a67c52;
}
.classic-portfolio .project-item .project-info p {
 margin-bottom: 20px;
}



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

.projects-view .project-b-item .project-b-des, .projects-view .project-b-item .project-image 
{
  width: 100%;
  float: none;
}

.projects-view .project-b-item:nth-child(even) div.project-b-des:after, .projects-view .project-b-item:nth-child(odd) .project-b-des:after {
top: -24px;
left: 47%;
position: absolute;
content: '';
width: 0;
height: 0;
border-style: solid;
border-width: 0 24px 24px 24px;
border-color: transparent transparent #f5f5f5;
display: block;
}

}

@-moz-document url-prefix() { 
  .classic-portfolio.col-2-portfolio .project-item {
  width: 47.8%; 
  margin:4px 1% 32px 1% ;
  }
  .classic-portfolio.col-3-portfolio .project-item {
    width: 31%;
    margin: 4px 1% 32px;
  }
}


/**** Single Portfolio ****/

.single-portfolio-holder {
  margin: 90px 0 20px 0;
}

.single-portfolio-holder .singlework-de {
  width: 100%;
}
.single-portfolio-holder .work-images {
  margin: 0;
  padding: 0;
}
.single-portfolio-holder .work-images li {
  margin-bottom:30px;
  list-style: none;
}


.port-de-title-1 {
  margin:-10px 0 10px 0;
}
.port-de-title-1 .btline-title {
  font-size: 17px;
  text-transform: uppercase;
  color: #5d5d5d;
  letter-spacing: 2px;
  margin-bottom: 20px;
}
.single-port-cont {
  margin-bottom:40px;
}
.single-port-cont p  {
  margin-bottom: 15px;
}

.port-de-title {
  margin: 10px 0 10px 0;
}
.port-dmb {
  margin-bottom: 35px;
}
.port-dem {
  margin-top: 35px;
}
.port-de-title .btline-title {
  font-size: 17px;
  text-transform: uppercase;
  color: #5d5d5d;
  letter-spacing: 2px;
  margin-bottom: 20px;
}
.port-de-title .btline-title:after {
position: absolute;
background: #ada5a4;
width: 50px;
height: 3px;
top: 40px;
opacity: .4;
left: 0;
font-size: 68px;
font-family: serif;
content: " ";
}

.single-port-details {
  margin:72px 0 0 0;
  padding: 0;
  list-style: none; 
}
.single-port-details.single-m {
  margin-top: 30px;
}
.single-port-details li {
  padding: 7px 2px;
  border-bottom: solid 1px #ddd;

}
.single-port-details li:first-child {
  padding-top:0;
}
.single-port-related {
  margin-top: 50px;
}
.single-port-related .btline-title {
  font-size: 17px;
  text-transform: uppercase;
  margin-bottom: 38px;
}

/* single porfolio images slider */

.single-port-slide {
  position: relative;
}

.single-port-slide .single-port-nav a {
  color:#f4f4f4; 
  width:48px;
  height:48px;
  line-height:48px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  opacity:0;
  top:47%;
  text-align:center;
  cursor:pointer;
  position:absolute;
}
.single-port-slide:hover .single-port-nav a  {
 opacity: 1;
}
.single-port-slide .single-port-nav .prev {  
   left:2.2%;
}
.single-port-slide .single-port-nav .next {  
  right:2.2%;
}
.single-port-slide .single-port-nav a:hover { 
  background: rgba( 0, 0, 0, 0.2 );
}
.single-port-slide .owl-pagination-cm {
  position: absolute;
  bottom: 27px;
  width: 100%;
  margin: 0 auto;
}
.single-port-slide .owl-pagination-cm .owl-page span {
display: block;
width: 9px !important;
height:9px !important;
margin: 5px 2px !important;;  
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
background: #fff;
border: none;
} 
.single-port-slide .owl-pagination-cm .owl-page.active span  
{
width: 14px !important;
height: 14px !important;
background: #fff !important;
border: none;
}



/*=================================================
2 -  Share Box 
=================================================*/


.single-post-share-box {
  margin-top: 48px !important;
}
.share-box {
  padding: 14px 20px;
  border: solid 1px #ddd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  display: table;
  width: 100%;
  table-layout: fixed;
  font-size: 12px;
  color: #666;
}
.share-box span, .share-box .share-box-icons {
  display: table-cell;
  vertical-align: middle;
}
.share-box .share-box-icons {
  margin: 0;
  padding: 0;
  list-style: none;
  text-align: right;
}
.share-box  .share-box-icons li {
  display: inline-block;
  font-size: 13px;
  padding: 0 17px;

}

.share-box  .share-box-icons li a {
  color: #787878;
}

.share-box  .share-box-icons li a:hover {
  color: #111;
}
/**** Next and per post nav ****/

.single-post-nav {
  margin-top: 25px !important;
  margin-bottom: 52px !important;
}
.single-post-nav li {
  width:49% !important;
}
.single-post-nav li:first-child {
  margin-right:1.5% !important;
}
.nav-btn {
  margin: 0;
  padding: 0;
  list-style-type: none;

}

.nav-btn li {
  display: inline-block;
  border: solid 1px #ddd;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  width: 176px; 
  height: 51px;
  text-align: center;
}
.nav-btn li a {
  padding: 14px 20px;
  line-height: 51px; 
  color: #787878;
}
.nav-btn li a:hover {
  color: #111;
}

/********* line title *********/ 

.btline-title {
  padding-bottom: 17px;
  position:relative;
  margin-bottom: 32px;
}
.woocommerce-cart-holder .cross-sells {
  margin-top: -10px;
}
.btline-title:after {
  background:#ada5a4; 
  content: " ";
  display: block;
  height: 3px;
  width: 42px; 
  position: absolute;
  bottom: -2px;
  z-index: 999;
}

/*=================================================
3 - Isotope
=================================================*/

/**** Isotope Filtering ****/
.isotope-item {
  z-index: 2;
}

.isotope-hidden.isotope-item {
  pointer-events: none;
  z-index: 1;
}

/**** Isotope CSS3 transitions ****/

.isotope,
.isotope .isotope-item {
  -webkit-transition-duration: 0.8s;
     -moz-transition-duration: 0.8s;
      -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
          transition-duration: 0.8s;
}

.isotope {
  -webkit-transition-property: height, width;
     -moz-transition-property: height, width;
      -ms-transition-property: height, width;
       -o-transition-property: height, width;
          transition-property: height, width;
}

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:      -o-transform, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}

/*=================================================
4 - Page Header
=================================================*/

.pages-header-container {
  background: #f5f5f5; 
}

.pages-header {
  text-align: center;
  padding:45px 0 50px 0;
}
.pages-header .title-un {
  margin-bottom: 6px;
  text-transform: uppercase;
  letter-spacing: 4px;
  font-weight: 600;
  color: #5d5d5d ;
}
.pages-header .breadcrumbs {
  list-style: none;
  margin: 40px 0 0 0;
  padding: 0;
  letter-spacing: 2px;
}
.pages-header .breadcrumbs li {
  display: inline-block;

}
.pages-header .breadcrumbs li:after {
content: '>';
 padding:0 1px 0 5px;
}
.pages-header .breadcrumbs li:last-child:after {
content: '';
}
/*=================================================
5 - des
=================================================*/

.title-un {
  text-align: center;
  position: relative;
  letter-spacing: 2px;
  color: #5d5d5d ;
}
.title-un-des {
text-align: center;
width: 70%;
margin: 45px auto;
}
.title-un:after {
position: absolute;
left:0;
right:0;
margin-left:auto;
margin-right:auto;
background: #ada5a4;
width: 50px;
height: 3px;
bottom: -20px;
opacity: .4;
font-size: 68px;
font-family: serif;
content: " ";
}