/*

[Main Stylesheet]

Project     : JD - Responsive Personal vCard / CV / Resume Template
Version     : 1.0
Author      : ThemeLooks
Author URI  : https://themeforest.net/user/themelooks


NOTE:
------
PLEASE DO NOT EDIT THIS CSS, YOU MAY NEED TO USE "custom.css" FILE FOR WRITING YOUR CUSTOM CSS.
WE MAY RELEASE FUTURE UPDATES SO IT WILL OVERWRITE THIS FILE. IT'S BETTER AND SAFER TO USE "custom.css".


[TABLE OF CONTENTS]

1. GENERAL STYLES
    1.1. HEADINGS
    1.2. LINKS
    1.3. NAV LINKS
    1.4. BUTTONS
    1.5. FORM CONTROLS
    1.6. ALERT

2. HELPER CLASSES
    2.1. FLOATS
    2.2. OVERFLOWS
    2.3. PADDINGS
    2.4. TEXT COLORS
    2.5. BACKGROUND IMAGE
    2.6. BACKGROUND OVERLAY
    2.7. BACKGROUND COLORS
    2.8. FONTS
    2.9. VERTICAL CENTERING

3. COMPONENTS
    3.1. PRELOADER
    3.2. SECTION TITLE
    3.3. PAGE BREADCRUMB
    3.4. OWL DOTS
    3.5. PORTFOLIO FILTER MENU
    3.6. PAGINATION NAV
    3.7. BACK TO TOP

4. WIDGETS
    4.1. WIDGET TITLE
    4.2. SEARCH WIDGET
    4.3. NEWSLETTER WIDGET
    4.4. LINKS WIDGET
    4.5. TAGS WIDGET

5. BLOCKS
    5.1. ABOUT BLOCK
    5.2. SERVICE BLOCK
    5.3. TIMELINE BLOCK
    5.4. CONTACT INFO BLOCK
    5.5. CONTACT FORM
    5.6. COMMENT BLOCK
    5.7. CALL TO ACTION BLOCK

6. ITEMS
    6.1. PORTFOLIO ITEMS
    6.2. TIMELINE ITEMS
    6.3. SKILLS ITEMS
    6.4. PRICING ITEM
    6.5. TEAM MEMBER ITEM
    6.6. POST ITEM
    6.7. TESTIMONIAL ITEM
    6.8. COMMENT ITEMS

7. HEADER SECTION
    7.1. HEADER NAVBAR
    7.2. HEADER NAV LINKS

8. BANNER SECTION
    8.1. BANNER CONENT

9. FOOTER SECTION
    9.1. FOOTER SOCIAL
    9.2. COPYRIGHT TEXT

10. 404 SECTION
    10.1. 404 CONTENT

11. COMING SOON SECTION
    11.1. COMING SOON CONTENT

*/
/*------------------------------------*\
    1. GENERAL STYLES
\*------------------------------------*/
html {
  height: 100%; }

body {
  height: 100%;
  color: #878787;
  font-family: "Roboto", sans-serif;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  word-wrap: break-word;
  background: #181818; }

p:last-child {
  /* RESET MARGIN OF LAST P TAG */
  margin-bottom: 0; }

ul:last-child {
  margin-bottom: 0; }

img,
.nav > li > a > img {
  /* RESPONSIVE IMAGES */
  max-width: 100%;
  height: auto; }

p:last-child > img {
  margin-bottom: 15px; }

::-moz-selection,
::selection {
  color: #fff;
  background-color: #ffd430; }

.del {
  text-decoration: line-through; }

.table:last-child {
  margin-bottom: 0; }

.wrapper {
  height: 100%; }

/* 1.1. HEADINGS */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  color: #f4f4f4;
  font-family: "Roboto Condensed", sans-serif; }

h1,
h2,
h3,
.h1,
.h2,
.h3 {
  font-weight: 700; }

h4,
h5,
h6,
.h4,
.h5,
.h6 {
  font-weight: 600; }

.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  margin-top: 0;
  margin-bottom: 0; }

h5,
.h5 {
  font-size: 16px; }

h6,
.h6 {
  font-size: 14px; }

h1,
.h1 {
  line-height: 46px; }

h2,
.h2 {
  line-height: 40px; }

h3,
.h3 {
  line-height: 34px; }

h4,
.h4 {
  line-height: 28px; }

h5,
.h5 {
  line-height: 26px; }

h6,
.h6 {
  line-height: 24px; }

/* 1.2. LINKS */
a,
.btn-link {
  -webkit-transition-property: color, border-color, background-color, box-shadow;
  transition-property: color, border-color, background-color, box-shadow;
  -webkit-transition-duration: .35s;
  transition-duration: .35s;
  -webkit-transition-timing-function: ease, ease, ease-in-out, ease-in-out;
  transition-timing-function: ease, ease, ease-in-out, ease-in-out; }

a,
.btn-link,
a:link,
.btn-link:link,
a:visited,
.btn-link:visited,
a:hover,
.btn-link:hover,
a:focus,
.btn-link:focus,
a:active,
.btn-link:active {
  /* RESET TEXT DECORATION AND OUTLINE */
  text-decoration: none;
  outline: 0; }

