/*
    Theme Name: 4Display
    Description: Child theme of Genesis, by <a href="http://www.limecanvas.com/">Lime Canvas</a>.
    Author: Lime Canvas
    Author URI: http://www.limecanvas.com
    Version: 1.0.0
    
    Template: genesis

    License: GPL-2.0+
    License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

@import url(http://fonts.googleapis.com/css?family=Lato:400,300italic,300,400italic,700,700italic,900,900italic); /*font-family: 'Lato', sans-serif;*/
@import url(https://fonts.googleapis.com/css?family=Roboto:400,400italic,300italic,300,500,500italic,700,700italic); /*font-family: 'Roboto', sans-serif;*/


/* # Body
---------------------------------------------------------------------------------------------------- */

body {
  font-family: 'Lato', sans-serif !important;
  font-size:14px !important;
  font-weight: normal !important;
  color: #252525 !important;
  overflow-x:hidden;
}

body.displaysystems-page .site-inner {
    padding:0;
}

body.single-portfolio-page #page-title-block {
    height: 300px;
}

body.single-displaysystem-page #page-title-block {
    height: 377px;
    margin-bottom: 30px;
    padding: 0 !important;
    background-position: center top;
    background-size: 100% 100%;
    background-color: #cacbce;
}

body.single-portfolio-page #masonry {
    max-width:1140px;
    margin:30px auto;
}

body.single-portfolio-page .masonry .item.thumbnail { 
    width:  284px;
    height: 285px;
}

body.single-portfolio-page .masonry .item.medium { 
    width:  568px;
    height: 285px;
}

body.single-portfolio-page .masonry .item.full { 
    width:  auto;
    height: 285px;
}

body > div {
    font-size:14px !important;
}

.site-inner, .wrap {
    max-width: 1170px !important;
}

/* # Header
---------------------------------------------------------------------------------------------------- */

.site-header {
     min-height: 0 !important;
     border-bottom: 1px solid #dbdbdb;
}

.site-header .wrap {
     padding:7px 0 5px !important;
}

.site-header .title-area {
     width:auto !important;
     padding:0 !important;
}

.site-header .title-area a img:hover {
  filter: brightness(120%);
  -webkit-filter: brightness(120%);
  transition: all 1s ease 0s;
}


/* # Bootstrap Navigation
---------------------------------------------------------------------------------------------------- */

.navbar-default {
    clear: none;
    float: right;
    z-index: 9999;
    background: none !important;
    border:none !important;
    box-shadow: none !important;
    margin:15px 0 0 0 !important;
 }

.navbar .nav-collapse {
    position: relative;
    left: 0;
    display: block;
    float: left;
}

.navbar .container {
    width:auto;
}

.navbar .nav > li {
    float: left;
    margin:0 15px;
} 

.navbar .nav > li > a {
    color: #252525;
    display: block;
    font-weight: 700;
    padding: 7px 10px;
    position: relative;
    font-size:16px;
    text-decoration: none;
    transition: color 0.25s ease-in 0s;
    font-family: 'Roboto', sans-serif;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.navbar .nav .dropdown-toggle .caret {
    margin-top: 8px;
}

.navbar .nav > li > a:focus,
.navbar .nav > li > a:hover {
    background: none;
    color: #8cc641;
    transition: color 0.25s ease-in 0s;
    text-decoration: none;
}

.navbar .nav > .active > a,
.navbar .nav > .active > a:hover,
.navbar .nav > .active > a:focus {
    background: none;
    color: #8cc641;
    transition: color 0.25s ease-in 0s;
}

.navbar li.active a, .navbar li.active a:hover {
     background: none;
}

.navbar .btn-navbar {
    display: none;
    top:5px;
    right: 0;
    padding: 7px 10px !important;
    margin-right: 5px;
    margin-left: 15px;
    color: #ffffff;
    background: #8cc641;
    box-shadow: none !important;
    z-index: 9999;
    position: absolute;
}

.navbar .btn-navbar:hover,
.navbar .btn-navbar:focus,
.navbar .btn-navbar:active,
.navbar .btn-navbar.active,
.navbar .btn-navbar.disabled,
.navbar .btn-navbar[disabled] {
    color: #8cc641 !important;
    background-color: #f2f2f2 !important;
    border: 2px solid #f2f2f2 !important;
}

.navbar .btn-navbar .icon-bar {
    display: block;
    width: 18px;
    height: 2px;
    background-color: #fff;
    -webkit-border-radius: 1px;
     -moz-border-radius: 1px;
          border-radius: 1px;
    -webkit-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
     -moz-box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
          box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

.navbar .btn-navbar:hover .icon-bar,
.navbar .btn-navbar:focus .icon-bar,
.navbar .btn-navbar:active .icon-bar {
    background-color: #8cc641;
}

.btn-navbar .icon-bar + .icon-bar {
    margin-top: 3px;
}

.nav-collapse .dropdown-menu a {
     padding:5px 10px;
     display: block;;
     color: #252525 !important;
     -webkit-border-radius: 0px !important; 
    -moz-border-radius: 0px !important; 
     border-radius: 0px !important; 
    text-shadow:none !important;
    font-weight: normal !important;
    margin:0 !important;
}


.nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus { 
    color:#fff;
    background: #8cc641 !important;
    -webkit-border-radius: 0px !important; 
    -moz-border-radius: 0px !important; 
    border-radius: 0px !important; 
}

.nav-collapse.collapse {
    display: block;
}

.collapse.in {
    height: auto !important;
}

/* # Slider
---------------------------------------------------------------------------------------------------- */

#slider {
     clear:both;
     overflow: hidden;
}

#slider .slidertitlewhite {
    background: url(images/blacktransparent.png) repeat;
    padding: 20px 10px 5px;
    width: 255px;
    max-width: none !important;
    text-align: center;
}

