Difference between revisions of "Template:Edinburgh OG/header"

Line 155: Line 155:
 
}
 
}
  
 +
/********************************* HOVERING ICON ********************************/   
 
img.link{max-width:90%; filter: grayscale(100%);-webkit-filter: grayscale(100%); opacity:0.7;}  
 
img.link{max-width:90%; filter: grayscale(100%);-webkit-filter: grayscale(100%); opacity:0.7;}  
 
img.link:hover {filter:grayscale(0%); -webkit-filter: grayscale(0%);opacity:1;}
 
img.link:hover {filter:grayscale(0%); -webkit-filter: grayscale(0%);opacity:1;}
 +
 +
/********************************* pORTFOLIO ********************************/   
 +
.portfolio-box {
 +
  position: relative;
 +
  display: block;
 +
  max-width: 650px;
 +
  margin: 0 auto;
 +
}
 +
.portfolio-box .portfolio-box-caption {
 +
  color: white;
 +
  opacity: 0;
 +
  display: block;
 +
  background: rgba(240, 95, 64, 0.9);
 +
  position: absolute;
 +
  bottom: 0;
 +
  text-align: center;
 +
  width: 100%;
 +
  height: 100%;
 +
  -webkit-transition: all 0.35s;
 +
  -moz-transition: all 0.35s;
 +
  transition: all 0.35s;
 +
}
 +
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content {
 +
  width: 100%;
 +
  text-align: center;
 +
  position: absolute;
 +
  top: 50%;
 +
  transform: translateY(-50%);
 +
}
 +
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category,
 +
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
 +
  font-family: 'Open Sans', 'Helvetica Neue', Arial, sans-serif;
 +
  padding: 0 15px;
 +
}
 +
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-category {
 +
  text-transform: uppercase;
 +
  font-weight: 600;
 +
  font-size: 14px;
 +
}
 +
.portfolio-box .portfolio-box-caption .portfolio-box-caption-content .project-name {
 +
  font-size: 18px;
 +
}
 +
.portfolio-box:hover .portfolio-box-caption {
 +
  opacity: 1;
 +
}
 +
.portfolio-box:focus {
 +
  outline: none;
 +
}
 +
.no-padding {
 +
  padding: 0;
 +
}
 +
 
 +
.no-gutter > [class*='col-'] {
 +
  padding-right: 0;
 +
  padding-left: 0;
 +
} 
 
/********************************* Profile Page ********************************/   
 
/********************************* Profile Page ********************************/   
 
.profile {
 
.profile {
Line 471: Line 528:
  
 
</body>
 
</body>
−
 
  
  
 
<html>
 
<html>

Revision as of 15:42, 17 October 2016