@import url(https://fonts.googleapis.com/css?family=Raleway:400,500,300,600,700);

* {
  margin: 0;
  padding: 0;
  border: 0;
  outline: none;
}
html {
  min-height: 100%;
  position: relative;
}
body {
  background: #fff;
  color: #414141;
  font-family: 'Raleway', sans-serif, Arial, Verdana;
  font-size: 13px;
}
a {
  color: #2c313b;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
a:hover {
  text-decoration: none;
  color: #414141;
}
a:focus {
  outline: none;
}
.nolist {
  list-style: none;
}
.clearBoth {
  clear: both;
}
.space-bottom {
  margin-bottom: 45px;
}
.space-top {
  margin-top: 45px;
}
/* ============================ */
/* ======= TYPOGRAPHY ========= */
h1,
h2,
h3,
h4,
h5 {
  font-weight: 500;
  text-transform: uppercase;
}
h1,
h2,
h3 {
  margin: 0 0 25px 0;
}
h4,
h5 {
  margin: 0 0 15px 0;
}
.heading-block {
  margin-bottom: 48px;
  overflow: hidden;
}
.heading {
  font-size: 32px;
  font-weight: 400;
  line-height: 32px;
  text-transform: uppercase;
  border-left: 2px solid #414141;
  border-top: 2px solid #414141;
  display: inline-block;
  padding: 16px 20px 16px 16px;
  margin: 0 0 16px 0;
}
.subheading {
  font-size: 13px;
  font-weight: 400;
  line-height: 14px;
  color: #757575;
  margin: 0 0 16px 0;
  text-transform: none;
}
.pageheading {
  font-size: 48px;
  line-height: 48px;
  font-weight: 300;
  border-bottom: 1px solid #e6e6e6;
  margin: 0 0 45px 0;
  padding: 0 0 30px 0;
  text-transform: none;
}
.pageheading span {
  font-size: 36px;
  color: #bdbdbd;
  float: right;
}
.additional-info i {
  border: 2px solid #414141;
  font-size: 30px;
  display: inline-block;
  padding: 6px 0;
}
.additional-info i:hover {
  background: #414141;
  color: #fff;
}
.additional-info h2,
.additional-info h3 {
  text-transform: none;
  font-weight: 400;
}
.additional-info h2 {
  font-size: 28px;
}
.additional-info h2 strong {
  font-weight: 700;
}
.additional-info h3 {
  margin: 0 0 10px 0;
}
@media (max-width: 767px) {
  .heading {
    font-size: 24px;
  }
}
#content article p {
  color: #757575;
  line-height: 20px;
  margin: 0 0 25px 0;
}
#content article ul,
#content article ol {
  margin-left: 15px;
}
blockquote {
  font-size: 18px;
  font-style: italic;
  font-weight: 300;
  color: #414141;
  border: 0;
  padding: 0;
}
blockquote:before {
  content: "\7b";
  font-family: "ElegantIcons";
  color: #d1d1d1;
  position: relative;
  bottom: -10px;
  left: -5px;
}
blockquote:after {
  content: "\7b";
  font-family: "ElegantIcons";
  color: #d1d1d1;
  position: relative;
  top: -10px;
  right: -5px;
}
table {
  width: 100%;
}
table th {
  background: #f6f6f6;
}
table th,
table td {
  padding: 10px;
  border-bottom: 1px solid #f6f6f6;
}
/* ============================ */
/* ========= BUTTONS ========== */
.btn {
  border-radius: 0;
  font-size: 24px;
  font-weight: 400;
  color: #414141;
  padding: 5px 21px;
  text-transform: uppercase;
}
.btn.btn-default,
.btn.btn-primary {
  background: none;
  border: 2px solid #414141;
}
.btn.btn-default:hover,
.btn.btn-primary:hover {
  color: #f2f2f2;
  background: #414141;
}
.btn.btn-sm {
  font-size: 15px;
  padding: 10px 15px;
}
.btn.btn-lg {
  font-size: 36px;
}
/* ============================ */
/* ========= HEADER =========== */
.header {
  background: #fff;
  margin-bottom: 38px;
  overflow: hidden;
}
.header.menu-open .topbar-container {
  background: #fefefe;
  position: fixed;
  width: 100%;
}
.header .topbar-container {
  z-index: 9999;
  position: relative;
  -webkit-transition: opacity 1s ease;
  -moz-transition: opacity 1s ease;
  -o-transition: opacity 1s ease;
  transition: opacity 1s ease;
  opacity: 1;
  filter: alpha(opacity=100);
}
.header .topbar-container.start {
  opacity: 0;
  filter: alpha(opacity=0);
}
.topbar {
  border-bottom: 1px solid #e6e6e6;
  padding: 48px 0;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.topbar a.menu {
  font-size: 26px;
  display: inline-block;
  border: 2px solid #414141;
  float: left;
  margin: 8px 0 0 0;
  position: relative;
  z-index: 1;
}
.topbar a.menu i {
  display: block;
}
.topbar a.menu:hover {
  background: #414141;
  color: #f2f2f2;
}
.topbar a.menu.overlay-close {
  display: none;
}
.topbar .logo {
  position: absolute;
  width: 100%;
}
.topbar .logo a {
  border: 2px solid #414141;
  font-size: 24px;
  font-weight: 500;
  text-transform: uppercase;
  padding: 5px 15px 5px 18px;
  letter-spacing: 3px;
  display: inline-block;
}


@media (max-width: 450px) {
.topbar .logo a {
margin-left:80px !important;
  border: 2px solid #414141;
  font-size: 24px;
  font-weight: 500;
  text-transform: uppercase;
  padding: 2px 0px 2px 4px;

  display: inline-block;
}
}


.topbar .logo a:hover {
  background: #fff;
  color: #f2f2f2;
}
@media (max-width: 767px) {
  .topbar {
    padding: 30px 0;
  }
}
/* ============================ */
/* ========== CONTENT ========= */
#content section {
  padding-bottom: 48px;
  margin-bottom: 64px;
  border-bottom: 2px solid #eee;
  overflow: hidden;
  clear: both;
}
@media (max-width: 767px) {
  #content section {
    padding-bottom: 24px;
    margin-bottom: 32px;
  }
}
/* ============================ */
/* ========= FOOTER =========== */
.bottom {
  background: #eee;
  padding: 64px 0;
}
.bottom .contact-info {
  margin-bottom: 32px;
}
.bottom .contact-info li {
  display: inline;
  font-size: 16px;
  font-weight: 500;
  color: #757575;
  border-right: 2px solid #9b9b9b;
  padding: 0 10px;
}
.bottom .contact-info li:last-child {
  border-right: 0;
}
.bottom .contact-info li a {
  color: #757575;
}
.bottom .contact-info li a:hover {
  text-decoration: underline;
}
@media (max-width: 767px) {
  .bottom .contact-info li {
    display: block;
    border: 0;
  }
}
.bottom .social-icons {
  margin-bottom: 32px;
}
.bottom .social-icons a {
  border-color: #757575;
  color: #757575;
}
.bottom p.copy {
  color: #757575;
  margin: 0;
}
/*** sticky footer ***/
@media (min-width: 768px) {
  html,
  body {
    height: 100%;
  }
  .sticky {
    min-height: 100%;
    height: auto;
    margin-bottom: -272px;
  }
  .push {
    height: 272px;
  }
}
/* ============================ */
/* ========= SLIDER =========== */
.slider .txt {
  padding-left: 0;
  margin: 90px 0 0 0;
}
.slider .txt h1,
.slider .txt h2 {
  font-size: 38px;
  font-weight: 300;
  text-transform: uppercase;
  margin: 0 0 10px 0;
}
.slider .txt h1 span,
.slider .txt h2 span {
  font-weight: 500;
}
.slider .txt p {
  font-size: 15px;
  color: #757575;
  display: block;
  margin: 25px 0;
}
.slider .txt hr {
  width: 166px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 0 30px 0;
}
@media (max-width: 991px) {
  .slider .txt {
    margin-top: 50px;
  }
  .slider .txt h1,
  .slider .txt h2 {
    font-size: 30px;
  }
  .slider .txt p {
    font-size: 13px;
  }
}
@media (max-width: 767px) {
  .slider .txt {
    margin-top: 30px;
    margin-bottom: 30px;
    text-align: center;
  }
  .slider .txt hr {
    margin: 0 auto 30px auto;
  }
}
.slider .img {
  padding-right: 0;
}
.slider .img img {
  float: right;
}
/* ============================ */
/* ======= BOXES ICONS ======== */
.social-icons {
  position: relative;
  z-index: 1;
}
.social-icons a {
  display: inline-block;
  font-size: 12px;
  border: 2px solid #a4a3a3;
  color: #a4a3a3;
  padding: 7px;
  margin: 8px 0 0 7px;
}
.social-icons a.social1:hover {
  background: #484848;
  border-color: #232323;
}
.social-icons a.social2:hover {
  background: #cc2127;
  border-color: #cc2127;
}
.social-icons a.social3:hover {
  background: #ec5656;
  border-color: #ec5656;
}
.social-icons a.social4:hover {
  background: #3b5998;
  border-color: #3b5998;
}
.social-icons a.social5:hover {
  background: #28a9e2;
  border-color: #28a9e2;
}
.social-icons a:hover {
  color: #f2f2f2;
}
.social-icons a i {
  display: block;
}
.icon-box {
  border-left: 2px solid transparent;
  border-right: 2px solid transparent;
}
.icon-box:hover {
  border-color: #eee;
}
.icon-box:hover i {
  background: #414141;
  color: #f2f2f2;
}
.icon-box i {
  display: inline-block;
  border: 2px solid #414141;
  font-size: 30px;
  padding: 14px 16px;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.icon-box h3 {
  font-size: 17px;
  font-weight: 500;
  text-transform: uppercase;
  margin: 16px 0;
}
.icon-box h3 a {
  color: #414141;
}
.icon-box hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 16px auto;
}
.icon-box p {
  font-size: 13px;
  color: #757575;
  display: block;
  padding: 0 25px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .icon-box p {
    padding: 0;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .icon-box {
    margin-bottom: 20px;
  }
}
@media (max-width: 767px) {
  .icon-box {
    margin-bottom: 40px;
  }
}
/* ============================ */
/* ======== NEWSLETTER ======== */
.newsletter {
  margin-bottom: 64px;
  overflow: hidden;
}
.newsletter input[type="text"] {
  border: 2px solid #bdbdbd;
  width: 100%;
  color: #bdbdbd;
  font-size: 22px;
  padding: 14px 25px;
  text-transform: uppercase;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.newsletter input[type="text"]:focus {
  border-color: #414141;
  color: #414141;
}
@media (max-width: 767px) {
  .newsletter input[type="text"] {
    margin-bottom: 20px;
    font-size: 16px;
    text-align: center;
  }
}
.newsletter input[type="submit"] {
  border: 2px solid #bdbdbd;
  width: 100%;
  color: #bdbdbd;
  font-size: 20px;
  padding: 15.5px 0;
  text-align: center;
  text-transform: uppercase;
  background: none;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.newsletter input[type="submit"]:hover {
  border-color: #414141;
  background: #414141;
  color: #f2f2f2;
}








.newsletter select {
  border: 2px solid #bdbdbd;
  width: 100%;
  color: #bdbdbd;
  font-size: 22px;
  padding: 14px 25px;
  text-transform: uppercase;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.newsletter select:focus {
  border-color: #414141;
  color: #414141;
}
@media (max-width: 767px) {
  .newsletter select {
    margin-bottom: 20px;
    font-size: 16px;
    text-align: center;
  }
}
.newsletter select {
  border: 2px solid #bdbdbd;
  width: 100%;
  color: #bdbdbd;
  font-size: 20px;
  padding: 15.5px 0;
  text-align: center;
  text-transform: uppercase;
  background: none;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.newsletter select:hover {
  border-color: #414141;
  background: #414141;
  color: #f2f2f2;
}





/* ============================ */
/* ======== PORTFOLIO ========= */
.portfolio .item {
  margin-bottom: 30px;
}
.portfolio .item .item-wrapper {
  position: relative;
  overflow: hidden;
}
.portfolio .item .item-wrapper:hover .mask {
  left: 0;
  transform: translateX(0px);
}
.portfolio .item .item-wrapper .label {
  color: #414141;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  background: #fff;
  padding: 25px 20px;
  position: absolute;
  top: 0;
  right: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.portfolio .item .mask {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: #fff;
  text-align: center;
  padding-top: 96px;
  transform: translateX(-100%);
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.portfolio .item .mask h4 {
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 0 20px 0;
}
.portfolio .item .mask h4 a {
  color: #414141;
}
.portfolio .item .mask h4 a:hover {
  color: #757575;
}
.portfolio .item .mask hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 16px auto;
}
.portfolio .item .mask p {
  font-size: 13px;
  color: #757575;
  padding: 0 165px;
  margin: 0 0 16px 0;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .portfolio .item .mask p {
    padding: 0;
  }
}
.portfolio .item .mask a.btn {
  margin: 0 8px;
}
@media (max-width: 991px) {
  .portfolio .item .mask {
    padding-top: 40px;
  }
  .portfolio .item .mask p {
    padding: 0;
  }
}
.portfolio .item.col-md-4 .mask {
  padding-top: 60px;
}
.portfolio .item.col-md-4 .mask h4 {
  font-size: 16px;
}
.portfolio .item.col-md-4 .mask p {
  font-size: 12px;
  color: #7a7a7a;
  padding: 0 75px;
  margin: 0 0 25px 0;
}
.portfolio .item.col-md-4 .mask .btn.btn-sm {
  font-size: 13px;
  padding: 10px;
}
.portfolio .item.col-md-3 .mask {
  padding-top: 30px;
}
.portfolio .item.col-md-3 .mask h4 {
  font-size: 16px;
  margin: 0 0 10px 0;
}
.portfolio .item.col-md-3 .mask hr {
  margin-bottom: 5px;
}
.portfolio .item.col-md-3 .mask p {
  font-size: 12px;
  color: #7a7a7a;
  padding: 0 30px;
  margin: 0 0 25px 0;
}
.portfolio .item.col-md-3 .mask .btn.btn-sm {
  font-size: 12px;
  padding: 7px;
}
.loader-container {
  text-align: center;
  margin: 60px 0 42px 0;
}
.loader-container span {
  display: inline-block;
  font-size: 18px;
  font-weight: 500;
  text-transform: uppercase;
  padding-left: 60px;
}
@media (max-width: 767px) {
  .loader-container span {
    font-size: 15px;
  }
}
.loader-portfolio {
  font-size: 8px;
  display: inline-block;
  margin: 5em auto;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  text-indent: -9999em;
  -webkit-animation: load4 1.3s infinite linear;
  animation: load4 1.3s infinite linear;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
@-webkit-keyframes load4 {
  0%,
  100% {
    box-shadow: 0em -3em 0em 0.2em #414141, 2em -2em 0 0em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 0em #414141;
  }
  12.5% {
    box-shadow: 0em -3em 0em 0em #414141, 2em -2em 0 0.2em #414141, 3em 0em 0 0em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  25% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 0em #414141, 3em 0em 0 0.2em #414141, 2em 2em 0 0em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  37.5% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 0em #414141, 2em 2em 0 0.2em #414141, 0em 3em 0 0em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  50% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 0em #414141, 0em 3em 0 0.2em #414141, -2em 2em 0 0em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  62.5% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 0em #414141, -2em 2em 0 0.2em #414141, -3em 0em 0 0em #414141, -2em -2em 0 -0.5em #414141;
  }
  75% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 0em #414141, -3em 0em 0 0.2em #414141, -2em -2em 0 0em #414141;
  }
  87.5% {
    box-shadow: 0em -3em 0em 0em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 0em #414141, -3em 0em 0 0em #414141, -2em -2em 0 0.2em #414141;
  }
}
@keyframes load4 {
  0%,
  100% {
    box-shadow: 0em -3em 0em 0.2em #414141, 2em -2em 0 0em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 0em #414141;
  }
  12.5% {
    box-shadow: 0em -3em 0em 0em #414141, 2em -2em 0 0.2em #414141, 3em 0em 0 0em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  25% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 0em #414141, 3em 0em 0 0.2em #414141, 2em 2em 0 0em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  37.5% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 0em #414141, 2em 2em 0 0.2em #414141, 0em 3em 0 0em #414141, -2em 2em 0 -0.5em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  50% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 0em #414141, 0em 3em 0 0.2em #414141, -2em 2em 0 0em #414141, -3em 0em 0 -0.5em #414141, -2em -2em 0 -0.5em #414141;
  }
  62.5% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 0em #414141, -2em 2em 0 0.2em #414141, -3em 0em 0 0em #414141, -2em -2em 0 -0.5em #414141;
  }
  75% {
    box-shadow: 0em -3em 0em -0.5em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 0em #414141, -3em 0em 0 0.2em #414141, -2em -2em 0 0em #414141;
  }
  87.5% {
    box-shadow: 0em -3em 0em 0em #414141, 2em -2em 0 -0.5em #414141, 3em 0em 0 -0.5em #414141, 2em 2em 0 -0.5em #414141, 0em 3em 0 -0.5em #414141, -2em 2em 0 0em #414141, -3em 0em 0 0em #414141, -2em -2em 0 0.2em #414141;
  }
}
.single-portfolio .main-foto {
  margin-bottom: 50px;
}
.single-portfolio .full-foto {
  margin-bottom: 30px;
}
.single-portfolio .grid-item {
  text-align: center;
  margin-bottom: 90px;
}
.single-portfolio .grid-item img {
  margin-bottom: 30px;
}
.single-portfolio .grid-item h4 {
  font-weight: 500;
  margin: 0 0 20px 0;
  text-transform: none;
}
.single-portfolio .grid-item h4 a {
  color: #414141;
}
.single-portfolio .grid-item h4 a:hover {
  color: #757575;
}
.single-portfolio .grid-item hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 16px auto;
}
.single-portfolio .grid-item p {
  display: block;
  font-size: 13px;
  color: #757575;
  margin: 0 0 16px 0;
  padding: 0 50px;
}
.single-portfolio ul.details li {
  overflow: hidden;
  margin: 0 0 38px 0;
}
.single-portfolio ul.details li i {
  border: 2px solid #414141;
  padding: 11px 16px;
  margin: 0 15px 0 0;
  font-size: 30px;
}
.single-portfolio ul.details li time {
  font-size: 18px;
  font-weight: 500;
}
.single-portfolio ul.details li time,
.single-portfolio ul.details li h4 {
  margin: 0 0 8px 0;
}
.single-portfolio ul.details li hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 0 8px 0;
}
.single-portfolio ul.details li span {
  font-size: 13px;
  color: #7a7a7a;
}
.single-portfolio .social-icons h3 {
  text-transform: none;
}
.single-portfolio .social-icons a {
  color: #414141;
  border-color: #414141;
  margin: 0 5px 0 0;
}
.single-portfolio .social-icons a:hover {
  color: #fff;
}
@media (max-width: 991px) {
  .social-icons {
    margin-bottom: 40px;
  }
}
.single-gallery {
  margin-bottom: 60px;
}
.single-gallery img {
  margin: 0 14px;
  float: left;
}
@media (min-width: 768px) and (max-width: 1199px) {
  .single-gallery img {
    margin: 0 2%;
    width: 46%;
  }
}
@media (max-width: 767px) {
  .single-gallery img {
    margin: 0 0 20px 0;
  }
}
.quotes {
  border: 2px solid #414141;
  text-align: center;
  padding: 30px 15px 10px 15px;
}
.quotes h3 {
  text-transform: none;
  margin: 0 0 15px 0;
}
.nav {
  margin: -50px 0 45px 0;
}
.nav a {
  color: #adadad;
}
.nav a:hover {
  color: #7a7a7a;
}
@media (max-width: 767px) {
  .nav {
    margin: 0 0 40px 0;
  }
}
.portfolio-fullscreen .header {
  background: url(../images/elements/folio-full.jpg) no-repeat top left;
  background-size: cover;
  position: relative;
  margin-bottom: 0;
}
.portfolio-fullscreen .topbar-container {
  background: rgba(255, 255, 255, 0.8);
}
.portfolio-fullscreen #content {
  background: #fff;
  position: relative;
  padding-top: 64px;
}
/* ============================ */
/* ========= OVERLAY ========== */
.overlay {
  position: fixed;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: rgba(254, 254, 254, 0.95);
  z-index: 995;
}
.overlay nav {
  text-align: center;
  position: relative;
  top: 50%;
  width: 100%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
}
.overlay ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
  display: inline-block;
  height: 100%;
  position: relative;
}
.overlay ul li {
  float: left;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  margin: 0 12px;
  position: relative;

}
.overlay ul li a {
  font-size: 22px;
  font-weight: 400;
  display: block;
  color: #1b1919;
  text-transform: lowercase;
  border: 2px solid transparent;
  padding: 3px 15px;
  z-index: 9999;
}
.overlay ul li a:hover,
.overlay ul li a:focus,
.overlay ul li a.active {
  border-color: #1b1919;
  text-decoration: none;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .overlay ul li a {
    font-size: 22px;
  }
}
.overlay ul li ul {
  position: absolute;
  left: -18%;
  top: 32px;
  display: none;
  width:130%;

}

@media (max-width: 1011px) {
.overlay ul li ul {
  position: absolute;
  
  top: 32px;

  width:100%;

}
}



.overlay ul li ul:before {
  content: "\33";
  font-family: "ElegantIcons";
  font-size: 36px;
}
.overlay ul li ul li {
  float: none;
  display: block;
}
.overlay ul li ul li a {
  font-size: 16px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .overlay ul li ul li a {
    font-size: 18px;
  }
}
.overlay p.copy {
  position: absolute;
  bottom: 40px;
  font-size: 15px;
  color: #757575;
  width: 100%;
  text-align: center;
  margin: 0;
}
@media (max-width: 991px) {
  .overlay nav {
    top: 50%;
    overflow-x: hidden;
    overflow-y: scroll;
  }
  .overlay ul li {
    float: none;
  }
  .overlay ul li.active ul {
    height: 100%;
  }
  .overlay ul li ul {
    position: static;
    height: 0;
  }
  .overlay ul li ul li a {
    font-size: 14px;
  }
}
.overlay-door {
  visibility: hidden;
  width: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  -webkit-transition: width 0.5s 0.3s, visibility 0s 0.8s;
  transition: width 0.5s 0.3s, visibility 0s 0.8s;
}
.overlay-door.open {
  visibility: visible;
  width: 100%;
  -webkit-transition: width 0.5s;
  transition: width 0.5s;
}
.overlay-door nav {
  position: absolute;
  left: 50%;
  -webkit-transform: translateY(-50%) translateX(-50%);
  transform: translateY(-50%) translateX(-50%);
}
.overlay-door nav,
.overlay-door p.copy {
  opacity: 0;
  -webkit-transition: opacity 0.3s 0.5s;
  transition: opacity 0.3s 0.5s;
}
.overlay-door.open nav,
.overlay-door.open p.copy {
  opacity: 1;
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
.overlay-door.close-door nav,
.overlay-door.close-door p.copy {
  -webkit-transition-delay: 0s;
  transition-delay: 0s;
}
/* ============================ */
/* ========= LOADER =========== */
.loader {
  width: 100%;
  height: 100%;
  background-color: #fff;
  z-index: 9999;
  position: fixed;
  text-align: center;
}
.loader .spinner {
  width: 100%;
  height: 150px;
  position: absolute;
  top: 40%;
  margin: 0 auto;
  left: 0;
  right: 0;

  background-image: url('../images/logo.png');
   background-repeat: no-repeat;
    background-attachment: fixed;
    background-position: center; 
  -webkit-animation: rotateplane 1.2s infinite ease-in-out;
  animation: rotateplane 1.2s infinite ease-in-out;
}
@-webkit-keyframes rotateplane {
  0% {
    -webkit-transform: perspective(120px);
  }
  50% {
    -webkit-transform: perspective(120px) rotateY(180deg);
  }
  100% {
    -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg);
  }
}
@keyframes rotateplane {
  0% {
    transform: perspective(200px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(200px) rotateX(0deg) rotateX(0deg);
  }
  50% {
    transform: perspective(200px) rotateY(-10.1deg) rotateX(0deg);
    -webkit-transform: perspective(200px) rotateY(-10.1deg) rotateX(0deg);
  }
  100% {
    transform: perspective(200px) rotateY(10deg) rotateX(0deg);
    -webkit-transform: perspective(200px) rotateY(10deg) rotateX(0deg);
  }
}
/* ============================ */
/* ======== HOMEPAGE ========== */
.home .header {
  background: #eee;
  margin-bottom: 0;
  position: relative;
}
.home .header.header-black {
  background: #000;
}
.home .header.header-black .topbar .logo a,
.home .header.header-black .topbar a.overlay-menu {
  color: #fff;
  border-color: #fff;
}
.home .header.header-black .social-icons a {
  color: #fff;
  border-color: #fff;
}
.home .topbar {
  border-bottom: 2px solid #e0e0e0;
}
.home .social-icons a {
  border-color: #414141;
  color: #414141;
}
.home .social-icons a:hover {
  color: #f2f2f2;
}
.home #content {
  padding-top: 64px;
  position: relative;
  background: #fff;
}
/* ============================ */
/* ========== TEAM ============ */
.team {
  text-align: center;
  margin-bottom: 20px;
  overflow: hidden;
}
.team .owl-item .person {
  width: 100%;
}
.team .person {
  position: relative;
  overflow: hidden;
}
.team .person:hover .mask {
  left: 0;
  transform: translateX(0px);
}
.team .person .mask {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: rgba(255,255,255,0.9);
  text-align: center;
  padding-top: 96px;
  transform: translateX(-100%);
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}
.team .person .mask h4 {
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 0 20px 0;
}
.team .person .mask hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 16px auto;
}
.team .person .mask a {
  display: inline-block;
  border: 2px solid #414141;
  margin: 0 3px;
}
.team .person .mask a:hover {
  background: #414141;
  color: #fff;
}
.team img {
  margin-bottom: 25px;
}
.team h4 {
  font-weight: 500;
  text-transform: uppercase;
  margin: 0 0 10px 0;
}
.team h4 a {
  color: #414141;
}
.team hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 10px auto;
}
.team p {
  color: #757575;
  margin: 0 0 20px 0;
}
.team .owl-dots {
  display: block;
  text-align: center;
}
.team .owl-dots .owl-dot {
  display: inline-block;
}
.team .owl-dots .owl-dot.active span {
  background: #757575;
}
.team .owl-dots .owl-dot span {
  display: block;
  width: 15px;
  height: 15px;
  background: #414141;
  margin: 0 3px;
}
.team .owl-dots .owl-dot span:hover {
  background: #757575;
}
/* ============================ */
/* ======== SKILLBAR ========== */
.skillbar {
  position: relative;
  margin-bottom: 20px;
}
.skillbar .skillbar-title {
  display: block;
  text-transform: uppercase;
  color: #757575;
  margin: 0 0 10px 0;
}
.skillbar .skillbar-container {
  border: 2px solid #e1e1e1;
  padding: 6px 7px;
  position: relative;
}
.skillbar .skillbar-bar {
  height: 2px;
  width: 0;
  background: #414141;
}
.skillbar .skill-bar-percent {
  position: absolute;
  top: -36px;
  right: 0;
  background: #fff;
  padding: 5px;
}
/* ============================ */
/* ========= COUNTER ========== */
.counter {
  position: relative;
  overflow: hidden;
}
.counter.button-margin {
  margin-bottom: 40px;
}
.counter .counter-line {
  border-top: 2px solid #414141;
  content: "";
  display: block;
  height: 1px;
  position: absolute;
  top: 21%;
  left: 15px;
  width: 80%;
  z-index: 0;
}
.counter ul {
  overflow: hidden;
}
.counter li {
  text-align: center;
}
.counter li i {
  display: block;
  border: 2px solid #414141;
  font-size: 30px;
  background: #fff;
  position: relative;
  z-index: 1;
  margin: 0 -5px 20px -5px;
  padding: 11px 0;
}
.counter li span {
  margin: 0 -15px 10px -15px;
  display: block;
}
.counter li span.number {
  font-size: 18px;
  font-weight: 500;
}
.counter li span.title {
  text-transform: uppercase;
}
.counter li hr {
  width: 28px;
  border-width: 2px 0 0;
  border-color: #e0e0e0;
  margin: 0 auto 10px auto;
}
@media (min-width: 768px) and (max-width: 991px) {
  .counter li i {
    margin: 0 0 20px 0;
  }
}
@media (max-width: 767px) {
  .counter ul {
    border-bottom: 2px solid #e0e0e0;
  }
  .counter li {
    margin: 0 0 20px 0;
  }
  .counter li i {
    display: inline-block;
    margin: 0 0 20px 0;
    padding: 10px;
  }
  .counter .counter-line {
    display: none;
  }
}
/* ============================ */
/* ========= CONTACT ========== */
.page-contact .pageheading {
  margin-bottom: 60px;
}
.page-contact .desc .cover {
  margin-bottom: 25px;
  position: relative;
}
.page-contact .desc .cover:before {
  border-bottom: 8px solid #fff;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  content: " ";
  height: 0;
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
}
.page-contact .desc h2 {
  font-size: 32px;
  text-transform: none;
  margin: 0 0 10px 0;
}
.page-contact .desc p {
  font-size: 16px;
  color: #676767;
  line-height: 30px;
}
.page-contact .desc p small {
  font-size: 13px;
  color: #898989;
}
.page-contact .contact-form h3 {
  margin-bottom: 40px;
}
.page-contact .contact-form input,
.page-contact .contact-form textarea {
  display: block;
  width: 100%;
  margin: 0 0 12px 0;
  padding: 8px 15px;
  border: 2px solid #d7d7d7;
  font-size: 15px;
  font-weight: 400;
  text-transform: uppercase;
  color: #7a7a7a;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.page-contact .contact-form input:focus,
.page-contact .contact-form textarea:focus {
  border-color: #8f8f8f;
}
.page-contact .contact-form textarea {
  height: 150px;
  max-height: 150px;
  max-width: 100%;
}
.page-contact .contact-form .btn.btn-default {
  font-size: 15px;
  font-weight: 600;
  color: #707070;
  border-color: #8f8f8f;
  min-width: 140px;
  padding: 10px;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.page-contact .contact-form .btn.btn-default:hover {
  background: #414141;
  border-color: #414141;
  color: #fff;
}
.page-contact .company-info h3 {
  margin-bottom: 40px;
}
.page-contact .company-info h4 {
  font-weight: 700;
  margin-bottom: 25px;
}
.page-contact .company-info .address,
.page-contact .company-info .address p {
  font-size: 15px;
  font-weight: 400;
  color: #7a7a7a;
}
.page-contact .company-info i {
  display: block;
  border: 2px solid #8f8f8f;
  color: #8f8f8f;
  width: 30px;
  font-size: 16px;
  text-align: center;
  padding: 5px;
  margin: 0 0 15px 0;
}
.page-contact .company-info i.icon_mail_alt:before {
  position: relative;
  top: -2px;
}
.page-contact .company-info i:hover {
  background: #414141;
  border-color: #414141;
  color: #fff;
}
.page-contact .company-info p {
  font-size: 18px;
  font-weight: 500;
  margin: 0 0 30px 0;
}
.page-contact .company-info p span {
  font-size: 13px;
  font-weight: 400;
  display: block;
  margin: 0 0 15px 0;
}
.page-contact .company-info p a:hover {
  text-decoration: underline;
}
@media (min-width: 768px) and (max-width: 991px) {
  .page-contact .desc {
    margin-bottom: 40px;
  }
}
@media (max-width: 767px) {
  .page-contact .desc,
  .page-contact .contact-form,
  .page-contact .company-info {
    margin-bottom: 40px;
  }
}
/* ============================ */
/* ===== COMPANIES LOGO ======= */
ul.companies li {
  margin-bottom: 20px;
}
ul.companies li a {
  display: block;
}
ul.companies li a:hover img {
  opacity: 1;
  filter: alpha(opacity=100);
}
ul.companies li a img {
  opacity: 0.6;
  filter: alpha(opacity=30);
  -webkit-transition: opacity 0.4s ease;
  -moz-transition: opacity 0.4s ease;
  -o-transition: opacity 0.4s ease;
  transition: opacity 0.4s ease;
}
/* ============================ */
/* ======== PRICE TABLE ======= */
.price-table {
  margin-bottom: 16px;
}
.price-table .price-table-inner {
  border: 2px solid #414141;
  padding: 30px;
  -webkit-transition: border-color 0.4s ease;
  -moz-transition: border-color 0.4s ease;
  -o-transition: border-color 0.4s ease;
  transition: border-color 0.4s ease;
}
.price-table .price-table-inner:hover {
  border-color: rgba(65, 65, 65, 0.3);
}
.price-table i.main-icon {
  display: inline-block;
  border: 2px solid #414141;
  font-size: 30px;
  margin: 0 0 25px 0;
  padding: 11px 16px;
}
.price-table i.separator {
  color: #e6e6e6;
  font-size: 20px;
}
.price-table hr {
  border: 1px solid #e0e0e0;
  margin: 0 auto 8px auto;
  width: 28px;
}
.price-table p,
.price-table ul li {
  color: #7a7a7a;
}
.price-table ul {
  margin-bottom: 20px;
}
.price-table ul li {
  display: block;
  color: #444;
  font-size: 15px;
  border-bottom: 1px solid #e6e6e6;
  padding: 12px 0;
}
.price-table ul li:last-child {
  border-bottom: 0;
}
.price-table ul li:nth-of-type(even) {
  background: #f6f6f6;
}
.price-table .btn.btn-default {
  border-color: #bbb;
  color: #444;
  font-size: 15px;
  display: block;
  padding: 9px 10px;
}
.price-table .btn.btn-default:hover {
  border-color: #414141;
  color: #fff;
}
/* ============================ */
/* ========== TIMELINE ======== */
.timeline {
  position: relative;
  width: 100%;
  float: left;
  padding: 170px 0;
}
.timeline:before {
  border-top: 2px solid #d8d8d8;
  width: 100%;
  left: 0;
  top: 50%;
  position: absolute;
  content: "";
}
.timeline .timeline-item {
  text-align: center;
  position: relative;
}
.timeline .timeline-item:before {
  border-top: 2px solid #414141;
  width: 100%;
  left: 0;
  top: 50%;
  position: absolute;
  content: "";
}
.timeline .timeline-item:after {
  content: "\35";
  font-family: "ElegantIcons";
  font-size: 30px;
  text-align: right;
  position: absolute;
  right: -15px;
  top: -4px;
}
.timeline .timeline-item:nth-of-type(1):before {
  width: 50%;
  left: 50%;
}
.timeline .timeline-item:nth-last-of-type(1):before {
  width: 50%;
}
.timeline .timeline-item:nth-last-of-type(1):after {
  content: "";
}
.timeline .timeline-point {
  border: 2px solid #414141;
  background: #fff;
  font-size: 24px;
  font-weight: 500;
  padding: 18px 19px;
  position: relative;
  z-index: 2;
  cursor: pointer;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.timeline .timeline-point:hover {
  background: #414141;
  color: #fff;
}
.timeline .timeline-cloud-wrapper {
  position: absolute;
  left: 30%;
}
.timeline .timeline-cloud-wrapper.top-cloud {
  top: -170px;
  padding-bottom: 40px;
}
.timeline .timeline-cloud-wrapper.bottom-cloud {
  bottom: -170px;
  padding-top: 40px;
}
.timeline .timeline-cloud-wrapper:before {
  border-left: 2px solid #d8d8d8;
  height: 100%;
  left: 40px;
  top: 0;
  position: absolute;
  content: "";
}
@media (min-width: 768px) and (max-width: 991px) {
  .timeline .timeline-cloud-wrapper {
    left: 15%;
  }
}
.timeline .timeline-cloud {
  border: 2px solid #d8d8d8;
  background: #fff;
  font-weight: 500;
  text-align: left;
  padding: 5px 15px 15px 15px;
  position: relative;
  z-index: 2;
  -webkit-transition: all 0.4s ease;
  -moz-transition: all 0.4s ease;
  -o-transition: all 0.4s ease;
  transition: all 0.4s ease;
}
.timeline .timeline-cloud.active {
  border-color: #414141;
}
.timeline .timeline-cloud span {
  font-size: 38px;
  color: #d8d8d8;
  display: block;
}
.timeline .timeline-cloud p {
  font-size: 18px;
  margin: 0;
  line-height: 20px;
  display: block;
  height: 40px;
}
@media (max-width: 767px) {
  .timeline {
    padding: 0;
  }
  .timeline:before {
    border: 0;
  }
  .timeline .timeline-item {
    padding-top: 40px;
    padding-bottom: 0px;
  }
  .timeline .timeline-item:before,
  .timeline .timeline-item:after {
    content: "";
    border: 0;
  }
  .timeline .timeline-item .timeline-point {
    display: inline-block;
  }
  .timeline .timeline-item .timeline-cloud-wrapper {
    position: static;
    padding: 0;
    margin: 10px 0 0 0;
  }
}
/* ============================ */
/* ========== ELEMENTS ======== */
.alert {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.alert ol {
  margin-left: 15px;
}
.label {
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  border-radius: 0;
}
.label.margin-r {
  margin-right: 5px;
}
.nav-tabs > li > a {
  border-radius: 0;
  text-transform: uppercase;
}
.tab-content p {
  line-height: 22px;
}
.panel-group .panel {
  border-radius: 0;
  box-shadow: none;
}
.panel-group .panel-heading {
  border-radius: 0;
}
/* ============================ */
/* ============= 404 ========== */
.notfound i {
  font-size: 40px;
  margin: 11px 8px 20px 0;
  float: left;
}
.notfound h2 {
  text-transform: none;
}