#slider .small_light_white {
    background: url(images/blacktransparent.png) repeat;
    padding: 5px 10px 20px !important;
    width: 255px;
    max-width: none !important;
    text-align: center;
}

body #slider .tp-caption.slidertitleblack, body #slider .slidertitleblack {
	font-family: 'Lato', sans-serif !important;
	font-weight: 700 !important;
}

body #slider .tp-caption.slidertitlewhite, body #slider .slidertitlewhite {
	font-family: 'Lato', sans-serif !important;
	font-weight: 700 !important;
}

body #slider .tp-caption.smalllightgray, body #slider .smalllightgray {
	font-family: 'Lato', sans-serif !important;
}	

body #slider .tp-caption.small_light_white, body #slider .small_light_white {
	font-family: 'Lato', sans-serif !important;
}

body #slider a img:hover {
	filter: brightness(120%);
    -webkit-filter: brightness(120%);
    transition: all 1s ease 0s !important;
}

/* # HomePage Content
---------------------------------------------------------------------------------------------------- */

body.home-page .site-inner {
  display: none;
}

#page-title-block {
    clear:both;
    overflow: hidden;
    height: 229px;
    width:100%;
    -webkit-background-size: 100%;
    -moz-background-size: 100%;
    -o-background-size: 100%;
    background-size: 100%;
    background-position: center top;
    background-repeat: no-repeat;
    color:#fff;
    text-align: center;
    padding:70px 0 20px 0;
    background-color: #252525;
}

#page-title-block h1 {
    font-weight: 700;
    font-family: 'Lato', sans-serif;
    font-size:34px;
    margin:0 0 10px 0;
}

#page-title-block .sub-title {
    max-width:430px;
    margin:0 auto; 
    font-size:16px;
    line-height: 20px;
}

#page-title-block .sub-title img {
    display: block;
    margin:20px auto 0;
}

#page-title-block .sub-title a img:hover {
    filter: brightness(120%);
    -webkit-filter: brightness(120%);
    transition: all 1s ease 0s;
}

#page-title-block .portfolio-icon {
    clear:both;
    margin:0 0 10px 0;
}

#page-title-block .portfolio-icon img {
    display: block;
    margin:0 auto;
}

/*entry content*/

.entry {
    padding:0 !important;
}

.entry h1, .entry h2 {
    margin:0 0 30px 0;
}

.middle-content {
    max-width:450px;
    margin:0 auto 40px auto;
    font-size:16px;
    color: #7e8a94;
    text-align: center; 
}

.featured-content {
    padding:50px 10px;
    color: #7e8a94;
}

.featured-content h2, .featured-content h3 {
    color: #252525;
    margin:0 0 20px 0;
}

.featured-content p {
    margin-bottom: 20px;
}

.bar-content {
    padding:40px 25% 20px 0;
    background:#dcebe8;
}

.bar-content h2, .bar-content h3 {
    margin-bottom: 20px;
    color: #252525;
}

#content-block-1 {
    clear: both;
    overflow: hidden;
    color: #7e8a94;
    font-size:0;
    line-height: 0;
}

#content-block-1 .container {
    font-size: 14px;
    line-height: 1.42857;
}

#content-block-1 .content-block-title {
    text-align: center;
    padding:25px 10px;
    background:#dcebe8;
}

#content-block-1 .content-block-title h2 {
    margin:0;
    font-size:26px;
    color: #252525;
    font-weight: 700;
    line-height: 26px;
}

#content-block-2 {
    background:#fff;
    clear: both;
    overflow: hidden;
    color: #7e8a94;
    padding:25px 0;
}

#content-block-2 .content-block-title {
    text-align: center;
    padding:25px 10px;
}

#content-block-2 .content-block-title h2 {
    margin:0;
    font-size:26px;
    color: #252525;
    font-weight: 700;
    line-height: 26px;
}


#content-block-3 {
    clear: both;
    overflow: hidden;
    background: #f8faf9;
    color: #303030;
    padding:25px 0;
}

#content-block-3 .content-block-title {
    text-align: center;
    padding:25px 10px;
    background:url(images/strikebg.jpg) repeat-x left center;
    max-width:650px;
    margin:0 auto 20px;
}

#content-block-3 .content-block-title h2 {
    margin:0;
    font-size:26px;
    color: #252525;
    font-weight: 700;
    line-height: 26px;
    padding:0 20px;
    background:#f8faf9;
    text-transform: uppercase;
    display: inline-block;
}

#content-block-4 {
    background:#dcebe8;
    clear: both;
    overflow: hidden;
    color: #252525;
    padding:25px 0 0;
}

#content-block-4 .content-block-title {
    text-align: center;
    padding:25px 10px;
}

#content-block-4 .content-block-title h2 {
    margin:0;
    font-size:26px;
    color: #252525;
    font-weight: 700;
    line-height: 26px;
    text-transform: uppercase;
}

#content-block-4 .container {
    padding-bottom: 40px;
}

#content-block-4 .content-block-bottom {
    clear:both;
    overflow: hidden;
    background:#fff;
    padding:50px 0 40px;
}

