@font-face {
       font-family: 'Gotham';
       font-weight: 200;
       src: url('fonts/GothamHTF-XLight.eot');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 200;
       src: url('fonts/GothamHTF-XLight.woff') format('woff'),
           url('fonts/GothamHTF-XLight.svg#GothamHTF-XLight') format('svg');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 300;
       src: url('fonts/GothamHTF-Light.eot');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 300;
       src: url('fonts/GothamHTF-Light.woff') format('woff'),
           url('fonts/GothamHTF-Light.svg#GothamHTF-Light') format('svg');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 400;
       src: url('fonts/GothamHTF-Book.eot');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 400;
       src: url('fonts/GothamHTF-Book.woff') format('woff'),
           url('fonts/GothamHTF-Book.svg#GothamHTF-Book') format('svg');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 500;
       src: url('fonts/GothamHTF-Medium.eot');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 500;
       src: url('fonts/GothamHTF-Medium.woff') format('woff'),
           url('fonts/GothamHTF-Medium.svg#GothamHTF-Medium') format('svg');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 600;
       src: url('fonts/GothamHTF-Bold.eot');
   }

   @font-face {
       font-family: 'Gotham';
       font-weight: 600;
       src: url('fonts/GothamHTF-Bold.woff') format('woff'),
           url('fonts/GothamHTF-Bold.svg#GothamHTF-Bold') format('svg');
   }



   html,
   body {
       height: 100%;
       font-family: "Gotham", sans-serif;
       color: #464646;
       /* box-sizing: content-box; */
   }


   .pagewrap {
       min-height: 100%;
       height: auto !important;
       height: 100%;
       margin: 0 auto -180px;
       /* the bottom margin is the negative value of the footer's height */
       box-sizing: initial;
       background-color: #f2dea6;
   }

   footer {
       min-height: 180px;
   }

   .push {
       height: 180px;
;
   }

   .js .fadeIn {
       display: none;
   }

   .container {
       max-width: 990px;
   }

   .clearthis:after,
   section:after {
       content: "";
       display: table;
       clear: both;
   }

   section {
       clear: both;
   }

   h1,
   h2,
   h3,
   .serif {
       font-family: 'Gotham', sans-serif;
       /* text-transform: lowercase; */
   }


   h1,
   .pagetitle {
       color: #374ea2;
       text-align: center;
       font-size: 24px;
       /* text-transform: lowercase; */
       border-bottom: solid 1px #374ea2;
       padding-bottom: 15px;
   }
   
   h2 {
       color: #9b6c21;
       text-align: center;
       font-size: 30px;
       font-weight: 400;
       /* text-transform: lowercase; */
   }

   hr {
       border-color: #374ea2;
   }

   img {
       max-width: 100%;
   }

   .fullwidth img {
       width: 100%;
   }

   .flex-video {
       position: relative;
       width: 100%;
       padding-bottom: 66.67%;
   }

   .flex-video iframe {
       position: absolute;
       top: 0;
       width: 100%;
       height: 100%;
       left: 0;
   }

   ul {
       margin: 0;
       list-style-type: none;
       padding: 0;
   }

   a {
       color: #374ea2;
       font-weight: 500;
   }

   a:hover,
   a:focus {
       color: #000;
       font-weight: 500;
   }

   a.popup .feature-box {
       background: #855c47;
       /* display: inline-block; */
       /* height: 1px; */
       /* float: left; */
   }

   a.popup img {
       /* border: 1px solid rgb(228, 231, 236); */
       /* box-shadow: 1px 1px 5px #E8EDF1; */
   }

   a.popup img:hover {
       /* box-shadow: 0 0 10px 1px #DEDC03 inset; */
       /* border: 1px solid red; */
       opacity: 0.5;
   }

   .botgap {
       margin-bottom: 40px;
   }

   .topgap {
       margin-top: 40px;
   }

   .clearfloat,
   .cf {
       clear: both;
   }

   ul,
   ol {
       margin-bottom: 15px;
       margin-top: 15px;
       padding-left: 15px;
   }

   ul li {
       margin-bottom: 5px;
       list-style-position: outside;
       list-style-type: disc;
   }

   ol li {
       margin-bottom: 10px;
       list-style-type: decimal;
   }

   /* ul.list li, .liststyle li {
  background-color: #eee;
  padding: 3px 20px;
  border-radius: 30px;
  margin: 0px 10% 5px;
} */

   checkbox {
       color: #18443f;
   }

   .blue {
       color: #38a9e1;
   }

   .grey {
       color: #9d9d9c;
   }

   .white {
       color: #fff;
   }

   .js #banner {
       display: none;
   }

   .bigphone {
       font-family: 'Gotham', sans-serif;
       /* font-weight: bold; */
       vertical-align: middle;
       /* margin-right: 10px; */
   }

   .smallphone {
       display: none;

   }


   #banner {
       position: relative;
       z-index: 40;
   }

   #home-carousel {
       background: #aaa;
   }

   .carousel-inner .item {
       height: 700px;
       background-size: cover;
       background-position: center;
   }


   .banner-overlay {
       text-align: center;
       position: absolute;
       bottom: 0;
       z-index: 100;
       width: 100%;
       /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#000000+0,000000+100&0+0,0.65+100 */
       background: -moz-linear-gradient(top, rgba(248, 242, 231, 0) 0%, rgba(173, 131, 45, 0.25) 100%);
       /* FF3.6-15 */
       background: -webkit-linear-gradient(top, rgba(248, 242, 231, 0) 0%, rgba(173, 131, 45, 0.25) 100%);
       /* Chrome10-25,Safari5.1-6 */
       background: linear-gradient(to bottom, rgba(248, 242, 231, 0) 0%, rgba(173, 131, 45, 0.25) 100%);
       /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
       filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#a6000000', GradientType=0);
       /* IE6-9 */
   }



   #features {
       text-align: center;
       margin: 20px 0;
   }

   .feature-item {
       display: inline-block;
       position: relative;
       margin: 20px;
       width: 240px;
       /*background: #ab755b; */
       min-height: 150px;
       max-width: 80%;
       border-radius: 50%;
       border: 2px solid #fff;
       overflow: hidden;
   }

   .feature-item:hover {
       box-shadow: 0 0 30px #ab755b;
       /* border-color: rgba(255, 255, 255, 0); */
   }

   .feature-item .text {
       position: absolute;
       top: 60%;
       text-align: center;
       width: 80%;
       margin: -10% 0 0;
       color: #fff;
       left: 10%;
       font-family: Gotham;
       font-weight: 600;
       text-shadow: 2px 2px 3px rgba(91, 63, 46, 0.5);
   }




   .store {
       border: 1px solid #ddd;
       text-align: left;
       padding: 0 15px;
       border-left-width: 5px;
       margin-bottom: 20px;
   }

   .store .store-contact li {
       display: inline-block;
       margin-right: 50px;
   }

   .store .store-contact li a {
       color: #000;
   }

   .store .store-contact li a:hover {
       color: #1C70B8;
   }

   .store .address {
       font-size: 1.2em;
   }

   .store .logo {
       text-align: center;
       float: right;
       padding: 15px;
   }

   .store ul.store-contact {
       margin-bottom: 15px;
   }

   .store .title a {
       color: rgb(255, 255, 255);
       background: #1C70B8;
       padding: 10px 30px;

       margin: 0 -20px;
       font-weight: 800;
       border-radius: 0px 0px 30px;

       border-left: 5px solid rgb(203, 77, 31);
       display: inline-block;
   }

   #mapcanvas {
       height: 500px;
       margin-bottom: 20px;
   }

   #mapcanvas img {
       max-width: none !important;
   }

   #mapcanvas .logo img {
       max-width: 100% !important;
   }

   .autoload .pagination {
       display: none;
   }

   section.product-page {
       background: #FAFBFC;
   }

   .product {
       background: #FFF;
       border: 2px solid #F3F5F8;
       margin-bottom: 30px;
       position: relative;
       display: block;
   }

   .product .image {
       display: block;
       background: #fff;
   }

   .product.list .image {
       height: 250px;
       line-height: 250px;
   }

   .product .image .fa,
   .product-detail .image .fa {
       font-size: 9em;
       color: #F3F5F8;
       line-height: 2;
   }

   .product .image.missing .fa {
       color: rgba(255, 237, 0, 0.2);
   }

   .product .title {
       margin: 0;
       padding: 10px;
       background: #F3F5F8;
       color: #000;
   }

   .product .feature-text {
       padding: 10px;
   }

   .product:hover,
   .product:hover .title {
       background: #1C70B8;
       color: #fff;
   }

   .product:hover a,
   .product:hover p,
   .product:hover h4 {
       color: #fff;
   }

   .product:hover .image {
       filter: alpha(opacity=40);
       -moz-opacity: 0.4;
       -khtml-opacity: 0.4;
       opacity: 0.4;
   }

   .product .middle {
       display: none;
   }

   .product:hover .middle {
       display: block;
   }

   .prod-series {
       display: block;
       background: #fff;
       /* padding: 10px; */
       /* margin-bottom: 30px; */
   }

   .prod-series .image {
       /* border: 1px solid red; */
       /* padding-bottom: 80%; */
       position: relative;
       text-align: center;
       min-height: 300px;
       line-height: 300px;
   }

   .prod-series .image img {
       /* position: absolute; */
       max-width: 100%;
       max-height: 100%;
       /* top: 0; */
       /* left: 0; */
       width: auto;
   }

   .prod-series:hover {
       /* box-shadow: 0 0 15px #1C70B8 inset; */
   }

   .prod-series .overlay {
       padding: 0 !important;
   }

   .middle {
       color: #fff;
       position: absolute;
       top: 50%;
       left: 50%;
       margin: -25px -50px;
       width: 100px;
       height: 50px;
   }

   ul.specs {
       /* background: #F3F5F8; */
       /* padding: 5px; */
       margin-bottom: 10px;
       display: table;
       width: 100%;
       font-size: 13px;
   }

   ul.specs li {
       background: #505054;
       margin-bottom: 1px;
       line-height: 1em;
       text-align: left;
       /* box-shadow: 1px 1px 2px #CAD0D7 inset; */
       color: #eee;
       /* border-radius: 20px; */
       /* overflow: hidden; */
       /* padding-left: 110px; */
       /* position: relative; */
       display: table-row;
       border-bottom: 1px solid #444446;
   }

   ul.specs li:last-child {
       margin-bottom: 0;
   }

   ul.specs li span {
       padding: 10px 12px;
       display: table-cell;
       border-top: 1px solid #444446;
       vertical-align: middle;
       word-break: break-word;
   }

   ul.specs li .title {
       /* float: left; */
       width: 40%;
       background: rgb(58, 58, 60);
       color: #B8BCBF;
       text-align: right;
       /* padding-left: 20px; */
       /* position: absolute; */
       /* left: 0; */
       /* border-right: 2px solid #FFED00; */
       height: 100%;
       /* position: absolute; */
   }

   ul.specs li .fa {
       font-size: 1.3em;
       color: #9DA4AE;
       margin-right: 10px;
   }

   ul.specs .icons {
       height: 32px;
       margin-right: 5px;
   }

   .modal {
       background: rgba(0, 0, 0, 0.75);
   }

   .tabheader {
       /* background: #E4E7EC; */
       padding: 10px;
       margin: 0 10px;
       display: inline-block;
       border-radius: 3px 3px 0 0;
   }

   mapdata {
       display: none;
   }

   /*! jQuery UI - v1.11.4 - 2015-03-11
----------------------------------*/

   .ui-slider {
       position: relative;
       text-align: left;
   }

   .ui-slider .ui-slider-handle {
       position: absolute;
       z-index: 2;
       width: 1.3em;
       height: 1.3em;
       cursor: default;
       -ms-touch-action: none;
       touch-action: none;
       border-radius: 15px;
       border: 1px solid rgb(242, 239, 237);
   }

   .ui-slider .ui-slider-range {
       position: absolute;
       z-index: 1;
       font-size: .7em;
       display: block;
       border: 0;
       background-position: 0 0;
   }

   /* support: IE8 - See #6727 */
   .ui-slider.ui-state-disabled .ui-slider-handle,
   .ui-slider.ui-state-disabled .ui-slider-range {
       filter: inherit;
   }

   .ui-slider-horizontal {
       height: .8em;
   }

   .ui-slider-horizontal .ui-slider-handle {
       top: -.3em;
       margin-left: -.6em;
   }

   .ui-slider-horizontal .ui-slider-range {
       top: 0;
       height: 100%;
   }

   .ui-slider-horizontal .ui-slider-range-min {
       left: 0;
   }

   .ui-slider-horizontal .ui-slider-range-max {
       right: 0;
   }

   .ui-slider-vertical {
       width: .8em;
       height: 100px;
   }

   .ui-slider-vertical .ui-slider-handle {
       left: -.3em;
       margin-left: 0;
       margin-bottom: -.6em;
   }

   .ui-slider-vertical .ui-slider-range {
       left: 0;
       width: 100%;
   }

   .ui-slider-vertical .ui-slider-range-min {
       bottom: 0;
   }

   .ui-slider-vertical .ui-slider-range-max {
       top: 0;
   }

   /* Interaction states
----------------------------------*/
   .ui-state-default,
   .ui-widget-content .ui-state-default,
   .ui-widget-header .ui-state-default {

       background: #413F3D;
       font-weight: normal;
       color: #555555;
       outline: none;
   }

   .ui-state-default a,
   .ui-state-default a:link,
   .ui-state-default a:visited {
       color: #555555;
       text-decoration: none;
   }

   .ui-state-hover,
   .ui-widget-content .ui-state-hover,
   .ui-widget-header .ui-state-hover,
   .ui-state-focus,
   .ui-widget-content .ui-state-focus,
   .ui-widget-header .ui-state-focus {

       background: #dadad;
       font-weight: normal;
       color: #212121;
   }

   .ui-state-hover a,
   .ui-state-hover a:hover,
   .ui-state-hover a:link,
   .ui-state-hover a:visited,
   .ui-state-focus a,
   .ui-state-focus a:hover,
   .ui-state-focus a:link,
   .ui-state-focus a:visited {
       color: #212121;
       text-decoration: none;
   }

   .ui-state-active,
   .ui-widget-content .ui-state-active,
   .ui-widget-header .ui-state-active {

       background: #000;
       font-weight: normal;
       color: #212121;
   }

   .ui-state-active a,
   .ui-state-active a:link,
   .ui-state-active a:visited {
       color: #212121;
       text-decoration: none;
   }


   .prodsearchform {
       background: #F2EFED;
       padding: 10px 20px;
       color: #575553;
       /* border-radius: 3px; */
       margin-bottom: 30px;
   }

   .prodsearchform .item {
       width: 25%;
       display: inline-block;
       /* border: 1px solid #3A3939; */
       float: left;
       padding: 10px 20px;
   }

   .range-min,
   .range-max {
       width: 50%;
       display: inline-block;
       padding-top: 5px;
       color: #1C70B8;
   }

   .range-min {
       text-align: left;
   }

   .range-max {
       text-align: right;
   }

   .prodsearchform .cat_textbox {
       width: 100%;
       border: none;
       background: #A5A09D;
       padding: 5px;
       color: #fff;
       border-radius: 3px;
       margin-bottom: 10px;
   }

   .ui-slider-range {
       background: #E95924;
       /* border: 1px solid #222; */
       /* box-shadow: inset 1px 1px 4px rgba(0, 0, 0, 0.3); */
   }

   .range-slider {
       border: none;
       background: #D2CCC9;
       border-radius: 10px;
       /* box-shadow: inset 1px 1px 3px #000; */
   }

   .prodsearchform .cat_dropdown {
       background: #A5A09D;
       border: none;
       color: #fff;
       height: 27px;
       border-radius: 3px;
       /* -webkit-appearance: initial; */
       /* text-align: center; */
       margin-bottom: 10px;
       width: 100%;
   }

   .js .range-slider input {
       display: none;
   }


   .tick-holder {
       display: inline-block;
       /* margin: 0 10px 0px 0; */
       background: #A5A09D;
       color: #14AEA5;
       padding: 0px;
       width: 1.5em;
       text-align: center;
       border-radius: 2px;
       height: 1.5em;
       /* float: left; */
       position: absolute;
       left: 0;
       line-height: 1.5;
   }

   .ticked .tick-holder {
       background: #E95924;
       color: #FFFFFF;
   }

   .tickbox {
       margin: 5px;
       padding-left: 30px;
       position: relative;
       display: inline-block;
   }

   .ticked .on {
       display: inline;
       line-height: 1.5;
   }

   .on,
   .ticked .off {
       display: none;
   }



   .tickbox:hover {
       /* background: rgba(0, 0, 0, 0.2); */
       border-radius: 2px;
       cursor: pointer;
       color: #1C70B8;
   }

   .inline a.list-group-item {
       display: inline-block;
       border-radius: 0;
       margin-bottom: 3px;
   }

   /* ==========================================================================
Waypoints
========================================================================== */
   .wp1,
   .wp2,
   .wp3,
   .wp4,
   .wp5,
   .wp6 {
       visibility: hidden;
   }

   .bounceInLeft,
   .bounceInRight,
   .fadeInUp,
   .fadeInUpDelay,
   .fadeInDown,
   .fadeInUpD,
   .fadeInLeft,
   .fadeInRight {
       visibility: visible;
   }

   .delay-05s {
       animation-delay: 0.5s;
       -webkit-animation-delay: 0.5s;
   }

   .delay-1s {
       animation-delay: 1s;
       -webkit-animation-delay: 1s;
   }

   .wp3 {
       /* background:  url('../img/iphone-bg.png') no-repeat center center; */
       /* background-position:  200px 10px; */
       /* height:  100%; */
   }


   /* ==========================================================================
Hero
========================================================================== */
   .hero {
       background: url('../img/hero-bg.jpg') no-repeat center center;
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       padding: 90px 0 300px 0;
       height: auto;
   }

   .hero h1 {
       font-size: 40px;
       letter-spacing: 12px;
       margin: 10px;
   }

   .hero h1 span {
       color: #a1a9b0;
       display: inline-block;
   }

   .hero p {
       letter-spacing: 1px;
   }

   .learn-more-btn {
       background: #3dc9b3;
       padding: 20px 40px;
       border-radius: 5px;
       -moz-border-radius: 5px;
       -webkit-border-radius: 5px;
       -o-border-radius: 5px;
       color: #fff;
       text-transform: uppercase;
       letter-spacing: 1px;
       display: inline-block;
       -webkit-box-shadow: 0px 3px 0px 0px #a1a9b0;
       -moz-box-shadow: 0px 3px 0px 0px #a1a9b0;
       box-shadow: 0px 3px 0px 0px #a1a9b0;
       margin: 60px 0 0;
       font-weight: bold;
   }

   .learn-more-btn:hover,
   .learn-more-btn:focus {
       background: rgba(61, 201, 179, 0.6);
       color: #fff;
   }

   /* ==========================================================================
Intro
========================================================================== */
   .intro {
       background: #f3f5f8;
   }

   .intro p {
       margin: 30px 0 0;
   }

   h1.arrow {
       font-size: 20px;
       text-transform: uppercase;
       /* color: #353535; */
       letter-spacing: 1px;
       background: url('../img/h1-bg.png') no-repeat center bottom;
       padding-bottom: 30px;
       font-weight: bold;
       border: none;
   }

   h1.arrow-left {
       font-size: 18px;
       text-transform: uppercase;
       color: #353535;
       letter-spacing: 1px;
       background: url('../img/h1-bg-left.png') no-repeat center bottom;
       padding-bottom: 30px;
       font-weight: bold;
   }

   h1.arrow-right {
       font-size: 18px;
       text-transform: uppercase;
       color: #353535;
       letter-spacing: 1px;
       background: url('../img/h1-bg-right.png') no-repeat center bottom;
       padding-bottom: 30px;
       font-weight: bold;
   }

   .showlink {
       display: none;
   }

   #search-widget {
       /* padding: 0 10px; */
       border: 1px solid #18443f;
       display: inline-block;
       border-radius: 30px;
       /* overflow: hidden; */
       vertical-align: middle;
       line-height: 26px;
       height: 26px;
       position: relative;
       width: 200px;
       max-width: 100%;
   }



   .search_button {
       background: none;
       border: none;
       padding: 0;
       height: 100%;
       /* vertical-align: top; */
       /* display: inline-block; */
       color: #18443f;
       position: absolute;
       top: 0;
       right: 10px;
       width: 24px;
       line-height: 1;
   }

   .search_button:hover {
       color: #ad832d;
   }

   .searchinput {
       height: 100%;
       top: 0;
       left: 10px;
       right: 35px;
       position: absolute;
   }

   input#CAT_Search {
       height: 100%;
       width: 100%;
       border: none;
       font-size: 14px;
       color: #555;
       position: absolute;
       top: 0;
       left: 0;
   }

   input#CAT_Search:focus {
       outline: none;
   }

   .search-btn {
       padding: 5px;
       line-height: 1 !important;
       height: auto;
   }

   /* ==========================================================================
Features
========================================================================== */
   .features-wrapper,
   .team-wrapper {
       margin: 70px 0 0;
   }

   .icon {
       height: 175px;
       width: 175px;
       line-height: 175px;
       max-width: 100%;
       background: #3dc9b3;
       border-radius: 50%;
       -o-border-radius: 50%;
       -moz-border-radius: 50%;
       -webkit-border-radius: 50%;
       display: block;
       color: #fff;
       font-size: 55px;
       text-align: center;
       vertical-align: middle;
       position: relative;
       margin: 0 auto 50px;
   }

   .icon .fa {
       line-height: 175px;
   }

   /* ==========================================================================
iPhone Section
========================================================================== */
   .iphone,
   .boxphoto {
       width: 50%;
       background: #f3f5f8;
       float: left;
       height: 100%;
       box-shadow: inset -15px -11px 40px -6px rgba(0, 0, 0, 0.1);
       -moz-box-shadow: inset -15px -11px 40px -6px rgba(0, 0, 0, 0.1);
       -webkit-box-shadow: inset -15px -11px 40px -6px rgba(0, 0, 0, 0.1);
       z-index: 1;
   }

   .fluid-white {
       width: 50%;
       background: #fff;
       float: right;
       height: 100%;
       z-index: 2;
   }

   .responsive-services {
       position: relative;
   }

   /* ==========================================================================
Swag
========================================================================== */
   .swag {
       background: url('../img/plants-bg.jpg') no-repeat center center;
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       background-attachment: fixed;
       padding: 50px 0;
   }

   .swag h1 {
       color: #fff;
       font-size: 40px;
       text-transform: uppercase;
       letter-spacing: 5px;
   }

   .swag h1 span {
       display: block;
       font-size: 25px;
       margin-top: 20px;
   }

   .down-arrow-btn {
       width: 40px;
       height: 40px;
       border-radius: 50%;
       -moz-border-radius: 50%;
       -webkit-border-radius: 50%;
       -o-border-radius: 50%;
       background: rgba(61, 201, 179, 0.6);
       display: inline-block;
       margin: 10px auto 20px;
       color: #18443f;
       font-size: 16px;
       line-height: 40px;
       text-align: center;
   }

   .down-arrow-btn:hover,
   .down-arrow-btn:focus {
       color: #18443f;
       background: #3dc9b3;
   }

   /* ==========================================================================
Subscribe
========================================================================== */
   .subscribe {
       background: url('../img/keyboard-bg.jpg') no-repeat center center;
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       background-attachment: fixed;
       padding: 120px 0 140px;
   }

   .subscribe h1 {
       color: #fff;
       margin-bottom: 40px;
   }

   .subscribe h1 span {
       display: block;
       font-size: 22px;
       text-transform: uppercase;
       font-weight: bold;
       margin-top: 20px;
       letter-spacing: 1px;
   }

   .subscribe input[type=text] {
       background-color: rgba(255, 255, 255, 0.1);
       border: solid 1px #fff;
       padding: 20px;
       width: 70%;
       color: #fff;
       /* border-radius: 2px; */
       max-width: 300px;
   }

   .subscribe input[type=submit] {
       background: #1C70B8;
       border: solid 1px #1C70B8;
       padding: 20px;
       color: #FFF;
       text-transform: uppercase;
       letter-spacing: 1px;
       transition: all 0.5s ease;
       -moz-transition: all 0.5s ease;
       -webkit-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
   }

   .subscribe input[type=submit]:hover {
       background: rgba(222, 220, 3, 0.5);
       border: solid 1px #DEDC03;
       color: #fff;
   }

   /* ==========================================================================
CTA
========================================================================== */
   .reverse-cta {
       background-color: #17191B;
       padding: 70px 0;
   }

   .reverse-btn {
       display: inline-block;
       padding: 25px 40px;
       color: #fff;
       border: solid 1px #fff;
       text-transform: uppercase;
       font-weight: bold;
       letter-spacing: 1px;
       /* border-radius: 2px; */
   }

   .reverse-btn:hover,
   .reverse-btn:focus {
       color: #3dc9b3;
       border: solid 1px #3dc9b3;
   }

   .lighting-bg {
       background: url('../img/lighting-bg.png') no-repeat center center;
       -webkit-background-size: cover;
       -moz-background-size: cover;
       -o-background-size: cover;
       background-size: cover;
       background-attachment: fixed;
       padding: 120px 0 140px;
   }

   /* ==========================================================================
FlexSlider Custom CSS
========================================================================== */
   #servicesSlider {
       margin-top: 70px;
   }

   ul.slides li {
       margin-bottom: 20px;
       text-align: center;
   }

   .filter-categories {
       display: none;
   }

   /* ==========================================================================
Portfolio
========================================================================== */
   #portfolioSlider {
       margin-top: 50px;
   }

   .effects {
       padding-left: 15px;
   }

   .effects .img {
       margin-bottom: 0;
       position: relative;
       z-index: 1;
       overflow: hidden;
   }

   .effects .img:nth-child(n) {
       margin-right: 5px;
   }

   .effects .img:first-child {
       margin-left: -15px;
   }

   .effects .img:last-child {
       margin-right: 0;
   }

   .effects .img img {
       display: block;
       margin: 0;
       padding: 0;
       height: auto;
   }

   .feature-box .text {
       /* background: #F7F5F5; */
       /* padding: 20px; */
       /* margin-bottom: 30px; */
       display: inline-block;
       width: 95%;
       /* float: right; */
       vertical-align: middle;
   }

   .overlay2 {
       display: none;
       position: absolute;
       z-index: 20;
       background: rgba(0, 0, 0, 0.6);
       overflow: hidden;
       transition: all 0.5s;
       -webkit-transition: all 0.5s;
       -moz-transition: all 0.5s;
       -o-transition: all 0.5s;
       left: 0;
       top: 0;
       right: 0;
       bottom: 0;
   }

   .text-centre {
       text-align: center;
   }


   a.close-overlay {
       display: block;
       position: absolute;
       top: 0;
       right: 0;
       z-index: 100;
       width: 45px;
       height: 45px;
       font-size: 20px;
       font-weight: 700;
       color: #fff;
       line-height: 45px;
       text-align: center;
       background-color: #000;
       cursor: pointer;
   }

   a.close-overlay.hidden {
       display: none;
   }

   a.expand {
       display: block;
       position: absolute;
       z-index: 100;
       text-align: center;
       color: #fff;
       font-weight: 600;
       font-size: 14px;
       text-transform: uppercase;
       line-height: 30px;
   }

   .overlay-effect .img i {
       font-size: 30px;
   }

   .overlay-effect .overlay {
       bottom: 0;
       left: 0;
       right: 0;
       width: 100%;
       height: 100%;
       opacity: 0;
   }

   .overlay-effect .overlay a.expand {
       left: 0;
       right: 0;
       bottom: 47%;
       margin: 0 auto -30px auto;
   }

   .overlay-effect .img.hover .overlay {
       height: 100%;
       opacity: 1;
   }

   .designs {
       position: absolute;
       left: 0;
       right: 0;
       margin-left: auto;
       margin-right: auto;
       top: 50px;
   }

   #portfolio .detail-page img {
       max-width: 100%;
   }

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

   #portfolio ul.portfolio-filter li {
       float: none;
       display: inline-block;
       margin-bottom: 10px;
       border: 1px solid #eee;
       box-shadow: 0 0 5px #eee;
   }

   #portfolio ul.portfolio-filter li a {
       border-radius: 0;
   }

   #portfolio ul.portfolio-filter li.active a {
       background-color: #3dc9b3;
       color: white;
   }

   #portfolio ul.portfolio-filter li a:hover {
       background-color: #3dc9b3;
       color: white;
   }

   .portfolio-item-wrapper img {
       max-width: 100%;
   }


   /* ==========================================================================
Team
========================================================================== */
   .progress {
       height: 30px;
   }

   .progress-bar {
       line-height: 30px;
   }

   .team img {
       margin-bottom: 40px;
       border-radius: 50%;
       filter: gray;
       /* IE6-9 */
       filter: grayscale(1);
       /* Firefox 35+ */
       -webkit-filter: grayscale(1);
       /* Google Chrome, Safari 6+ & Opera 15+ */
       -webkit-transition: all 0.25s;
       -moz-transition: all 0.25s;
       -o-transition: all 0.25s;
       transition: all 0.25s;
   }

   /* Disable grayscale on hover */
   .team img:hover {
       filter: none;
       -webkit-filter: grayscale(0);
   }


   ul.social-buttons {
       list-style: none;
       margin: 0;
       padding: 0;
       display: inline-block;
   }

   ul.social-buttons li {
       display: inline-block;
       margin: 7px;
   }

   ul.social-buttons li:last-child {
       /* margin-right: 0; */
   }

   #icon-section .social-btn {
       width: 2.2em;
       height: 2.2em;
       border-radius: 50%;
       -moz-border-radius: 50%;
       -webkit-border-radius: 50%;
       -o-border-radius: 50%;
       /* background: #ab755b; */
       display: inline-block;
       color: #006278;
       font-size: 1.6em;
       text-align: center;
       border: 2px solid #18443f;
       line-height: 2em;
   }

   .social-btn .fa {
       position: relative;
       line-height: 1;
       vertical-align: middle;
   }

   .social-btn:hover,
   .social-btn:focus {
       background: rgba(255, 255, 255, 0.5);
       color: #AD832D;
       border-color: #18443f;
   }

   .social {
       margin-top: 25px;
   }

   #top-bar {
       text-align: right;
       color: #18443f;
       font-size: 20px;
       line-height: 30px;
       width: 100%;
   }

   #top-bar .icon-btn {
       margin-right: 10px;
       color: #18443f;
   }

   #top-bar .icon-btn:hover {
       color: #AD832D;
   }

   #top-bar .icon-btn .fa {
       font-size: 1.3em;
       vertical-align: -3px;
   }

   #top-bar .social-buttons li {
       margin: 0 0 5px 0px;
   }

   #top-bar .social-buttons a {
       background: #18443f;
       display: inline-block;
       width: 25px;
       height: 25px;
       text-align: center;
       line-height: 23px;
       border-radius: 50%;
       font-size: 16px;
       color: #fff;
   }

   #top-bar .social-buttons a:hover {
       background: #bfdfdc;
   }

   .overlay .social-btn {
       border-color: rgba(255, 255, 255, 0.5);
       color: rgba(255, 255, 255, 0.5);
   }

   .overlay .social-btn:hover {
       border-color: #fff;
       color: #fff;
       background: rgba(0, 0, 0, 0.5);
   }

   /* ==========================================================================
Contact
========================================================================== */
   .up-btn {
       width: 50px;
       height: 50px;
       border-radius: 50%;
       -moz-border-radius: 50%;
       -webkit-border-radius: 50%;
       -o-border-radius: 50%;
       background: rgba(61, 201, 179, 0.6);
       display: block;
       margin: 0 auto;
       color: #18443f;
       font-size: 18px;
       text-align: center;
       position: absolute;
       top: -26px;
       left: 0;
       right: 0;
       margin-left: auto;
       margin-right: auto;
   }

   .up-btn .fa {
       line-height: 46px;
       color: #000;
   }

   .up-btn:hover,
   up-btn:focus {
       color: #006c6f;
       background: #b0d5d6;
   }

   .contact-details {
       margin: 70px 0;
   }

   .contact-details h2 {
       font-size: 20px;
   }

   .contact-details h2 span {
       display: block;
       color: #3dc9b3;
       text-transform: uppercase;
       letter-spacing: 1px;
       font-size: 16px;
       margin-top: 15px;
   }

   .contact-wrap {
       position: relative;
   }

   .google-map {
       /* margin-top: 50px; */
   }


   /* Isotope Animating
* -------------------------- */
   .isotope,
   .isotope .isotope-item {
       /* change duration value to whatever you like */
       -webkit-transition-duration: 0.8s;
       -moz-transition-duration: 0.8s;
       -ms-transition-duration: 0.8s;
       -o-transition-duration: 0.8s;
       transition-duration: 0.8s;
   }

   .isotope {
       -webkit-transition-property: height, width;
       -moz-transition-property: height, width;
       -ms-transition-property: height, width;
       -o-transition-property: height, width;
       transition-property: height, width;
   }

   .isotope .isotope-item {
       -webkit-transition-property: -webkit-transform, opacity;
       -moz-transition-property: -moz-transform, opacity;
       -ms-transition-property: -ms-transform, opacity;
       -o-transition-property: -o-transform, opacity;
       transition-property: transform, opacity;
   }

   /**** disabling Isotope CSS3 transitions ****/

   .isotope.no-transition,
   .isotope.no-transition .isotope-item,
   .isotope .isotope-item.no-transition {
       -webkit-transition-duration: 0s;
       -moz-transition-duration: 0s;
       -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
       transition-duration: 0s;
   }



   /* filtering portfolio */
   div.filter-categories {
       display: none;
   }

   .tags,
   #blog-tags {
       display: none;
   }

   .blog-details {
       font-size: 12px;
       color: #666;
       margin: 10px 0;
   }

   .blog-preview-img {
       float: right;
       margin: 0 0 10px 20px;
       max-width: 50%;
   }

   #icon-section {
       text-align: center;
       padding: 50px 20px;
   }

   .shade-grey {
       background: #e7e7e7;
   }


   /* ==========================================================================
Footer
========================================================================== */
   #mainfooter a {
       /* color: #a1a9b0; */
   }

   #mainfooter {
       /* background-color: #3a3a3c; */
       /* padding: 40px 0 30px; */
       /* color: #fff; */
       text-align: center;
   }

   #mainfooter p {
       color: #fff;
   }

   .contact-footer {
       margin: 10px 0;
   }

   .contact-footer li {
       margin: 5px;
       display: inline-block;
   }

   .footer-logos img {
       display: block;
       margin: 0 auto 10px;
   }

   ul.legals {
       list-style: none;
       color: #fff;
       line-height: 25px;
   }

   ul.legals li {
       display: inline-block;
   }

   ul.legals li::after {
       content: " |";
   }

   ul.legals li:last-child::after {
       content: "";
   }

   .legals {
       text-align: left;
   }

   footer nav li {
       display: inline-block;
       margin: 0px 15px 15px;
       font-size: 0.8em;
   }

   footer nav ul {
       text-align: center;
       /* margin-bottom: 20px; */
   }

   .credit {
       text-align: center;
       font-size: 10px;
       color: #79797B;
       margin-bottom: 10px;
   }

   .credit a {
       color: #777;
   }

   #faqs .panel-group {
       margin-top: 60px;
   }

   #faqs .panel-default>.panel-heading {
       background-color: #3dc9b3;
       border-color: #dddddd;
       color: white;
   }

   #faqs .panel-title>a:hover,
   #faqs .panel-title>a:focus {
       color: white;
   }

   #faqs .panel-title>a {
       display: block;
   }

   #faqs .collapse {
       visibility: visible;
   }

   #blog section {
       padding: 0 0 30px;
       margin-bottom: 30px;
       border-bottom: 1px solid #eeeeee;
   }

   #blog .image-container img {
       max-width: 100%;
   }

   #blog section:last-child {
       border: none;
   }

   #blog ul.pagination li a {
       color: #3dc9b3;
       border: none;
       border-radius: 0;
   }

   #blog ul.pagination li.active a,
   #blog ul.pagination li a:hover {
       background: #3dc9b3;
       color: white;
       border: none;
   }

   #blog .input-group-btn:last-child>.btn {
       margin-left: 0;
   }

   #blog form {
       margin: 30px 0;
   }

   .BlogTagList ul li a {
       font-size: 14px;
   }

   .BlogTagCloud a {
       padding: 5px 8px;
       display: inline-block;
       /* background: #f8f8f8; */
       /* color: #3dc9b3; */
       border: 1px solid #eeeeee;
       margin-bottom: 5px;
       font-size: 0.8em;
   }

   .BlogTagCloud a:hover {
       color: white;
       background-color: #1C70B8;
   }

   .popular-posts li {
       display: block;
       margin-bottom: 15px;
   }

   .popular-posts li small {
       display: block;
   }

   #pagination a {
       padding: 8px;
   }

   nav.navbar-default .navbar-brand {
       max-width: 240px;
       padding: 0px 0;
       height: auto;
       width: 100%;
   }

   .navbar-brand>img {
       margin-bottom: -2px;
       width: 100%;
   }

   .navbar-default .navbar-collapse,
   .navbar-default .navbar-form {
       margin-left: 30%;
   }

   @media (min-width: 768px) {
       .navbar-header {
           max-width: 30%;
       }
   }

   .navbar-default .navbar-toggle {
       background: #90cef1;
       padding: 5px;
       position: absolute;
       top: 100%;
       right: 0;
       border: 3px solid #4e4442;
       margin-top: 0;
       z-index: 1000;
       border-top: none;
       border-radius: 0 0 4px 4px;
   }


   @media (max-width: 1050px) {
       .navbar-default .navbar-nav {
           margin-top: 0;
       }
   }

   @media (max-width: 767px) {
       .navbar-toggle {
           /* margin-top: 15px; */
       }

       .navbar-default .navbar-nav {
           position: relative;
           z-index: 1;
           background: white;
       }

       .navbar-default .navbar-collapse,
       .navbar-default .navbar-form {
           border-color: transparent;
           box-shadow: none;
       }

       .navbar-default .navbar-toggle:hover,
       .navbar-default .navbar-toggle:focus {
           background: #90cef1;
           /* border: 1px solid #3dc9b3; */
           color: white;
       }

       .navbar-default .navbar-nav>.active>a,
       .navbar-default .navbar-nav>.active>a:hover,
       .navbar-default .navbar-nav>.active>a:focus .navbar-default .navbar-nav>li>a:hover,
       .navbar-default {
           color: white;
           background: #18443f;
       }

       .navbar-nav>li>a:focus {
           color: #18443f;
           background-color: transparent;
       }

       .navbar-nav>li {
           margin: 1px 0;
       }

       .navbar-default .navbar-toggle .icon-bar {

           height: 4px;
       }

       .navbar-default .navbar-toggle:hover .icon-bar {
           background-color: #AD832D;
       }

       .navbar-default .navbar-collapse {
           margin: 0 -15px;
           padding: 0;
       }

       .inner {
           padding-top: 40px;
       }

       .section-padding {
           padding: 40px 0 50px;
       }

       .title-inside {
           margin-top: 40px;
       }

       .sidebar {
           margin-top: 40px;
       }

       #contact .col-md-8 {
           margin-bottom: 80px;
       }
   }

   /* ------------------ Navigation ------------------ */

   header {
       background: #ffffff;
       font-family: 'Gotham', serif;
       position: relative;
   }


   @media screen and (min-width: 768px) {

       #home-page header {
           background: rgb(255, 255, 255, 100);
           position: absolute;
           width: 100%;
           z-index: 1000;
       }
   }

   nav.navbar-default {
       background: none;
       min-height: 40px;
   }

   #mainNavbar {
       text-align: right;
   }

   .js header nav ul {
       /* display: inline-block; */
   }

   nav ul.sm {
       display: inline-block;
   }

   /* SmartMenus Core CSS (it's not recommended editing this)
===============================================================*/

   .sm,
   .sm ul,
   .sm li {
       display: block;
       list-style: none;
       padding: 0;
       margin: 0;
       line-height: normal;
       direction: ltr;
       /* margin-left: auto; */
   }

   ul.sm li {
       position: relative;
       /* z-index:1000; */
   }

   ul.sm a {
       position: relative;
       display: block;
   }

   ul.sm a.disabled {
       cursor: default;
   }

   ul.sm ul {
       position: absolute;
       top: -999999px;
       left: -800px;
       width: 100px;
   }

   ul.sm li {
       float: left;
   }

   ul.sm-rtl {
       direction: rtl;
   }

   ul.sm-rtl li {
       float: right;
   }

   ul.sm ul li,
   ul.sm-vertical li {
       float: none;
       font-size: 13px;
   }

   ul.sm a {
       white-space: nowrap;
   }

   ul.sm ul a,
   ul.sm-vertical a {
       white-space: normal;
   }

   * html ul.sm-vertical li {
       float: left;
       width: 100%;
   }

   * html ul.sm-vertical ul li {
       float: none;
       width: auto;
   }

   *:first-child+html ul.sm-vertical>li {
       float: left;
       width: 100%;
   }

   ul.sm ul.sm-nowrap>li>a {
       white-space: nowrap;
   }

   ul.sm:after {
       content: "\00a0";
       display: block;
       font: 0/0 serif;
       clear: both;
       visibility: hidden;
       overflow: hidden;
   }

   * html ul.sm {
       height: 1px;
   }

   *:first-child+html ul.sm {
       min-height: 1px;
   }

   ul.sm li *,
   ul.sm li *:before,
   ul.sm li *:after {
       -moz-box-sizing: content-box;
       -webkit-box-sizing: content-box;
       box-sizing: content-box;
   }

   ul.sm {
       -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
   }

   /* wrapper
===============*/
   #mainnav {
       width: 100%;
       font-weight: 600;
       font-size: 14px;
       /*   padding: 0 30px;*/

       /* color: #000; */
       position: relative;
       z-index: 400;
   }

   #mainnav>a {
       display: none;
   }

   /*common styles
=======================*/
   .sm-main a,
   header nav a {
       color: #374ea2;
       font-weight: 600;
       display: block;
       text-decoration: none;
       /*padding: 0 1.2em;*/
   }

   .sm-main a:active {
       color: #000000;
       /* -webkit-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.3);
    -moz-box-shadow: inset 1px 1px 3px rgba(0,0,0,0.3);
    box-shadow: inset 1px 1px 3px rgba(0,0,0,0.3);
    background-color: #1c8d98;*/
   }

   .sm-main li:hover>a {
       color: #000000;
       /* background: none; */
       /* color: #fff; */
       /* font-weight: 800; */
   }

   /*.sm-main .subs > a:after
{
    width: 0;
    height: 0;
    border: 0.313em solid transparent;
    border-bottom: none;
    border-top-color: #5B82AD;
    content: '';
    vertical-align: middle;
    display: inline-block;
    position: relative;
    right: -0.313em;
}*/
   /* first level
==================*/

   .sm-main,
   header nav ul {
       padding: 0;
       margin: 24px 0 0;
       /* float: right; */
   }

   .sm-main>li,
   header nav li {
       height: 100%;
       display: inline-block;
   }

   .sm-main>li>a,
   header nav li a {
       height: 100%;
       line-height: 2.4em;
       text-align: left;
       font-size: 14px;
       padding: 0px 0.7em;
   }

   .sm-main li.active:not(:hover)>a {
       /* border-bottom: 2px solid #318CA5; */
       /* margin-bottom: -2px; */
       /* background-color: #1C70B8; */
       /* border-bottom: 1px solid #fff; */
       color: #000000;
       /* text-decoration: underline; */
   }

   .sm-main li:hover>a {
       /* border-bottom: 2px solid #318CA5; */
       /* margin-bottom: -2px; */
       background-color: rgba(255, 255, 255, 0.5);
       /* border-bottom: 1px solid rgba(255,255,255,0.5); */
       /* color: #86BD31; */
       /* text-decoration: underline; */
       /* margin-bottom: -1px; */
   }

   /* second level
========================*/
   .sm-main ul {
       background-color: #90cef1;
       font-weight: 400;
       /* padding: 0 !important; */
       box-shadow: 1px 1px 3px rgba(24, 68, 63, 0.5);
   }

   .sm-main ul a {
       /* border-top: 1px solid #B9C7D7; */
       /* padding: 0.5em 1.5em; */
       /* color: #333; */
   }

   /* Sub menu indicators - Smart Menu styles
===================*/
   .sm-main a span.sub-arrow {
       position: absolute;
       bottom: -6px;
       left: 50%;
       margin-left: -5px;
       /* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
       width: 0;
       height: 0;
       overflow: hidden;
       border-width: 6px;
       /* tweak size of the arrow */
       border-style: solid dashed dashed dashed;
       border-color: rgba(255, 255, 255, 0.3) transparent transparent transparent;
       color: #18443f;
       line-height: 1;
   }

   .sm-main-vertical a span.sub-arrow,
   .sm-main ul a span.sub-arrow {
       bottom: auto;
       top: 50%;
       margin-top: -5px;
       right: -4px;
       left: auto;
       margin-left: 0;
       border-style: dashed dashed dashed solid;
       border-color: transparent transparent transparent rgba(0, 0, 0, 0.3);
   }

   /* Scrolling arrows containers for tall sub menus - test sub menu:
"Sub test" -> "more..." -> "more..." in the default download package
 - Smart Menu styles
===================*/
   .sm-main span.scroll-up,
   .sm-main span.scroll-down {
       position: absolute;
       display: none;
       visibility: hidden;
       overflow: hidden;
       background: #ffffff;
       height: 20px;
       /* width and position will be automatically set by the script */
   }

   .sm-main span.scroll-up-arrow,
   .sm-main span.scroll-down-arrow {
       position: absolute;
       top: -2px;
       left: 50%;
       margin-left: -8px;
       /* we will use one-side border to create a triangle so that we don't use a real background image, of course, you can use a real image if you like too */
       width: 0;
       height: 0;
       overflow: hidden;
       border-width: 8px;
       /* tweak size of the arrow */
       border-style: dashed dashed solid dashed;
       border-color: transparent transparent #247eab transparent;
   }

   .sm-main span.scroll-down-arrow {
       top: 6px;
       border-style: solid dashed dashed dashed;
       border-color: #247eab transparent transparent transparent;
   }

   @media screen and (max-width: 1100px) {

       .sm-main a {
           /* font-size: 15px !important; */
       }

       .sm-main a {
           /* padding: 0 1em; */
       }
   }


   @media screen and (max-width: 767px) {


       /* The following will make the sub menus collapsible for small screen devices (it's not recommended editing these)
  - Smart Menu styles
==========================*/
       ul.sm-main {
           width: 100% !important;
           margin: 0;
           /* margin-bottom: 10px; */
           display: block;
       }

       ul.sm-main ul {
           background: #f3e9d5;
           display: none;
           position: static !important;
           top: auto !important;
           left: auto !important;
           margin-left: 0 !important;
           margin-top: 0 !important;
           width: auto !important;
           min-width: 0 !important;
           max-width: none !important;
       }

       ul.sm-main>li {
           float: none;
           background: none;
           border: none;
           margin: 0;
           padding: 0;
           border-top: 1px solid rgba(0, 0, 0, 0.15);
       }

       ul.sm-main>li>a,
       ul.sm-main ul.sm-nowrap>li>a {
           white-space: normal;
           /* padding-left: 22px; */
       }

       ul.sm-main iframe {
           display: none;
       }

       ul.sm-main ul li {
           border-top: 1px solid rgba(24, 68, 63, 0.5);
       }

       /* Uncomment this rule to disable completely the sub menus for small screen devices */
       /*.sm-main ul, .sm-main span.sub-arrow, .sm-main iframe {
		display:none !important;
	}*/


       /* Menu items  - Smart Menu styles
===================*/
       /* presume we have 4 levels max */
       .sm-main>li:last-child>a,
       .sm-main>li:last-child>ul>li:last-child>a,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>a,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>a,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>a,
       .sm-main>li:last-child>ul,
       .sm-main>li:last-child>ul>li:last-child>ul,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>ul,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>ul {}

       /* highlighted items, don't need rounding since their sub is open */
       .sm-main>li:last-child>a.highlighted,
       .sm-main>li:last-child>ul>li:last-child>a.highlighted,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>a.highlighted,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>a.highlighted,
       .sm-main>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>ul>li:last-child>a.highlighted {}

       /* Sub menu indicators  - Smart Menu styles
===================*/
       .sm-main a span.sub-arrow,
       .sm-main ul a span.sub-arrow {
           top: 50%;
           margin-top: -9px;
           right: 10px;
           left: auto;
           margin-left: 0;
           width: 17px;
           height: 17px;
           /* font:bold 16px/16px monospace !important; */
           text-align: center;
           border: 0;
           /* text-shadow:none; */
           /* background:rgba(0,0,0,0.1); */
           -moz-border-radius: 100px;
           /* -webkit-border-radius:100px; */
           /* border-radius:100px; */
           /* font-size: 1em; */
           /* color: rgba(0, 0, 0, 0.3); */
           /* line-height: 1; */
       }

       .sm-main a.highlighted span.sub-arrow {
           display: none !important;
       }

       .navbar .columns {
           padding: 0;
       }

       /* wrapper
===============*/
       #mainnav {
           width: 100%;
           position: static;
           margin: 0;

           /* padding-bottom: 10px; */
           /* max-height: 100%; */
           /* overflow: scroll; */
           padding-top: 3.125em;
       }

       /*menu icon
===============*/
       #mainnav>a {
           width: 3.125em;
           /* 50 */
           height: 3.125em;
           /* 50 */
           text-align: left;
           text-indent: -9999px;
           background-color: #ab755b;
           position: absolute;

           right: 0;
           top: 0;
       }

       #mainnav>a:before,
       #mainnav>a:after {
           position: absolute;
           border: 2px solid #fff;
           top: 35%;
           left: 25%;
           right: 25%;
           content: '';
       }

       #mainnav>a:after {
           top: 60%;
       }

       #mainnav:not( :target)>a:first-of-type,
       #mainnav:target>a:last-of-type {
           display: block;
       }

       #mainnav:not( :target)>.sm-main {
           display: none;
       }

       #mainnav:target>.sm-main {
           display: block;
       }

       /* first level
===================*/
       .sm-main>li {
           width: 100%;
           float: none;
       }

       .sm-main>li>a {
           height: auto;
           text-align: left;
           /* padding: 0 1.2em; */
       }

       .sm-main>li:not( :last-child)>a {
           border-right: none;
           /* border-bottom: 1px solid #DEDC03; */
           /*    margin-bottom: -1px;*/
       }

       /* second level
===================*/
       .sm-main ul {
           position: static;
           padding-top: 0;
       }

       .sm-main:not( :hover)>li.active>a:after {
           display: none;
       }

       .sm-main ul li a:hover,
       .sm-main ul:not( :hover) li.active a {
           /* background-color: #1c8d98; */
       }

       /* third level
===================*/
       .sm-main ul ul {
           border-left: 5px solid rgba(0, 0, 0, 0.1);
           /* border-top: 1px solid #80BA27; */
       }

       .fixed {
           max-height: 100%;
           overflow: auto;
       }

   }


   .sm .but {
       float: right;
   }

   .sm .but a {
       background: #318CA5;
       line-height: 2em;
       /* padding: 0; */
       margin: 2px;
       height: 28px;
       color: #fff;
       border-radius: 20px;
       font-weight: 800;
   }

   .sidenav ul {
       margin: 0;
       padding: 0;
       background: #eee;
       border-left: 3px solid #ddd;
       border-radius: 5px;
       overflow: hidden;
   }

   .sidenav ul li {
       margin: 0;
       padding: 0;
       list-style: none;
   }

   .sidenav ul li a {
       padding: 10px;
       display: block;
       font-size: 14px;

   }

   .sidenav ul li a:hover {
       background: #318CA5;
       color: #fff;

   }

   .sidenav ul li.selected a {
       background: #ddd;
   }


   /* ----- -----*/
   .feature-box {
       position: relative;
       display: inline-block;
       float: left;
       width: 100%;
       text-align: center;
   }

   .feature-box img {
       width: 100%;
   }

   .feature-box.alt,
   .align-Right {
       float: right;
   }

   .feature-box.width-Half {
       width: 50%;
   }

   .feature-box.width-Third {
       width: 33.333%;
   }

   .feature-box.width-Quarter {
       width: 25%;
   }

   .hoverover .overlay,
   .feature-box .overlay {
       background: rgba(0, 0, 0, 0.5);
       color: #fff;
       position: absolute;
       top: 0;
       left: 0;
       right: 0;
       /* text-align:center; */
       -webkit-transition: all 0.5s;
       -moz-transition: all 0.5s;
       -ms-transition: all 0.5s;
       -o-transition: all 0.5s;
       transition: all 0.5s;
       height: 0;
       opacity: 0;
       padding: 40px;
       z-index: 200;
   }

   .feature-box .title {
       position: relative;
       font-size: 1.5em;
       border-top: 1px solid #fff;
       border-bottom: 1px solid #fff;
       display: inline-block;
       vertical-align: middle;
       text-transform: uppercase;
       font-weight: 600;
       margin: 20px 0;
       line-height: 1.6;
   }

   .vspace {
       position: relative;
       height: 100%;
       vertical-align: middle;
       width: 1px;
       display: inline-block;
       /* border: 1px solid red; */
   }

   .team-profile {
       padding: 0;
       position: relative;
   }

   .team-profile img {
       width: 100%;
   }

   .hoverover:hover .overlay,
   .feature-box:hover .overlay {
       opacity: 1;
       height: 100%;
   }

   .learn-more-btn {
       background: #b27b5b;
       -webkit-box-shadow: 0px 3px 0px 0px #A1A9B0;
       -moz-box-shadow: 0px 3px 0px 0px #A1A9B0;
       box-shadow: 0px 3px 0px 0px #A1A9B0;
   }

   .learn-more-btn:hover,
   .learn-more-btn:focus {
       background: rgba(255, 237, 0, 0.6);
   }

   h2 a,
   h3 a,
   .store-contact a {
       /* color:#000; */
   }

   .light-box:hover,
   .light-box:focus {
       -webkit-box-shadow: 0px 3px 0px 0px #b27b5b;
       -moz-box-shadow: 0px 3px 0px 0px #b27b5b;
       box-shadow: 0px 3px 0px 0px #b27b5b;
   }

   ul.tagcloud-list li a:hover {
       color: white;
       background: #b27b5b;
   }

   .form-control:focus {
       border: 1px solid #b27b5b;
       -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(178, 123, 91, 0.6);
       box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(178, 123, 91, 0.6);
   }

   .btn {
       border-radius: 2px;
       background: #EDEFF2;
       /* font-family: helvetica; */
       line-height: 1.8;
       color: #000;
   }

   .btn:hover {
       background-color: #B7B7B7;
       /* color: #000; */
   }

   .btn-primary {
       background-color: #374ea2;
       border-color: #374ea2;
       color: #FFF;
       font-size: 15px;
       font-weight: 500;
   }

   .btn-primary:hover,
   .btn-primary:focus,
   .btn-primary.focus,
   .btn-primary:active,
   .btn-primary.active,
   .open>.dropdown-toggle.btn-primary {
       background-color: #000000;
       border-color: #000000;
       opacity: 1;
   }

   .btn-secondary {
       color: #353535;
   }

   .subscribe input[type=submit] {
       /* background-color: #1C70B8; */
       /* border: none; */
   }

   #blog ul.pagination li a,
   ul.tagcloud-list li a,
   .contact-details h2 span {
       color: #333;
   }

   .overlay-effect .overlay a.expand {
       color: white;
   }

   .reverse-btn:hover,
   .reverse-btn:focus {
       color: #1C70B8;
       border: solid 1px #1C70B8;
   }

   .subscribe input[type=submit]:hover {
       /* background: rgba(255, 237, 0, 0.6); */
       /* border: 1px solid blue; */
   }

   .title-inside::after {
       border: solid 2px #1C70B8;
   }

   #blog ul.pagination li.active a,
   #blog ul.pagination li a:hover,
   .icon,
   .down-arrow-btn:hover,
   .down-arrow-btn:focus,
   .up-btn:hover,
   .up-btn:focus,
   #faqs .panel-default>.panel-heading,
   #portfolio ul.portfolio-filter li.active a,
   #portfolio ul.portfolio-filter li a:hover {
       background-color: #1C70B8;
   }

   .up-btn,
   .down-arrow-btn {
       background-color: rgb(200, 215, 228);
   }

   .navbar-default .navbar-nav>li>a:hover,
   .navbar-default .navbar-nav>li>a:focus,
   .navbar-default .navbar-nav>li.active>a {
       background: #006c6f;
   }

   .BlogTagCloud a {
       color: #1C70B8;
       border: 1px solid #eeeeee;
   }

   .BlogTagCloud a:hover {
       /* color: white; */
       /* background-color: #1C70B8; */
   }

   nav.navbar-default .navbar-brand span {
       /* color: #1C70B8; */
       font-size: 1em;
       margin: 0 10px;
       color: #DADADA;
       text-shadow: 0 0 3px #E0CFD1;
   }

   .navbar-default .navbar-toggle:hover,
   .navbar-default .navbar-toggle:focus {
;
       /* border:1px solid #1C70B8; */
   }

   #pagination a {
       color: #1C70B8;
   }

   #pagination a:hover {
       color: rgba(255, 237, 0, 0.6);
   }

   @media (max-width: 767px) {

       .navbar-default .navbar-nav>.active>a,
       .navbar-default .navbar-nav>.active>a:hover,
       .navbar-default .navbar-nav>.active>a:focus .navbar-default .navbar-nav>li>a:hover,
       .navbar-default {
           background: #expectations;
       }

       .blog-preview-img {
           float: none;
           margin: 0 0 10px 0;
           max-width: 100%;
           /* width: 100%; */
       }
   }

   .log1 .loggedout,
   .log0 .loggedin,
   .log .loggedin {
       display: none;
   }

   /* ==========================================================================
Products
========================================================================== */
   .prodThumb h3 {
       margin-top: 5px;
       font-size: 1em;
   }

   .prodThumb:hover .square {
       /* box-shadow: 0 0 10px 1px #DEDC03; */
       border: 2px solid #1C70B8;
   }

   .prod-popup {
       opacity: 0;
       display: none;
       background: #444446;
       padding: 10px;
       /* border: 1px solid #aaa; */
       position: absolute;
       width: 100%;
       z-index: 100;
       bottom: 200%;
       left: 0;
       word-wrap: break-word;
       /* margin-bottom: 10px; */
       -webkit-transition: all 0.5s ease;
       -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
       transition: all 0.5s ease;
       overflow: hidden;
       z-index: 600;
       /* border: 2px solid #fff; */
       box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);
   }

   .prodThumb:hover .prod-popup {
       opacity: 1;
       bottom: 100%;
       display: block;
   }

   .prodThumb {
       width: 16%;
       /* height: 300px; */
       display: inline-block;
       padding: 10px 0;
   }

   .square {
       position: relative;
       width: 100%;
       display: block;
       background: #fff;
       border: 2px solid #eee;
   }

   .square-dummy {
       padding-top: 100%;
       /* forces 1:1 aspect ratio */
   }

   .img-square {
       position: absolute;
       top: 0;
       bottom: 0;
       left: 0;
       right: 0;
       text-align: center;
       /* Align center inline elements */
       font: 0/0 a;
   }

   .img-square .centerer {
       display: inline-block;
       vertical-align: middle;
       height: 100%;
   }

   .img-square img {
       vertical-align: middle;
       display: inline-block;
       max-height: 100%;
       /* <-- Set maximum height to 100% of its parent */
       max-width: 100%;
       /* <-- Set maximum width to 100% of its parent */
   }

   h1 .filler {
       height: 20px;
       width: 50px;
       display: inline-block;
   }

   @media (max-width: 767px) {
       .carousel-inner .item {
           height: 500px;
           padding-bottom: 50%;
       }

       .prodThumb {
           width: 100%;
           position: relative;
       }

       .prodThumb img {
           height: auto;
           min-height: 150px;
       }

       .prodThumb:hover .prod-popup {
           display: none;
       }

       .prodThumb .prod-popup {
           opacity: 1;
           bottom: 100%;
           display: none;
       }

       .prodThumb.active .square {
           display: none;
       }

       .prodThumb.active .prod-popup {
           display: block;
           position: relative;
       }

       .prodThumb h3 {
           position: absolute;
           top: 20px;
           left: 20px;
           z-index: 600;
       }

       .prodThumb.active h3 {
           color: #1C70B8;
       }

       .prod-popup img {
           width: 100%;
           text-align: center;
       }

       .square-dummy {
           padding: 0;
       }

       .img-square {
           position: relative;
           top: initial;
           left: initial;
           bottom: initial;
           right: initial;
           width: 100%;
       }


       h1 .filler {

           display: block;
       }

       .feature-box.width-Half,
       .feature-box.width-Third {
           width: 100%;
       }

       .feature-box.width-Quarter {
           width: 50%;
       }



       .hoverover .overlay,
       .feature-box .overlay {
           opacity: 1;
           position: relative;
           height: auto;
           background: #1C1C1D;
       }
   }

   #top-bar .showsearch,
   #top-bar .hidesearch {
       display: none;
   }


   @media (max-width: 600px) {
       .carousel-inner .item {
           height: 500px;
           padding-bottom: 60%;
           background-position-x: 40%;
       }

       .bigphone {
           display: none;
       }

       .smallphone {
           display: initial;
       }

       #top-bar .showsearch {
           display: inline-block;
       }

       #search-widget {
           display: none;
           color: #ccc;
       }

       #top-bar.searchopen {
           position: relative;
           margin: 5px 5px 0 30px;
           padding-top: 30px;
       }

       #top-bar.searchopen .showsearch {
           display: none;
       }

       #top-bar.searchopen .hidesearch {
           display: block;
           position: absolute;
           top: 0;
           left: -24px;
           margin: 0;
           color: #ccc;
           line-height: 1;
       }

       #top-bar.searchopen #search-widget {
           display: inline-block;
           width: 100%;
           position: absolute;
           top: 0;
           left: 0;
       }

   }

   @media (max-width: 991px) {
       .container {
           width: auto;
       }
   }

   .carousel-control .icon-prev,
   .carousel-control .icon-next {
       font-family: inherit;
       font-size: 100px;
       margin-top: -30px;
       line-height: 0.3;
       height: 60px;
       width: 50px;
       vertical-align: middle;
   }

   #home-page .hide-home {
       display: none;
   }

   #content .row>div {
       margin-bottom: 15px;
   }

   .search-result h3 {
       margin-bottom: 0;
   }

   .search-result {
       border-bottom: 1px solid #eee;

   }

   /*
  Bootstrap Carousel Fade Transition (for Bootstrap 3.3.x)
  CSS from:       http://codepen.io/transportedman/pen/NPWRGq
  and:            http://stackoverflow.com/questions/18548731/bootstrap-3-carousel-fading-to-new-slide-instead-of-sliding-to-new-slide
  Inspired from:  http://codepen.io/Rowno/pen/Afykb 
*/
   .carousel-fade .carousel-inner .item {
       opacity: 0;
       transition-property: opacity;
   }

   .carousel-fade .carousel-inner .active {
       opacity: 1;
   }

   .carousel-fade .carousel-inner .active.left,
   .carousel-fade .carousel-inner .active.right {
       left: 0;
       opacity: 0;
       z-index: 1;
   }

   .carousel-fade .carousel-inner .next.left,
   .carousel-fade .carousel-inner .prev.right {
       opacity: 1;
   }

   .carousel-fade .carousel-control {
       z-index: 2;
   }

   /*
  WHAT IS NEW IN 3.3: "Added transforms to improve carousel performance in modern browsers."
  Need to override the 3.3 new styles for modern browsers & apply opacity
*/
   @media all and (transform-3d),
   (-webkit-transform-3d) {

       .carousel-fade .carousel-inner>.item.next,
       .carousel-fade .carousel-inner>.item.active.right {
           opacity: 0;
           -webkit-transform: translate3d(0, 0, 0);
           transform: translate3d(0, 0, 0);
       }

       .carousel-fade .carousel-inner>.item.prev,
       .carousel-fade .carousel-inner>.item.active.left {
           opacity: 0;
           -webkit-transform: translate3d(0, 0, 0);
           transform: translate3d(0, 0, 0);
       }

       .carousel-fade .carousel-inner>.item.next.left,
       .carousel-fade .carousel-inner>.item.prev.right,
       .carousel-fade .carousel-inner>.item.active {
           opacity: 1;
           -webkit-transform: translate3d(0, 0, 0);
           transform: translate3d(0, 0, 0);
       }
   }

   #content {
       max-width: 100%;
       overflow: auto;
       z-index: 40;
   }

   /*  .banner-overlay .container {
       padding-bottom: 30px;
   } */
   .banner-overlay img {
       /* width: 70px; */
       margin-bottom: 0;
   }

   .banner-overlay .btn {
       margin-left: 20px;
   }

   @media screen and (min-width: 768px) {
       .banner-overlay img {
           width: auto;
           margin-bottom: 0;
           /* width: 100px; */
       }
   }

   @media screen and (min-width: 1024px) {
       .banner-overlay img {
           width: auto;

       }
   }

   .loading-image {

       opacity: 1;
       transition: .3s opacity;
   }

   .carousel.video {
       position: absolute;
       top: 0;
       left: 0;
       width: 100%;

   }

   #banner {
       max-height: 600px;
   }

   .loading-image.hideEl {
       opacity: 0;

       transition: .3s opacity;
   }

   .slider {

       opacity: 1;
       transition: .3s opacity;
   }

   .slider.hideEl {
       opacity: 0;
       transition: .3s opacity;

   }

   video {
       object-fit: cover;
       width: 100%;
       height: 700px;
   }
   .banner-overlay .btn {
       margin-top: 20px;
       margin-bottom: 20px;
   }