/**
  This style is for :
    - Portfolio Teaser Grid Mode
    - Portfolio Teaser with Isotope
    - Portfolio Teaser List Mode
    - Portfolio Single Page
  
  The style will not work properly if the 
  original Portfolio plugin base style is 
  included.
  
  1. Isotope Buttons
  2. List Mode Teaser
  3. Grid Mode Teaser
  4. Portfolio Fotorama
  5. Portfolio Project
  6. Portfolio Project Items
  7. Portfolio Social Buttons
**/

.isotope-target {
  position: relative;
}


/**
  Teaser Category Navigation
  **/
ul.portfolio-source {
  margin-bottom: 60px;
}

ul.portfolio-source > li a {
  font-size: 16px;
  margin-bottom: 15px !important;
}

ul.portfolio-source > li a:hover {
	outline: 0;
}
/**
  Teaser Main body content
  **/
.portfolio-content {
  margin-bottom: 50px;
}


/**
  Teaser Grid Mode
  **/
ul.portfolio > li {
  cursor: pointer;
  position: relative;
  overflow: hidden;
  vertical-align: top;
  margin-bottom: 30px;
}


ul.portfolio .portfolio {
	text-align: center;
}

ul.portfolio .post-thumbnail {
  border-radius: 10px;
  height: 200px;
  overflow: hidden;
  position: relative;
  margin: 0;
}

ul.portfolio .portfolio-info {
	margin-top: 30px;
}

ul.portfolio img {
  border-radius: 10px;
}

ul.portfolio .mask {
	border-radius: 10px;
}


ul.portfolio .post-title {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 10px;
}

ul.portfolio .post-date {
	font-size: 14px;
	margin-bottom: 10px;
}

ul.portfolio .post-portfolio-tags {
  font-size: 14px;
}

ul.portfolio .btn,
ul.portfolio .post-social {
	margin-top: 20px;
}




/**
  Teaser List Mode
  **/
ul.portfolio .list-mode {
	margin-bottom: 70px;
}

ul.portfolio .list-mode .portfolio-info {
  margin-top: 10px;
}

ul.portfolio .list-mode .post-date {
  font-size: 12px;
}


ul.portfolio .list-mode .post-social,
ul.portfolio .list-mode .btn {
	margin-top: 0;
}

ul.portfolio .list-mode .post-bottom {
	margin-top: 30px;
}


/**
  Single Page
  **/
#page .fotorama {
	margin-bottom: 60px;
}

#page .fotorama__nav-wrap {
	border-radius: 10px;
	padding: 10px 20px;
  margin: 20px auto;
}

.fotorama__wrap {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}


#page .fotorama__nav {
  background: transparent;
}

#page .fotorama__thumb-border,
#page .fotorama__thumb {
	border-radius: 6px;
}


#page .fotorama__nav--dots .fotorama__nav__frame {
	width: 30px;
	height: 40px;
}


#page  .fotorama__active .fotorama__dot,
#page  .fotorama__dot {
  border: none;
  border-radius: 100%;
  width: 20px;
  height: 20px;
}

#page .fotorama__arr {
	height: 50px;
	width: 50px;	
	background: none;
	opacity: 0.7;
	text-align: center;
}

#page .fotorama__arr:before {
  font-size: 40px;
	font-family: "fontawesome";
}

#page .fotorama__arr:hover {
	opacity: 1;
}

#page .fotorama__arr--next:before {
	content: "\f138";
}

#page .fotorama__arr--prev:before {
  content: "\f137";
}

.single.portfolio .post-title:first-child {
	margin-top: 0;
}

#page .portfolio-project {
	margin-top: 70px;
}

#page .portfolio-project-item {
	margin-bottom: 60px;
	padding-left: 20px;
	padding-right: 40px;
}

#page .portfolio-project-item .portfolio-project-body {
	font-size: 14px;
}

#page .portfolio-project-item .faplus {
	margin-top: 3px;
	float: left;
	margin-right: 15px;
}

#page .portfolio-project-item .faplus.pull-center {
	width: 100%;
	margin: 10px 0;
	text-align: center;
}

#page .portfolio-project-item .faplus.pull-left {
	margin-right: 30px;
}

#page .portfolio-project-item .faplus.pull-right {
  margin-left: 30px;
}

#page .portfolio-project-item .faplus-shape-diamond,
#page .portfolio-project-item .faplus-shape-circle {
	padding: 15px;
	width: auto;
}


#page .portfolio-project-title {
  font-size: 18px;
  font-weight: bold;
  line-height: 19px;
  padding-top: 3px;
  margin-bottom: 5px;
  border: none;
}

.single.portfolio .post-social {
	margin-top: 30px;
}

.single.portfolio #sidebar {
  padding-top: 0;
}

.single.portfolio .portfolio-project-inner {
	display: table-cell;
}