#content-block-4 .content-block-bottom .container {
    padding-bottom: 0;
    position: relative;
}

/*variety list*/

#variety-list {
    clear:both;
    overflow: hidden;
    text-align: center;
    color: #252525;
    margin-bottom: 20px;
}

#variety-list div {
    padding:0;
}

#variety-list img {
  margin-bottom: 15px;
}

#variety-list .rotate:hover {
    transform: rotate(360deg);
    -ms-transform: rotate(360deg); /* IE 9 */
    -webkit-transform: rotate(360deg); /* Safari and Chrome */
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s  ease-in-out;
    -o-transition: all .3s  ease-in-out;
    -ms-transition: all .3s  ease-in-out;
    transition: all .3s ease-in-out;
}

/*testimonials*/

#testimonials {
    clear:both;
    overflow: hidden;
    padding-bottom: 30px;
}

#testimonials #testimonial-1 {
    padding-right: 80px;
    padding-bottom: 30px;
}

#testimonials #testimonial-2 {
    padding-left: 80px;
    padding-bottom:30px;
}


#testimonials .testimonial-excerpt {
    clear:both;
    margin:0 0 20px 0;
    line-height: 24px;
    font-size:14px;
}

#testimonials .testimonial-thumb {
    float:left;
    margin:0 20px 20px 0;
}

#testimonials .testimonial-thumb img {
    max-height: 70px;
    width:auto;
}

#testimonials .testimonial-author {
    float:left;
    font-size:16px;
    color:#303030;
    padding:25px 0;
}

#testimonials .testimonial-author span {
    display: block;
    clear: both;
    color: #7e8a94;
}

#testimonials .carousel-inner {
  padding-bottom: 20px;
}

#testimonials .carousel-control.left {
    background: url(images/carousel-left-arrow.png) no-repeat left top !important;
    width:40px !important;
    height: 32px;
    border:1px solid #7e8a94;
    font-size:0;
    left:46% !important;
    bottom: 0 !important;
    top:auto !important;
    transition: all .5s ease 0s;
}

#testimonials .carousel-control.right {
    background: url(images/carousel-right-arrow.png) no-repeat left top !important;
    width:40px !important;
    height: 32px;
    border:1px solid #7e8a94;
    font-size:0;
    right:46% !important;
    bottom: 0 !important;
    top:auto !important;
    transition: all .5s ease 0s;
}

#testimonials .carousel-control.left:hover {
    background: #8cc641 url(images/carousel-left-arrow.png) no-repeat left top !important;
}

#testimonials .carousel-control.right:hover {
    background: #8cc641 url(images/carousel-right-arrow.png) no-repeat left top !important;
}

/*masonry*/

#masonry,
#masonry1,
#masonry2,
#masonry3,
#masonry4,
#masonry5,
#masonry6,
#masonry7,
#masonry8,
#masonry9 {
    clear:both;
    overflow: hidden;
    max-width:1376px;
    margin:0 auto;
    position: relative;
}

.masonry .item {
    width:  272px;
    height: 275px;
    float: left;
    background: #000 url(images/cross-icon-hover.png) no-repeat center center;
    overflow: hidden;
}

.masonry .item p {
	margin: 0 !important;
}

.masonry .item img {
    margin:0;
    max-width: 100%;
    min-height: 284px; 
    transition: all 0.5s ease 0s;
    -webkit-transition: all 0.5s ease 0s;
    -moz-transition: all 0.5s ease 0s;
    -o-transition: all 0.5s ease 0s;
}

    .home-page .masonry .item img { 
        width:  100%;
    }

.masonry .item a img:hover {
    opacity: 0.3;
    filter: alpha(opacity=30); /* For IE8 and earlier */
}

.masonry .large a img:hover {
    opacity: 0.3;
    filter: alpha(opacity=30); /* For IE8 and earlier */
}

.masonry .item.thumbnail { 
    width:  274px;
    height: 274px;
}

.masonry .item.medium { 
    width:  549px;
    height: 274px;
}

.masonry .item.large { 
    width:  274px;
    height: 548px;
}

.masonry .item.full { 
    width:  auto;
    height: 274px;
}

.masonry .item.thumbnail { 
    background: #000 url(images/cross-icon-hover.png) no-repeat center center;
    border-radius: 0px !important;
    border:none !important;
    padding:0 !important;
    margin:0 !important;
    box-shadow: none !important;
    line-height: 0 !important;
}

.portfolio-tab .masonry .item {
    width:  284px;
    height: 284px;
    float: left;
}

.portfolio-tab .masonry .item.thumbnail { 
    width:  284px;
    height: 284px;
}

.portfolio-tab .masonry .item.medium { 
    width:  568px;
    height: 284px;
}

.portfolio-tab .masonry .item.large { 
    width:  284px;
    height: 568px;
}

.portfolio-tab .masonry .item.full {
    width:  auto;
    height: 284px;
    max-width: 1136px;
}

.image-hover-link {
    position: absolute;
    width:100%;
    height: 100%;
    z-index: 9;
    display: none;
    top:0;
    left:0;
    opacity: 0.5;
    right:0;
}

.item:hover .image-hover-link  {
    display: block;
}

.image-hover-link:hover {
    opacity: 100;
    transition: opacity 1s ease-in-out;
   -moz-transition: opacity 1s ease-in-out;
   -webkit-transition: opacity 1s ease-in-out;
    background: url(images/blacktransparentbg.png) repeat 0 0;
}

