﻿

/* ---- Sharepoint fix ------*/
/*----- move to corev15.css --*/
#s4-bodyContainer {padding-bottom:0;}
#contentBox { margin-left: 0; }
#sideNavBox { display: none; }
#contentBox {margin-left:0; margin-right:0; min-width:100%}
#suiteBarDelta, #s4-ribbonrow {/*display:none*/}
#ribbonBox *, #ribbonBox ::after, #ribbonBox ::before{-webkit-box-sizing: content-box;-moz-box-sizing: content-box;box-sizing: content-box;}
.ms-srch-resultFooter {display:none}
.ms-srch-hover-actions {display:none}
.ms-srch-hover-subTitle h3 {font-size:11pt}
.ms-srch-sbLarge>input {border-style:solid}
.ms-webpart-chrome-vertical, .ms-webpart-cell-vertical, .ms-webpart-zone {display:block}
.row.no-gutters > [class^="col-"],
.row.no-gutters > [class*=" col-"] {
   padding-right: 0;
   padding-left: 0;
}
h2 {padding-left:20px;font-weight: 300;color: #000;font-size: 28px;text-transform: uppercase;margin-bottom: 10px;padding-top: 10px;}
@media (max-width: 1122px)and (min-width: 992px){
    h2 {font-size: 22px;}
    h1 {font-size: 24px;}
    .ms-rtestate-field h2, h2.ms-rteElement-H2 {/* [ReplaceColor(themeColor:"ContentAccent1")] */ font-size: 22px;}
}

/*   p    */
p.ms-rteElement-P{-ms-name:"Paragraph";-ms-element:"true";}
.ms-rtestate-field p, p.ms-rteElement-P {line-height: 28px!important;}

h1.ms-rteElement-H1{-ms-name:"Heading 1";-ms-element:"true";}
.ms-rtestate-field h1, h1.ms-rteElement-H1 {font-size:30px;font-weight:300;line-height:40px;text-transform: uppercase; color:#000000;margin-top: 20px;margin-bottom: 10px;}

h2.ms-rteElement-H2{-ms-name:"Heading 2";-ms-element:"true";}
.ms-rtestate-field h2, h2.ms-rteElement-H2 {color:#000;line-height: 1.4;font-weight: 300;font-size: 28px;text-transform: uppercase;margin-bottom: 10px;padding-top: 10px;}

h2.ms-rteElement-H2A{-ms-name:"Heading 2 w/o left padding";}
h2.ms-rteElement-H2A {padding-left:0;}

h3.ms-rteElement-H3{-ms-name:"Heading 3";-ms-element:"true";}
.ms-rtestate-field h3, h3.ms-rteElement-H3 {font-size: 23px;margin-top: 20px;margin-bottom: 10px;font-family: inherit;font-weight: 500;line-height: 1.1;color: inherit;text-transform: uppercase;}

h4.ms-rteElement-H4{-ms-name:"Heading 4";-ms-element:"true";}
.ms-rtestate-field h4, h4.ms-rteElement-H4 {font-weight: 300;line-height: 40px;font-size: 24px;margin-top: 20px;margin-bottom: 10px;font-weight: 300;line-height: 1.1;color: #4a4a4a;}

h2.ms-rteElement-H2B{-ms-name:"Heading 2 Alternate";margin-top: 20px;margin-bottom: 10px;padding-left: 0;line-height: 40px;font-size: 24px;color:#000000; text-transform:uppercase}
h3.ms-rteElement-H3B{-ms-name:"Heading 3 Alternate";font-size: 18px;margin-top: 10px;margin-bottom: 10px; color:#000000; text-transform:uppercase; font-weight:300;}
h4.ms-rteElement-H4B{-ms-name:"Heading 4 Alternate";font-size: 22px;margin-top: 10px;margin-bottom: 10px; color:#4a4a4a; text-transform:none; font-weight:300; line-height:32px}
.ms-rtestate-field ul {line-height:28px;}
/*------------------ Main -------*/
body {font-family: "Roboto", sans-serif;font-size: 16px;font-weight: 400;background-color: #fff;color: #4a4a4a;position: relative;}
ul ul {list-style-type: square;}
/*----------------- Header Region --------------------------*/
header {z-index: 10;/*position: fixed;*/right: 0;left: 0; top: 0; background-color:#ffffff}
.sticky-top {z-index:10}


.fixed-nav{background: #fff;top: 0px;left: 0px;right: 0px;z-index: 99;position: fixed;position: sticky;}
#full_menu {background-color:#ffffff}
.navbar-header {background-color:#ffffff}
.logo, .ms-siteicon-a {margin: 8px 0;display:block; max-height:none}
.navbar-header h1 {position: absolute;left: 243px;top: 67px;margin: 0;border-bottom: 0;font-size: 12px;color: #045D85;font-weight: 400;text-transform: uppercase; font-size:12px}
@media (max-width: 767px) {
	.navbar-header h1 {display:none}
}	
#pageStatusBar[class], .ms-status-msg {margin-bottom: 0;padding: 0;border-width: 0;}

/*--------------- Hamburger ---------------------------*/
.hamburger > a {color: #fff;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;background: #006499;padding: 10px 25px 14px 25px;font-size: 28px;text-align: center;display: block;}
.hamburger > a {height: 76px;width: 76px;line-height: 76px;font-size: 20px;margin: 0;padding: 0;text-decoration: none;border-radius: 0;}
.hamburger ul.dropdown-menu {top:78px;right:0;left:auto;margin: 0 auto;width: 320px;font-size: 16px;font-weight: 400;text-decoration: none;border-radius: 0;text-transform: uppercase;background-color: #006399;border: 0;}
.hamburger ul li {position:relative; width:100%}
.hamburger  .navbar-nav li .fa {float: right;}
.hamburger .navbar-nav > li > span, .hamburger .navbar-nav>li>a {padding: 0px 15px;color: #fff;display:block}
.hamburger .navbar-nav > li > span:hover, .hamburger .navbar-nav>li>a:hover,
.hamburger .navbar-nav > li > span:focus, .hamburger .navbar-nav>li>a:focus {color:#ffffff} 
.hamburger .navbar-nav ul.dropdown-menu {background-color:hsl(201, 100%, 19%); padding-left:20px}
.hamburger .navbar-nav  ul.dropdown-menu li {min-height:40px}
.hamburger .navbar-nav ul.dropdown-menu .col-md-5 {width:100%!important}
@media (min-width: 768px) {
	.hamburger .navbar-nav ul.dropdown-menu .col-md-5  {-ms-flex: 0 0 100%;flex: 0 0 100%;max-width:100%;}
}
.hamburger .navbar-nav ul.dropdown-menu ul.submenu-link{padding:10px 0}
.hamburger .navbar-nav ul.dropdown-menu li a {color:#fff;}
.hamburger .megamenu-content-section, .hamburger .megamenu-close {display:none}

/*.hamburger ul.sub-menu {font-size: 15px;display: none;position: relative;}
.hamburger ul.menu-list {display: none;position: relative;}
.hamburger ul.inner-menu {display: none;position: relative;}
.hamburger li a.dropdown:hover ul.inner-menu, .hamburger li a.dropdown:focus ul.inner-menu {display: block !important;}
.hamburger li a.dropdown:hover ul.menu-list, .hamburger li a.dropdown:focus ul.menu-list {display: block !important;}
.hamburger li a.dropdown:hover ul.sub-menu, .hamburger li a.dropdown:focus ul.sub-menu {display: block !important;}
.hamburger .navbar-collapse.in {display: inline;overflow-y: hidden;}*/

/*--------------------- Search -------------*/
.search {height: 76px;line-height: 76px;width: 76px;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;background: #E5E4E4;text-align: center;}
@media (min-width: 1199px) {
    .search {-webkit-transform: translate(0, 51%);-ms-transform: translate(0, 51%);-o-transform: translate(0,51%);transform: translate(0, 51%);}
}
@media (max-width: 1122px) and (min-width: 992px){
   	.search{-webkit-transform: translate(0, 0%);-ms-transform: translate(0, 0%);-o-transform: translate(0,0%);transform: translate(0, 0%);}
}
@media (max-width: 767px) {
	.search{-webkit-transform: translate(0, 0%);-ms-transform: translate(0, 0%);-o-transform: translate(0,0%);transform: translate(0, 0%);}
}
#SearchBox {width:100%}
#searchBox .ms-srch-sbLarge.ms-srch-sb-border, .ms-srch-sbLarge.ms-srch-sb-borderFocused {border:0; width:100%}
#searchBox .ms-srch-sbLarge>input {width:90%}

/*--------------- Navigation ------------- */
.visible-full-menu {display: none;}
@media (min-width: 1199px) {
	.visible-full-menu {display: block;}
}


/*------------------ Back To Top ---------------------*/
#backToTopButton{display: inline-block;background-color: #fff;color:#333;width: 50px;height: 50px;text-align: center;border-radius: 2px;position: fixed;bottom: 20px;right: 20px;transition: background-color .3s, opacity .5s, visibility .5s;  opacity: 0;  visibility: hidden;  z-index: 1000;}
#backToTopButton::after {content: "\f102";font-family: FontAwesome;font-weight: normal;font-style: normal;font-size: 2em;line-height: 50px;}
#backToTopButton:hover {cursor: pointer;background-color: #555; color:#fff}
#backToTopButton:active {background-color: #555;color:#fff}
#backToTopButton.show {opacity: 1;visibility: visible;}
@media (min-width: 500px) {
  #backToTopButton{margin: 30px;}
}

/*-------------- Footer ------------------------------*/
footer {background-color: #2c2c2c;color: #fff;padding: 42px 0;}
footer > div {padding: 0 30px;}
footer a, footer a:visited {color: #fff;}
footer ul.nav li a:hover, footer ul.nav li span:hover, footer ul.nav li a:hover, footer ul.nav li span:hover, footer .copyright a:hover, footer ul li a:hover,
footer ul.nav li a:focus, footer ul.nav li span:focus, footer ul.nav li a:focus, footer ul.nav li span:focus, footer .copyright a:focus, footer ul li a:focus,
.resposive-text-center a:hover{background-color: transparent;color: #716f71;text-decoration: none;}
footer .nav-link {padding:0.2rem 0.5rem;display: block;}
footer .lang-btn {line-height:1;background: transparent none repeat scroll 0 0;border: 1px solid #fff;border-radius: 2px;color: #fff;margin-bottom: 15px;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
footer .lang-btn:hover {background: transparent none repeat scroll 0 0;color: #ccc;text-decoration: none;}
.ada_comp {margin-top: 5px;color: #aeaeae;font-size: 12px;}

@media (max-width: 767px) {
.logo img,  .ms-siteicon-a img {width: 100px;}
.resposive-text-center {text-align: center;}
footer ul.nav li a, footer ul.locations li a, footer ul.locations li span, footer ul.nav li span, footer a {font-size: 11px;line-height: 23px;}
footer ul.footer-menu {margin: 7.5px -15px;-webkit-box-orient:vertical!important;-webkit-box-direction:normal!important;-ms-flex-direction:column!important;flex-direction:column!important}
.language-option {text-align: center;width: 100%;}
.language-option .btn {float: none !important;margin-bottom: 10px;}
footer .hline {background: #4a4a4a none repeat scroll 0 0;height: 1px;margin: 15px 0;width: 100%;}
footer .copyright, footer .copyright a {font-size: 9px;}
}
/*----------------------- Left Navigation --------------------*/
.menu-header {padding: 0px;}
.menu-items {background-color: #E5E4E4;padding: 10px;margin: 5px 0px;list-style-type: none;}
.menu-items a {color: #585757;display: block;}
.menu-items.active {background-color: rgba(0, 99, 153, 0.95);}
.menu-items.active a {color: #ffffff;}
.menu-items-nested {padding: 5px;margin: 5px 0px;list-style-type: none;}
.menu-items-nested a {text-transform:uppercase}

.menu-items-nested {display:none;}
.menu-items-nested.active {display:block;}
/*----------------------- Page Layout ------------------------*/
.page-wrapper {}  
.page-wrapper .inner-2-column {}
.inner-2-column .hero-section {margin-bottom:30px;}
.inner-2-column .content-section {margin-bottom:30px;}

/*hero*/
.hero-section .hero-banner {}
.hero-section img {width: 100%;height: auto;}
.hero-section .hero-content {position: absolute;top: 50%;transform: translateY(-50%);-ms-transform: translateY(-50%);-moz-transform: translateY(-50%);-webkit-transform: translateY(-50%);-o-transform: translateY(-50%);    padding-left: 0;    width: 50%;    background-color: rgba(255, 255, 255, 0.9);font-weight: 300;line-height: 36px;padding: 40px 40px 40px 40px;font-size: 30px;}
.hero-section .hero-content h2 {line-height: 40px;font-size: 36px;padding-left:0;text-transform: none;color: #4a4a4a;}
.hero-section .hero-content div {line-height: 28px;font-size: 18px;font-weight: 300;margin: 0 0 10px;}
.hero-section .hero-content > div {padding-top: 22px;}
.hero-section .hero-content input.ms-long{width:100%;}
.hero-section .hero-content textarea{width:100%; height:80px}
.hero-blue .hero-section .hero-content {background-color:rgba(20, 170, 225, 0.75)}
.hero-blue .hero-section .hero-content h2 {display:none;}
.hero-blue .hero-section .hero-content div {color:#ffffff;}
.hero-noheader .hero-content h2  {display:none;}
.hero-darkblue .hero-section .hero-content {background-color:rgba(0, 100, 153, 0.75)}
.hero-darkblue .hero-section .hero-content h2 {font-weight:500;color:#ffffff; font-size:28px;}
.hero-darkblue .hero-section .hero-content div {color:#ffffff;}


@media (min-width: 992px) {
	.hero-section .hero-content {left: 50%}
	.hero-left .hero-section .hero-content {left:0;}
}
@media (min-width:768px) and (max-width:991px) {
    .hero-section .hero-content {position: relative;top:0;width: 100%;padding: 10px;bottom: -1px;transform: translateY(0);-ms-transform: translateY(0);-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);}
    .hero-section .hero-content div{font-size: 14px;line-height: 24px;}
    .hero-section .hero-content h2{font-size: 16px;line-height: 30px;padding-left: 0;}
}
@media (max-width:767px) {
    .hero-section .hero-content {top:0;position: relative;width: 100%;transform: translateY(0);-ms-transform: translateY(0);-moz-transform: translateY(0);-webkit-transform: translateY(0);-o-transform: translateY(0);padding: 10px;}        
    .hero-section .hero-content div{font-size: 14px;line-height: 24px;} 
    .hero-section .hero-content h2{font-size: 16px;line-height: 30px;padding-left: 0;}
}

.hero-center .hero-section .hero-content {
	background:rgba(0, 100, 153, 0.8) none repeat scroll 0 0;
    position: absolute;
    left: 50%;
  	transform: translate(-50%, 0%);
    top:auto;
    bottom: 50px;
    width: 85%;
    margin:0 auto;
    padding: 38px;
}
.hero-center .hero-section .hero-content div  {
    line-height: 42px;
    font-size: 31px;
    padding-left: 0;
    text-transform: uppercase;
    color: #ffffff;
    padding-top:0;
    margin-bottom:0;
}
.hero-center .content-section .field-content {
	padding:20px;
}
@media (max-width: 1024px){
	.hero-center .hero-section .hero-content {position: relative;top: 0;left: 0;    transform: translate(0%, 0%);width: 100%;padding: 15px;}
	.hero-center .hero-section .hero-content div {font-size: 20px;line-height: 30px;}
}


/*------------------Article------------------*/
.article-page .article-header-section h1 {font-size:2.2rem; margin: 20px 0 10px}
.article-page .article-header-section h4 {font-weight:300; line-height:1.4}
.article-page .article-header-section .date-line {margin:20px 0; font-weight:500;}
.article-page .article-section p {line-height:1.4!important; margin-bottom:10px;}
.article-page .article-section {margin-bottom:30px;}
.article-page .related-info-section {background-color:#00a4e4; padding:15px; margin-bottom:30px;}
.article-page .related-info-section .article-banner {width:100%}
.article-page .related-info-section .article-banner img {width:100%}
.article-page .related-info-section .article-related-info {margin:15px;color:#ffffff}
.article-page .related-info-section .article-related-info a {color:#ffffff; text-decoration:none; border-bottom:1px #ffffff dashed}
.article-page .article-section img{display: block;max-width: 100%;height: auto;}
.article-page .article-section table{display: block;overflow-x: auto;border: none;}
	
/*------------------- Feed ---------------------------------*/
.press-release-section .press-release-image {width:100%}
.press-release-section .press-release-image img {width:100%}
.press-release-section .press-release-title a {text-decoration: none !important;color: #00a4e4;font-size: 25px;font-weight: 500;}
.press-release-section .press-release-date {margin:10px 0; font-weight:500}
/*-------------- Custom Table Styles -------------------------*/
.ms-rteTable-ConvertTextTo2Columns {-ms-name:"Table Style - Convert Text To 2 Columns";border-width:0px;border-style:none;border-collapse:collapse;}
.ms-rteTable-ConvertTextTo2Columns td,
.ms-rteTable-ConvertTextTo2Columns > tbody > tr > td {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;column-gap: 40px;padding-left: 30px;padding-right: 30px;margin-bottom: 30px;margin: 0 0 10px;line-height: 28px;display: block;-webkit-column-gap: 40px;transform: translateY(0%);-ms-transform: translateY(0%);-moz-transform: translateY(0%);-webkit-transform: translateY(0%);-o-transform: translateY(0%); font-weight:400}
.ms-rteTable-ConvertTextTo2Columns th,
.ms-rteTable-ConvertTextTo2Columns > tbody > tr > th {padding-left:30px; padding-right:30px;}

/* ---------------------------- CONTENT WebParts --------------------- */
h2.element-invisible {display: none;} /* ? */
.img-responsive img {width: 100%;height: auto;} /* need to change with img-fluid */

.carousel-indicators {text-align: right;bottom: 2px;left: 60%;width:60%;z-index: 15;margin-right:0; margin-left:-30%; display:block}
.carousel-indicators li {display: inline-block;width: 10px;height: 10px;margin: 1px 3px;text-indent: -999px;cursor: pointer;background-color: #000;background-color: rgba(0,0,0,0);border: 1px solid #fff;border-radius: 10px;}
.carousel-indicators .active {width: 12px;height: 12px;margin: 0 3px;background-color: #fff;}
.carousel-control-next, .carousel-control-prev {border: 2px solid #ffffff;border-radius: 4px;bottom: 15px;height: 25px;top: inherit;width: 25px;}
.carousel-control-prev {left:91.5%;}
.carousel-control-next {right:3%}

/* New banner starts*/
.carousel-1 .banner-img img{height: 510px !important;}
.carousel-1 .carousel-contents{color: hsl(0, 0%, 100%);left: 0;padding: 40px 40px 40px 60px;position: absolute;top: 50%;width: 68%;transform: translateY(-45%);-ms-transform: translateY(-45%);-moz-transform: translateY(-45%);-webkit-transform: translateY(-45%);-o-transform: translateY(-45%);box-sizing: border-box;}
.carousel-1 .carousel-contents p {font-weight: 300;line-height: 28px;font-size: 18px;}
.carousel-1 .carousel-contents p.title {font-size: 30px;line-height: 36px;margin-top: 20px;margin-bottom: 10px; font-weight:400}
.carousel-1 .carousel-contents .brand_link a{color: #fff; text-transform:uppercase; font-weight:400}
.carousel-1 .carousel-contents .brand_link a:hover{text-decoration: none;background-position: 25px 5px;}
.carousel-1 .carousel-contents .brand_link .white-arrow{color: #fff;text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/white-arrow.png") no-repeat scroll 10px 5px;display: inline-block;transition: all 0.3s ease-in-out 0s;text-decoration: none;width: 40px;vertical-align: top;height: 24px;}
.carousel-1 .carousel-contents .brand_link .white-arrow:hover{background-position: 15px 5px;}
.carousel-1 .carousel-contents p::last-child{margin-bottom: 0;}
.carousel-1 .carousel-contents .edit-cta a{color: #fff;}


/* carousel fix */
.carousel-1 .carousel-item {transition-duration: 1.5s;}
.carousel-1 .overlay {position: absolute;width: 100%;height: 100%;background: #000;opacity: 0.6;transition: all 2.2s ease-out;} 
.carousel-1 .carousel-inner .carousel-item {min-height: 510px; background-position: center center; background-repeat: no-repeat; background-size: cover;}
.carousel-1 .active .title b {font-weight:500;transition: font-weight 2s  ease-out}



.carousel-4 .banner-img img{height: 510px !important;}
.carousel-4 .carousel-contents{background-color: hsla(201, 100%, 30%, 0.75);color: hsl(0, 0%, 100%);left: 0;padding: 40px 40px 40px 60px;position: absolute;top: 50%;width: 68%;transform: translateY(-45%);-ms-transform: translateY(-45%);-moz-transform: translateY(-45%);-webkit-transform: translateY(-45%);-o-transform: translateY(-45%);box-sizing: border-box;}
.carousel-4 .carousel-contents p {font-weight: 300;line-height: 28px;font-size: 18px;}
.carousel-4 .carousel-contents p.title {font-weight: 400; font-size: 30px;line-height: 40px;margin-top: 0px;margin-bottom: 20px;}
.carousel-4 .carousel-contents .brand_link a{color: #fff; text-transform:uppercase}
.carousel-4 .carousel-contents .brand_link a:hover{text-decoration: none;background-position: 25px 5px;}
.carousel-4 .carousel-contents .brand_link .white-arrow{color: #fff;text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/white-arrow.png") no-repeat scroll 10px 5px;display: inline-block;transition: all 0.3s ease-in-out 0s;text-decoration: none;width: 40px;vertical-align: top;height: 24px;}
.carousel-4 .carousel-contents .brand_link .white-arrow:hover{background-position: 15px 5px;}
.carousel-4 .carousel-contents p::last-child{margin-bottom: 0;}
.carousel-4 .carousel-contents .edit-cta a{color: #fff;}




@media (max-width: 991px) {
.carousel-1 .carousel-inner .carousel-item {min-height: 310px;}
.carousel-1 .carousel-indicators {left: 50%;}
/*.carousel-1 .carousel-indicators {bottom: 5px;left: 50%;text-align: right;}*/
/*.carousel-1 .carousel-indicators li {border: 1px solid #003f60;}*/
/*.carousel-1 .carousel-indicators .active {background-color: #4a4a4a;}*/
/*.carousel-1 .carousel-contents{background-color: rgba(255, 255, 255, 1);transform: translateY(0%);position: relative;padding-left: 0;padding-right: 0;width: 100%;height: 100%;padding: 15px;} */
.carousel-1 .carousel-control-prev {left: 86.5%;background-image: none !important;}
.carousel-1 .carousel-control-next, .carousel-1 .carousel-control-prev {border: 2px solid #000;color: #000;}
.carousel-1 .carousel-control-next {right: 6%;background-image: none !important;}

/*.carousel-1 .banner-img img {width: 100%;height: auto !important;}*/
.carousel-1 .carousel-contents p.title{font-size: 30px;}
.carousel-1 .carousel-contents p.title, .carousel-1 .carousel-contents p{color: #ffffff;}
.carousel-1 .carousel-contents .brand_link a {line-height: 24px;font-size: 15px;}
/*.carousel-1 .carousel-contents .brand_link .white-arrow{text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 5px;display: inline-block;width: 40px;vertical-align: top;height: 24px;transition: all 0.3s ease-in-out 0s;text-decoration: none;}*/


.carousel-4 .carousel-indicators {bottom: 5px;left: 50%;text-align: right;}
.carousel-4 .carousel-indicators li {border: 1px solid #003f60;}
.carousel-4 .carousel-indicators .active {background-color: #4a4a4a;}
.carousel-4 .carousel-contents{background-color: rgba(255, 255, 255, 1);transform: translateY(0%);position: relative;padding-left: 0;padding-right: 0;width: 100%;height: 100%;padding: 15px;} 
.carousel-4 .carousel-control-prev {left: 86.5%;background-image: none !important;}
.carousel-4 .carousel-control-next, .carousel-1 .carousel-control-prev {border: 2px solid #000;color: #000;}
.carousel-4 .carousel-control-next {right: 6%;background-image: none !important;}

.carousel-4 .banner-img img {width: 100%;height: auto !important;}
.carousel-4 .carousel-contents p.title{color: #4a4a4a;font-size: 30px;}
.carousel-4 .carousel-contents p.title, .carousel-1 .carousel-contents p{color: #4a4a4a;}
.carousel-4 .carousel-contents .brand_link a {color: hsl(201, 100%, 30%);line-height: 24px;font-size: 15px;}
.carousel-4 .carousel-contents .brand_link .white-arrow{text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 5px;display: inline-block;width: 40px;vertical-align: top;height: 24px;transition: all 0.3s ease-in-out 0s;text-decoration: none;}
}




@media (max-width: 767px){
.carousel-control-next, .carousel-control-prev {display:none;}
.carousel-1 .carousel-indicators {left:60%}
.carousel-1 .carousel-inner .carousel-item {min-height: 310px;}
.carousel-1 .carousel-contents{transform: translateY(0%);padding-left: 0;padding-right: 0;width: 100%;padding: 15px;}
.carousel-1 .carousel-contents p.title{font-size: 20px; line-height:28px; margin-top:0; margin-bottom:20px}
.carousel-1 .carousel-contents p.title, .carousel-1 .carousel-contents p {padding-left: 10px;}
.carousel-1 .carousel-contents p.description {display:none;}
.carousel-1 .carousel-contents p.header {color:#ffffff; margin-bottom:0; font-weight:400}
.carousel-4 .carousel-contents p.title{font-size: 30px;}
.carousel-4 .carousel-contents p.title, .carousel-1 .carousel-contents p {padding-left: 10px;}

/*.carousel-1 .carousel-contents p.title{color: #4a4a4a;font-size: 30px;}

.carousel-1 .carousel-contents .brand_link a {color: hsl(201, 100%, 30%);line-height: 24px;font-size: 15px;padding-left: 10px;}
.carousel-1 .carousel-contents .brand_link .white-arrow {text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url(/_catalogs/masterpage/Harman.com/img/blue-arrow.png) no-repeat scroll 10px 5px;display: inline-block;transition: all 0.3s ease-in-out 0s;text-decoration: none;width: 40px;vertical-align: top;height: 24px;}
.carousel-1 .banner-img img {width: 100%;height: auto !important;}*/
}

/* Recognition Starts*/
.carousel-2 h2 {font-weight: 300;padding-left: 30px;color: #000;font-size: 28px;text-transform: uppercase;margin-bottom: 10px;padding-top: 10px;}    
.carousel-2 .carousel-contents { padding: 50px 30px 20px 50px;display: block;position: absolute;height: inherit;left: 0px;bottom: 0;right: 65%;top: 0px;background-color: rgba(0, 63, 96, 0.6);color: #ffffff;}
.carousel-2 .carousel-contents p.title {font-size: 34px;margin-top: 25px;white-space: normal;font-weight:300; line-height:normal}
.carousel-2 .brand_link  {bottom: 0px;left: 0;position: absolute;right: 0;margin:0}
.carousel-2 .brand_link > a{background: #003f60 url(/_catalogs/masterpage/Harman.com/img/white-arrow.png) no-repeat scroll 160px 26px;color: #ffffff;    display: block;    font-weight: 500;    padding: 25px 50px;    transition: all 0.3s ease-in-out 0s;    text-decoration: none;    text-transform:uppercase}
.carousel-2 .brand_link a:hover {background-position: 175px 26px;}
@media (max-width: 991px) {
.carousel-2 .carousel-indicators {bottom: 5px;left: 50%;text-align: right;}
.carousel-2 .carousel-control-prev {left: 86.5%;background-image: none !important;}
}

@media (min-width:768px) and (max-width:991px) {
.carousel-2 .carousel-contents  {padding: 30px 20px 50px 20px;}
.carousel-2 .carousel-contents p.title {font-size: 20px;margin-top: 10px;}
}
@media (max-width: 767px) {
    .carousel-2 .carousel-contents  {font-size: 24px;display: block;width: 100%;background: rgba(0, 63, 96, 0.6);padding: 0px;position:absolute;top:auto; bottom:0}
    .carousel-2 .carousel-contents p.title {font-size: 16px; padding:10px 30px;margin:0}
    .carousel-2 .brand_link {position: relative;}
    .carousel-2 .brand_link a {text-transform:none;font-size: 17px;padding: 15px 15px 15px 30px;background-position: 140px 16px;}
    .carousel-2 .brand_link a:hover {background-position: 155px 16px;}
    .carousel-2 .carousel-indicators {bottom: -50px;text-align: center;}
    .carousel-2 .carousel-indicators li {border: 1px solid #003f60;}
    .carousel-2 .carousel-indicators .active {background-color:#4a4a4a}
    .carousel-2 {margin-bottom: 20px;}
}
/* Recognition Ends*/

/* Carousel 3 banner starts*/
.carousel-3 .banner-img img{height: 510px !important;}
.carousel-3 .carousel-contents{background-color: hsla(0, 0%, 100%, 0.75);color: hsl(0, 0%, 29%);left: 0;padding: 0px 40px 0px 60px;position: absolute;top: 50%;width: 48%;transform: translateY(-45%);-ms-transform: translateY(-45%);-moz-transform: translateY(-45%);-webkit-transform: translateY(-45%);-o-transform: translateY(-45%);box-sizing: border-box;}
.carousel-3 .carousel-contents p {font-weight: 300;line-height: 28px;font-size: 18px;}
.carousel-3 .carousel-contents p.header {font-size: 30px;line-height: 36px;margin-top: 20px;margin-bottom:0;}
.carousel-3 .carousel-contents p.title {font-size: 18px;line-height: 36px;font-style:italic; font-weight:500; margin-bottom:10px;}
.carousel-3 .carousel-contents .brand_link a{color: #337ab7; text-transform:uppercase; font-weight:400}
.carousel-3 .carousel-contents .brand_link a:hover{text-decoration: none;background-position: 25px 5px;}
.carousel-3 .carousel-contents .brand_link .white-arrow{color: #337ab7;text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 5px;display: inline-block;transition: all 0.3s ease-in-out 0s;text-decoration: none;width: 40px;vertical-align: top;height: 24px;}
.carousel-3 .carousel-contents .brand_link .white-arrow:hover{background-position: 15px 5px;}
.carousel-3 .carousel-contents p::last-child{margin-bottom: 0;}
.carousel-3 .carousel-contents .edit-cta a{color: #fff;}


@media (max-width: 991px) {
.carousel-3 .carousel-indicators {bottom: 5px;left: 50%;text-align: right;}
.carousel-3 .carousel-indicators li {border: 1px solid #003f60;}
.carousel-3 .carousel-indicators .active {background-color: #4a4a4a;}
.carousel-3 .carousel-contents{background-color: rgba(255, 255, 255, 1);transform: translateY(0%);position: relative;padding-left: 0;padding-right: 0;width: 100%;height: 100%;padding: 15px;} 
.carousel-3 .carousel-control-prev {left: 86.5%;background-image: none !important;}
.carousel-3 .carousel-control-next, .carousel-1 .carousel-control-prev {border: 2px solid #000;color: #000;}
.carousel-3 .carousel-control-next {right: 6%;background-image: none !important;}

.carousel-3 .banner-img img {width: 100%;height: auto !important;}
.carousel-3 .carousel-contents p.title{color: #4a4a4a;font-size: 30px;}
.carousel-3 .carousel-contents p.title, .carousel-1 .carousel-contents p{color: #4a4a4a;}
.carousel-3 .carousel-contents .brand_link a {color: hsl(201, 100%, 30%);line-height: 24px;font-size: 15px;}
.carousel-3 .carousel-contents .brand_link .white-arrow{text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 5px;display: inline-block;width: 40px;vertical-align: top;height: 24px;transition: all 0.3s ease-in-out 0s;text-decoration: none;}
}




@media (max-width: 767px){
.carousel-3 .carousel-contents p.title{font-size: 30px;}
.carousel-3 .carousel-contents p.title, .carousel-1 .carousel-contents p {padding-left: 10px;}
}





/* Solution */
.home_page_solutions h2 {font-weight: 300;padding-left:30px;color: #000;font-size: 28px;text-transform: uppercase;margin-bottom: 10px;    padding-top: 10px;}
.circular-cards {position: relative;min-height: 580px;background: url("/SiteCollectionImages/Blocks/Solution/landing-page-bg.jpg") no-repeat 0% 0% / cover;    padding:30px 25px;}
.circular-cards .cards img {margin: 0 auto 25px;display:block}
.circular-cards .cards {background: white none repeat scroll 0 0;border: 0 solid transparent;border-radius: 4px;display: block;padding: 16px;    text-decoration: none;    min-height: 510px;    margin:2px}
.circular-cards .cards:hover{background-color: rgba(255, 255, 255, 0.8);}
.circular-cards .cards p.title {margin-bottom:10px;line-height:2rem; color: #006399;font-size: 24px;text-transform: uppercase;/*padding: 0px 30px; width: 242px; */text-align: center;    text-align-last: center;}
.circular-cards .cards p.desc {color: #828282;font-size: 1.1rem;font-weight: 300;line-height:1.6rem}
.circular-cards .cards p.explore {color: #006399;font-size: 18px;position: absolute;bottom: 0;/*padding-left: 15px;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;   -webkit-transition: all 0.3s ease-in-out;    -ms-transition: all 0.3s ease-in-out;    transition: all 0.3s ease-in-out;    cursor: pointer;    background: transparent url(/_catalogs/masterpage/Harman.com/img/blue-arrow.png) no-repeat scroll 95px 3px; width: 135px;*/}
.circular-cards .cards p.explore a {text-decoration:none;}
.circular-cards .cards p.explore .white-arrow{text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 5px;display: inline-block;width: 40px;vertical-align: top;height: 24px;transition: all 0.3s ease-in-out 0s;text-decoration: none;}
.circular-cards .cards p.explore a:hover .white-arrow {background-position: 15px 5px;}

/*.circular-cards .cards p.explore a:hover {background-position: 105px 3px;}*/
@media (max-width: 991px) and (min-width: 768px) {
.circular-cards .cards {background: white none repeat scroll 0 0;border: 0 solid transparent;border-radius: 4px;display: block;padding: 15px;    text-decoration: none;    min-height: 370px;}
.circular-cards .cards img {display: block;height: 100px;margin: 0 auto 30px;text-align: center;width: 100px;}
.circular-cards  .cards p.title {line-height:2rem}
}

@media (max-width: 767px) {
.circular-cards .cards {min-height: 310px;margin-bottom: 5px;}
.circular-cards .cards img {display: block;height: 100px;margin: 0 auto 30px;text-align: center;width: 100px;}
.circular-cards  .cards p.title {font-size: 18px;}
}

@media (max-width: 767px) {	
h2 {font-size: 18px !important;}
h1 {font-size: 22px !important;}
h4 {font-size: 18px !important;}
h5 {font-size: 18px !important;}
.home_page_solutions h2 {padding-left:25px;}
.ms-rteTable-ConvertTextTo2Columns td, .ms-rteTable-ConvertTextTo2Columns > tbody > tr > td {padding-left:15px;padding-right:15px;-webkit-column-count: 1;-moz-column-count: 1;column-count: 1;}
}




#solution-canvas {
    height: 580px;
    width: 100%;
}

.home-page-solutions .solution-blocks {
    position: relative;
}

.home-page-solutions .solution-blocks-content {
    position: absolute;
    top: 17px;
    padding: 0 15px;
    padding-left: 18px;
    padding-right: 18px;
}
.home-page-solutions .solution-blocks .solution-card .fa-pencil-square-o {
    color: #fff;
}


/* Ecosystem */
.ecosystem h2 {font-weight: 300;padding-left: 30px;color: #000;font-size: 28px;text-transform: uppercase;margin-bottom: 10px;padding-top: 10px;}
.ecosystem h3 {font-size: 23px;padding-left: 15px;margin-top: 20px;margin-bottom: 10px;font-weight: 400;line-height: 1.1;text-transform: uppercase;}
.ecosystem ul.logo-collection {margin: 0 auto;padding-left: 0;text-align: left;width: 100%;display: inline-block;}
.ecosystem ul.logo-collection li {margin-bottom: 50px;min-width: 119px;padding-left: 5px;padding-right: 5px;display: inline-block;vertical-align: top;}
.ecosystem ul.logo-collection li a {width: 100px;display: block;padding: 2px;margin: 0px auto;}
@media (max-width: 767px) {	
ul.logo-collection li {margin-bottom: 20px;}
}

/* Tweets */
.tweets {height:282px;border-top-left-radius: 4px;border-top-right-radius: 4px;background-color: #006DA8;}
.tweets .carousel-content {padding-left: 30px;padding-right: 30px;padding-top:30px;position: relative;}
.tweets .fa {color: #fff;}
.tweets .fa-twitter {font-size: 32px;}
.tweets .carousel-content h3 {font-weight: 300;font-size: 26px;color: #fff;}
.tweets .carousel-content a {text-decoration: none;color: #62d0df;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.tweets .carousel-content a:hover {color:#ffffff}


/* Cards-3 */
.cards-3 .card-1 img.img-100-percent {width: 100%;height: auto;}
.cards-3 .brand-name-row {bottom: 0;position: absolute;width: 100%;}
.cards-3 .card-2 .card-content {padding: 30px;position: absolute;right: 0;top: 0;bottom: 0;background: #eff0f1;width:100%;}
.cards-3 .card-2 .card-content h3 {font-size: 22px;line-height: 32px;margin-top: 0px;margin-bottom: 20px;font-weight: 300;color: #4a4a4a;}
.cards-3 .card-2 .card-content p {font-weight: 300;margin-bottom: 10px;font-size: 16px;line-height: 28px;word-wrap: break-word;}

.cards-3.right .card-1{-webkit-box-ordinal-group: 14;-ms-flex-order: 13;order: 13;}
.cards-3 .brand-name-row .list-inline {
    margin: 0 auto 0 -1px;
    text-align: center;
    width: 100%;
}
.cards-3 .list-inline > li {
    padding-right: 2px;
    padding-left: 2px;
}

.cards-3 .brand-name-row .list-inline li {margin: 10px 0 0;height: auto !important;position:relative}

.cards-3 .brand-name-row .list-inline li a {
    width: 163px;
    min-height: 150px;
    display: block;
    text-align: center;
    margin: 0px auto;
    color: #fff;
    text-decoration: none;
    border: 0 solid;
    border-radius: 4px 4px 0 0 !important;
    -webkit-border-radius: 4px 4px 0 0;
    -moz-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    background-color: rgba(0, 100, 153, 0.8);
}

.cards-3 .brand-name-row .list-inline li a span.white-arrow {
    background: hsla(0, 0%, 0%, 0) url('/_catalogs/masterpage/Harman.com/img/white-arrow.png') no-repeat scroll 50% center;
    display: block;
    padding: 20px 0;
    padding: 33px 0 20px;
    transition: all 0.3s ease-in-out 0s;
}
.cards-3 .brand-name-row .list-inline li a span.white-arrow:hover {
    background-position: 54% center;
}
@media (max-width: 1199px) and (min-width: 768px) { 
    .cards-3 .brand-name-row .list-inline li a {
        width: 140px;
    }
    .cards-3 .card-2 .card-content h3{
        line-height: 27px;
        margin-bottom: 10px;
        font-size:18px;
    }
    .cards-3 .card-2 .card-content p{
        line-height: 22px;
        margin-bottom: 5px;
        font-size:14px;
    }

        
}
@media (max-width: 991px) {
	

.cards-3 .card-2 .card-content {
    position: relative;
    padding: 20px 20px 20px;
}
.cards-3.right .card-1{-webkit-box-ordinal-group: 0;-ms-flex-order: -1;order: -1;}
}

@media (max-width: 575px){
.cards-3 .brand-name-row	 {
	position:relative
}

.cards-3 .brand-name-row .list-inline li {
    background: hsl(201, 100%, 30%) none repeat scroll 0 0;
    display: block;
    list-style: outside none none;
    margin-bottom: 0px;
    margin-top:5px;
}

.cards-3 .brand-name-row .list-inline li a span.white-arrow {
	display:none
}

.cards-3 .brand-name-row .list-inline li a {
	min-height:auto;
}

.cards-3 .card-2 .card-content h3 {
    font-size: 16px !important;
    line-height: 30px !important;
    font-weight: 300;
}
.cards-3 .card-2 .card-content p {
    line-height: 24px !important;
    font-size: 14px;
}

}
/* Cards-1 */
.home_page_news h2 {
	font-weight: 300;
    padding-left: 30px;
    color: #000;
    font-size: 28px;
    text-transform: uppercase;
    margin-bottom: 10px;
    padding-top: 10px;
}

.cards-1 img {
    width: 100%;
    height: inherit;
}

.cards-1 .card-content {
    bottom: 0;
    height: auto;
    min-height: 5px;
    overflow: hidden;
    top: inherit;
    padding-right: 0px;
    position: absolute;
    width: 100%;
}

.cards-1 .card-content .sub-title {
    margin: 0 0 5px;
    padding-top: 10px;
}

.cards-1 .card-content .sub-title span {
    background-color: #fff;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    color: #000;
    margin-left: 20px;
    padding: 6px 10px;
    font-size:14px;
}

.cards-1 .card-content .small-strip {
    background: rgba(0, 164, 227, 0.9) none repeat scroll 0 0;
    min-height: 10px;
}

.cards-1 .card-content .desc {
    padding-top: 10px;
    height: 0;
    opacity: 0;
    transition: all .4s ease-in-out 0s;
    padding: 10px 20px 20px;
    padding-bottom: 0;
}

.cards-1 .news-left:hover .card-content .desc {
    height: auto;
    opacity: 1;
    transition: all .4s ease-in-out 0s;
    padding: 10px 20px 20px;
}
.cards-1 .card-content .desc h3 {
    font-weight: 300;
    font-size:1.5rem;
    margin-bottom:0;
    margin-top:20px;
}
.cards-1 .news-right .card-5:hover .card-content .desc,
.cards-1 .news-right .card-3:hover .card-content .desc,
.cards-1 .news-right .card-2:hover .card-content .desc {
    height: auto;
    opacity: 1;
    transition: all .4s ease-in-out 0s;
    padding: 10px 20px 20px;
}
.cards-1 .card-content .desc a {
    color: #fff;
    text-decoration: none;
}
.cards-1 .card-content .link-white-arrow {
    background: url("/_catalogs/masterpage/Harman.com/img/white-arrow.png") no-repeat scroll 0 0;
    width: 100px;
    display: inline-block;
    height: 16px;
    transition: all 0.3s ease-in-out 0s;
    margin-top:10px
}
.cards-1 .card-content .link-white-arrow:hover {
    background-position: 10px 0;
}




.cards-1 .card-4 .call-to-action a {text-decoration: none;color: #fff;text-transform:uppercase;display: block;font-weight: 500;padding: 23px;background-color:rgba(99, 208, 223, 0.9)}

.cards-1 .card-4 .call-to-action a:hover {background-position: 125px 25.5px;}
.cards-1 .card-4 .call-to-action .white-arrow{text-transform: uppercase;font-size: 18px;background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/white-arrow.png") no-repeat scroll 10px 2px;display: inline-block;width: 40px;vertical-align: top;height: 24px;transition: all 0.3s ease-in-out 0s;text-decoration: none;}
.cards-1 .card-4 .call-to-action a:hover .white-arrow {background-position: 15px 2px;}



.cards-1 .card-2 {
    border-bottom: 3px solid #fff;
}
.cards-1 .card-2 .card-content {
}

.cards-1 .card-2 a:hover {
    background-position: 125px 25.5px;
}



.cards-1 .card-4 {
    border-bottom: 4px solid #fff;
}
.cards-1 .card-4  .card-content {
position:relative
}
.cards-1 .card-4 .sub-title{
	
}
.cards-1 .card-3 {
	border-right: 4px solid #fff;
	}
.cards-1 .card-3 img {
    height: 284px;
    object-fit: cover;
}


/* News Starts*/
@media (max-width: 767px)
{
	
	.cards-1 .card-content .desc h3 {
    	font-size: 18px;
	}
	
	.cards-1 .card-3 img {height:100%}

}

@media (min-width: 768px)
{
	.cards-1 .card-5 img {
	    height: 212px;
	    object-fit: cover;
	}	
}
@media (max-width: 575px){
.cards-1 .card-3 {
    border-right: 0;
    border-bottom: 4px solid #fff;
}
}

@media (max-width: 480px){
.cards-1 .card-3 {
    border-bottom: 4px solid #fff;
    border-right: 0;

}
}

@media (max-width: 991px)
{
	.cards-1 .news-left{
		border-bottom: 3px solid #fff;
	}
}

/*--------------------------------------------*/
/* Cards-2 */

.cards-2 img {width: 100%;height: inherit;}
.cards-2 .card-content {position:relative}
.cards-2 a {text-decoration: none;color: white;transition: all 0.3s ease-in-out 0s;}


.cards-2 .card-content .call-to-action {
	position:absolute;
	bottom:0;	
    left:0;
    background-color: rgba(0, 57, 71, 0.89);
    display: inline-block;
    overflow: hidden;
    padding: 15px 15px 15px 30px;
    width: 100%;
}


.cards-2 .call-to-action .white-arrow {
    background: transparent url('/_catalogs/masterpage/Harman.com/img/white-arrow.png') no-repeat scroll right 10px;
    padding: 8px 20px;
    transition: all 0.3s ease-in-out 0s;
}

.cards-2 .card-1 .card-content .call-to-action {
	/*background-color: transparent;   */
    padding: 15px 15px 15px 30px;
}




.cards-2 .card-2 img {
    height: 282px;
    object-fit: cover;
}


.cards-2 .card-2 {
    border-bottom: 3px solid #fff;
}

.cards-2 .card-4 {
    border-bottom: 4px solid #fff;
}
.cards-2 .card-4 img {
    height: 282px;
    object-fit: cover;
}

.cards-2 .card-3 {
	border-right: 4px solid #fff;
	}
.cards-2 .card-3 img {
    height: 282px;
    object-fit: cover;
}

@media (max-width: 767px)
{
	
	.cards-2 .card-content .desc h3 {
    	font-size: 18px;
	}
	
	.cards-2 .card-3 {
    	border-bottom: 4px solid #fff;
    	border-right: 0px solid #fff;
	}

	
	/*.cards-2 .card-3 img {height:100%}*/

}

@media (min-width: 768px)
{
	.cards-2 .card-5 img {
	    height: 212px;
	    object-fit: cover;
	}	
}
@media (max-width: 480px){
.cards-2 .card-3 {
    border-right: 0;
    border-bottom: 4px solid #fff;
}
}

@media (max-width: 991px)
{
	.cards-2 .news-left{
		border-bottom: 3px solid #fff;
	}
}


/*--------------------------------------------*/
@media (min-width: 992px) {
    .harman-inspired-views-image {
        min-height: 600px;
        background-color: #eff0f1;
    }
    .career-section .caption-hover img {
        height: 350px;
    }
    .news-left {
        border-right: 4px solid #fff;
    }

    .news-left img {
        height: 566px;
    }
}
@media (max-width: 991px) {
    .news-tweets .carousel-content p.brand-image {
        text-align: center;
    }
    .news-right .brand-image {
        text-align: center;
    }
    .news-right-top {
        border-top: 3px solid #fff;
    }
}

@media (min-width: 768px) {
    .innovation-banner > hero-bg {
        overflow: hidden;
        height: 435px;
    }
    .ms-content-wrapper .content p {
        font-size: 28px;
        font-weight: 300;
        line-height: 38px;
    }

    .news-right-bottom-left {
        border-right: 4px solid #fff;
    }

    .news-right-bottom img {
        height: 284px;
        object-fit: cover;
    }

    .news-right-bottom-right img {
        height: 212px;
        object-fit: cover;
    }
    .news-right-top #views-bootstrap-carousel-2{
        height: 100%;
    }
}
@media (max-width: 767px) {
    .news-left:hover .card-content .desc, .news-left:focus .card-content .desc {
        height: 120px;
        opacity: 1;
        transition: all 1s ease-in-out 0s;
        padding: 10px 20px 20px;
    }

    .news-right-bottom-left:hover .card-content .desc, .news-right-bottom-left:focus .card-content .desc {
        height: 120px;
        opacity: 1;
        transition: all 1s ease-in-out 0s;
        padding: 10px 20px 20px;
    }

    .news-right-bottom-right:hover .card-content .desc, .news-right-bottom-right:focus .card-content .desc {
        height: 120px;
        opacity: 1;
        transition: all 1s ease-in-out 0s;
        padding: 10px 20px 20px;
    }

    .card-content .desc h3 {
        font-size: 18px;
    }

    .home-page-news .card-content .sub-title {
        text-align: center;
    }

    .home-page-news .card-content .sub-title span {
        margin-left: 0;
        padding: 0px 10px;
    }

    .news-right-bottom-right-top {
        border-top: 4px solid #fff;
    }

    .home-page-news .news-left, .home-page-news .news-right {
        height: auto !important;
    }

    .home-page-news img {
        height: auto !important;
        width: 100%;
    }

    .news-tweets .carousel-content h3 {
        font-size: 18px;
        font-weight: 300;
        line-height: 1.1;
    }
    .news-tweets .carousel-content p.brand-image {
        text-align: center;
    }
    .home-page-news .news-right-bottom-left img{
        height: 281px !important;
        object-fit: cover;

    }
    .home-page-news .news-right-bottom-right img{
        height: 205px !important;
    }
    .news-right-top #views-bootstrap-carousel-2{
        height: 100%;
    }
}
@media (max-width: 480px){
    .home-page-news  .news-right .col-xs-6,.home-page-news .news-right-bottom .col-xs-6  {
        width: 100% !important;
    }
}
/* News Ends*/

/*------- Brands Log - need to be re-worked ----------------*/
ul.logo-collection li a {
    width: 100px;
    display: block;
    padding: 2px;
    text-align: center;
    margin: 0px auto;
    transform: translateZ(0px);
    -webkit-transform: translateZ(0px);
    -moz-transform: translateZ(0px);
}
ul.logo-collection li {
    margin-bottom: 20px;
    min-width: 100px;
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
    vertical-align: top;
}
.logo-collection li {
    height: auto;
    display: inline-block;
    text-align: -webkit-match-parent;
    margin: 0 auto;
    text-align: left;
}
.list-unstyled {
    padding-left: 0;
    list-style: none;
}
ul.logo-collection {
    margin: 0 auto;
    padding-left: 0;
    text-align: left;
    width: 100%;
    display: inline-block;
}
.lifestyle-logo-collection ul.logo-collection li a
{
	width:auto;
}
/*------- END Brands Log - need to be re-worked ----------------*/



/* Intro text */
.intro-text .block-content {margin:0 15px; padding:30px 0}
.intro-text .card0 {position:relative; }
.intro-text .card0 .content-sub p, 
.intro-text .card0 .content-sub div{font-size: 14px;line-height: 1.7;color: #4a4a4a; text-align: left;font-weight: 300;}
.intro-text .card0 .content-sub {padding:30px 20px 10px;}
@media (min-width: 992px){
	.intro-text .card0 .content-sub {padding:30px 40px 10px;}
	.intro-text.intro-text-2-col .card0 .content-sub > p, .intro-text.intro-text-2-col .card0 .content-sub div  {column-count: 2;column-gap: 40px; }
}
.intro-text.intro-text-2-col .card0 .content-sub  p, .intro-text.intro-text-2-col .card0 .content-sub div  {font-weight:300; line-height:1.7; font-size: 14px;color: #4a4a4a;}
.intro-text.intro-text-2-col .card0 .content-sub h2 {margin-bottom:20px; padding-top:0; font-weight:500;font-size:18px;line-height: 28px;color: #4a4a4a; text-align:center; text-transform:none}
/* Intro text end */

/*------- banner-block -----------------------------------------*/
.banner-block .block-header h2 {text-align: center;color:#00a7e4;font-weight:500;margin-bottom: 20px;margin-top: 40px;}
.banner-block .block-header p {text-align: center; font-weight:500; font-size:20px; margin-left:40px; margin-right:40px; margin-bottom: 40px;}
.banner-block .banner-container {position:relative}
.banner-block .banner-content {position:absolute; bottom:0;background-color: hsla(0, 0%, 0%, 0.6); width:100%;}
.banner-block .banner-content .sub-content {padding-top:20px; padding-bottom:20px}

.banner-block .banner-caption {transform: none;position: relative;font-size: 32px;font-weight: 400; text-transform:uppercase; color:#fff; text-align:center}
.banner-block .banner-description {position: relative; padding-left:100px;padding-right:100px; color:#ffffff; }
.banner-block .banner-description p {font-size: 20px;line-height:28px;  text-align:center; margin-bottom:0}

@media (max-width: 767px) {
	.banner-block .block-header h2 {margin-top: 20px;}
	.banner-block .block-header p {font-size:16px;margin-left:20px; margin-right:20px;}
	.banner-block .banner-content {position:relative;background-color:#000000}
	.banner-block .banner-description {padding-left:20px;padding-right:20px;}
	.banner-block .banner-description p {color:#ffffff;font-size: 16px;line-height:24px;}
	.banner-block .banner-caption {color:#ffffff}
}

/*---------------------- end Banner Block ------------------------------------*/

/*------- downloads -----------------------------------------*/
.downloads {width:100%; }
.downloads .card0 {margin-left:40px; margin-right:40px;background: #006499;padding:10px 20px;}
.downloads .download-item {position:relative}
.downloads .download-item a {color:#ffffff; background-color:#45c5e8; width: 64px;height: 64px;-moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%;font-weight:500;text-align:center;line-height:64px;font-size:1.4rem; display:block;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;}
.downloads .download-item a:hover {text-decoration:none; background-color:#009cd8;}
.downloads .description {color:#ffffff; margin-left:20px}
@media (max-width: 767px) { 
	.downloads .card0 {margin-left:0px; margin-right:0px;}
}
/*------- end downloads -----------------------------------------*/

/*------- Block Banner -----------------------------------------*/
.banner .banner-content{position:relative}
.banner .banner-container img {width:100%}
.banner .banner-caption {top: 45%;bottom:0;transform: translateY(-65%);position: absolute;color: #fff;text-align: center;font-size: 48px;font-weight: 400;background-color:transparent!important}

.banner .banner-description {margin-top: -100px; background-color: hsl(0, 0%, 100%);border: 0 solid hsla(0, 0%, 0%, 0);border-radius: 4px;padding: 40px 50px 20px 50px;}
.banner .banner-description, .banner .banner-description p {font-weight: 300;line-height: 28px;}
@media (max-width: 991px) and (min-width: 768px) {
    .banner .banner-caption {transform: translateY(-80%);-ms-transform: translateY(-80%);-moz-transform: translateY(-80%);-webkit-transform: translateY(-80%); -o-transform: translateY(-80%);font-size: 48px;top: 50%;}
    .banner .banner-container img {height: 435px;filter: brightness(50%);-webkit-filter: brightness(50%);}
}
@media (max-width: 767px){
    .banner .banner-container img {width: 100%;/*height: 200px;*/}
    .banner .banner-caption {font-size: 18px;transform: translateY(-50%);-ms-transform: translateY(-50%);-moz-transform: translateY(-50%);-webkit-transform: translateY(-50%); -o-transform: translateY(-50%);text-align: left;padding-left: 10px;}
    .banner .banner-description {margin-top: 0px;}
    .banner .banner-description p {font-size: 16px;padding: 15px 0;padding-left: 10px;}        
}
/*------- Block Banner 2 Columns -----------------------------------------*/
.banner-2-col .banner-caption {font-size: 26px;line-height: 36px;margin-bottom: 0px;}
.banner-2-col .banner-description {column-count: 2;column-gap: 40px; font-weight:300; line-height:28px}

@media (min-width: 1200px) {
	.banner-2-col .banner-caption {top:50%;transform: translateY(-50%);}
}
@media (max-width: 767px){
	.banner-2-col .banner-caption {line-height:1.5;font-size: 18px;transform: translateY(-50%);-ms-transform: translateY(-50%);-moz-transform: translateY(-50%);-webkit-transform: translateY(-50%); -o-transform: translateY(-50%);text-align: left;padding-left: 10px;}    
	.banner-2-col .banner-description {margin: 0;column-count: 1;padding: 10px;}
}
/*------- End Block Banner -----------------------------------------*/
/*-------------- Block Banner with flex text -----------------------*/
.banner.banner-flexible-text .banner-description {background-color: transparent;padding: 40px 20px 0px 20px;font-size: 18px;line-height: 28px;font-weight: 400;}
	
@media (min-width: 768px) {
.banner.banner-flexible-text .banner-description {position: absolute; bottom:0;}
.banner.banner-flexible-text .banner-description {padding: 40px 60px 20px 60px; text-align:center;}	
}



/*------- Blocks banner-N-text -----------------------------------------*/
.banner-N-text .banner-container {position:relative}
.banner-N-text .banner-caption {top: 45%;bottom:0;transform: translateY(-65%);position: absolute;color: #fff;text-align: center;font-size: 48px;font-weight: 300;}

.banner-N-text .banner-description {bottom:10%;position: absolute; padding-left:40px;padding-right:40px}
.banner-N-text .banner-description p {font-size: 18px;line-height: 28px;color: white;text-align: center;}

.banner-N-text h3 {text-align: center;color:#00a7e4;font-weight:400;font-size: 28px;text-transform: uppercase;margin-bottom: 20px;margin-top: 40px;}

.banner-N-text .cards .img{text-align:center}
.banner-N-text .cards .title{text-align:center;text-transform: uppercase;padding-top: 10px;min-height: 50px; font-weight:500}
.banner-N-text .link {text-align:center; margin-bottom:20px}
.banner-N-text  p.desc {font-weight:300; font-size:14px; line-height:1.7}


@media (max-width: 991px) and (min-width: 768px) {
    .banner-N-text .banner-caption {font-size: 24px;transform: translateY(-80%);-ms-transform: translateY(-80%);-moz-transform: translateY(-80%);-webkit-transform: translateY(-80%); -o-transform: translateY(-80%);top: 50%;}
}
@media (max-width: 767px){
    .banner-N-text .banner-img img {width: 100%;}
    .banner-N-text .banner-caption {font-weight:400;padding-top:30px;font-size: 18px;position:relative;color:#4a4a4a; transform:none;-ms-transform:none;-moz-transform:none;-webkit-transform:none; -o-transform:none;}
    .banner-N-text .banner-description {margin-top: 0px;position:relative; padding-left:0; padding-right:0}
    .banner-N-text .banner-description p {font-size: 16px;line-height:24px;padding: 15px 0; color:#4a4a4a; text-align:left}   
    .banner-N-text h3 {font-size:24px;margin-top:0;}     
}


.banner-N-text.style-2 .banner-content {position:absolute; bottom:0;background-color: hsla(0, 0%, 0%, 0.6); width:100%; min-height:110px;}
.banner-N-text.style-2 .banner-content .sub-content {margin:auto}
.banner-N-text.style-2 .banner-caption {transform: none;position: relative;font-size: 32px;font-weight: 400; text-transform:uppercase; }
.banner-N-text.style-2 .banner-description {position: relative; padding-left:40px;padding-right:40px}
.banner-N-text.style-2 .banner-description p {font-size: 16px;line-height:24px;}

@media (max-width: 767px) {
	.banner-N-text.style-2 .banner-content {position:relative;background-color:#000000}
	.banner-N-text.style-2 .banner-description p {color:#ffffff}
	.banner-N-text.style-2 .banner-caption {color:#ffffff}
}

/*------- Block Banners-1 -------------------------------------*/
.banners-1 .content-img {text-align:center}

/*------- Chess Cells -----------------------------------------*/
.chess-cell-content {overflow: hidden;position: relative;padding: 0;height: 210px;}
.chess-cell-image img {width: 100%;height: 210px;}
.chess-cell-content .chess-cell-text {background-color: hsla(197, 100%, 45%, 0.8);min-height: 210px;color: #fff;padding: 40px 15px 0 15px;}
.chess-cell-content .chess-cell-text h1 {font-size: 36px;font-weight: 500;text-transform: uppercase;margin-bottom:20px;}
.chess-cell-content.cell0 .chess-cell-text {background-color: hsla(197, 100%, 45%, 0.8);}
.chess-cell-content.cell1 .chess-cell-text {background-color: hsla(201, 100%, 30%, 0.8);}   
.chess-cell-content.cell2 .chess-cell-text {background-color: hsla(201, 100%, 30%, 0.8);}   
.chess-cell-content.cell3 .chess-cell-text {background-color: hsla(193, 100%, 15%, 0.9);}   
.chess-cell-content.cell4 .chess-cell-text {background-color: hsla(197, 100%, 45%, 0.8);} 
/*------- End Chess Cells -----------------------------------------*/

/*------- Leadership -----------------------------------------*/


/*------- Leadership -----------------------------------------*/
.leadership-block .leadership-data {display: block;margin-bottom: 40px;position: relative;}
.leadership-block .leadership-data .leader-img {margin-bottom: 40px;}
.leadership-block .leadership-data .leader-img img {border: 0 solid;border-radius: 4px;display: block;min-height: 200px;width: 200px;}
.leadership-block .leader-name-desig {bottom: -4px;left: 230px;top: 2%;position: absolute;right: 0;font-size: 36px;margin-top: 20px;font-weight: 500;line-height: 1.1;margin-top: 0;}
.leadership-block .leader-name-desig h1 {font-size: 36px;font-weight:500;text-transform:none; color:#4a4a4a; margin-top:0}
.leadership-block .leader-name-desig .hline {background: hsl(0, 2%, 90%) none repeat scroll 0 0;height: 1px;margin: 20px 0;}
.leadership-block .leader-name-desig p a {text-decoration: none;}
.leadership-block .leader-name-desig p {font-size: 18px;margin: 0 0 10px;line-height: 28px;font-weight: 300;}
#leadershipTab a {padding: 10px 15px;font-size: 20px;}
#leadershipTab a.active:hover  {color: #fff;text-decoration: none;background: hsl(201, 100%, 30%) none repeat scroll 0 0;border-bottom-color: hsl(0, 0%, 87%);border-right-color: hsla(0, 0%, 0%, 0);}
#leadershipTab a:hover {text-decoration: none;background: hsl(0, 0%, 97%) none repeat scroll 0 0;}
#leadershipTab a p {margin: 0 0 10px;line-height: 28px;font-size: 14px;}
#leadershipTab a.active h4 {color:white}

@media (min-width: 768px) {
	#leadershipTabContent {padding-left: 70px;}
}
@media (max-width: 991px) {
	.leadership-block .leader-name-desig h1 {font-size: 28px; line-height:30px}
	.leadership-block .leader-name-desig p.desig {font-size: 18px;line-height:24px!important }
}
@media (max-width: 767px) {
	.leadership-data{margin-top: 20px;}}

/*----------- End Leadership ---------------------------------*/
/*----------- Cards-4 Card Blue----------------------------------------*/
.cards-blue .card-1 {
    position: relative;
    border: 2px solid #fff;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -o-border-radius: 4px;
    border-radius: 4px;
    overflow: hidden;
}
.cards-blue .card-1 .content {
    position: absolute;
    bottom: 0px;
    width: 100%;
}
.cards-blue .card-1 .content .title {
    margin: 0 0 4px;
    padding-top: 10px;
    padding-left: 20px;
    font-size:14px
}
.cards-blue .card-1 .content .sub-content .sub-title {
    font-size: 20px;
    font-weight: 300;
    margin: 0;
    padding-bottom: 10px;
}
.cards-blue .card-1 .content .sub-content .cta {
    display: none;
    padding-bottom: 10px;
}
.cards-blue .card-1:hover .content .cta {
    display: block;
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.cards-blue .card-1 .content .title a{
    color: black;
    text-decoration: none;
}
.cards-blue .card-1 .content .title span {
    background-color: #fff;
    color: #000;
    padding: 4px 10px;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}
.cards-blue .card-1 .content .sub-content {
    padding: 30px 30px 0;
    background-color: rgba(0, 99, 153, 0.9);
    color: #fff;
    min-height: 110px;
    
}
.cards-blue .card-1:hover .content {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
.cards-blue .card-1 .cta {
    font-size: 16px;
    line-height: 26px;
    font-weight: 300;
    list-style: none;
    padding:0;
}
.cards-blue .card-1 .content .sub-content .cta a {
    font-size: 16px;
    font-weight: 400;
    line-height: 28px !important;
        color: #fff;
    text-transform: uppercase;
    text-decoration: none;
    background: hsla(0, 0%, 0%, 0) url(/_catalogs/masterpage/Harman.com/img/white-arrow.png) no-repeat scroll right 5px;
    display: inline-block;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    padding: 0 40px 10px 0;
}
.cards-blue .card-1 .content .sub-content .cta  a:hover {
    padding-right: 55px;
}
.cards-blue .img-bg {height:100%;}
.cards-blue .img-bg img {height:100%;}

@media (max-width: 991px){
    .cards-blue .card-1 .content .sub-content .cta {
        display: block;
    }
    .cards-blue .card-1 .img-bg img{
        height: 500px;
    }
}
/*--------------------------------------------*/
/*----------- Cards-5 Card LightBlue----------------------------------------*/
.cards-blue.light .card-1 .content {bottom: 0;height: auto;min-height: 5px;overflow: hidden;top: inherit;padding-right: 0px;position: absolute;width: 100%;}
.cards-blue.light .card-1 .content .sub-content {background: rgba(0, 164, 227, 0.9) none repeat scroll 0 0;color: #fff;min-height: 10px;height:10px; padding:0 20px}
.cards-blue.light .card-1 .content .sub-content .sub-title {padding-top: 10px;height: 0;transition: all .4s ease-in-out 0s;padding-bottom: 0;font-size:24px; line-height:26px}
.cards-blue.light .card-1:hover .content .sub-content, .cards-blue.light .card-1:hover .content .sub-content .sub-title {
    height:auto
}

@media (max-width: 991px){
    .cards-blue.light .card-1 .content .sub-content .cta {
        display: block;
    }
    .cards-blue.light .card-1 .img-bg img{
        height: 500px;
    }
    .cards-blue.light .card-1 .content .sub-content .sub-title {
    	height: auto;
	}
}

/*--------------------------------------------*/

/*----------- Cards-6----------------------------------------*/
.cards-6 .card-1 {position: relative;border: 2px solid #fff;overflow: hidden;background-color:rgba(0, 164, 227, 0.9);}
.cards-6 .card-1 .content {position: absolute;width: 100%;color: #ffffff;bottom: 0;font-weight: 300;padding: 20px 15px 15px 15px;    min-height: 220px;}
.cards-6 .card-1.bg-blue .content {
	background-color:rgba(0, 164, 227, 0.9)
}
.cards-6 .card-1 .content.short-content {min-height:150px;height:150px; padding-left:30px;}
.cards-6 .card-1 .content.noimage-content {position:relative;padding:25px;}
	
.cards-6 .card-1 .content .title {font-weight: 300;margin: 0;padding-bottom: 15px;text-transform: uppercase;font-size:24px;}
.cards-6 .card-1 .content.noimage-content .title {font-weight:400;}
.cards-6 .card-1 .content .sub-content {color: #fff;min-height: 110px;}
.cards-6 .card-1 .content .sub-content .sub-title {font-size: 14px;font-weight: 300;margin: 0; /*padding-bottom: 10px;*/}
.cards-6 .card-1 .content.short-content .sub-content .sub-title {display:none}
.cards-6 .card-1 .content.no-content {height:auto; min-height:0 }
.cards-6 .card-1 .content.no-content .sub-content {display:none; }
.cards-6 .card-1 .content .title a{color: white;text-decoration: none;}
.cards-6 .card-1 .content .cta {font-size: 16px;line-height: 26px;font-weight: 300;list-style: none;padding:0;bottom:10px;position:absolute}
.cards-6 .card-1 .content .sub-content .cta a {font-size: 16px;font-weight: 400;line-height: 28px !important;color: #fff;text-transform: uppercase;text-decoration: none;    background: hsla(0, 0%, 0%, 0) url(/_catalogs/masterpage/Harman.com/img/white-arrow.png) no-repeat scroll right 5px;    display: inline-block;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    -webkit-transition: all .3s ease-in-out;    -ms-transition: all .3s ease-in-out;    transition: all .3s ease-in-out;    padding: 0 40px 0px 0;}
.cards-6 .card-1 .content.noimage-content .sub-content .cta a {text-transform:none}

.cards-6 .card-1 .content.footer-content {min-height:400px;height:400px;}
.cards-6 .card-1 .content.footer-content .sub-footer a {font-size: 13px;font-weight: 400;line-height: 28px !important;color: #fff;text-decoration: none;background: hsla(0, 0%, 0%, 0) url(/_catalogs/masterpage/Harman.com/img/white-arrow.png) no-repeat scroll right 5px;    display: inline-block;    -moz-transition: all .3s ease-in-out;    -o-transition: all .3s ease-in-out;    -webkit-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;transition: all .3s ease-in-out;padding: 0 30px 0px 0;}
.cards-6 .card-1 .content .sub-content .cta  a:hover {padding-right: 55px;}
.cards-6 .card-1 .content.footer-content .sub-footer a:hover {padding-right: 35px;}

@media (max-width: 768px) {
	.cards-6 .card-1 .content {position: relative;}
}

@media (max-width: 576px) {
	.cards-6 .card-1 .content {position: absolute;}
}
/*------------------------- News Cards ----------------------------*/
.cards-30x70 .cell {background-color:rgba(0, 164, 227, 0.9); border:2px #ffffff solid!important; }
.cards-30x70 .cell .news-content {}
.cards-30x70 .cell .news-content .card-2 {padding-top:20px;padding-bottom:20px;}
.cards-30x70 .cell .news-content .news-text h4,
.cards-30x70 .cell .news-content .news-text h4 a,
.cards-30x70 .cell .news-content .news-text h4 a:visited {font-size:22px;line-height:32px;font-weight:400;color:#ffffff; text-decoration:none}

.cards-30x70 .cell .news-content span.white-arrow {background: url(/_catalogs/masterpage/Harman.com/img/white-arrow.png) no-repeat scroll 0% center;    display: inline-block;    padding: 10px 0;    width: 100px;    margin-left: 25px;    transition: all 0.3s ease-in-out 0s;}
.cards-30x70 .cell .news-content a:hover span.white-arrow {background-position: 20%;}



/*-------------------------Cards CTA-------------------------------*/
.cards-cta .card-1 .img-bg {padding:15px; width:100%}
.cards-cta .card-1 .img-bg img {width:100%}
.cards-cta .card-1 .content {padding:0 15px 15px; min-height:200px;}
.cards-cta .card-1 .content h5 {font-size: 24px;margin-top: 0px;margin-bottom: 10px; font-weight:400}
.cards-cta .card-1 .content h5 a {color:#4a4a4a}
.cards-cta .card-1 .content h5 a:hover {text-decoration:none}
.cards-cta .card-1 .content .cta {position: absolute;bottom: 0px;display: inline-block;padding: 6px 12px;text-align: center;border: 1px solid transparent;text-transform: uppercase;    margin-bottom: 20px;    background: #00a4e4;}
.cards-cta .card-1 .content .cta a {font-size: 14px;color: #fff;}
.cards-cta .card-1 .content .cta a:hover {text-decoration:none}
@media (max-width: 576px) {
	.cards-cta .card-1 .content .cta {position: relative;}
	.cards-cta .card-1 {height:auto!important}
}

/*--------------------------------------------------------*/
.chess-cards .chess-card-footer p {font-weight:300; font-size:16px;line-height:27px; padding-left:30px; padding-right:30px}
.chess-cards .card-2 {padding:30px;background: #eff0f1;}
.chess-cards .card-1 {}
.chess-cards .card-1 .chess-card-image {height:100%;}
.chess-cards .card-1 .chess-card-image img {width:100%; height:100%}
.chess-cards .card-2 .chess-card-text, .chess-cards .card-2 .chess-card-link {padding-left:30px; padding-right:30px}
.chess-cards .card-2 .chess-card-text h3 {color: #006499;font-weight: 400;font-size: 23px;line-height:32px; padding-left:0; padding-top:0}
.chess-cards .card-2 .chess-card-text p {color: #4a4a4a;font-size:21px; font-weight:300;padding-top:0px; line-height:32px;}
.chess-cards .card-2 .chess-card-link a {color: #006499;transition: all 0.3s ease-in-out;text-transform: uppercase;font-size: 18px;}
.chess-cards .card-2 .chess-card-link a:hover {padding-right: 55px; text-decoration:none}
/*-------------------------------------------------------*/

/*--------------------------------------------------------*/
.chess-cards.text .card-2 .chess-card-text h3 {color: #4a4a4a;font-weight: 300;text-transform:none; font-size:22px;line-height:32px;}
.chess-cards.text .card-2 .chess-card-text p {-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;-webkit-column-gap: 40px;-moz-column-gap: 40px;column-gap: 40px;font-weight: 300;font-size: 16px;    line-height: 28px;}
/*-------------------------------------------------------*/

.cards-carousel .card-2 {padding:30px;background: #eff0f1;}
.cards-carousel .card-2 .chess-card-text h3 {color: #4a4a4a;font-weight: 300;text-transform:none; font-size:22px;line-height:32px;}
.cards-carousel .card-2 .chess-card-text p {padding-top:15px;-webkit-column-count: 2;-moz-column-count: 2;column-count: 2;-webkit-column-gap: 40px;-moz-column-gap: 40px;column-gap: 40px;font-weight: 300;    font-size: 16px;    line-height: 28px;}
.cards-carousel .carousel-indicators {left:55%}
.cards-carousel .carousel-control-prev {left:87%}

/*---------------------------------------------------------*/
.cards-twitter .card-1 {background-color:#006DA8}

/*------------------ Grid -------------------------*/
.grid .card-1, .grid .card-2 {padding: 30px;height: 170px;overflow: hidden;border: 2px solid #FFF;border-radius: 4px;}
.grid.grid-blue .card-1 {background-color: #14AAE1;color: #FFF;}
.grid.grid-darkblue .card-1 {background-color: #003B49;color: #FFF;}
.grid .card-2 {border: 2px solid #FFF;border-radius: 4px;padding: 30px;background-color: #E5E4E4;}

.grid .sub-title {font-size: 22px;line-height: 32px; font-weight:500}
.grid .sub-description {font-size: 12px;}
.grid .sub-footer, .grid .sub-footer p {font-weight:300;line-height: 28px;}
.grid .cta a {position: absolute;bottom: 10px; text-transform:uppercase; }
.grid .cta a:hover {text-decoration:none}
.grid .cta a .white-arrow{background: rgba(0, 99, 153, 0) url("/_catalogs/masterpage/Harman.com/img/blue-arrow.png") no-repeat scroll 10px 3px;display: inline-block;transition: all 0.3s ease-in-out 0s;text-decoration: none;width: 50px;vertical-align: top;height: 24px;}
.grid .cta a .white-arrow:hover{background-position: 20px 3px;}

/*------------------ CTA Banner -------------------------*/
.cta-banner {position:relative}
.cta-banner img {width:100%}
.cta-banner .cta-banner-description {background-color: #ece5e5;color: black;position: absolute;/* top: 265px; */bottom: 90px;right: 70px;left: 70px;padding: 30px;line-height: 20px;}
.cta-banner .cta-banner-description p {font-weight: 300;line-height: 28px;}
.cta-banner .cta-banner-description a {background: rgba(0, 164, 227, 0.9) none repeat scroll 0 0;color: white;padding: 7px;border-radius: 3px;text-transform: uppercase;}
@media (max-width: 1024px) {
.cta-banner .cta-banner-description {position: relative;top: 0;left: 0;width: 100%;padding: 15px;font-size: 16px;line-height: 30px;}
}
.cta-banner.style-2 .cta-banner-description {position:relative; background-color:transparent; bottom:auto; left:auto; right:auto;}
.blue-arrow {font-size: 18px;font-weight: 400;line-height: 28px !important;text-transform: uppercase;text-decoration: none;background: hsla(0, 0%, 0%, 0) url(/_catalogs/masterpage/Harman.com/img/blue-arrow.png) no-repeat scroll right 5px;display: inline-block;    -moz-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;-webkit-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;transition: all .3s ease-in-out;padding: 0 40px 0px 0;}


/*---- 3-box ------------*/
/*.slick-box .block-content {margin-left:-15px; margin-right:-15px; width:100%}*/
.slick-box .block-header h2 {text-align: center;color:#00a7e4;font-weight:500;margin-bottom: 20px;margin-top: 40px;}
.slick-box .card0 {position:relative; /*margin-left:15px; margin-right:15px;*/ }
/* slick box */
.slick-box .card0:hover img,
.slick-box .card0:focus img {
  transform: scale(0.9);
  transition: all .5s;
}

/*.slick-box .block-content .content-img img {width:100%;}*/



/*--------------------- FORMS --------------------------*/
.form {padding: 2.5em 1em 1em 1em}
.form-select {width:100%;color: #808284;font-weight: 300;padding: 10px;margin-bottom: 10px;margin-right: 25px;font-size: 14px;border: 1px solid #e5e4e4;height: 40px;border-radius: 0px;}
.form-submit {color: #ffffff!important;border: transparent;padding: 8px;font-size: 16px!important;margin-left: 6px;width: 92px;border-radius: 3px;border-style: none !important;background-color: #337ab7 !important;}
.form-result {padding:10px}
.street-address {padding:0 10px; display:block}
/*--------------------- EXCEPTIONS!!!!! ----------------*/
.harman-inspired-about .card-2 {background:#ffffff}
/*--------------------- EXTENSIONS !!! -----------------*/
.bg-gray {background-color:#e5e4e4!important}
.bg-darkblue {background-color:#006499!important}
.bg-blue {background-color:rgba(0, 164, 227, 0.9)!important}
.height-400 {height:400px}
.height-500 {height:500px}
.width-100 {width:100px!important; position:relative}
.width-100 img {width:100px!important;}
.column-1 p {-webkit-column-count: 1!important;-moz-column-count: 1!important;column-count: 1!important;-webkit-column-gap: 0px!important;-moz-column-gap: 0px!important;column-gap: 0px!important;}

/*-------------------------------------------------------------------*/
/*-------------------- Edit Show Block ------------------------------*/
.edit-block-item-link, .edit-block-approve-item-link, .edit-mode-block-cl {display:none;}
.edit-mode-block {padding:10; background-color:#eeeeee}
.edit-mode-block, .edit-mode-block-cl { z-index:99}
.edit-mode-block button, .edit-mode-block-cl button {min-width:auto}
.updateProgressGear img{z-index: 1001;top: 40%;margin:0px;left:40%;position: absolute;}
.updateProgressGear{margin:0px;padding:0px;top:0px; bottom:0px; left:0px; right:0px;position:absolute;z-index:1000;background-color:#cccccc;filter: alpha(opacity=70);opacity: 0.7;}
.edit-block-link {}
.edit-block-item-link {position:absolute; top:0; left:0; }
.active .edit-block-item-link  {z-index:100}
.edit-block-item-link button {opacity: 0.7;color:#000000; cursor:pointer; min-width:auto;}
.edit-block-approve-item-link {position:absolute; top:0; left:40px;}
.active .edit-block-approve-item-link  {z-index:100}
.edit-block-approve-item-link button {opacity: 0.7;color:green; cursor:pointer; min-width:auto;}
.draft {color:red!important; font-size:11pt;}
.btn-a {margin-left:3px;color: #fff; background: #0073ae;padding: 5px 6px;font-size:10px;line-height: 14px;text-transform: uppercase;border: 0 solid transparent;-moz-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;-webkit-transition: all 0.3s ease-in-out;-ms-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;-webkit-border-radius: 0;-moz-border-radius: 0;-o-border-radius: 0;border-radius: 2px;}
.btn-a:hover {color: #fff;background: #00a4e4;text-decoration: none;}
.btn-a:active {color: #fff;background: #0077b5;text-decoration: none;}
.btn-a:visited {color: #fff;}
.btn-a:focus {color: #fff;background: #0077b5;text-decoration: none;}

/* carousel fix */
.carousel-2 .carousel-item {
    transition-duration: 1.5s;
}

.carousel-2 .carousel-inner .carousel-item {
    min-height: 510px; 
    background-position: center center; 
    background-repeat: no-repeat; 
    background-size: cover;
}


.sticky-navigation .arrow-up {
    background: hsl(201, 100%, 30%) url(/_catalogs/masterpage/Harman.com/img/white-up-arrow.png) no-repeat scroll 0 10px;
    cursor: pointer;
    display: inline-block;
    height: 35px;
    width: 25px;
}

.sticky-navigation .arrow-down {
    background: hsl(201, 100%, 30%) url("/_catalogs/masterpage/Harman.com/img/white-down-arrow.png") no-repeat scroll 0 10px;
    cursor: pointer;
    display: inline-block;
    height: 35px;
    width: 25px;
} 



.scroll_wrapper.darkHeader, .scroll_pos{
    display: inline-block;
}
.sticky-navigation{
    float: right;
}
.scroll_pos {
    padding-top: 10px;
}
#top_to_down {
    font-size: 16px;
    margin-left: 10px;
    margin-top: 10px;
    border-radius: 2px;
    padding: 2px 3px;
    border: 1px solid #fff;
}
.sticky-navigation .menu {
    margin-left: -20px;
    padding: 10px;
    border-radius: 2px;
    text-align: left;
    top: -7px;
}
.scroll_dropdown ul li a:hover, .scroll_dropdown ul li a:focus {
    background-color: #f5f5f5;;
    color: #333;
}
#top_to_down:hover {
    text-decoration: none;
    color: #fff;
}
#top_to_down::after {
    content: "\f0d7";
    font-family: FontAwesome;
    font-size: 16px;
    padding-left: 5px;
    padding-right: 5px;
}
.scroll_wrapper{
    background-color: hsl(201, 100%, 30%);
    padding: 5px 25px 5px 15px;
    margin-top: 0;
    display: none;
    margin-bottom: 0;
    width: 100%;
    line-height: normal;
    font-weight: 300;
    text-transform: uppercase;
}
.scroll_wrapper a{
    color: #fff;
    float:right;
}
.scroll_wrap {
    color: white;
    /*margin-top: 28px;*/
    top: 103px;
    padding: 0;
    position: fixed;
    position: sticky;
    z-index: 99;
    right: 0;
    left: 0;
}
.open .dropdown-menu.menu {
    display: block;
}
body.logged-in .scroll_wrap.container {
    top: 132px;
}
.scroll_dropdown ul.dropdown-menu li {
    min-height: 30px;
}
.scroll_dropdown ul.dropdown-menu {
    background-color: #fff;
}
@media (max-width:1199px) {
    .scroll_wrap {
        top: 77px;
    }
}
@media (max-width:767px) {
    .modal-open {
        padding-right: 0px !important;
    }
}





/* experiments with animations */
.carousel-4 .carousel-item {
 opacity: 0;
 transition-duration: 1.9s;
 transition-property: opacity;
}

.carousel-4  .carousel-item.active,
.carousel-4  .carousel-item-next.carousel-item-left,
.carousel-4  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-4 .active.carousel-item-left,
.carousel-4  .active.carousel-item-right {
 opacity: 0;
}

.carousel-4  .carousel-item-next,
.carousel-4 .carousel-item-prev,
.carousel-4 .carousel-item.active,
.carousel-4 .active.carousel-item-left,
.carousel-4  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}

.carousel-4 .carousel-inner .carousel-item {opacity: 0;top: 0;left: 0;width: 100%;display: block;position: absolute;transition: opacity 1s ease-in-out;}
.carousel-4 .carousel-inner .carousel-item .brand_link {opacity:1;transition: opacity .2s ease-in-out;}
.carousel-4 .carousel-inner .carousel-item:first-of-type {position: relative;}
.carousel-4 .carousel-inner .active {opacity: 1;}


.carousel-4  .active  .brand_link {opacity:1}

.animated {
  -webkit-animation-duration: 1.5s;
  animation-duration: 1.5s;
}

@-webkit-keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    -webkit-transform: translate3d(100px, 0, 0);
    transform: translate3d(100px, 0, 0);
  }

  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}


/* China Temp */
.china-connected-car-page .tweets .carousel-content i,
.china-lifestyle-audio-page .tweets .carousel-content i {display:none;}
.china-connected-car-page .tweets .carousel-content h3,
.china-lifestyle-audio-page .tweets .carousel-content h3 {font-size:21px;}


/*--- Japan Temp ----*/
.japan .circular-cards .cards p.title {font-size:20px; padding: 0 20px;}
.japan .circular-cards .cards p.desc {font-size:1rem}
.japan .circular-cards .cards p.explore {font-size:16px}
.japan .chess-cards .card-1 .chess-card-image img {height:auto}


/*--- Russia Temp ---*/
.russia .chess-cell-content .chess-cell-text {padding-top: 20px;}
.russia .chess-cell-content .chess-cell-text h1 {font-size:28px; margin-bottom:0}

/*---- quick menu fix ------*/
.secondary.d-xl-block {
	display:flex!important
}

.inspired-new .banner-N-text.style-2 .banner-caption {margin-top:30px;}
@media (max-width: 768px) {
.inspired-new .banner-N-text.style-2 .banner-caption {margin-top:0px;}
}