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

    Template Name:  Sole - Portfolio, Resume and CV
    Template URI: http://themevictory.com
    Description: This is html5 template
    Author: ThemeVictory
    Author URI: http://themevictory.com
    Version: 1.0

-----------------------------------------------------------------------------------
    
    CSS INDEX
    ===================
    
    1. Theme Default CSS (body, link color, section etc)
    2. Aside Menu Area
    3. About Area  
    4. Skills Area
    5. Experience & Education Area
      5.1. Video Area
    6. Portfolio Area
    7. References Area 
    8. Pricing Table Area
    9. Blog  Area
    10. Interests Area 
    11. Contact Area 
    12. Footer Area
    13. Single Portfolio Area
    14. Blog Details Area
    

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


/* Google Fonts Here */

@import url('https://fonts.googleapis.com/css?family=Dosis:700|Lato:300,400,400i,700');

/*----------------------------------------*/
/*  1. Theme default CSS
/*----------------------------------------*/

body {
  font-family: 'Lato', sans-serif;
  font-size: 16px;
  line-height: 24px;
  position: relative;
  overflow-x: hidden;
  color: #999;
  background-color: #f7f7f7;
}

a {
  transition: all .3s ease 0s;
  text-decoration: none;
}

a:hover,
a:focus {
  text-decoration: none;
  outline: 0;
}

img {
  max-width: 100%;
  height: auto;
}

p {
  margin: 0 0 15px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0 0 10px;
  color: #444;
}

::-moz-selection {
  background: #b3d4fc;
  text-shadow: none;
}

::selection {
  background: #b3d4fc;
  text-shadow: none;
}

#loader-wrapper {
  position: fixed;
  z-index: 10;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

#loader {
  position: relative;
  z-index: 11;
  top: 50%;
  left: 50%;
  display: block;
  width: 150px;
  height: 150px;
  margin: -75px 0 0 -75px;
  -webkit-animation: spin 1.7s linear infinite;
  animation: spin 1.7s linear infinite;
  border: 3px solid transparent;
  border-top-color: #16a085;
  border-radius: 50%;
}

#loader:before {
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  content: '';
  -webkit-animation: spin-reverse .6s linear infinite;
  animation: spin-reverse .6s linear infinite;
  border: 3px solid transparent;
  border-top-color: #e74c3c;
  border-radius: 50%;
}

#loader:after {
  position: absolute;
  top: 15px;
  right: 15px;
  bottom: 15px;
  left: 15px;
  content: '';
  -webkit-animation: spin 1s linear infinite;
  animation: spin 1s linear infinite;
  border: 3px solid transparent;
  border-top-color: #f9c922;
  border-radius: 50%;
}

@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
  }
}

@keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes spin-reverse {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
  }
}

@keyframes spin-reverse {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(-360deg);
    transform: rotate(-360deg);
  }
}

#loader-wrapper .loader-section {
  position: fixed;
  z-index: 10;
  top: 0;
  width: 51%;
  height: 100%;
  background-color: #222222;
}

#loader-wrapper .loader-section.section-left {
  left: 0;
}

#loader-wrapper .loader-section.section-right {
  right: 0;
}

.loaded #loader-wrapper .loader-section.section-left {
  -webkit-transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
  transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
}

.loaded #loader-wrapper .loader-section.section-right {
  -webkit-transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
  transition: all .7s .3s cubic-bezier(.645, .045, .355, 1);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
}

.loaded #loader {
  -webkit-transition: all .3s ease-out;
  transition: all .3s ease-out;
  opacity: 0;
}

.loaded #loader-wrapper {
  visibility: hidden;
  -webkit-transition: all .3s 1s ease-out;
  transition: all .3s 1s ease-out;
  -webkit-transform: translateY(-100%);
  transform: translateY(-100%);
}

.section-title {
  padding: 70px 0 35px;
}

.section-title h2 {
  font-family: 'Dosis', sans-serif;
  font-size: 30px;
  font-weight: 700;
  text-transform: uppercase;
}

.area-padding {
  padding: 75px 20px;
}

.wrapper {
  padding-top: 40px;
}


/*----------------------------------------*/
/*  2. Aside Menu Area
/*----------------------------------------*/

#left-aside {
  padding: 0 30px 20px;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.profile-img {
  display: block;
  padding-top: 15px;
  padding-bottom: 25px;
  text-align: center;
}

.profile-img img {
  display: inline-block;
  width: 200px;
  height: 200px;
  border: 4px solid #eee;
}

.main-menu > li {
  position: relative;
  display: block;
  margin: 6px 0;
  text-align: center;
}

.main-menu > li a {
  font-family: 'Dosis', sans-serif;
  font-size: 24px;
  font-weight: 700;
  position: relative;
  display: inline-block;
  padding: 5px 0 2px;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  color: #000;
}

.main-menu > li a::before {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  max-width: 0;
  padding: 5px 0 2px;
  content: attr(data-hover);
  -webkit-transition: max-width .5s;
  -moz-transition: max-width .5s;
  transition: max-width .5s;
  color: #1fc0a0;
  border-bottom: 2px solid #1fc0a0;
}

.main-menu > li a:hover::before,
.main-menu > li a:active::before {
  max-width: 100%;
}

.main-menu > li.active a:hover {
  color: #1fc0a0;
  background: none;
}

.main-menu > li.active a {
  background-color: transparent;
}

.main-menu > li.active a::before {
  max-width: 100%;
}

.main-menu > li a:hover {
  color: #1fc0a0;
  background-color: transparent;
}

.nav > li > a:focus {
  background-color: transparent;
}


/*--------------------------------*/
/*  3. About Area
/*--------------------------------*/

.wrapper-right {
  padding: 0 20px;
}