.image-hover-link .hover-content {
    height: 100%;
    padding: 5%;
    position: relative;
    width: 100%;
}

.image-hover-link .hover-content .hover-content-border {
    display: block;
    position: relative;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    height: 100%;
}

.image-hover-link .hover-content .hover-content-border a {
    display:inline-block;
    position: absolute;
    text-align: center;
    top: 40%;
    left: 40%;
}

    .thumbnail .image-hover-link .hover-content .hover-content-border a {
        left: 30%;
    }

.image-hover-link .hover-content a:hover {
    text-decoration: none;
}

.fullwidth-masonry {
    max-width: 100% !important;
    margin:0 !important;
    overflow: auto !important;
    font-size: 0;
    line-height: 0;
}

.fullwidth-masonry .item {
    width:20% !important;
}

.fullwidth-masonry .item img {
    image-rendering: auto;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
}

.fullwidth-masonry .item.large {
    width:20% !important;
}

.fullwidth-masonry .item.thumbnail {
    width:20% !important;
    display: inline-block;
}

.fullwidth-masonry .item.medium {
    width:40% !important;
}



/*callus bottom*/

#callus {
    position: relative;
    overflow: hidden;
    clear: both;
}

#callus .container {
    position: relative;
}

#callus p {
    margin:0;
}

#callus .bottom-phone {
    float:right; 
    margin:0;
}

#callus .bottom-phone:hover {
    filter: brightness(120%);
    -webkit-filter: brightness(120%);
    transition: all 1s ease 0s;
}

/*single system carousel*/

#single-system-carousel-block {
    position: relative;
    clear: both;
    margin:0 0 110px 0;
    background: #141414;
}

#single-system-carousel-block .system-carousel {
    text-align: center;
}

#single-system-carousel-block .system-carousel p {
    font-size:0;
    line-height: 0;
    margin: 0;
}

#single-system-carousel-block .system-carousel img {
    display: inline-block;
    margin:0 -2px;
    width: 100%;
    image-rendering: auto;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
}

#single-system-carousel-block .carousel-control {
    background: none !important;
    top:45% !important;
    bottom: auto !important;
    opacity: 100 !important;
    font-size:30px !important;
    width:20% !important;
}

#single-system-carousel-block .indicator-wrapper {
    display: block;
}

#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar {
    width: 1em;
}

#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar-button {
    background-color: #000;
}
 
#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #000;
}
 
#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar-thumb {
    background-color: #252525;
    outline: 1px solid #252525;
}

#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar-thumb:hover, .tabs .container::-webkit-scrollbar-thumb:active {
    background-color:#8cc641;
    outline: 1px solid #8cc641;
}

#single-system-carousel-block .indicator-wrapper::-webkit-scrollbar-corner {
    background-color: #252525;
} 

#single-system-carousel-block .carousel-inner {
    border-bottom: 1px solid #e8eae9;
    border-top:1px solid #e8eae9;
}

#single-system-carousel-block .carousel-indicators {
    margin:0 !important;
    bottom: -64px !important;
    width:auto !important;
    left:auto !important;
    width:100% !important;
    border-bottom: 1px solid #e9e8ec;
    border-top:1px solid #e9e8ec;
}

#single-system-carousel-block .carousel-indicators li {
    text-indent: 0 !important;
    background: none !important;
    color: #bdbdbd;
    width:auto !important;
    height: auto !important;
    text-transform: uppercase;
    border:none !important;
    padding:20px 45px !important;
}

#single-system-carousel-block .carousel-indicators li:hover {
    color: #252525;
}

#single-system-carousel-block .carousel-indicators .active {
    width:auto !important;
    height: auto !important;
    color: #252525;
}

/*tabs*/
.tabs{
    width:100%;
    display:inline-block; 
    clear: both;
}

.tabs .tab-links {
    margin:0;
    padding:0;
    text-align: center;
}

.tabs .tab-links:after{
    display:block;
    clear:both;content:'';
}

.tabs .tab-links li{
    margin:0px;
    float:left;
    list-style:none;
}

.tabs .tab-links a{
    padding:20px 45px;
    display:inline-block;
    background:#fff;
    font-size:15px;
    text-transform: uppercase;
    font-weight:normal;
    line-height: 18px;
    color:#252525;
    transition:all linear 0.15s;
    text-decoration: none;
}

    .portfolio-tab .tabs .tab-links a {
        padding:40px 29.5px;
        text-transform: capitalize;
    }

.tabs .tab-links a:hover{
    background:#ecf2f2;
    text-decoration:none;
    color:#252525;
}

.tabs li.active a,.tabs li.active a:hover{
    background:#ecf2f2;
    color:#252525;
}

.tabs .tab-content {
    background:#ecf2f2;
    padding:35px 0;
    color: #7e8a94;
    border-top:1px solid #e9e8ec;
    border-bottom:1px solid #e9e8ec;
}

    .portfolio-tab .tabs .tab-content {
        background:none;
        border:none;
        padding:0;
    }

.tabs .tab-content .caption {
    padding:50px 0 20px 0;
}

.tabs .tab-content h2, .tabs .tab-content h3 {
    font-size:28px;
    line-height: 30px;
    font-weight: 700;
    color: #252525;
    margin:0 0 25px 0;
}

.tabs .tab-content p {
    margin:0 0 20px 0;
}

.tabs .tab{
    display:none;
}

.tabs .tab.active{
    display:block;
}

/*modal*/
.modal {
    top:13% !important;
}

