/*=================================================

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: " ";

}