.about-box {
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.about-content {
  padding-top: 50px;
}

.about-content h1 {
  font-weight: 400;
  color: #000;
}

.about-content strong {
  color: #1fc0a0;
}

.about-content span.typer {
  font-size: 24px;
  font-weight: 600;
  color: #1fc0a0;
}

.about-self {
  padding: 0 110px;
  text-align: center;
}

.about-self > p {
  font-size: 18px;
  line-height: 24px;
  padding: 40px 0 20px;
  border-bottom: 1px solid #e4e4e4;
}

.self-text {
  padding: 30px 110px 20px;
}

.my-profile {
  margin: 0;
  padding: 0;
  list-style: none;
}

.my-profile li {
  float: left;
  width: 50%;
  margin-bottom: 12px;
}

.head-title {
  font-size: 16px;
  display: inline-block;
  width: 100px;
  color: #444;
}

.pro-list {
  font-size: 16px;
  font-weight: 400;
  color: #9da0a7;
}

.about-bottom {
  display: block;
  overflow: hidden;
  margin-top: 30px;
  padding: 12px 0;
  background-color: #1fc0a0;
}

.social-icons ul {
  margin-bottom: 0;
}

.social-icons ul li {
  display: inline-block;
}

.social-icons ul li a {
  display: block;
  width: 40px;
  height: 40px;
  margin: 0 4px;
  transition: .3s;
  text-align: center;
  color: #fff;
  border-radius: 50%;
  background-color: transparent;
}

.social-icons ul li i {
  font-size: 18px;
  line-height: 42px;
}

.social-icons ul li a:hover {
  transition: .3s;
  color: #fff;
  box-shadow: 0 5px 11px 0 rgba(0, 0, 0, .20), 0 4px 15px 0 rgba(0, 0, 0, .15);
}


/*--------------------------------*/
/*  4. Skills Area
/*--------------------------------*/

.skill-box {
  margin-bottom: 5px;
  padding: 55px 40px 20px;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.skill-progress {
  position: relative;
}

.progress {
  position: relative;
  height: 5px;
  margin-bottom: 30px;
  border-radius: 0;
  background-color: #ddfbf5;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1) inset;
}

.web-per {
  font-size: 10px;
  line-height: 19px;
  position: absolute;
  top: -4px;
  right: 2%;
  width: 37px;
  height: 20px;
  text-align: center;
  color: #fff;
  border-radius: 2px;
  background: #1fc0a0 none repeat scroll 0 0;
}

.web-per::after {
  position: absolute;
  bottom: -6px;
  left: 15px;
  content: '';
  border-top: 6px solid #1fc0a0;
  border-right: 4px solid transparent;
  border-left: 4px solid transparent;
}

.progress-bar {
  line-height: 8px;
  border-radius: 5px;
  background-color: #1fc0a0;
}

.col-sm-6:nth-child(2) .skill-progress span {
  right: 7%;
}

.col-sm-6:nth-child(3) .skill-progress span {
  right: 17%;
}

.col-sm-6:nth-child(4) .skill-progress span {
  right: 27%;
}

.col-sm-6:nth-child(5) .skill-progress span {
  right: 12%;
}

.col-sm-6:nth-child(6) .skill-progress span {
  right: 7%;
}


/*--------------------------------*/
/*  5.Experience & Education Area
/*--------------------------------*/

.edu-result h4 {
  font-size: 17px;
  font-weight: 700;
  padding-top: 25px;
  text-transform: uppercase;
  color: #333;
}

.edu-result p {
  font-size: 16px;
  color: #757575;
}

.select-pin {
  font-size: 16px;
  font-weight: 700;
  position: relative;
  padding: 4px 20px 6px;
  text-align: center;
  color: #fff;
  border-radius: 2px;
  background-color: #1fc0a0;
}

.experience-main {
  background-color: #f7f7f7;
}

.left-edu .select-pin::after,
.right-edu .select-pin::after {
  position: absolute;
  bottom: -8px;
  content: '';
  border-top: 8px solid #1fc0a0;
}

.left-edu .select-pin::after {
  left: calc(50% - 6px);
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
}

.right-edu .select-pin::after {
  left: calc(50% - 6px);
  border-right: 6px solid transparent;
  border-left: 6px solid transparent;
}

.expre-edu.left-edu .edu-result {
  text-align: center;
}

.left-edu {
  position: relative;
  padding-right: 30px;
}

.left-edu::before {
  position: absolute;
  top: 0;
  right: -15px;
  width: 2px;
  height: 100%;
  content: '';
  background-color: #bef3e8;
}

.right-expre .edu-result {
  position: relative;
  padding: 30px 20px 15px;
  text-align: center;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.left-edu .edu-result {
  position: relative;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.right-expre .edu-result::before {
  position: absolute;
  bottom: 35px;
  left: -53px;
  width: 14px;
  height: 14px;
  content: '';
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  border: 2px solid #f7f7f7;
  background-color: #1fc0a0;
}

.right-expre .edu-result::after {
  position: absolute;
  bottom: 1px;
  left: -13px;
  content: '';
  border-top: 40px solid transparent;
  border-right: 12px solid rgba(31, 192, 160, .5);
  border-bottom: 40px solid transparent;
}

.left-edu .edu-result::after {
  position: absolute;
  z-index: 0;
  top: 36px;
  right: -51px;
  width: 14px;
  height: 14px;
  content: '';
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  border: 2px solid #f7f7f7;
  background-color: #1fc0a0;
}

.left-edu .edu-result::before {
  position: absolute;
  top: 1px;
  right: -13px;
  content: '';
  border-top: 40px solid transparent;
  border-bottom: 40px solid transparent;
  border-left: 12px solid rgba(31, 192, 160, .5);
}

.right-expre {
  padding-left: 30px;
}

.edu-result h6 {
  font-size: 14px;
  font-weight: 500;
  padding-bottom: 10px;
  text-transform: uppercase;
  color: #666;
}

.edu-result {
  margin-bottom: 25px;
  padding: 30px 20px 15px;
  background-color: #fff;
}

.last-result {
  margin-bottom: 0;
}

.expre-edu.left-edu .edu-result:last-child {
  margin-bottom: 0;
}

.expre-edu.right-expre .edu-result:last-child {
  margin-bottom: 0;
}


/*--------------------------------*/
/*  5.1 Video Area
/*--------------------------------*/

.video-area {
  display: block;
  margin-top: 70px;
  padding: 50px 30px;
  text-align: center;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.play-button {
  position: relative;
}

.play-button i {
  font-size: 25px;
  line-height: 71px;
  margin-left: 5px;
  color: #fff;
}

.play-button a {
  display: inline-block;
  width: 70px;
  height: 70px;
  text-align: center;
  border-radius: 50%;
  background-color: #1fc0a0;
}

.cd-popup-trigger + .tooltip > .tooltip-inner {
  padding: 5px 10px 3px;
  letter-spacing: 1px;
  text-transform: uppercase;
  background-color: #1fc0a0;
}

.cd-popup-trigger + .tooltip > .tooltip-arrow {
  border-top-color: #1fc0a0;
}

.cd-popup {
  position: fixed;
  z-index: 999999;
  top: 0;
  left: 0;
  visibility: hidden;
  width: 100%;
  height: 100%;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  opacity: 0;
  background-color: rgba(0, 0, 0, .85);
}

.cd-popup.is-visible {
  visibility: visible;
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
  opacity: 1;
}

.cd-popup-container {
  width: 80%;
  max-width: 650px;
  -webkit-transition-duration: .3s;
  -moz-transition-duration: .3s;
  transition-duration: .3s;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transform: translateY(-40px);
  -moz-transform: translateY(-40px);
  -ms-transform: translateY(-40px);
  -o-transform: translateY(-40px);
  transform: translateY(-40px);
  text-align: center;
  -webkit-backface-visibility: hidden;
}

.cd-popup::before {
  height: 100%;
  content: '';
}

.cd-popup-container,
.cd-popup::before {
  display: inline-block;
  vertical-align: middle;
}

.cd-popup-container .cd-popup-close {
  font-size: 19px;
  position: absolute;
  top: 0;
  right: 0;
  width: 30px;
  height: 30px;
  color: #ef4836;
}

.cd-popup-container a {
  background-color: #fff;
}

.video-container {
  position: relative;
  max-width: 650px;
  height: 350px;
  max-height: 100%;
  margin: 0 auto;
}

.video-container iframe {
  overflow: hidden;
  width: 100%;
  max-width: 650px;
  border: none;
}

.is-visible .cd-popup-container {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}


/*--------------------------------*/
/*  6. Portfolio Area
/*--------------------------------*/

.ff-container {
  display: block;
  width: 100%;
  padding: 30px 0 40px;
  text-align: center;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.ff-container label {
  font-size: 19px;
  line-height: 33px;
  display: inline-block;
  height: 30px;
  margin: 0 15px;
  padding: 0 2px;
  cursor: pointer;
  color: #424d71;
}

.ff-container label.ff-label-type-3 {
  border-radius: 0 3px 3px 0;
}

.ff-container input.ff-selector-type-all:checked ~ label.ff-label-type-all,
.ff-container input.ff-selector-type-1:checked ~ label.ff-label-type-1,
.ff-container input.ff-selector-type-2:checked ~ label.ff-label-type-2,
.ff-container input.ff-selector-type-3:checked ~ label.ff-label-type-3 {
  color: #1fc0a0;
  border-bottom: 2px solid #1fc0a0;
}

.ff-container input {
  display: none;
}

.clr {
  clear: both;
}

.da-thumbs {
  position: relative;
  margin: 20px auto;
  padding: 0;
  list-style: none;
}

.da-thumbs li {
  position: relative;
  float: left;
  margin: 11px;
  padding: 8px;
  background-color: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, .1);
}

.da-thumbs li a,
.da-thumbs li a img {
  position: relative;
  display: block;
}

.da-thumbs li a img {
  width: 225px;
  height: auto;
}

.da-thumbs li a {
  overflow: hidden;
}

.da-thumbs li a div {
  position: absolute;
  width: 100%;
  height: 100%;
  background-color: rgba(32, 39, 52, .8);
}

.da-thumbs li a div span {
  font-size: 18px;
  margin: 49px 0;
  padding: 10px 0;
}

.da-thumbs i.fa.fa-search {
  display: block;
}

.da-thumbs li a:hover {
  cursor: url(img/logo/hover-plus.png), auto;
  transition: .1s;
}

.ff-items {
  position: relative;
  margin: 0 auto;
  padding: 20px 9px 0;
  background-color: #fff;
}

.ff-items a span {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: block;
  overflow: hidden;
  height: 0;
  -webkit-transition: all .3s ease-out;
  -moz-transition: all .3s ease-out;
  -ms-transition: all .3s ease-out;
  -o-transition: all .3s ease-out;
  transition: all .3s ease-out;
  text-align: center;
  opacity: 0;
  color: #fff;
}

.ff-items a:hover span {
  height: 57px;
  opacity: 1;
}

.ff-items li {
  -webkit-transition: all .6s ease-in-out;
  -moz-transition: all .6s ease-in-out;
  -ms-transition: all .6s ease-in-out;
  -o-transition: all .6s ease-in-out;
  transition: all .6s ease-in-out;
}

.ff-container input.ff-selector-type-1:checked ~ .ff-items .ff-item-type-1,
.ff-container input.ff-selector-type-2:checked ~ .ff-items .ff-item-type-2,
.ff-container input.ff-selector-type-3:checked ~ .ff-items .ff-item-type-3 {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
  transform: scale(1.05);
  opacity: 1;
}

.ff-container input.ff-selector-type-1:checked ~ .ff-items li:not(.ff-item-type-1),
.ff-container input.ff-selector-type-2:checked ~ .ff-items li:not(.ff-item-type-2),
.ff-container input.ff-selector-type-3:checked ~ .ff-items li:not(.ff-item-type-3) {
  -webkit-transform: scale(.5);
  -moz-transform: scale(.5);
  -ms-transform: scale(.5);
  -o-transform: scale(.5);
  transform: scale(.5);
  opacity: .1;
}

.ff-container input.ff-selector-type-1:checked ~ .ff-items li:not(.ff-item-type-1) span,
.ff-container input.ff-selector-type-2:checked ~ .ff-items li:not(.ff-item-type-2) span,
.ff-container input.ff-selector-type-3:checked ~ .ff-items li:not(.ff-item-type-3) span {
  display: none;
}


/*--------------------------------*/
/*  7. References Area
/*--------------------------------*/

.clients-container {
  padding: 70px 0 5px;
}

.single-clients {
  float: left;
  overflow: hidden;
}

.clients-logo {
  display: block;
  text-align: center;
}

.clients-logo img {
  display: block;
  width: 100%;
  height: 100%;
}

.owl-nav.disabled {
  display: none;
}

/*--------------------------------*/
/*  8. Pricing Table Area
/*--------------------------------*/

.pricing {
  display: -webkit-flex;
  display: flex;
  width: 100%;
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-justify-content: center;
  justify-content: center;
}

.pricing-item {
  position: relative;
  display: -webkit-flex;
  display: flex;
  flex-direction: column;
  width: 33.33%;
  text-align: center;
  -webkit-flex-direction: column;
  -webkit-align-items: stretch;
  align-items: stretch;
}

.pricing-feature-list {
  text-align: left;
}

.pricing-action {
  color: inherit;
  border: none;
  background: none;
}

.pricing-action:focus {
  outline: none;
}

.pricing .pricing-item {
  padding: 20px 30px 25px;
  cursor: default;
  -webkit-transition: background .3s;
  transition: background .3s;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.pricing .pricing-title {
  font-size: 32px;
  font-weight: 700;
  padding: 0 0 18px;
  color: #777;
  border-bottom: 2px solid rgba(31, 192, 160, .3);
}

.pricing .pricing-price {
  font-size: 24px;
  padding: 16px 0 22px;
  color: #1fc0a0;
}

.pricing .pricing-sentence {
  font-size: 16px;
  font-weight: 700;
}

.pricing .pricing-feature-list {
  margin: 0;
  padding: 16px 20px 32px;
}

.pricing .pricing-action {
  font-size: 16px;
  position: relative;
  display: inline-block;
  margin-top: auto;
  padding: 5px 0 7px;
  -webkit-transition: background .3s;
  transition: background .3s;
  text-transform: capitalize;
  color: #fff;
  border: 1px solid #1fc0a0;
  border-radius: 2px;
  background-color: #1fc0a0;
}

.pricing .pricing-action:hover,
.pricing .pricing-action:focus {
  text-decoration: none;
  color: #1fc0a0;
  border: 1px solid #1fc0a0;
  background: #fff;
}


/*--------------------------------*/
/*  9. Blog Area
/*--------------------------------*/

.blog-box {
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.single-blog {
  display: block;
  padding: 15px 15px 35px;
}

.single-blog-img {
  position: relative;
  display: block;
  overflow: hidden;
  width: 100%;
  margin-bottom: 15px;
}

.frame-embed {
  width: 100%;
  height: 215px;
  border: 0;
}

.blog-content-area {
  padding: 0 0 60px 15px;
}

.blog-meta {
  margin-bottom: 10px;
  padding: 10px 0;
  border-bottom: 1px solid #ccc;
}

.blog-meta span.date-type {
  font-size: 13px;
  padding-right: 10px;
  color: #444;
  border-right: 1px solid #777;
}

.blog-meta span.date-type i {
  margin-right: 6px;
}

.blog-meta span.comments-type {
  margin-left: 10px;
}

.blog-meta span.comments-type a {
  font-size: 12px;
  margin-left: 5px;
  color: #444;
}

.blog-content h4 {
  margin-bottom: 10px;
  color: #444;
}

.blog-content h4 a {
  font-size: 18px;
  font-weight: 600;
  color: #444;
}

.blog-content h4 a:hover {
  text-decoration: none;
}

.blog-content p {
  font-size: 16px;
  line-height: 24px;
  margin-bottom: 5px;
  padding-bottom: 10px;
  color: #444;
}

.blog-btn a {
  font-size: 16px;
  position: relative;
  display: inline-block;
  padding: 5px 30px 7px 15px;
  text-transform: capitalize;
  color: #fff;
  border: 1px solid #1fc0a0;
  border-radius: 2px;
  background-color: #1fc0a0;
}

.blog-btn a::after {
  font-family: fontawesome;
  position: absolute;
  top: 6.5px;
  right: 12px;
  content: '\f105';
}

.blog-btn a:hover {
  text-decoration: none;
  color: #1fc0a0;
  border: 1px solid #1fc0a0;
  background: #fff;
}

.blog-item.item-indicator.owl-carousel.owl-theme .owl-nav div {
  font-size: 20px;
  line-height: 24px;
  display: inline-block;
  width: 30px;
  height: 30px;
  transition: all .5s ease 0s;
  text-align: center;
  color: #1fc0a0;
  border: 1px solid #1fc0a0;
  border-radius: 0;
  background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
}

.blog-item.item-indicator.owl-carousel.owl-theme .owl-nav div.owl-prev {
  position: absolute;
  bottom: 20px;
  left: calc(50% - 35px);
}

.blog-item.item-indicator.owl-carousel.owl-theme .owl-nav div.owl-next {
  position: absolute;
  bottom: 20px;
  left: calc(50% + 5px);
}

.blog-item.item-indicator.owl-carousel.owl-theme .owl-nav div.owl-prev:hover,
.item-indicator.owl-carousel.owl-theme .owl-nav div.owl-next:hover {
  color: #fff;
  border: 1px solid #1fc0a0;
  background: #1fc0a0;
}

.blog-item.item-indicator .col-md-6 {
  width: 100%;
}


/*--------------------------------*/
/*  10. Interests Area
/*--------------------------------*/

.interest-box {
  padding: 40px 50px;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.interest-box p {
  font-size: 16px;
  text-align: center;
  color: #757575;
}

.interests-list {
  margin: 0;
  padding: 15px 0 0;
  list-style: none;
  text-align: center;
}

.interests-list li {
  position: relative;
  display: inline-block;
  width: 80px;
  height: 80px;
  margin: 7px 5px;
  border: 1px solid #ccc;
  border-radius: 50%;
}

.interests-list i {
  font-size: 30px;
  line-height: 80px;
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  color: #1fc0a0;
}

.interests-list li + .tooltip > .tooltip-inner {
  padding: 5px 10px 3px;
  letter-spacing: 1px;
  background-color: #1fc0a0;
}

.interests-list li + .tooltip > .tooltip-arrow {
  border-bottom-color: #1fc0a0;
}


/*--------------------------------*/
/*  11. Contact Area
/*--------------------------------*/

.contact-form {
  margin-bottom: 5px;
  padding: 50px 30px;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.contact-area .form-control {
  font-size: 15px;
  height: 43px;
  margin-bottom: 20px;
  padding: 4px 12px 6px 15px;
  border: 1px solid #ccc;
  border-radius: 2px;
  box-shadow: none;
}

.contact-area textarea.form-control {
  font-size: 15px;
  height: 160px;
  margin-bottom: 20px;
  padding: 15px;
  resize: none;
  color: #000;
  border: 1px solid #ccc;
}

.contact-area .form-control:focus,
.contact-area textarea.form-control:focus {
  border-color: #1fc0a0;
}

.form-messages {
  transition: all .4s ease 0s;
  color: #ed3928;
}

.form-messages.success {
  color: #0f0;
}

.form-messages.error {
  color: #f00;
}

input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
  color: #555;
  background-color: transparent;
  background-image: none;
}

.btn.btn-custom {
  font-weight: 600;
  padding: 7px 30px;
  transition: all .3s ease-in-out;
  text-transform: uppercase;
  color: #fff;
  border: 1px solid #1fc0a0;
  background-color: #1fc0a0;
}

@-webkit-keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}

@keyframes hvr-ripple-out {
  100% {
    top: -12px;
    right: -12px;
    bottom: -12px;
    left: -12px;
    opacity: 0;
  }
}

.hvr-ripple-out {
  position: relative;
  display: inline-block;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  vertical-align: middle;
  box-shadow: 0 0 1px transparent;
}

.hvr-ripple-out:before {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  content: '';
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  border: 6px solid #1fc0a0;
  border-radius: 4px;
}

.hvr-ripple-out:hover:before,
.hvr-ripple-out:focus:before,
.hvr-ripple-out:active:before {
  -webkit-animation-name: hvr-ripple-out;
  animation-name: hvr-ripple-out;
}

.promote-img {
  margin: 30px 0 15px;
}

.promote-img img {
  border: 4px solid #eee;
}

.promote-text p {
  font-size: 16px;
  margin-bottom: 2px;
  color: #444;
}

.promote-text p a {
  color: #444;
}


/*--------------------------------*/
/*  12. Contact Area
/*--------------------------------*/

.footer-area {
  padding: 30px 0 15px;
  text-align: center;
}


/*--------------------------------*/
/*  13. Single Portfolio Area
/*--------------------------------*/

.single-portfolio-desc {
  background-color: #fff;
}

.single-desc-img {
  padding: 10px;
  background-color: #fff;
}

.cb-slideshow-box {
  position: relative;
  overflow: hidden;
  height: 525px;
}

.cb-slideshow,
.cb-slideshow::after {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 10px;
}

.cb-slideshow::after {
  content: '';
  background: transparent url(img/pattern.png) repeat top left;
}

.cb-slideshow li span {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-animation: imageAnimation 36s linear infinite 0s;
  -moz-animation: imageAnimation 36s linear infinite 0s;
  -ms-animation: imageAnimation 36s linear infinite 0s;
  -o-animation: imageAnimation 36s linear infinite 0s;
  animation: imageAnimation 36s linear infinite 0s;
  opacity: 0;
  color: transparent;
  background-repeat: none;
  background-position: 50% 50%;
  background-size: cover;
  -webkit-backface-visibility: hidden;
}

.cb-slideshow li div {
  position: absolute;
  z-index: 1000;
  bottom: 10px;
  left: 0;
  width: 100%;
  -webkit-animation: titleAnimation 36s linear infinite 0s;
  -moz-animation: titleAnimation 36s linear infinite 0s;
  -ms-animation: titleAnimation 36s linear infinite 0s;
  -o-animation: titleAnimation 36s linear infinite 0s;
  animation: titleAnimation 36s linear infinite 0s;
  text-align: right;
  opacity: 0;
}

.cb-slideshow li div h3 {
  font-size: 70px;
  line-height: 120px;
  padding: 0 30px;
  color: rgba(169, 3, 41, .8);
}

.cb-slideshow li:nth-child(1) span {
  background-image: url(img/portfolio/01.jpg);
}

.cb-slideshow li:nth-child(2) span {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -ms-animation-delay: 6s;
  -o-animation-delay: 6s;
  animation-delay: 6s;
  background-image: url(img/single-portfolio/03.jpg);
}

.cb-slideshow li:nth-child(3) span {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -ms-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
  background-image: url(img/single-portfolio/04.jpg);
}

.cb-slideshow li:nth-child(4) span {
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
  -ms-animation-delay: 18s;
  -o-animation-delay: 18s;
  animation-delay: 18s;
  background-image: url(img/single-portfolio/05.jpg);
}

.cb-slideshow li:nth-child(5) span {
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
  -ms-animation-delay: 24s;
  -o-animation-delay: 24s;
  animation-delay: 24s;
  background-image: url(img/single-portfolio/06.jpg);
}

.cb-slideshow li:nth-child(6) span {
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -ms-animation-delay: 30s;
  -o-animation-delay: 30s;
  animation-delay: 30s;
  background-image: url(img/single-portfolio/07.jpg);
}

.cb-slideshow li:nth-child(2) div {
  -webkit-animation-delay: 6s;
  -moz-animation-delay: 6s;
  -ms-animation-delay: 6s;
  -o-animation-delay: 6s;
  animation-delay: 6s;
}

.cb-slideshow li:nth-child(3) div {
  -webkit-animation-delay: 12s;
  -moz-animation-delay: 12s;
  -ms-animation-delay: 12s;
  -o-animation-delay: 12s;
  animation-delay: 12s;
}

.cb-slideshow li:nth-child(4) div {
  -webkit-animation-delay: 18s;
  -moz-animation-delay: 18s;
  -ms-animation-delay: 18s;
  -o-animation-delay: 18s;
  animation-delay: 18s;
}

.cb-slideshow li:nth-child(5) div {
  -webkit-animation-delay: 24s;
  -moz-animation-delay: 24s;
  -ms-animation-delay: 24s;
  -o-animation-delay: 24s;
  animation-delay: 24s;
}

.cb-slideshow li:nth-child(6) div {
  -webkit-animation-delay: 30s;
  -moz-animation-delay: 30s;
  -ms-animation-delay: 30s;
  -o-animation-delay: 30s;
  animation-delay: 30s;
}

@-webkit-keyframes imageAnimation {
  0% {
    -webkit-animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    -webkit-transform: scale(1.05);
    -webkit-animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    -webkit-transform: scale(1.1) rotate(3deg);
    opacity: 1;
  }
  25% {
    -webkit-transform: scale(1.1) rotate(3deg);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes imageAnimation {
  0% {
    -moz-animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    -moz-transform: scale(1.05);
    -moz-animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    -moz-transform: scale(1.1) rotate(3deg);
    opacity: 1;
  }
  25% {
    -moz-transform: scale(1.1) rotate(3deg);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes imageAnimation {
  0% {
    -o-animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    -o-transform: scale(1.05);
    -o-animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    -o-transform: scale(1.1) rotate(3deg);
    opacity: 1;
  }
  25% {
    -o-transform: scale(1.1) rotate(3deg);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-ms-keyframes imageAnimation {
  0% {
    -ms-animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    -ms-transform: scale(1.05);
    -ms-animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    -ms-transform: scale(1.1) rotate(3deg);
    opacity: 1;
  }
  25% {
    -ms-transform: scale(1.1) rotate(3deg);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes imageAnimation {
  0% {
    animation-timing-function: ease-in;
    opacity: 0;
  }
  8% {
    transform: scale(1.05);
    animation-timing-function: ease-out;
    opacity: 1;
  }
  17% {
    transform: scale(1.1) rotate(3deg);
    opacity: 1;
  }
  25% {
    transform: scale(1.1) rotate(3deg);
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-webkit-keyframes titleAnimation {
  0% {
    -webkit-transform: translateX(200px);
    opacity: 0;
  }
  8% {
    -webkit-transform: translateX(0px);
    opacity: 1;
  }
  17% {
    -webkit-transform: translateX(0px);
    opacity: 1;
  }
  19% {
    -webkit-transform: translateX(-400px);
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-moz-keyframes titleAnimation {
  0% {
    -moz-transform: translateX(200px);
    opacity: 0;
  }
  8% {
    -moz-transform: translateX(0px);
    opacity: 1;
  }
  17% {
    -moz-transform: translateX(0px);
    opacity: 1;
  }
  19% {
    -moz-transform: translateX(-400px);
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-o-keyframes titleAnimation {
  0% {
    -o-transform: translateX(200px);
    opacity: 0;
  }
  8% {
    -o-transform: translateX(0px);
    opacity: 1;
  }
  17% {
    -o-transform: translateX(0px);
    opacity: 1;
  }
  19% {
    -o-transform: translateX(-400px);
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@-ms-keyframes titleAnimation {
  0% {
    -ms-transform: translateX(200px);
    opacity: 0;
  }
  8% {
    -ms-transform: translateX(0px);
    opacity: 1;
  }
  17% {
    -ms-transform: translateX(0px);
    opacity: 1;
  }
  19% {
    -ms-transform: translateX(-400px);
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

@keyframes titleAnimation {
  0% {
    transform: translateX(200px);
    opacity: 0;
  }
  8% {
    transform: translateX(0px);
    opacity: 1;
  }
  17% {
    transform: translateX(0px);
    opacity: 1;
  }
  19% {
    transform: translateX(-400px);
    opacity: 0;
  }
  25% {
    opacity: 0;
  }
  100% {
    opacity: 0;
  }
}

.no-cssanimations .cb-slideshow li span {
  opacity: 1;
}

.single-portfolio-info {
  margin-top: 40px;
  padding: 0 100px;
  text-align: center;
}

.single-portfolio-info h2 {
  font-weight: 700;
}

.single-portfolio-info p {
  font-size: 16px;
  line-height: 24px;
  padding: 20px 0 10px;
  color: #757575;
}

.section-line {
  position: relative;
  top: -6px;
  display: inline-block;
  width: 65px;
  height: 1px;
  margin: 0 auto;
  margin-bottom: 4px;
  background: #ccc;
}

.single-portfolio-info blockquote p {
  font-weight: 600;
  padding: 0 0 5px;
  text-align: left;
}

.section-line::after {
  display: block;
  width: 40px;
  height: 1px;
  margin: 3px auto;
  content: '';
  background: #ccc;
}

.portfolio-attributes {
  display: block;
  margin: 40px 0 60px;
  text-align: center;
}

.attribute {
  font-size: 16px;
  display: inline-flex;
  margin: 0 20px;
  color: #333;
}

.lb-album {
  padding: 0 10px;
  list-style: none;
}

.lb-album li {
  position: relative;
  float: left;
  width: 33.33%;
  padding: 10px;
}

.lb-album li > a,
.lb-album li > a img {
  display: block;
}

.lb-album li > a {
  position: relative;
  padding: 2px;
  border-radius: 2px;
  background: #f7f7f7;
}

.lb-album li > a span {
  font-size: 24px;
  line-height: 162px;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -webkit-transition: opacity .3s linear;
  -moz-transition: opacity .3s linear;
  -ms-transition: opacity .3s linear;
  -o-transition: opacity .3s linear;
  transition: opacity .3s linear;
  text-align: center;
  opacity: 0;
  color: #fff;
  background-color: rgba(32, 39, 52, .8);
  filter: alpha(opacity=0);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)';
}

.lb-album li > a:hover span {
  opacity: 1;
  filter: alpha(opacity=99);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=99)';
}

.lb-overlay {
  position: fixed;
  z-index: 99;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 0;
  height: 0;
  padding: 0;
  text-align: center;
  background-color: rgba(32, 39, 52, .9);
}

.lb-overlay > div {
  position: relative;
  width: 550px;
  height: 80px;
  margin: 40px auto 0 auto;
  color: rgba(27, 54, 81, .8);
}

.lb-overlay div h3,
.lb-overlay div p {
  width: 275px;
  height: 60px;
  padding: 0 20px;
}

.lb-overlay div h3 {
  font-size: 24px;
  line-height: 36px;
  float: left;
  text-align: right;
  text-transform: uppercase;
  color: #fff;
  border-right: 1px solid #fff;
}

.lb-overlay div h3 span {
  font-weight: 400;
  text-transform: capitalize;
}

.lb-overlay div h3 span,
.lb-overlay div p {
  font-size: 16px;
  font-style: italic;
}

.lb-overlay div h3 span {
  line-height: 10px;
  display: block;
}

.lb-overlay div p {
  float: left;
  text-align: left;
  color: #fff;
}

.lb-overlay a.lb-close {
  font-size: 14px;
  line-height: 24px;
  position: absolute;
  z-index: 1001;
  top: 33px;
  left: 50%;
  overflow: hidden;
  width: 72px;
  height: 24px;
  margin-left: -25px;
  text-align: center;
  text-transform: uppercase;
  opacity: 0;
  color: #fff;
  border-radius: 2px;
  background: rgba(27, 54, 81, .8);
  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .3);
  filter: alpha(opacity=0);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)';
}

.lb-overlay img {
  position: relative;
  max-height: 100%;
  -webkit-transition: opacity .5s linear;
  -moz-transition: opacity .5s linear;
  -ms-transition: opacity .5s linear;
  -o-transition: opacity .5s linear;
  transition: opacity .5s linear;
  opacity: 0;
  -webkit-box-shadow: 1px 1px 4px rgba(0, 0, 0, .3);
  -moz-box-shadow: 1px 1px 4px rgba(0, 0, 0, .3);
  box-shadow: 0 2px 7px rgba(0, 0, 0, .2);
  filter: alpha(opacity=0);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)';
}

.lb-prev,
.lb-next {
  position: absolute;
  top: -32px;
  left: 50%;
  width: 24px;
  height: 25px;
  text-indent: -9000px;
  opacity: .8;
  filter: alpha(opacity=80);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=80)';
}

.lb-prev:hover,
.lb-next:hover {
  opacity: 1;
  filter: alpha(opacity=99);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=99)';
}

.lb-prev {
  margin-left: -30px;
  background: transparent url(img/single-portfolio/arrows.png) no-repeat top left;
}

.lb-next {
  margin-left: 6px;
  background: transparent url(img/single-portfolio/arrows.png) no-repeat top right;
}

.lb-overlay:target {
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  padding: 70px 100px 150px 100px;
}

.lb-overlay:target img,
.lb-overlay:target a.lb-close {
  opacity: 1;
  filter: alpha(opacity=99);
  -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=99)';
}

x:-o-prefocus,
.lb-overlay img {
  height: 100%;
}

.gallery-link {
  clear: both;
  padding: 30px 20px 30px;
}

.pager li > a {
  text-transform: uppercase;
  color: #bbb;
  border: 0;
  background-color: transparent;
}

.pager li > a:hover,
.pager li > a:focus {
  background-color: transparent;
}

.pager li > a:hover {
  color: #8a8787;
}

.portfolio-link {
  display: inline-block;
}

.portfolio-link a {
  font-size: 24px;
  line-height: 34px;
  vertical-align: middle;
  color: #bbb;
}


/*--------------------------------*/
/*  14. Blog Details Area
/*--------------------------------*/

.single-post-info {
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.post-full-image {
  position: relative;
  display: block;
}
.post-full-image iframe {
  display: block;
  width: 100%;
  height: 300px;
  border: none;
}

.post-full-image h2 {
  margin: 20px 0 10px 20px;
}

.post-datetime {
  font-weight: 700;
  line-height: 1;
  position: absolute;
  top: 20px;
  left: 20px;
  width: 60px;
  height: 60px;
  padding-top: 11px;
  text-align: center;
  color: #fff;
  background-color: #1fc0a0;
}

.post-datetime span {
  display: block;
}

.post-datetime .day {
  font-size: 20px;
  margin-bottom: 2px;
}

.post-datetime .month {
  font-size: 13px;
}

.post-inner {
  padding: 0 20px;
}

.post-icons {
  margin-bottom: 10px;
}

.single-post-box-one .post-icons,
.single-post-box-two .post-icons {
  text-align: left;
}

.post-icons a {
  font-size: 15px;
  margin-right: 20px;
  color: #2b2b2b;
}

.post-icons i {
  margin-right: 10px;
  color: #ccc;
}

.single-post-para {
  padding: 20px 0;
}

.single-post-para p {
  font-size: 15px;
  line-height: 26px;
}

.para-quote {
  font-weight: 600;
  position: relative;
  padding: 20px 10px 20px 48px;
  text-align: left;
}

.para-quote::before {
  font-family: 'fontawesome';
  font-size: 30px;
  position: absolute;
  top: 27px;
  left: 6px;
  content: '\f10d';
  color: #aaa;
}

.single-post-para p.list-heading {
  font-size: 18px;
  padding: 20px 0 5px;
  text-align: left;
  color: #444;
}

.post-list li {
  line-height: 26px;
  text-align: left;
}

.share-post {
  font-size: 16px;
  overflow: hidden;
  margin: 10px 0 40px;
  text-align: left;
}

.share-post p {
  float: left;
  margin-right: 15px;
}

.share-post a {
  font-size: 14px;
  display: inline-block;
  width: 30px;
  transition: .3s;
  color: #141e26;
}

.share-post a:hover {
  opacity: .5;
  filter: alpha(opacity=50);
}

.post-comments,
.leave-comments {
  text-align: left;
}

.leave-comments {
  margin-top: 40px;
  padding: 0 20px 40px;
}

.single-comment .leave-comments {
  padding: 0;
}

.post-comments h4,
.leave-comments h4 {
  font-size: 16px;
  font-weight: 700;
  display: block;
  margin-bottom: 25px;
  padding-bottom: 30px;
  text-transform: uppercase;
  border-bottom: 1px solid #eaeaea;
}

.post-comments ul.comment-list {
  padding-left: 15px;
  list-style: none;
}

.comment-list li.single-comment {
  margin-bottom: 22px;
  padding-bottom: 22px;
  border-bottom: 1px solid #ececec;
}

.profile-pic {
  float: left;
  width: 50px;
  height: 50px;
}

.single-comment .comment {
  font-weight: 300;
  line-height: 22px;
  padding-left: 70px;
}

.comment h4 {
  margin-bottom: 20px;
  padding-bottom: 0;
  border-bottom: 0;
}

.comment h4 a {
  text-transform: none;
  color: #141e26;
}

.comment h4 span {
  font-size: 13px;
  font-weight: 400;
  display: block;
  margin-top: 10px;
  text-transform: none;
  color: #a5a5a5;
}

.reply a {
  font-weight: 400;
  position: relative;
  margin-left: 20px;
  color: #1fc0a0;
}

.reply a::before {
  font-family: fontawesome;
  position: absolute;
  left: -20px;
  content: '\f112';
}

.reply a:hover {
  text-decoration: underline;
}

.leave-inputs input,
.leave-inputs textarea {
  width: 100%;
  margin-bottom: 18px;
  padding: 8px 12px;
  color: #999;
  border: 1px solid #eee;
}

.leave-inputs input:nth-child(3) {
  margin-bottom: 0;
}

.leave-inputs textarea {
  height: 100px;
  margin-bottom: 14px;
  resize: none;
}

.leave-inputs input[type='submit'] {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 0;
  padding: 9px 12px 7px;
  transition: .5s;
  text-transform: uppercase;
  color: #999;
  border: 1px solid #eee;
  background-color: #fff;
}

.leave-inputs input[type='submit']:hover {
  transition: .5s;
  color: #fff;
  background-color: #1fc0a0;
}

.leave-inputs span {
  display: block;
  margin-top: 5px;
  text-align: center;
}

.leave-inputs span a {
  font-weight: 600;
  color: #1fc0a0;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.fadeIn {
  animation-name: fadeIn;
}

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.back-btn a {
  font-size: 15px;
  font-weight: 700;
  padding-left: 25px;
  text-transform: uppercase;
  color: #141e26;
}

.back-btn a:hover {
  color: #ef4836;
}

.widget {
  margin-bottom: 30px;
  padding: 24px 20px;
  background-color: #fff;
  box-shadow: 0 1px 6px rgba(0, 0, 0, .12), 0 1px 4px rgba(0, 0, 0, .15);
}

.widget > .widget-title {
  font-size: 16px;
  font-weight: 700;
  margin-top: 0;
  margin-bottom: 15px;
  padding-bottom: 15px;
  text-transform: uppercase;
  color: #050d13;
  border-bottom: 1px solid #f2f2f2;
}

.widget .navbar-form {
  padding: 0;
}

.navbar-form .form-control {
  box-shadow: none;
}

.add-on .form-control:focus {
  border-color: #ccc;
  -webkit-box-shadow: none;
  box-shadow: none;
}

.recent-posts li.single-recent-post {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #f2f2f2;
}

.recent-posts li:last-of-type.single-recent-post {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0 solid #f2f2f2;
}

.single-recent-post .recent-post-img {
  margin-bottom: 20px;
}

.single-recent-post a {
  font-weight: 700;
  text-transform: uppercase;
  color: #050d13;
}

.single-recent-post a:hover,
.single-recent-post p a:hover {
  text-decoration: none;
  color: #1fc0a0;
}

.single-recent-post p a {
  font-size: 13px;
  font-weight: 400;
  text-transform: none;
  color: #a7a7a7;
}

.single-recent-post .recent-post-img img {
  width: 100%;
}

.single-recent-post p {
  margin-bottom: 0;
}

.widget > ul {
  margin-bottom: 0;
  padding: 0;
  list-style: none;
}

.widget > ul > li {
  display: block;
  margin-bottom: 10px;
}

.widget > ul > li > a {
  font-weight: 300;
  display: block;
  color: #818181;
}

.widget > ul > li > a:hover {
  text-decoration: underline;
  color: #1fc0a0;
}


/*----------------------------------------*/
/*  End css
/*----------------------------------------*/