.modal-title {
    font-weight: 700;
}

.modal-body {
    overflow: hidden;
    color: #7e8a94;
    padding:40px 25px 20px!important;
    font-weight: normal;
    line-height: 20px;
}

.modal-body p {
    font-weight: normal !important;
}

.modal-body label {
    display: none !important;
}

.modal-body .gform_wrapper {
    margin-top: 0 !important;
}

.modal-body .gform_wrapper .gform_footer {
    text-align: right;
}

/*boxes*/

div.dark-bar {
    background:#dcebe8;
    color: #7e8a94;
    margin: 0 -9999rem;
  /* add back negative margin value */
    padding: 0 9999rem;
    overflow: hidden;
    clear:both;
    margin-bottom:40px;
}

div.gray-bar {
    background:#f9fbfa;
    color: #7e8a94;
    margin: 0 -9999rem;
  /* add back negative margin value */
    padding: 40px 9999rem 30px;
    overflow: hidden;
    clear:both;
    border-bottom: 1px solid #e9e8ec;
    border-top:1px solid #e9e8ec;
}

div.gray-bar h2, div.gray-bar h3 {
    color:#252525;
    font-weight: 700;
    margin:0 0 20px 0;
    font-family: 'Lato', sans-serif;
}

div.gray-bar p {
    margin:0 0 20px 0;
}

div.gray-bar .caption {
    padding:40px 10% 0 0;
}

div.white-bar {
    background:#fff;
    color: #7e8a94;
    margin: 0 -9999rem;
  /* add back negative margin value */
    padding: 40px 9999rem 30px;
    overflow: hidden;
    clear:both;
}

div.white-bar h2, div.white-bar h3 {
    color:#252525;
    font-weight: 700;
    margin:0 0 20px 0;
    font-family: 'Lato', sans-serif;
}

div.white-bar p {
    margin:0 0 20px 0;
}

div.white-bar .caption {
    padding:40px 0 0 10%;
}

/*forms*/

input[type="email"],
input[type="number"],
input[type="password"],
input[type="tel"],
input[type="text"],
input[type="url"] {
    border:1px solid #cecfcf !important;
    padding:10px 15px !important;
    color:#7e8a94 !important;
    font-weight: normal;
}

textarea {
    border:1px solid #cecfcf !important;
    padding:10px 15px !important;
    color:#7e8a94 !important;
    font-weight: normal;
}

button,  
input[type="button"], 
input[type="reset"], 
input[type="submit"], 
.button {
    color:#fff !important;
    font-weight: 700 !important;
    font-size:14px !important;
    line-height: 16px !important;
    text-decoration: none;
    border:2px solid #8cc641 !important;
    background: #8cc641 !important;
    padding:7px 25px !important; 
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    display: inline-block;
    transition:all linear 0.15s !important;
    -webkit-transition: all linear 0.15s !important;
    -moz-transition: all linear 0.15s !important;
    -o-transition: all linear 0.15s !important;
}

button:hover, 
input[type="button"]:hover, 
input[type="reset"]:hover, 
input[type="submit"]:hover, 
.button:hover {
    text-decoration: none;
    color:#2d2d2d !important;
    border:2px solid #8cc641 !important;
    background: #fff !important;
}

button:focus, 
input[type="button"]:focus, 
input[type="reset"]:focus, 
input[type="submit"]:focus, 
.button:focus {
    text-decoration: none;
    color:#2d2d2d !important;
    border:2px solid #8cc641 !important;
    background: #fff !important;
}

/*buttons*/
.learn-more-button {
    color:#8cc641;
    font-weight: 700;
    font-size:14px;
    line-height: 16px;
    text-decoration: none;
    border:2px solid #8cc641;
    padding:7px 25px; 
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    display: inline-block;
    transition:all linear 0.15s !important;
    -webkit-transition: all linear 0.15s !important;
    -moz-transition: all linear 0.15s !important;
    -o-transition: all linear 0.15s !important;
    vertical-align: text-top;
}

.learn-more-button:hover, .learn-more-button:focus {
    text-decoration: none;
    color:#252525;
    border:2px solid #252525;
}

.view-more-button {
    color:#8cc641;
    font-weight: 700;
    font-size:14px;
    line-height: 16px;
    text-decoration: none;
    border:2px solid #8cc641;
    padding:7px 25px; 
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    display: inline-block;
    transition:all linear 0.15s !important;
    -webkit-transition: all linear 0.15s !important;
    -moz-transition: all linear 0.15s !important;
    -o-transition: all linear 0.15s !important;
    vertical-align: text-top;
}

.view-more-button:hover, .view-more-button:focus {
    text-decoration: none;
    color:#252525;
    border:2px solid #252525;
}

.view-all-button {
    color:#fff;
    font-weight: 700;
    font-size:14px;
    line-height: 16px;
    text-decoration: none;
    border:2px solid #fff;
    padding:7px 25px; 
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    display: inline-block;
    transition:all linear 0.15s !important;
    -webkit-transition: all linear 0.15s !important;
    -moz-transition: all linear 0.15s !important;
    -o-transition: all linear 0.15s !important;
    vertical-align: text-top;
}

.view-all-button:hover, .view-all-button:focus {
    text-decoration: none;
    color:#8cc641;
    border:2px solid #8cc641;
}