a {
  color: #ffd430; }
  a:hover, a:focus {
    color: #ffd430; }

.btn-link {
  display: inline-block;
  color: inherit;
  font-weight: inherit; }
  .btn-link:hover, .btn-link:focus, .btn-link.active {
    color: #ffd430; }

/* 1.3. NAV LINKS */
.nav li a:hover, .nav li a:focus {
  background-color: transparent;
  /* RESET NAV HOVER AND FOCUS BACKGROUND COLOR */ }

.nav li.open > a {
  background-color: transparent;
  /* RESET NAV HOVER AND FOCUS BACKGROUND COLOR */ }
  .nav li.open > a:hover, .nav li.open > a:focus {
    background-color: transparent;
    /* RESET NAV HOVER AND FOCUS BACKGROUND COLOR */ }

.nav li a {
  color: inherit; }
  .nav li a:focus {
    color: inherit; }

.nav li.active > a:focus,
.nav li.open > a:focus {
  color: inherit; }

.nav li a:hover {
  color: #ffd430; }

.nav li.active > a {
  color: #ffd430; }
  .nav li.active > a:hover, .nav li.active > a:focus {
    color: #ffd430; }

.nav li.open > a {
  color: #ffd430; }
  .nav li.open > a:hover, .nav li.open > a:focus {
    color: #ffd430; }

.nav > li {
  float: left; }
  .nav > li > a {
    display: inline-block; }

/* 1.4. BUTTONS */
.btn {
  position: relative;
  padding: 7px 30px 6px;
  border-radius: 0;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 15px;
  line-height: 25px;
  -webkit-transition-property: color, border-color, background-color;
  transition-property: color, border-color, background-color;
  -webkit-transition-duration: .35s;
  transition-duration: .35s;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  text-transform: uppercase;
  z-index: 0; }
  .btn.active, .btn:active {
    box-shadow: none;
    /* RESET BUTTON BOX SHADOW */ }
  .btn:focus, .btn.focus {
    outline: 0;
    /* RESET BUTTON OUTLINE */ }
  .btn.active.focus, .btn.active:focus {
    outline: 0;
    /* RESET BUTTON OUTLINE */ }
  .btn:active.focus, .btn:active:focus {
    outline: 0;
    /* RESET BUTTON OUTLINE */ }
  .btn.focus {
    outline: 0;
    /* RESET BUTTON OUTLINE */ }
  .btn:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-transition: -webkit-transform .35s ease-in-out;
    transition: -webkit-transform .35s ease-in-out;
    transition: transform .35s ease-in-out;
    transition: transform .35s ease-in-out, -webkit-transform .35s ease-in-out;
    z-index: -1; }
  .btn:hover:before, .btn:focus:before, .btn.active:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1); }

.btn-default {
  color: #ffd430;
  background-color: transparent;
  border-color: #ffd430; }
  .btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus {
    color: #ffd430;
    background-color: transparent;
    border-color: #ffd430; }
  .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus {
    color: #ffd430;
    background-color: transparent;
    border-color: #ffd430; }
  .btn-default:before {
    background-color: #ffd430; }
  .btn-default:hover, .btn-default:focus, .btn-default.focus {
    color: #fff;
    background-color: transparent;
    border-color: #ffd430; }
  .btn-default:active {
    color: #fff;
    background-color: transparent;
    border-color: #ffd430; }
    .btn-default:active:hover, .btn-default:active:focus, .btn-default:active.focus {
      color: #fff;
      background-color: transparent;
      border-color: #ffd430; }
  .btn-default.active {
    color: #fff;
    background-color: transparent;
    border-color: #ffd430; }
    .btn-default.active:hover, .btn-default.active:focus, .btn-default.active.focus {
      color: #fff;
      background-color: transparent;
      border-color: #ffd430; }

.open > .dropdown-toggle.btn-default {
  color: #fff;
  background-color: transparent;
  border-color: #ffd430; }
  .open > .dropdown-toggle.btn-default:hover, .open > .dropdown-toggle.btn-default:focus, .open > .dropdown-toggle.btn-default.focus {
    color: #fff;
    background-color: transparent;
    border-color: #ffd430; }

.nav > li > a.btn-default:hover, .nav > li > a.btn-default:focus {
  color: #fff;
  background-color: transparent;
  border-color: #ffd430; }

.nav > li.active > a.btn-default {
  color: #fff;
  background-color: transparent;
  border-color: #ffd430; }

.btn-white {
  color: #fff;
  background-color: transparent;
  border-color: #fff; }
  .btn-white.disabled:hover, .btn-white.disabled:focus, .btn-white.disabled.focus {
    color: #fff;
    background-color: transparent;
    border-color: #fff; }
  .btn-white[disabled]:hover, .btn-white[disabled]:focus, .btn-white[disabled].focus {
    color: #fff;
    background-color: transparent;
    border-color: #fff; }
  .btn-white:before {
    background-color: #fff; }
  .btn-white:hover, .btn-white:focus, .btn-white.focus {
    color: #ffd430;
    background-color: transparent;
    border-color: #fff; }
  .btn-white:active {
    color: #ffd430;
    background-color: transparent;
    border-color: #fff; }
    .btn-white:active:hover, .btn-white:active:focus, .btn-white:active.focus {
      color: #ffd430;
      background-color: transparent;
      border-color: #fff; }
  .btn-white.active {
    color: #ffd430;
    background-color: transparent;
    border-color: #fff; }
    .btn-white.active:hover, .btn-white.active:focus, .btn-white.active.focus {
      color: #ffd430;
      background-color: transparent;
      border-color: #fff; }

.open > .dropdown-toggle.btn-white {
  color: #ffd430;
  background-color: transparent;
  border-color: #fff; }
  .open > .dropdown-toggle.btn-white:hover, .open > .dropdown-toggle.btn-white:focus, .open > .dropdown-toggle.btn-white.focus {
    color: #ffd430;
    background-color: transparent;
    border-color: #fff; }

.nav > li > a.btn-white:hover, .nav > li > a.btn-white:focus {
  color: #ffd430;
  background-color: transparent;
  border-color: #fff; }

.nav > li.active > a.btn-white {
  color: #ffd430;
  background-color: transparent;
  border-color: #fff; }

.btn-primary {
  color: #fff;
  background-color: #ffd430;
  border-color: #ffd430; }
  .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus {
    color: #fff;
    background-color: #ffd430;
    border-color: #ffd430; }
  .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus {
    color: #fff;
    background-color: #ffd430;
    border-color: #ffd430; }
  .btn-primary:before {
    background-color: #181818; }
  .btn-primary:hover, .btn-primary:focus, .btn-primary.focus {
    color: #fff;
    background-color: transparent;
    border-color: #181818; }
  .btn-primary:active {
    color: #fff;
    background-color: transparent;
    border-color: #181818; }
    .btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus {
      color: #fff;
      background-color: transparent;
      border-color: #181818; }
  .btn-primary.active {
    color: #fff;
    background-color: transparent;
    border-color: #181818; }
    .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus {
      color: #fff;
      background-color: transparent;
      border-color: #181818; }

.open > .dropdown-toggle.btn-primary {
  color: #fff;
  background-color: transparent;
  border-color: #181818; }
  .open > .dropdown-toggle.btn-primary:hover, .open > .dropdown-toggle.btn-primary:focus, .open > .dropdown-toggle.btn-primary.focus {
    color: #fff;
    background-color: transparent;
    border-color: #181818; }

.nav > li > a.btn-primary:hover, .nav > li > a.btn-primary:focus {
  color: #fff;
  background-color: transparent;
  border-color: #181818; }

.nav > li.active > a.btn-primary {
  color: #fff;
  background-color: transparent;
  border-color: #181818; }

/* 1.5. FORM CONTROLS */
.form-group {
  margin-bottom: 20px; }

.form-control {
  height: 40px;
  padding: 8px 15px;
  border-color: #e5e5e5;
  border-radius: 0;
  box-shadow: none;
  font-family: "Roboto Condensed", sans-serif;
  font-size: 14px;
  line-height: 24px;
  font-weight: 400;
  -webkit-transition-duration: .25s;
  transition-duration: .25s;
  outline: 0; }
  .form-control:focus {
    border-color: #ffd430;
    box-shadow: none; }

textarea.form-control {
  height: auto;
  min-height: 120px;
  resize: vertical; }

select.form-control {
  cursor: pointer; }

/* 1.6. ALERT */
.alert {
  border-radius: 0; }

/*------------------------------------*\
    2. HELPER CLASSES
\*------------------------------------*/
/* 2.1. FLOATS */
.float--left {
  float: left; }

.float--right {
  float: right; }

/* 2.2. OVERFLOWS */
.ov--h {
  overflow: hidden; }

/* 2.3. PADDINGS */
.pt--10 {
  padding-top: 10px; }

.pt--20 {
  padding-top: 20px; }

.pt--30 {
  padding-top: 30px; }

.pt--40 {
  padding-top: 40px; }

.pt--50 {
  padding-top: 50px; }

.pt--60 {
  padding-top: 60px; }

.pt--70 {
  padding-top: 70px; }

.pt--80 {
  padding-top: 80px; }

.pt--90 {
  padding-top: 90px; }

.pt--100 {
  padding-top: 100px; }

.pt--130 {
  padding-top: 130px; }

.pt--160 {
  padding-top: 160px; }

.pb--10 {
  padding-bottom: 10px; }

.pb--20 {
  padding-bottom: 20px; }

.pb--30 {
  padding-bottom: 30px; }

.pb--40 {
  padding-bottom: 40px; }

.pb--50 {
  padding-bottom: 50px; }

.pb--60 {
  padding-bottom: 60px; }

.pb--70 {
  padding-bottom: 70px; }

.pb--80 {
  padding-bottom: 80px; }

.pb--90 {
  padding-bottom: 90px; }

.pb--100 {
  padding-bottom: 100px; }

.pb--130 {
  padding-bottom: 130px; }

.pb--160 {
  padding-bottom: 160px; }

/* 2.4. TEXT COLORS */
.text-dark {
  color: #414141; }

.text-default {
  color: #878787; }

.text-white {
  color: #fff; }

.text-primary {
  color: #ffd430; }

/* 2.5. BACKGROUND IMAGE */
.bg--img {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat; }

/* 2.6. BACKGROUND OVERLAY */
[data-overlay] {
  position: relative; }
  [data-overlay]:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    -webkit-transition: opacity .25s ease-in-out;
    transition: opacity .25s ease-in-out;
    z-index: -1; }

[data-overlay="0"]:before {
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; }

[data-overlay="0.1"]:before {
  opacity: 0.1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=10)"; }

[data-overlay="0.15"]:before {
  opacity: 0.15;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=15)"; }

[data-overlay="0.2"]:before {
  opacity: 0.2;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)"; }

[data-overlay="0.25"]:before {
  opacity: 0.25;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=25)"; }

[data-overlay="0.3"]:before {
  opacity: 0.3;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; }

[data-overlay="0.35"]:before {
  opacity: 0.35;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=35)"; }

[data-overlay="0.4"]:before {
  opacity: 0.4;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; }

[data-overlay="0.45"]:before {
  opacity: 0.45;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=45)"; }

[data-overlay="0.5"]:before {
  opacity: 0.5;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; }

[data-overlay="0.55"]:before {
  opacity: 0.55;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=55)"; }

[data-overlay="0.6"]:before {
  opacity: 0.6;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; }

[data-overlay="0.65"]:before {
  opacity: 0.65;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)"; }

[data-overlay="0.7"]:before {
  opacity: 0.7;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)"; }

[data-overlay="0.75"]:before {
  opacity: 0.75;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)"; }

[data-overlay="0.8"]:before {
  opacity: 0.8;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; }

[data-overlay="0.85"]:before {
  opacity: 0.85;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)"; }

[data-overlay="0.9"]:before {
  opacity: 0.9;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; }

[data-overlay="0.95"]:before {
  opacity: 0.95;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; }

[data-overlay="1"]:before {
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

/* 2.7. BACKGROUND COLORS */
.bg-light {
  background-color: #f7f7f7; }

.bg-dark {
  background-color: #151515; }

.bg-default {
  background-color: #fff; }

.bg-primary {
  background-color: #ffd430; }

/* 2.8. FONTS */
.ff--default {
  font-family: "Roboto", sans-serif; }

.ff--primary {
  font-family: "Roboto Condensed", sans-serif; }

.fw--100 {
  font-weight: 100; }

.fw--200 {
  font-weight: 200; }

.fw--300 {
  font-weight: 300; }

.fw--400 {
  font-weight: 400; }

.fw--500 {
  font-weight: 500; }

.fw--600 {
  font-weight: 600; }

.fw--700 {
  font-weight: 700; }

.fw--800 {
  font-weight: 800; }

.fw--900 {
  font-weight: 900; }

.fs--12 {
  font-size: 12px;
  line-height: 22px; }

.fs--14 {
  font-size: 14px;
  line-height: 24px; }

.fs--16 {
  font-size: 16px;
  line-height: 26px; }

.fs--18 {
  font-size: 18px;
  line-height: 28px; }

.fs--20 {
  font-size: 20px;
  line-height: 30px; }

.fs--22 {
  font-size: 22px;
  line-height: 32px; }

.fs--24 {
  font-size: 24px;
  line-height: 34px; }

.fs--26 {
  font-size: 26px;
  line-height: 36px; }

.fs--28 {
  font-size: 28px;
  line-height: 38px; }

.fs--30 {
  font-size: 30px;
  line-height: 40px; }

/* 2.9. VERTICAL CENTERING */
.vc--parent {
  width: 100%;
  height: 100%;
  display: table; }

.vc--child {
  display: table-cell;
  vertical-align: middle; }

.row--vc > div {
  float: none;
  display: table-cell;
  vertical-align: middle; }

.hc {
  text-align: center; }

/*------------------------------------*\
    3. COMPONENTS
\*------------------------------------*/
/* 3.1. PRELOADER */
#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99999; }

.preloader--spinner {
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: 30px;
  height: 30px;
  margin: -15px auto 0;
  background-color: #fff;
  -webkit-animation: preloaderRotate 1.2s infinite ease-in-out;
  animation: preloaderRotate 1.2s infinite ease-in-out; }

@-webkit-keyframes preloaderRotate {
  0% {
    -webkit-transform: perspective(120px); }
  50% {
    -webkit-transform: perspective(120px) rotateY(180deg); }
  100% {
    -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); } }

@keyframes preloaderRotate {
  0% {
    transform: perspective(120px) rotateX(0deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
  50% {
    transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
    -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }
  100% {
    transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
    -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }

/* 3.2. SECTION TITLE */
.section--title .h2 {
  display: inline-block;
  position: relative;
  margin-top: -8px;
  padding-bottom: 16px;
  z-index: 0; }
  .section--title .h2:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 130px;
    height: 1px;
    margin: 0 auto;
    background-color: #fff; }
  .section--title .h2:after {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 90px;
    height: 1px;
    margin: 0 auto;
    background-color: #636363; }
  .section--title .h2.text-white:before {
    background-color: #fff; }

/* 3.3. PAGE BREADCRUMB */
.page--breadcrumb .breadcrumb {
  padding: 0;
  color: #fff;
  background-color: transparent;
  border-radius: 0;
  font-size: 24px;
  line-height: 34px;
  font-weight: 700;
  text-transform: uppercase; }
  .page--breadcrumb .breadcrumb li.active {
    color: #fff; }

/* 3.4. OWL DOTS */
.owl-dots {
  margin-top: 22px;
  text-align: center; }

.owl-dot {
  display: inline-block;
  width: 10px;
  height: 6px;
  margin: 0 5px;
  border: 1px solid #fff;
  -webkit-transition: background-color .25s ease-in-out;
  transition: background-color .25s ease-in-out; }
  .owl-dot.active {
    background-color: #fff; }

/* 3.5. PORTFOLIO FILTER MENU */
.portfolio--filter-menu .nav {
  margin-top: -26px;
  margin-bottom: 2px;
  color: #181818;
  font-weight: 700;
  text-align: center;
  text-transform: uppercase; }
  .portfolio--filter-menu .nav > li {
    float: none;
    display: inline-block;
    margin: 20px 16px 0;
    -webkit-transition: color .25s;
    transition: color .25s;
    cursor: pointer; }
    .portfolio--filter-menu .nav > li:hover, .portfolio--filter-menu .nav > li.active {
      color: #fff; }
    .portfolio--filter-menu .nav > li:before {
      content: " ";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      width: 1px;
      height: 10px;
      margin: 0 auto;
      background-color: #181818;
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      visibility: hidden;
      -webkit-transition-property: opacity, visibility, top, bottom;
      transition-property: opacity, visibility, top, bottom;
      -webkit-transition-duration: .35s;
      transition-duration: .35s;
      -webkit-transition-timing-function: ease-in-out;
      transition-timing-function: ease-in-out; }
    .portfolio--filter-menu .nav > li:after {
      content: " ";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      width: 1px;
      height: 10px;
      margin: 0 auto;
      background-color: #181818;
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      visibility: hidden;
      -webkit-transition-property: opacity, visibility, top, bottom;
      transition-property: opacity, visibility, top, bottom;
      -webkit-transition-duration: .35s;
      transition-duration: .35s;
      -webkit-transition-timing-function: ease-in-out;
      transition-timing-function: ease-in-out;
      top: auto;
      bottom: 0; }
    .portfolio--filter-menu .nav > li:hover:before, .portfolio--filter-menu .nav > li.active:before {
      top: -14px;
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      visibility: visible; }
    .portfolio--filter-menu .nav > li:hover:after, .portfolio--filter-menu .nav > li.active:after {
      bottom: -14px;
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      visibility: visible; }

/* 3.6. PAGINATION NAV */
.pagination {
  display: block;
  margin: 0;
  border-radius: 0; }
  .pagination > li > a {
    color: #181818;
    background-color: transparent; }
    .pagination > li > a:hover, .pagination > li > a:focus {
      color: #181818;
      background-color: transparent; }
  .pagination > li > span {
    color: #181818;
    background-color: transparent; }
    .pagination > li > span:hover, .pagination > li > span:focus {
      color: #181818;
      background-color: transparent; }
  .pagination > li:first-child > a,
  .pagination > li:first-child > span {
    border-radius: 0; }
  .pagination > li:last-child > a,
  .pagination > li:last-child > span {
    border-radius: 0; }
  .pagination > li > a:hover,
  .pagination > li > span:hover {
    color: #fff;
    background-color: #ffd430;
    border-color: #ffd430; }
  .pagination > li.active > a,
  .pagination > li.active > span {
    color: #fff;
    background-color: #ffd430;
    border-color: #ffd430; }
    .pagination > li.active > a:hover,
    .pagination > li.active > span:hover {
      color: #fff;
      background-color: #ffd430;
      border-color: #ffd430; }

/* 3.7. BACK TO TOP */
#backToTop {
  position: fixed;
  right: 30px;
  bottom: 20px;
  opacity: 0;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  visibility: hidden;
  -webkit-transition-property: bottom, opacity, visibility;
  transition-property: bottom, opacity, visibility;
  -webkit-transition-duration: .25s;
  transition-duration: .25s;
  -webkit-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  z-index: 999; }

body.isScrolling #backToTop {
  bottom: 30px;
  opacity: 1;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  visibility: visible; }

#backToTop .btn {
  width: 35px;
  padding: 0;
  font-size: 18px;
  line-height: 45px; }

/*------------------------------------*\
    4. WIDGETS
\*------------------------------------*/
.widget {
  padding: 10px;
  background-color: #f2f2f2; }
  .widget + .widget {
    margin-top: 30px; }

/* 4.1. WIDGET TITLE */
.widget--title {
  margin-bottom: 5px;
  padding: 18px 20px;
  background-color: #fff;
  text-align: center;
  text-transform: uppercase; }
  .widget--title:last-child {
    margin-bottom: 0; }
  .widget--title .h4 {
    position: relative;
    display: inline-block;
    z-index: 0; }
    .widget--title .h4:before {
      content: " ";
      position: absolute;
      top: 50%;
      left: -20px;
      right: -20px;
      margin-top: -1px;
      height: 1px;
      border-style: solid;
      border-width: 0 10px;
      border-color: #ffd430; }

/* 4.2. SEARCH WIDGET */
.search--widget {
  position: relative;
  margin: 20px;
  z-index: 0; }
  .search--widget .form-control {
    border-color: transparent; }
    .search--widget .form-control:focus {
      border-color: #ffd430; }
  .search--widget button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 8px 20px;
    border-width: 0; }

/* 4.3. NEWSLETTER WIDGET */
.newsletter--widget {
  padding: 25px 20px;
  text-align: center; }
  .newsletter--widget .desc {
    margin-bottom: 16px;
    color: #555; }
  .newsletter--widget .form-control {
    background-color: #f2f2f2; }
  .newsletter--widget .btn {
    margin-top: 30px; }

/* 4.4. LINKS WIDGET */
.links--widget {
  padding: 23px 30px 22px; }
  .links--widget .nav > li {
    float: none; }
    .links--widget .nav > li + li {
      margin-top: 10px; }
    .links--widget .nav > li > a {
      position: relative;
      padding: 0 0 0 16px;
      z-index: 0; }
      .links--widget .nav > li > a:before {
        content: "\f101";
        position: absolute;
        top: 0;
        left: 0;
        font-family: "FontAwesome"; }

/* 4.5. TAGS WIDGET */
.tags--widget {
  padding: 16px 20px; }
  .tags--widget .nav > li > a {
    padding: 6px 10px; }

/*------------------------------------*\
    5. BLOCKS
\*------------------------------------*/
/* 5.1. ABOUT BLOCK */
.about--block .title {
  position: relative;
  margin-bottom: 4px;
  padding: 7px 0 7px 15px;
  border-left: 5px solid #181818;
  z-index: 0; }
  .about--block .title:before {
    content: " ";
    position: absolute;
    top: 0;
    left: -5px;
    width: 5px;
    height: 50%;
    background-color: #f00;
    z-index: 1; }

.about--block .info {
  color: #696969;
  font-size: 16px;
  line-height: 26px; }
  .about--block .info th {
    position: relative;
    padding-right: 15px;
    text-transform: uppercase;
    z-index: 0; }
    .about--block .info th:after {
      content: ":";
      position: absolute;
      top: -1px;
      right: 0;
      font-weight: normal; }
    .about--block .info th .fa {
      min-width: 16px;
      margin-right: 15px; }
  .about--block .info td {
    padding-left: 8px; }
  .about--block .info tr + tr th,
  .about--block .info tr + tr td {
    padding-top: 18px; }
  .about--block .info tr + tr th:after {
    top: 17px; }

.about--block .social .nav {
  margin: 0 -2.5px; }
  .about--block .social .nav li a {
    min-width: 30px;
    margin: 5px 2.5px 0;
    padding: 2px 0 0;
    border: 1px solid #b2b2b2;
    line-height: 28px;
    text-align: center; }
    .about--block .social .nav li a:hover, .about--block .social .nav li a:focus {
      color: #fff;
      background-color: #181818;
      border-color: #181818; }

/* 5.2. SERVICE BLOCK */
.service--block {
  padding: 30px 20px 22px;
  background-color: #fff;
  border-top: 3px solid #181818;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
  text-align: center;
  -webkit-transition: border-color .55s, background-color .55s ease-in-out;
  transition: border-color .55s, background-color .55s ease-in-out; }
  .service--block:hover {
    background-color: #181818;
    border-color: #ffd430; }
  .service--block .icon {
    max-width: 60px;
    margin: 0 auto 23px;
    padding-top: 2px;
    color: #fff;
    background-color: #ffd430;
    border: 1px solid #ffd430;
    font-size: 22px;
    line-height: 56px;
    text-align: center;
    -webkit-transition: background-color .55s ease-in-out;
    transition: background-color .55s ease-in-out; }
  .service--block:hover .icon {
    background-color: transparent; }
  .service--block .title .h4 {
    margin-bottom: 14px;
    text-transform: uppercase;
    -webkit-transition: color .55s;
    transition: color .55s; }
  .service--block:hover .title .h4 {
    color: #fff; }
  .service--block .desc {
    -webkit-transition: color .55s;
    transition: color .55s; }
  .service--block:hover .desc {
    color: #eee; }

/* 5.3. TIMELINE BLOCK */
.timeline--block .title .h5 {
  position: relative;
  margin-top: -6px;
  padding-bottom: 17px;
  color: #414141;
  text-align: center;
  text-transform: uppercase;
  z-index: 0; }
  .timeline--block .title .h5:before {
    content: " ";
    position: absolute;
    left: 15px;
    right: 0;
    bottom: 0;
    width: 20px;
    height: 5px;
    margin: 0 auto;
    background-color: #181818; }
  .timeline--block .title .h5:after {
    content: " ";
    position: absolute;
    left: 15px;
    right: 0;
    bottom: 0;
    width: 20px;
    height: 5px;
    margin: 0 auto;
    background-color: #181818;
    left: 0;
    right: 25px;
    background-color: #ffd430; }

.timeline--block .sub-title {
  max-width: 600px;
  margin: 26px auto 27px;
  text-align: center; }

/* 5.4. CONTACT INFO BLOCK */
.contact--info-block {
  text-align: center; }
  .contact--info-block .icon {
    position: relative;
    max-width: 55px;
    margin: 0 auto 13px;
    color: #fff;
    background-color: #181818;
    font-size: 24px;
    line-height: 55px;
    z-index: 0; }
    .contact--info-block .icon:before {
      content: " ";
      position: absolute;
      top: 50%;
      left: -15px;
      right: -15px;
      height: 1px;
      margin-top: -1px;
      border-style: solid;
      border-width: 0 10px;
      border-color: #ffd430; }
  .contact--info-block .desc {
    margin-top: 6px;
    margin-bottom: 2px;
    color: #555; }

/* 5.5. CONTACT FORM */
.contact--form .title .h4 {
  margin-top: -7px;
  margin-bottom: 2px; }

/* 5.6. COMMENT BLOCK */
.comment--block-inner {
  padding: 53px 30px 60px;
  background-color: #f2f2f2; }

/* 5.7. CALL TO ACTION BLOCK */
.cta--block .title .h2 {
  margin-top: 2px; }

/*------------------------------------*\
    6. ITEMS
\*------------------------------------*/
/* 6.1. PORTFOLIO ITEMS */
.portfolio--item {
  position: relative;
  z-index: 0; }
  .portfolio--item .caption {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 30px 20px;
    color: #fff;
    text-align: center;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    -webkit-transition: opacity .35s ease-in-out, visibility .35s ease-in-out;
    transition: opacity .35s ease-in-out, visibility .35s ease-in-out;
    z-index: 1; }
  .portfolio--item:hover .caption {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible; }
  .portfolio--item .caption:before {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #181818;
    opacity: 0.85;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=85)";
    z-index: -1; }
  .portfolio--item .caption:after {
    content: " ";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    width: 1px;
    margin: 0 auto;
    border-style: solid;
    border-width: 25px 0;
    border-color: #fff; }
  .portfolio--item .caption .h6 {
    color: #fff;
    text-transform: uppercase; }

/* 6.2. TIMELINE ITEMS */
.timeline--items {
  margin-top: 52px; }
  .timeline--items > li {
    position: relative;
    width: 50%;
    margin-left: 50%;
    padding-top: 20px;
    padding-left: 80px;
    z-index: 0; }
    .timeline--items > li:first-child {
      padding-top: 0; }
    .timeline--items > li:before {
      content: " ";
      position: absolute;
      top: 0;
      left: -2px;
      bottom: 0;
      border-left: 4px solid #e5e5e5; }
    .timeline--items > li:nth-child(even) {
      margin-left: 0;
      padding-left: 0;
      padding-right: 80px; }
      .timeline--items > li:nth-child(even):before {
        left: auto;
        right: -2px; }
    .timeline--items > li:last-child:after {
      content: " ";
      position: absolute;
      left: -15px;
      bottom: 0;
      width: 30px;
      height: 4px;
      background-color: #e5e5e5; }
    .timeline--items > li:nth-child(even):last-child:after {
      left: auto;
      right: -15px; }

.timeline--item {
  position: relative;
  background-color: #232323;
  z-index: 0; }
  .timeline--item:before {
    content: " ";
    position: absolute;
    top: 50%;
    left: -80px;
    width: 80px;
    height: 1px;
    background-color: #e5e5e5; }

.timeline--items > li:nth-child(even) .timeline--item:before {
  left: auto;
  right: -80px; }

.timeline--item .icon {
  content: "\f19d";
  position: absolute;
  top: 50%;
  left: -100px;
  width: 40px;
  margin-top: -20px;
  color: #181818;
  font-family: "FontAwesome";
  font-size: 16px;
  line-height: 40px;
  text-align: center; }

.timeline--items > li:nth-child(even) .timeline--item .icon {
  left: auto;
  right: -100px; }

.timeline--item .info,
.timeline--item .content {
  display: table-cell;
  vertical-align: top; }

.timeline--item .table tbody tr td {
  min-width: 190px;
  padding: 0;
  border: 1px solid #e5e5e5; }

.timeline--item .info {
  min-width: 190px; }

.timeline--item .date {
  position: relative;
  margin: -1px -1px 0;
  padding: 7px 20px 5px;
  z-index: 0; }

.timeline--item .bottom {
  padding: 16px 20px 15px; }

.timeline--item .name {
  margin-top: 0;
  text-transform: uppercase; }

.timeline--item .institute {
  margin-top: 6px;
  margin-bottom: 1px;
  color: #555; }

.timeline--item .content {
  padding: 22px 30px 22px; }

.timeline--item .info + .content {
  border-left-width: 0; }

/* 6.3. SKILLS ITEMS */
.skill--title {
  position: relative;
  margin-bottom: 34px;
  padding: 7px 0 7px 15px;
  border-left: 5px solid #fff;
  z-index: 0; }
  .skill--title:before {
    content: " ";
    position: absolute;
    top: 0;
    left: -5px;
    width: 5px;
    height: 50%;
    background-color: #ffd430;
    z-index: 1; }

.skill--item {
  position: relative;
  z-index: 0; }
  .skill--item:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background-color: #333;
    z-index: -1; }
  .skill--item + .skill--item {
    margin-top: 24px; }

.skill--progress {
  height: 4px;
  background-color: #ffd430;
  -webkit-transition: width .85s ease .25s;
  transition: width .85s ease .25s; }

/* 6.4. PRICING ITEM */
.pricing--item {
  max-width: 380px;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  border: 1px solid #e5e5e5;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
  -webkit-transition: border-color .25s, box-shadow .25s ease-in-out;
  transition: border-color .25s, box-shadow .25s ease-in-out;
  text-align: center; }
  .pricing--item:hover {
    border-color: transparent;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.15); }

.pricing--header {
  padding: 60px 20px 47px; }
  .pricing--header .plan {
    display: inline-block;
    padding: 13px 30px;
    background-color: #fff;
    text-transform: uppercase; }
    .pricing--header .plan .h3 {
      font-weight: 400; }
  .pricing--header .price {
    margin-top: 48px;
    font-size: 18px;
    line-height: 28px;
    font-weight: 700; }
    .pricing--header .price span {
      font-size: 54px;
      line-height: 64px;
      font-weight: normal; }

.pricing--features .nav {
  color: #555; }
  .pricing--features .nav > li {
    float: none;
    padding: 15px 20px;
    border-bottom: 1px solid #e5e5e5; }

.pricing--action {
  padding: 40px 20px; }

/* 6.5. TEAM MEMBER ITEM */
.team--member {
  position: relative;
  max-width: 380px;
  margin-left: auto;
  margin-right: auto;
  z-index: 0; }
  .team--member .img img {
    display: block;
    width: 100%; }
  .team--member .caption {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.8);
    text-align: center;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    visibility: hidden;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
    -webkit-transition-property: opacity, visibility, -webkit-transform;
    transition-property: opacity, visibility, -webkit-transform;
    transition-property: opacity, visibility, transform;
    transition-property: opacity, visibility, transform, -webkit-transform;
    -webkit-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-timing-function: ease-in-out;
    transition-timing-function: ease-in-out;
    z-index: 1; }
  .team--member:hover .caption {
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible;
    -webkit-transform: scale(1);
    transform: scale(1);
    pointer-events: none; }
  .team--member .name .h3 {
    margin-bottom: 0;
    color: #fff; }
  .team--member .social .nav {
    margin-top: 17px; }
    .team--member .social .nav > li {
      float: none;
      display: inline-block; }
      .team--member .social .nav > li > a {
        display: block;
        width: 35px;
        margin: 0 1.5px;
        padding: 0;
        border: 1px solid rgba(255, 255, 255, 0.4);
        font-size: 16px;
        line-height: 33px; }
        .team--member .social .nav > li > a:hover {
          background-color: #fff; }

/* 6.6. POST ITEM */
.post--item {
  max-width: 380px;
  margin-left: auto;
  margin-right: auto;
  padding: 20px 20px 22px;
  background-color: #fff; }

.post--items .post--item {
  max-width: none;
  padding: 0; }
  .post--items .post--item + .post--item {
    margin-top: 52px;
    padding-top: 60px;
    border-top: 1px solid #e5e5e5; }

.post--header {
  margin-bottom: 30px; }

.post--date {
  float: left;
  width: 80px;
  margin-right: 30px;
  padding: 11px 0;
  font-size: 16px;
  line-height: 24px;
  text-align: center; }
  .post--date a {
    color: #fff; }

.post--img {
  position: relative;
  margin-bottom: 28px;
  z-index: 0; }
  .post--img img {
    width: 100%; }
  .post--img .date {
    position: absolute;
    left: 0;
    bottom: 1px;
    width: 60px;
    padding: 12px 0;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    text-align: center;
    z-index: 0; }
    .post--img .date:before {
      content: " ";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: #ffd430;
      opacity: 0.8;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
      -webkit-transition: opacity .25s ease-in-out;
      transition: opacity .25s ease-in-out;
      z-index: -1; }
    .post--img .date:hover:before {
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; }

.post--meta {
  margin: 0;
  color: #999; }
  .post--meta .nav {
    margin: 0 -5px; }
    .post--meta .nav > li {
      padding: 0 5px; }
      .post--meta .nav > li > .fa {
        margin-right: 8px; }

.post--single .post--meta .nav > li > .fa {
  color: #414141; }

.post--meta .nav > li > a {
  padding: 0; }
  .post--meta .nav > li > a:after {
    content: ",";
    color: #999; }
  .post--meta .nav > li > a:last-child:after {
    display: none; }

.post--excerpt {
  margin-top: 13px; }

.post--action {
  margin-top: 16px;
  color: #555;
  font-weight: 500; }
  .post--action a .fa {
    margin-left: 8px; }

.post--footer {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid #e5e5e5; }

.post--share > span {
  display: inline-block;
  margin-right: 15px;
  color: #181818;
  vertical-align: middle; }

.post--share .nav {
  display: inline-block;
  color: #999;
  vertical-align: middle; }
  .post--share .nav > li > a {
    width: 30px;
    margin: 0 2.5px;
    padding: 2px 0 0;
    border: 1px solid #e5e5e5;
    font-size: 14px;
    line-height: 26px;
    text-align: center; }
    .post--share .nav > li > a:hover {
      color: #fff;
      background-color: #181818;
      border-color: #181818; }

.post--nav {
  margin-top: 4px; }
  .post--nav .prev .fa {
    margin-right: 8px; }
  .post--nav .next .fa {
    margin-left: 8px; }
  .post--nav .divider {
    margin: 0 5px; }

/* 6.7. TESTIMONIAL ITEM */
.testimonial--slider {
  margin: 1px 0 2px; }

.testimonial--item {
  text-align: center; }
  .testimonial--item .icon {
    margin-bottom: 20px;
    font-size: 36px;
    line-height: 46px; }
  .testimonial--item blockquote {
    max-width: 720px;
    margin: 0 auto;
    padding: 0;
    border-width: 0;
    font-size: 16px;
    line-height: 26px; }
    .testimonial--item blockquote p {
      font-style: italic; }
      .testimonial--item blockquote p:before {
        content: "\f10d";
        margin-right: 8px;
        font-family: "FontAwesome";
        font-style: normal;
        font-size: 22px; }
      .testimonial--item blockquote p:after {
        content: "\f10e";
        margin-left: 8px;
        font-family: "FontAwesome";
        font-style: normal;
        font-size: 22px; }
    .testimonial--item blockquote footer {
      margin-top: 30px;
      color: inherit;
      font-size: 14px;
      line-height: 24px;
      font-weight: 700;
      text-transform: uppercase; }

/* 6.8. COMMENT ITEMS */
.comment--items .comment--items {
  padding-top: 30px;
  padding-left: 130px; }

.comment--items > li + li {
  margin-top: 30px; }

.comment--item .img {
  position: relative;
  max-width: 100px;
  margin-right: 30px;
  z-index: 0; }
  .comment--item .img:before {
    content: " ";
    position: absolute;
    top: 50%;
    left: 0;
    right: -30px;
    height: 1px;
    margin-top: -1px;
    background-color: #e5e5e5;
    z-index: -1; }

.comment--item .info {
  padding: 15px 20px 14px;
  border: 1px solid #e5e5e5; }

.comment--item .date {
  margin-top: 2px; }

.comment--item .action {
  margin-top: 5px; }

.comment--item .content {
  margin-top: 7px;
  color: #555; }

/*------------------------------------*\
    7. HEADER SECTION
\*------------------------------------*/
/* 7.1. HEADER NAVBAR */
.header--navbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  margin-bottom: 0;
  border-width: 0;
  border-radius: 0;
  -webkit-transition: background-color .25s ease-in-out, box-shadow .25s ease-in-out;
  transition: background-color .25s ease-in-out, box-shadow .25s ease-in-out;
  z-index: 999; }

body.isScrolling .header--navbar {
  background-color: #181818;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.15); }

.header--navbar .navbar-toggle {
  margin: 33px 0;
  border-color: #fff;
  border-radius: 0; }
  .header--navbar .navbar-toggle .icon-bar {
    background-color: #fff;
    border-radius: 0; }

.header--navbar .logo {
  height: 100px;
  padding: 20px 0; }

.header--navbar > .container .navbar-brand {
  margin-left: 0;
  margin-right: 0; }

.header--navbar .navbar-collapse {
  padding: 0; }

/* 7.2. HEADER NAV LINKS */
.header--nav-links {
  margin: 0 -15px;
  padding: 23px 0;
  color: #fff;
  line-height: 26px;
  text-transform: uppercase; }
  .header--nav-links > li > a {
    position: relative;
    padding: 0 16px;
    z-index: 0; }
    .header--nav-links > li > a:before {
      content: " ";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      width: 1px;
      margin: 0 auto;
      border-style: solid;
      border-color: #fff;
      border-width: 8px 0;
      transform: rotate(45deg);
      opacity: 0;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
      visibility: hidden;
      -webkit-transition-property: opacity, visibility, top, bottom, border-color;
      transition-property: opacity, visibility, top, bottom, border-color;
      -webkit-transition-duration: .35s;
      transition-duration: .35s;
      -webkit-transition-timing-function: ease-in-out;
      transition-timing-function: ease-in-out;
      z-index: -1; }
    .header--nav-links > li > a:hover:before {
      top: -12px;
      bottom: -12px;
      opacity: 1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
      visibility: visible; }
  .header--nav-links > li.active > a:before {
    top: -12px;
    bottom: -12px;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    visibility: visible; }
  .header--nav-links > li > a > .caret {
    margin-left: 5px; }

.dropdown-menu {
  margin-top: 10px;
  padding: 11px 0 9px;
  color: #222;
  border-width: 0;
  border-radius: 0;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.05);
  font-size: 16px;
  line-height: 26px; }
  .dropdown-menu > li > a {
    padding: 5px 20px; }

/*------------------------------------*\
    8. BANNER SECTION
\*------------------------------------*/
.banner--section {
  height: 100%; }

/* 8.1. BANNER CONENT */
.banner--content .title {
  margin-bottom: 16px; }

.banner--content .name .h2 {
  display: inline-block;
  font-size: 42px;
  line-height: 52px;
  border-style: solid;
  border-width: 1px 0;
  border-color: #ffd430; }

.banner--content .role {
  margin-top: 20px; }

.banner--content .desc {
  margin-top: 16px;
  color: #ccc; }

.banner--content .action {
  margin-top: 10px; }
  .banner--content .action .btn {
    margin: 15px 15px 0; }

.banner--content .text-welcome {
  background: linear-gradient(to top, #FCF6BA, #cb9821, #FCF6BA, #ca9821, #FCF6BA);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; }

.banner--content #scrolldown a {
  padding-top: 70px; }
  .banner--content #scrolldown a span {
    position: absolute;
    left: 50%;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    border-left: 1px solid #fff;
    border-bottom: 1px solid #fff;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-animation: sdb05 1.5s infinite;
    animation: sdb05 1.5s infinite;
    box-sizing: border-box; }

@-webkit-keyframes sdb05 {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0; } }

@keyframes sdb05 {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0; }
  50% {
    opacity: 1; }
  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0; } }

/*------------------------------------*\
    9. FOOTER SECTION
\*------------------------------------*/
.footer--section {
  color: #999;
  background-color: #181818; }

/* 9.1. FOOTER SOCIAL */
.footer--social .nav > li {
  float: none;
  display: inline-block; }
  .footer--social .nav > li > a {
    width: 30px;
    margin: 0 1px;
    padding: 2px 0 0;
    color: #181818;
    background-color: #fff;
    font-size: 14px;
    line-height: 28px; }
    .footer--social .nav > li > a:hover {
      color: #fff;
      background-color: #ffd430; }

/* 9.2. COPYRIGHT TEXT */
.copyright--text:last-child {
  margin-bottom: -8px; }

.footer--social + .copyright--text {
  margin-top: 34px; }

/*------------------------------------*\
    10. 404 SECTION
\*------------------------------------*/
.f0f--section {
  height: 100%; }

/* 10.1. 404 CONTENT */
.f0f--content .title {
  position: relative;
  z-index: 0; }
  .f0f--content .title .h1 {
    font-size: 160px;
    line-height: 180px;
    font-weight: 400; }
  .f0f--content .title p {
    display: inline-block;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    padding: 0 10px;
    background-color: #000; }

.f0f--content .desc {
  max-width: 630px;
  margin: 0 auto; }

.f0f--content .search {
  position: relative;
  max-width: 520px;
  margin: 52px auto 0;
  z-index: 0; }
  .f0f--content .search button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 6px 20px 7px; }

.f0f--content .buttons {
  margin-top: 30px; }
  .f0f--content .buttons .or {
    display: inline-block;
    margin-top: 30px;
    margin-left: 30px;
    margin-right: 30px;
    vertical-align: middle; }
  .f0f--content .buttons .btn {
    margin: 30px 0 0;
    vertical-align: middle; }

/*------------------------------------*\
    11. COMING SOON SECTION
\*------------------------------------*/
.coming-soon--section {
  height: 100%; }

/* 11.1. COMING SOON CONTENT */
.cs--content .logo {
  margin-bottom: 48px; }

.cs--content .title .h2 {
  position: relative;
  padding-bottom: 19px;
  font-size: 48px;
  line-height: 58px;
  z-index: 0; }
  .cs--content .title .h2:before {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 150px;
    margin: 0 auto;
    border-bottom: 1px solid rgba(255, 255, 255, 0.5); }
  .cs--content .title .h2:after {
    content: " ";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-width: 30px;
    margin: 0 auto;
    border-bottom: 1px solid #ffd430; }

.cs--content .countdown ul {
  margin: 0;
  padding: 0;
  list-style: none; }
  .cs--content .countdown ul li {
    display: inline-block;
    margin: 0 15px; }

.cs--content .countdown strong {
  display: block;
  font-size: 36px;
  line-height: 46px; }

.cs--content .countdown span {
  display: block;
  font-size: 16px;
  line-height: 26px; }

.cs--content .desc {
  max-width: 560px;
  margin: 30px auto 0; }

.cs--content .newsletter {
  position: relative;
  max-width: 440px;
  margin: 30px auto 0;
  z-index: 0; }
  .cs--content .newsletter button {
    position: absolute;
    top: 0;
    right: 0;
    padding: 7px 12px 6px; }

.cs--content .social {
  display: inline-block;
  margin: 60px 0 0; }
  .cs--content .social .nav > li > a {
    min-width: 34px;
    margin: 5px 2.5px 0;
    padding: 4px 0;
    border: 1px solid rgba(255, 255, 255, 0.5);
    text-align: center; }
    .cs--content .social .nav > li > a:hover {
      color: #fff;
      background-color: #ffd430;
      border-color: #ffd430; }

.cs--content .copyright {
  color: #999;
  font-size: 16px;
  line-height: 26px; }

.title-OldLondon {
  font-family: OldLondon;
  font-weight: 100;
  font-size: 40px;
  margin-bottom: 0px; }

.artistDesc {
  text-align: justify; }

.sticky {
  position: fixed !important;
  top: 0 !important;
  z-index: 999; }

.parallax {
  width: 80%;
  height: 800px;
  left: 0; }

.img--block {
  overflow: hidden;
  display: block;
  position: relative; }

.water {
  position: absolute;
  width: 100%;
  height: 717px;
  left: -20px;
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover; }

.darkgrey {
  color: #414141; }

.water-layer1 {
  background-image: url(./img/pano/layer1.png);
  top: -5vw;
  left: -6vw;
  width: 40vw;
  height: 50vw; }

.water-layer3 {
  background-image: url(./img/pano/layer2.png);
  top: -5vw;
  left: -3vw;
  width: 40vw;
  height: 50vw; }

.water-layer4 {
  background-image: url(./img/pano/layer3.png);
  top: -5vw;
  left: -3vw;
  width: 40vw;
  height: 50vw; }

.portfolio-small {
  display: block;
  width: 15vw;
  height: 15vw;
  overflow: hidden;
  position: relative;
  margin: .5vw; }
  .portfolio-small img {
    -webkit-filter: grayscale(100%);
    /* Safari 6.0 - 9.0 */
    filter: grayscale(100%);
    transition: all ease .5s;
    transform: scale(1);
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1); }
  .portfolio-small:hover img {
    -webkit-filter: grayscale(0%);
    /*Safari6.0-9.0*/
    filter: grayscale(0%);
    transition: all ease .5s;
    transform: scale(1.5); }

@font-face {
  font-family: "OldLondon";
  src: url("./fonts/OldLondon.ttf"); }

body.preloader-site {
  overflow: hidden; }

.loader-wrapper {
  height: 100%;
  width: 100%;
  background: #000;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999999; }

@-moz-keyframes leftAnim {
  0% {
    -moz-transform: translateX(194px);
    transform: translateX(194px);
    -webkit-transform: translateX(194px);
    -ms-transform: translateX(194px);
    -o-transform: translateX(194px); }
  100% {
    -moz-transform: translateX(0);
    transform: translateX(0);
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0); } }

@-webkit-keyframes leftAnim {
  0% {
    -webkit-transform: translateX(194px);
    transform: translateX(194px);
    -moz-transform: translateX(194px);
    -ms-transform: translateX(194px);
    -o-transform: translateX(194px); }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0); } }

@keyframes leftAnim {
  0% {
    -moz-transform: translateX(194px);
    -ms-transform: translateX(194px);
    -webkit-transform: translateX(194px);
    transform: translateX(194px);
    -o-transform: translateX(194px); }
  100% {
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0); } }

@-moz-keyframes rightAnim {
  0% {
    -moz-transform: translateX(0);
    transform: translateX(0); }
  100% {
    transform: translateX(-194px);
    -moz-transform: translateX(-194px);
    -webkit-transform: translateX(-194px);
    -ms-transform: translateX(-194px);
    -o-transform: translateX(-194px); } }

@-webkit-keyframes rightAnim {
  0% {
    transform: translateX(0px);
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px); }
  100% {
    transform: translateX(-194px);
    -webkit-transform: translateX(-194px);
    -moz-transform: translateX(-194px);
    -ms-transform: translateX(-194px);
    -o-transform: translateX(-194px); } }

@keyframes rightAnim {
  0% {
    transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -webkit-transform: translateX(0px);
    -o-transform: translateX(0px); }
  100% {
    transform: translateX(-164px);
    -moz-transform: translateX(-164px);
    -ms-transform: translateX(-164px);
    -webkit-transform: translateX(-164px);
    -o-transform: translateX(-164px); } }

.loader {
  width: 600px;
  height: 300px;
  margin: 0 auto;
  position: relative;
  top: 40vh; }

.loader::after {
  content: "";
  display: inline-block;
  position: absolute;
  left: 50%;
  margin-left: -1px;
  width: 2px;
  z-index: 1;
  height: 300px;
  border-left: 2px dotted #333; }

.loader__box {
  position: absolute;
  top: 0;
  width: 300px;
  height: 300px;
  overflow: hidden;
  z-index: 2; }

.loader--left {
  left: 0; }

.loader--left .loader__circle {
  background: url(./img/logopreloadarm.jpg);
  background-size: contain;
  right: 10px;
  -moz-animation: leftAnim 1.3s ease-in-out alternate infinite;
  -webkit-animation: leftAnim 1.3s ease-in-out alternate infinite;
  animation: leftAnim 1.3s ease-in-out alternate infinite; }

.loader--right {
  right: 0; }

.loader--right .loader__circle {
  background: url(./img/logopreloadarmp.jpg);
  background-size: contain;
  left: 10px;
  -moz-animation: rightAnim 1.3s ease-in-out alternate infinite;
  -webkit-animation: rightAnim 1.3s ease-in-out alternate infinite;
  animation: rightAnim 1.3s ease-in-out alternate infinite; }

.loader__circle {
  width: 150px;
  height: 150px;
  border: solid 2px black;
  display: block;
  background-size: contain;
  -moz-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  position: absolute;
  top: 50%;
  margin-top: -75px; }

.vandame {
  background: url(./img/vandame.png);
  display: block;
  bottom: 0;
  right: 0;
  height: 250px;
  width: 142px;
  background-size: contain;
  background-repeat: no-repeat;
  position: fixed;
  background-position-y: bottom; }

/*
 * Owl Carousel
 */
.owl-carousel {
  overflow: hidden; }

.owl-buttons {
  position: static; }

.owl-prev,
.owl-next {
  opacity: 0;
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -50px;
  width: 105px;
  height: 105px;
  line-height: 105px;
  font-size: 16px;
  text-align: center;
  color: #111;
  z-index: 6;
  -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -ms-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.27s cubic-bezier(0, 0, 0.58, 1); }

.owl-prev {
  left: -50px; }

.owl-next {
  right: -50px; }

.owl-prev:before,
.owl-next:before {
  content: "";
  display: block;
  width: 66%;
  height: 66%;
  position: absolute;
  top: 17px;
  left: 0;
  background: #fff;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -ms-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.27s cubic-bezier(0, 0, 0.58, 1); }

.owl-next:before {
  left: auto;
  right: 0; }

.owl-prev .fa,
.owl-next .fa {
  position: relative; }

.owl-prev:hover,
.owl-next:hover {
  -webkit-transition: 0 none !important;
  -moz-transition: 0 none !important;
  -ms-transition: 0 none !important;
  -o-transition: 0 none !important;
  transition: 0 none !important; }

.owl-prev:hover:before,
.owl-next:hover:before {
  opacity: 0.87; }

.owl-prev:active:before,
.owl-next:active:before {
  opacity: 0.6; }

.owl-carousel:hover .owl-prev {
  opacity: 1;
  left: -35px; }

.owl-carousel:hover .owl-next {
  opacity: 1;
  right: -35px; }

.owl-pagination {
  display: block;
  width: 100%;
  position: absolute;
  bottom: 30px;
  left: 0;
  text-align: center; }

.owl-page {
  display: inline-block;
  padding: 6px 4px;
  position: relative; }

.owl-page span {
  width: 6px;
  height: 6px;
  display: block;
  background: rgba(255, 255, 255, 0.7);
  position: relative;
  z-index: 1000 !important;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  -moz-box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  box-shadow: 1px 1px 0px rgba(0, 0, 0, 0.1);
  -webkit-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -moz-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -o-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  -ms-transition: all 0.27s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.27s cubic-bezier(0, 0, 0.58, 1); }

.owl-page:hover span {
  background: white; }

.owl-page.active span {
  background: transparent;
  bordeR: 1px solid rgba(255, 255, 255, 0.8);
  -webkit-transform: scale(1.3333333);
  -moz-transform: scale(1.3333333);
  -o-transform: scale(1.3333333);
  -ms-transform: scale(1.3333333);
  transform: scale(1.3333333); }

.item-carousel .owl-prev {
  left: -125px; }

.item-carousel .owl-next {
  right: -125px; }

section:hover .item-carousel.owl-carousel .owl-prev {
  opacity: 1;
  left: -80px; }

section:hover .item-carousel.owl-carousel .owl-next {
  opacity: 1;
  right: -80px; }

.item-carousel {
  margin-bottom: -50px;
  padding-bottom: 50px; }

.item-carousel .owl-pagination {
  bottom: 0; }

.work-full-slider .owl-pagination,
.content-slider .owl-pagination {
  bottom: 15px; }

.single-carousel,
.small-item-carousel {
  margin-bottom: 35px; }

.single-carousel .owl-pagination,
.small-item-carousel .owl-pagination {
  position: relative;
  left: 0;
  top: 35px;
  margin: 0; }

.single-carousel.black .owl-page span,
.small-item-carousel.black .owl-page span {
  background: rgba(0, 0, 0, 0.15);
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }

.single-carousel.black .owl-page:hover span,
.small-item-carousel.black .owl-page:hover span {
  background: rgba(0, 0, 0, 0.4); }

.single-carousel.black .owl-page.active span,
.small-item-carousel.black .owl-page.active span {
  background: rgba(0, 0, 0, 0.4); }

.single-carousel.black .owl-prev,
.single-carousel.black .owl-next,
.small-item-carousel.black .owl-prev,
.small-item-carousel.black .owl-next {
  color: rgba(0, 0, 0, 0.2);
  text-shadow: none;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: none; }

.single-carousel.black .owl-prev:hover,
.single-carousel.black .owl-next:hover,
.small-item-carousel.black .owl-prev:hover,
.small-item-carousel.black .owl-next:hover {
  color: rgba(0, 0, 0, 0.35); }

.single-carousel .owl-prev,
.small-item-carousel .owl-prev {
  left: -125px; }

.single-carousel .owl-next,
.small-item-carousel .owl-next {
  right: -125px; }

section:hover .single-carousel .owl-prev,
section:hover .small-item-carousel .owl-prev {
  opacity: 1;
  left: -80px; }

section:hover .single-carousel .owl-next,
section:hover .small-item-carousel .owl-next {
  opacity: 1;
  right: -80px; }

.black-arrows .owl-prev,
.black-arrows .owl-next {
  color: #fff; }

.black-arrows .owl-prev:before,
.black-arrows .owl-next:before {
  background: black; }

.fullwidth-slideshow-pager-wrap .owl-item {
  opacity: .7;
  -webkit-transition: all 0.07s cubic-bezier(0, 0, 0.58, 1);
  -moz-transition: all 0.07s cubic-bezier(0, 0, 0.58, 1);
  -o-transition: all 0.07s cubic-bezier(0, 0, 0.58, 1);
  -ms-transition: all 0.07s cubic-bezier(0, 0, 0.58, 1);
  transition: all 0.07s cubic-bezier(0, 0, 0.58, 1); }

.fullwidth-slideshow-pager-wrap .owl-item:hover {
  opacity: 1; }

.fullwidth-slideshow-pager-wrap .owl-item.synced {
  opacity: 1; }

.callme {
  display: none;
  position: fixed;
  top: 30px;
  left: 20px;
  z-index: 9999; }