.white-button {
    color:#252525 !important;
    font-weight: 700 !important;
    font-size:14px !important;
    line-height: 16px !important;
    text-decoration: none;
    border:2px solid #8cc641 !important;
    background: #fff !important;
    padding:7px 25px !important; 
    border-radius: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    display: inline-block;
    transition:all linear 0.15s !important;
    -webkit-transition: all linear 0.15s !important;
    -moz-transition: all linear 0.15s !important;
    -o-transition: all linear 0.15s !important;
}

.white-button:hover, .white-button:focus {
    text-decoration: none;
    color:#fff !important;
    border:2px solid #252525 !important;
    background: #8cc641 !important;
}


/*elements*/
.no-margin {
    margin:0 !important;
}

.green {
    color:#8cc641 !important;
}

.gray {
    color: #7e8a94 !important;
}

.bold {
    font-weight: 700 !important;
}

.semibold {
    font-weight: 600 !important;
}

/* # Footer Content
---------------------------------------------------------------------------------------------------- */

.site-footer {
    background:#636363 !important;
    color: #fff;
    padding:40px 0;
    text-align: left !important;
    font-weight: 300;
    line-height: 18px !important;
    font-size:14px !important;
}

.site-footer h3, .site-footer h4 {
    font-weight: 300;
    font-size:20px;
    color:#fff;
    margin:0 0 20px 0;
}

.site-footer .col-md-3 .menu {
    padding:0;
    margin:0;
}

.site-footer .col-md-3 .menu li {
    list-style: none;
    display: block;
    margin:0 0 10px 0;
}

.site-footer .col-md-3 .menu li a {
    font-weight: 300;
    color:#fff;
    text-transform: uppercase;
    font-size:14px;
}

.site-footer .col-md-3 .menu li a:hover {
    text-decoration: underline;
    color:#fff;
}

.site-footer .col-md-6 .menu {
    padding:0;
    margin:5px 0;
    text-align: center;
}

.site-footer .col-md-6 .menu li {
    list-style: none;
    display: inline-block;
    margin:0 0 10px 0;
}

.site-footer .col-md-6 .menu li a {
    font-weight: 300;
    color:#fff;
    text-transform: uppercase;
    font-size:14px;
    padding:0 15px;
}

.site-footer .col-md-6 .menu li a:hover {
    text-decoration: underline;
    color:#fff;
}

.site-footer .sagepay-logo {
    height: 62px;
    width:auto;
    margin: 0;
    padding:10px;
    background: #fff;
}


/* # Media Queries
---------------------------------------------------------------------------------------------------- */

@media only screen and (min-width: 1200px) and (max-width: 1280px) {


} 

@media only screen and (min-width: 1024px) and (max-width: 1199px) {

    .site-header .wrap {
        padding: 7px 15px 5px !important;
    }

    .tabs .tab-links a {
        padding: 20px 32px !important;
    }

    .portfolio-tab .tabs .tab-links a {
        padding: 20px 18.5px !important;
    }

    #single-system-carousel-block .carousel-indicators li {
        padding: 20px 36px !important;
    }

    .button {
        margin-bottom: 15px;
    }

} 

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

    .site-header .wrap {
        padding:60px 0 0 0 !important;
    }

    .navbar {
        min-height: 0 !important;
        float:none;
        margin:0 !important;
        background: #252525 !important;
        border-radius: 0px !important;
        position: fixed !important;
        top: 0; 
        width: 100%;
    }

    .navbar .nav-collapse {
        margin:40px 0 0;
        float:none;
        background: #000;
    }

    .navbar .nav > li {
        margin:0;
    }

    .nav-collapse .nav {
        margin:0 !important; 
    }

    .nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a {
        border-radius: 0px !important;
        transition:all linear 0.15s !important;
        -webkit-transition: all linear 0.15s !important;
        -moz-transition: all linear 0.15s !important;
        -o-transition: all linear 0.15s !important;
        margin:0 !important;
        font-size:14px;
    }

    .nav-collapse .nav > li > a:hover, .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus {
        background:#f2f2f2;
        transition:all linear 0.15s !important;
        -webkit-transition: all linear 0.15s !important;
        -moz-transition: all linear 0.15s !important;
        -o-transition: all linear 0.15s !important;
        border-radius: 0px;
    }

    .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus {
        background:#f2f2f2;
    }

    .navbar .btn-navbar {
        right:auto;
        left:0;
    }

    .site-header .title-area {
        width:100% !important;
        clear:both;
        margin:20px 0 40px 0;
    }

    .tabs .container {
        padding:0;
    }

    .tabs .tab-links li {
        
    }

    .tabs .tab-links a {
        padding: 20px 19px;
    }

    .portfolio-tab .tabs .tab-links a {
        padding: 30px 8.5px;
        font-size:14px;
    }

    .tabs .tab-content .caption {
        padding-top: 0;
    }

    div.gray-bar .caption {
        padding:30px 0 0 0;
    }

     div.white-bar .caption {
        padding:30px 0 0 0;
    }

     .fullwidth-masonry .item {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.large {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.thumbnail {
        height: auto !important;
        width: 19.8% !important;
    }

    .fullwidth-masonry .item.medium {
        height: auto !important;
        width: 40% !important;
    }

    #variety-list p {
        margin-bottom: 30px;
    }

    #testimonials #testimonial-1 {
        padding-right: 15px;
    }

    #testimonials #testimonial-2 {
        padding-left: 15px;
    }

    #testimonials .carousel-inner {
        padding-bottom: 30px !important;
    }

    #testimonials .carousel-control.right {
        right:20% !important;
    }

    #testimonials .carousel-control.left {
        left:20% !important;
    }

    #single-system-carousel-block .carousel-indicators li {
        padding: 20px 25px !important;
    }

    .site-footer {
        text-align: center !important;
    }

    .site-footer .col-md-3 {
        margin-bottom: 40px;
    }

    .button {
        margin-bottom: 15px;
    }

}

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

    body {
        padding:0 !important;
    }

   .site-header .wrap {
        padding:60px 0 0 0 !important;
    }

    .navbar {
        min-height: 0 !important;
        float:none;
        margin:0 !important;
        background: #252525 !important;
        border-radius: 0px !important;
        position: fixed !important;
        top: 0; 
        width: 100%;
    }

    .navbar .nav-collapse {
        margin:40px 0 0;
        float:none;
        background: #000;
    }

    .navbar .nav > li {
        margin:0;
    }

    .nav-collapse .nav {
        margin:0 !important; 
    }

    .nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a {
        border-radius: 0px !important;
        transition: all linear 0.15s;
        -webkit-transition: all linear 0.15s;
        -moz-transition: all linear 0.15s;
        -o-transition: all linear 0.15s;
        margin:0 !important;
        font-size:14px;
    }

    .nav-collapse .nav > li > a:hover, .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus {
        background:#f2f2f2;
        transition: all linear 0.15s;
        -webkit-transition: all linear 0.15s;
        -moz-transition: all linear 0.15s;
        -o-transition: all linear 0.15s;
        border-radius: 0px;
    }

    .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus {
        background:#f2f2f2;
    }

    .navbar .btn-navbar {
        right:auto;
        left:0;
    }

    .site-header .title-area {
        width:100% !important;
        clear:both;
        margin:20px 0 40px 0;
    }

    #slider .slidertitlewhite {
        padding: 10px 10px 5px;
        width: 150px;
    }

    #slider .small_light_white {
        padding: 5px 10px 10px !important;
        width: 150px;
    }

    .modal-body {
        padding:25px 15px 5px !important;
    }

    .modal-body .col-md-4 {
        padding-bottom: 20px;
    }

    .tabs .container {
        padding:0;
        overflow: hidden;
        overflow-x:scroll;
    }

    .tab-content .container {
        padding:0;
        overflow: hidden;
    }

    .tabs .tab-links {
        width:1146px;
    }

    .tabs .tab-links a {
        display: block;
    }

    .tabs .container::-webkit-scrollbar {
        width: 1em;
    }

    .tabs .container::-webkit-scrollbar-button {
        background-color: #000;
    }
     
    .tabs .container::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px #000;
    }
     
    .tabs .container::-webkit-scrollbar-thumb {
        background-color: #252525;
        outline: 1px solid #252525;
    }

    .tabs .container::-webkit-scrollbar-thumb:hover, .tabs .container::-webkit-scrollbar-thumb:active {
        background-color:#8cc641;
        outline: 1px solid #8cc641;
    }

    .tabs .container::-webkit-scrollbar-corner {
        background-color: #252525;
    } 

    .portfolio-tab .tabs .tab-links a {
        padding: 20px 30px;
    }

    .tabs .tab-content .caption {
        padding-top: 0;
    }

    .masonry .item.thumbnail {
        margin:0 auto;
        left:0;
        right:0;
    }

    .masonry .item.large {
        margin:0 auto;
        left:0;
        right:0;
    }

    .masonry .item.medium {
        margin:0 auto;
        left:0;
        right:0;
    }

    .image-hover-link .hover-content .hover-content-border a {
        left:23%;
    }

    div.gray-bar .caption {
        padding:30px 0 0 0;
    }

     div.white-bar .caption {
        padding:30px 0 0 0;
    }

    #variety-list p {
        margin-bottom: 30px;
    }

    #testimonials #testimonial-1 {
        padding-right: 15px;
        overflow: hidden;
    }

    #testimonials #testimonial-2 {
        padding-left: 15px;
        overflow: hidden;
    }

    #testimonials .carousel-inner {
        padding-bottom: 30px !important;
    }

    #testimonials .carousel-control.right {
        right:20% !important;
    }

    #testimonials .carousel-control.left {
        left:20% !important;
    }

    .masonry .item.thumbnail {
        margin:0 auto;
        left:0;
        right:0;
    }

    .masonry .item.medium {
        width:auto !important;
        height: auto !important;
    }

     .fullwidth-masonry .item {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.large {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.thumbnail {
        height: auto !important;
        width: 19.8% !important;
    }

    .fullwidth-masonry .item.medium {
        height: auto !important;
        width: 40% !important;
    }

    .dark-bar .col-md-6 {
        padding:0;
    }

    .bar-content {
        padding: 40px 0 20px 0;
    }

    #single-system-carousel-block .indicator-wrapper {
        overflow-x:scroll;
        bottom: -81px !important;
        position: absolute;
        overflow-y: hidden;
        width:100%;
    }

    #single-system-carousel-block .carousel-indicators {
        bottom:auto !important;
        width:1140px !important;
        position: relative !important;
    }

    .site-footer {
        text-align: center !important;
    }

    .site-footer .col-md-3 {
        margin-bottom: 40px;
    }

    .site-footer .col-md-6 {
        margin-bottom: 40px;
    }

    .button {
        margin-bottom: 15px;
    }

}

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

    body {
        padding:0 !important;
    }

    .site-header .wrap {
        padding:60px 0 0 0 !important;
    }

    .navbar {
        min-height: 0 !important;
        float:none;
        margin:0 !important;
        background: #252525 !important;
        border-radius: 0px !important;
        position: fixed !important;
        top: 0; 
        width: 100%;
    }

    .navbar .nav-collapse {
        margin:40px 0 0;
        float:none;
        background: #000;
    }

    .navbar .nav > li {
        margin:0;
    }

    .nav-collapse .nav {
        margin:0 !important; 
    }

    .nav-collapse .nav > li > a, .nav-collapse .dropdown-menu a {
        border-radius: 0px !important;
        transition: all linear 0.15s;
        -webkit-transition: all linear 0.15s;
        -moz-transition: all linear 0.15s;
        -o-transition: all linear 0.15s;
        margin:0 !important;
        font-size:14px;
    }

    .nav-collapse .nav > li > a:hover, .nav-collapse .nav > li > a:focus, .nav-collapse .dropdown-menu a:hover, .nav-collapse .dropdown-menu a:focus {
        background:#f2f2f2;
        transition: all linear 0.15s;
        -webkit-transition: all linear 0.15s;
        -moz-transition: all linear 0.15s;
        -o-transition: all linear 0.15s;
        border-radius: 0px;
    }

    .navbar .nav > .active > a, .navbar .nav > .active > a:hover, .navbar .nav > .active > a:focus {
        background:#f2f2f2;
    }

    .navbar .btn-navbar {
        right:auto;
        left:0;
    }

    .site-header .title-area {
        width:100% !important;
        clear:both;
        margin:20px 0 40px 0;
    }

    #slider .slidertitlewhite {
        padding: 10px 10px 5px;
        width: 95px;
        margin-top: -3px !important;
    }

    #slider .small_light_white {
        padding: 5px 10px 10px !important;
        width: 95px;
    }

    .modal-body {
        padding:25px 15px 5px !important;
    }

    .modal-body .col-md-4 {
        padding-bottom: 20px;
    }

    .tabs .container {
        padding:0;
        overflow: hidden;
        overflow-x:scroll;
    }

    .tab-content .container {
        padding:0;
        overflow: hidden;
    }

    .tabs .tab-links {
        width:1146px;
    }

    .tabs .tab-links a {
        display: block;
    }

    .tabs .container::-webkit-scrollbar {
        width: 1em;
    }

    .tabs .container::-webkit-scrollbar-button {
        background-color: #000;
    }
     
    .tabs .container::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px #000;
    }
     
    .tabs .container::-webkit-scrollbar-thumb {
        background-color: #252525;
        outline: 1px solid #252525;
    }

    .tabs .container::-webkit-scrollbar-thumb:hover, .tabs .container::-webkit-scrollbar-thumb:active {
        background-color:#8cc641;
        outline: 1px solid #8cc641;
    }

    .tabs .container::-webkit-scrollbar-corner {
        background-color: #252525;
    } 

    .portfolio-tab .tabs .tab-links a {
        padding: 20px 30px;
    }

    .tabs .tab-content .caption {
        padding-top: 0;
    }

    div.gray-bar .caption {
        padding:20px 0 0 0;
    }

     div.white-bar .caption {
        padding:20px 0 0 0;
    }

    .masonry .item.large {
        margin:0 auto;
        left:0;
        right:0;
    }

    .masonry .item.thumbnail {
        margin:0 auto;
        left:0;
        right:0;
    }

    .masonry .item.medium {
        width:auto !important;
        height: auto !important;
    }

    .image-hover-link .hover-content .hover-content-border a {
        left:30%;
    }

    .fullwidth-masonry .item {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.large {
        height: auto !important;
        width: 20% !important;
    }

    .fullwidth-masonry .item.thumbnail {
        height: auto !important;
        width: 19.8% !important;
    }

    .fullwidth-masonry .item.medium {
        height: auto !important;
        width: 40% !important;
    }

    #variety-list p {
        margin-bottom: 30px;
    }

    #testimonials #testimonial-1 {
        padding-right: 15px;
        overflow: hidden;
    }

    #testimonials #testimonial-2 {
        padding-left: 15px;
        overflow: hidden;
    }

    #testimonials .carousel-inner {
        padding-bottom: 30px !important;
    }

    #testimonials .carousel-control.right {
        right:20% !important;
    }

    #testimonials .carousel-control.left {
        left:20% !important;
    }

    #masonry .item {
        margin:0 auto !important;
        left:0;
        right:0;
    }

    .dark-bar .col-md-6 {
        padding:0;
    }

    #single-system-carousel-block .indicator-wrapper {
        overflow-x:scroll;
        bottom: -81px !important;
        position: absolute;
        overflow-y: hidden;
        width:100%;
    }

    #single-system-carousel-block .carousel-indicators {
        bottom:auto !important;
        width:1140px !important;
        position: relative !important;
    }

    .bar-content {
        padding: 40px 0 20px 0;
    }

    .site-footer {
        text-align: center !important;
    }

    .site-footer .col-md-3 {
        margin-bottom: 40px;
    }

    .site-footer .col-md-6 {
        margin-bottom: 40px;
    }

    .button {
        margin-bottom: 15px;
    }

}


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

    body {
        padding:0 !important;
    }

    #page-title-block .sub-title {
        font-size:14px;
    }

    #page-title-block .sub-title img {
        margin: 10px auto 0;
    }

    .image-hover-link .hover-content .hover-content-border a {
        left:16%;
    }

}