/*Header CSS*/
@media screen and (max-width: 992px) {
	.content-item img {
		height: auto;
	}
	
	.content-desc {
		padding: 25px;
	}
	
}

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

    /* General */
    .hide-mobile {
        display: none;
    }

    .show-mobile {
        display: block;
    }

    .content-container {
        margin-left: 21px;
        margin-right: 21px;
    }

    /* Header */
    .header-logo {
        float: left;
    }

    .header {
        margin-top: auto;
    }

    .openNav {
        font-size: 20px;
        cursor: pointer;
        color: orange;
        margin-left: 10px;
    }

    .header-logo > img {
        height: 26px;
    }

    .mobile-nav nav .container-fluid {
        padding-top: 17px;
        padding-bottom: 17px;
    }

    .mobile-nav nav div.container-fluid > .navbar-header {
        margin-left: auto;
        margin-right: auto;
    }

    .search-icon {
        float: right;
        color: orange;
        padding-top: 3px;
        padding-bottom: 3px;
    }

    /* Mobile primary/side nav menu */
    .sidenav {
        height: 100%;
        width: 0;
        position: absolute;
        z-index: 2000000;
        top: 0;
        left: 0;
        background-color: black;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 60px;
        color: white;
        display: block;
		/* font-family: 'Frank Ruhl Libre', serif; */
		font-family: 'Roboto', sans-serif;
    }

    .sidenav > a {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 20px;
        color: white;
        /* color: #818181; */
        display: block;
        transition: 0.3s;
        font-weight: bold;
    }

    .sidenav a:hover {
        color: white;
    }

    .sidenav .closebtn {
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 64px;
        margin-left: 50px;
    }

    .sidenav .closebtn i {
        object-fit: contain;
        transform: rotate(-315deg);
        font-size: 48px;
    }

    /* Microsite mobile primary menu */
	.sidenav-micro {
        height: 100%;
        width: 0;
        position: absolute;
        z-index: 200000;
        top: 0;
        left: 0;
        background-color: #f7f7f7;
        overflow-x: hidden;
        transition: 0.5s;
        padding-top: 60px;
        color: #212121;
        display: block;
		/* font-family: 'Frank Ruhl Libre', serif; */
		font-family: 'Roboto', sans-serif;
    }
    
    .sidenav-micro .navmenu, .sidenav-micro > a {
        padding: 8px 8px 8px 32px;
        display: block;
    }

    .sidenav-micro .navmenu > a, .sidenav-micro > a {
        color: #212121;
        transition: 0.3s;
        font-weight: bold;
        font-size: 20px;
        text-decoration: none;
    }

    .sidenav-micro a:hover {
        color: #B4B4B4;
    }

    .sidenav-micro .closebtn {
        color: #212121;
        position: absolute;
        top: 0;
        right: 25px;
        font-size: 64px;
        margin-left: 50px;
    }

    .sidenav-micro .closebtn i {
        object-fit: contain;
        transform: rotate(-315deg);
        font-size: 48px;
    }
    
    .sidenav-micro-link {
        display: inline-block;
    }
    
    #main {
        display: block;
        transition: all .5s ease-in-out;
    }

    /* Homepage Carousel */
    #myCarousel .carousel-inner > .item {
        min-height: 318px;
		background-size: cover;
    }

    .carousel-side-image {
        display: none;
    }

    .carousel-text {
        position: relative;
        left: auto;
        top: auto;
        max-width: 100%;
    }

    .carousel-text-box {
        padding: 40px;
    }

    .carousel-text-box h3 {
        margin: 0;
    }

    .carousel-text .line-2 {
        position: absolute;
        left: -16px;
        top: 52px;
    }

    /* End of Homepage Carousel */
    /* Page pageBreadcrumb */
    .pageBreadcrumb {
        margin-left: 0;
        margin-top: 60px;
        margin-bottom: 32px;
        display: flex;
        align-items: center;
    }

    .pageBreadcrumb span {
        display: none;
    }

    .pageBreadcrumb h2 {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
    }

    .pageBreadcrumb .rectangle-2 {
        display: none;
    }

    .pageBreadcrumb .line-2 {
        margin-right: 16px;
        display: inline-block;
    }

    /* Breadcrumb inside page header */
    .pageHeader {
        margin-top: 28px;
    }

    .pageBreadcrumb-head {
        margin-left: 0;
        margin-top: 32px;
        display: flex;
        align-items: center;
    }

    .pageBreadcrumb-head span {
        display: none;
    }

    .pageBreadcrumb-head h3 {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
    }

    .pageBreadcrumb-head .rectangle-2 {
        margin-right: 14px;
        width: 32px;
        height: 10px;
    }

    /* Header Image */
    .header-img {
        min-height: 146px;
    }

    /* Generic page header title */
    .has-side-margins {
        margin-left: 0;
        margin-right: 0;
    }

    /* map */
    .contact-info {
        margin-left: 0;
        margin-right: 0;
    }

    .map div iframe {
        height: 207px;
    }

    .info-box {
        padding-top: 0;
        padding-left: 0;
        margin-top: 32px;
        margin-bottom: 0;
    }

    .info-title {
        margin-bottom: 8px;
    }

    /* Accordion */
    .info-accordion {
        margin-top: 22px;
    }

    .accordion .accordion-title-button {
        padding: 24px 0 36px;
    }

    .accordion-title {
        margin-left: 0;
        margin-right: 0;
    }

    div.accordion-title .title {
        font-size: 20px;
        display: block;
        max-width: 300px;
    }

    div.accordion-title .title:after {
        font-size: 20px;
    }

    .panel {
        /* margin-top: 32px; */
    }

    .panel-content {
        margin-left: 4px;
        margin-right: 4px;
        padding: 24px 0;
        height: auto;
        border-bottom: solid 1px #e7e7e7;
    }

    /*.panel-content-row .content-container {*/
    /*border-bottom: solid 1px #e7e7e7;*/
    /*}*/
    .panel-content > div {
        margin-top: 0;
    }

    .panel-content-title {
        margin-bottom: 16px;
        font-size: 16px;
    }

    .panel-content-details {
        font-size: 18px;
    }

    .simple-panel-content {
        padding: 0;
        margin-bottom: 0;
    }

    .load-more-div {
        display: none;
    }

    .accordion-table tr.accordion-header th:not(:last-child), .table.accordion-table tr td:not(:last-child) {
        white-space: nowrap;
    }

    .accordion-table tr.accordion-header th:first-child, .table.accordion-table tr td:first-child {
        padding-left: 20px;
        border-right: 1px solid #e7e7e7;
    }

    /* Accordion styling overrides for article page inner columns */
    .accordion-item-inner > .accordion-button {
        left: 0;
    }

    .accordion-item-inner .accordion-title-button {
        padding-top: 24px;
        padding-right: 0;
        padding-bottom: 36px;
        margin-right: 0;
    }

    .accordion-item-inner .accordion-title {
        margin-left: 0;
        margin-right: 0;
    }

    /* cta */
    .cta {
        display: block;
        margin: 20px 8px;
    }

    .cta-desc {
        margin-top: 6px;
        max-width: 100%;
        padding-right: 0;
    }

    .cta-image {
        padding: 0;
    }

    .cta-image .line-2 {
        display: none;
    }
    
    .cta-btn {
        width: 94%;
        display: block;
    }

    /* cta with video carousel */
    #videoCarousel .carousel-inner .item img {
        height: auto;
        max-height: 312px;
        width: 100%;
    }

    #videoCarousel .carouselControl {
        max-height: 40px;
    }

    #videoCarousel .carouselControl .nextBtn, #videoCarousel .carouselControl .prevBtn {
        width: 12%;
    }
    
    /* Teaser Image */
    .teaser-image {
        margin-top: 64px;
        display: block;
    }

    .teaser-image-item {
        height: 172px;
        width: 100%;
        display: flex;
        align-items: center;
        box-shadow: 0px 8px 20px 5px darkgrey;
    }

    .teaser-title {
        margin-bottom: 8px;
        display: block;
    }

    .teaser-desc {
        display: block;
    }

    .teaser-image-box {
        margin-bottom: 32px;
    }

    /* page footer */
    .page-footer {
        margin-top: 64px;
    }

    .navigate-links-content {
        margin-bottom: 24px;
    }

    .navigate-links-content a {
        display: block;
    }

    .navigate-links, .social-links {
        margin-bottom: 64px;
    }
    
    .view-more {
        padding: 0;
    }

    .subscribe-email-input {
        border-radius: 4px;
        box-shadow: 0 2px 4px 0 rgba(49, 49, 49, 0.12), 0 0 1px 0 rgba(239, 242, 247, 0.5);
        border: solid 0.5px transparent;
    }

    .footer-container {
        margin-bottom: 64px;
    }

    /* Footer bottom */
    .footer-bottom div span {
        float: none;
        display: block;
    }

    .footer-bottom div span:not(.copyright) {
        margin-bottom: 16px;
    }

    .footer-link, .copyright {
        margin-left: 0;
    }

    .footer-right-column {
        padding-left: 15px;
    }
    
    /* functionality container */
    .functionality-container {
        display: none;
    }

    /* Ask Feature */
    .ask-feature-row {
        display: none;
    }

    /* back to top */
    .back-to-top {
        display: none;
    }

    /* Image header white rectangle and filter button */
    .filter-box, .white-rectangle {
        display: none;
    }

    /* Listing filter option */
    .listing-filter-multi {
        margin-left: 0;
        margin-right: 0;
    }
    
    .filter-box {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
    
    .filter-show {
        display: block;
        margin-bottom: 0;
    }
    
    .filter-options > .option-heading {
        font-size: 24px;
        margin-top: 8px;
    }
    
    .filter-options > .option-section {
        margin-top: 10px;
    }

    .filter-options > .option-section > .section-header {
        font-size: 18px;
    }

    .filter-options > .option-section > .section-content > .dropdown, .dropdown-menu {
        width: 100%;
    }
    
    .filter-options > .option-buttons {
        margin-top: 30px;
    }
    
    .filter-options-multi {
        padding-left: 15px;
    }

    /* About MTI */
    .hightlight-text-box-mobile {
        display: block;
        margin-top: 32px;
    }

    .hightlight-text-box {
        display: none;
    }

    .about-details {
        padding: 0;
    }

    .teaser-content-box {
        padding: 0;
    }

    .teaser-list {
        display: block;
    }

    .teaser-img-box .line {
        display: none;
    }

    .core-value-img {
        box-shadow: 0 12px 22px 0 rgba(49, 49, 49, 0.26), 0 0 1px 0 rgba(239, 242, 247, 0.4);
        border-style: solid;
        border-width: 0.5px;
        border-color: transparent;
    }

    /* back to top button */
    .back-to-top {
        display: none;
    }

    /* Profile Grid */
    .content-item-box {
        padding: 0;
    }

    .content-item {
        width: 100%;
        /* margin-bottom: 32px; */
    }

    .tab button {
        padding: 17px 12px;
        font-size: 16px;
        margin-right: 0;
    }

    .tab {
        display: flex;
    }

    /* simple accordion */
    .simple-accordion-content {
        padding: 24px 0 0;
    }

    /* External Image Grid */
    .ex-img-grid {
        display: block;
        margin: 0;
    }

    .ex-img-grid div img {
        max-width: 125px;
        max-height: 57px;

    }

    .ex-img-grid div:nth-last-child(n+3) img {
        margin-bottom: 56px;
    }

    .ex-img-grid-mobile {
        display: block;
        padding: 0 19px;
    }

    .ex-img-grid-mobile div {
        align-items: center;
    }

    .ex-img-grid-mobile div img {
        margin: auto;
        height: auto;
        max-width: 100px;
        max-height: 88px;
    }

    .ex-img-grid-mobile div {
        display: inline-flex;
    }

    .ex-img-grid-item {
        min-height: 128px;
        margin-bottom: 16px;
    }

    /* Title Image Summary Teaser */
    .TIS-teaser-box {
        padding: 24px 38px 37px 51px;
        margin-bottom: 32px;
		max-width: 100%;
    }

    .TIS-teaser {
        margin-left: 4px;
        margin-right: 4px;
    }

    .TIS-teaser-title {
        margin-top: 50px;
    }

    .TIS-teaser-summary h3 {
        margin-bottom: 24px;
    }

    .TIS-teaser-link a {
        margin-top: 16px;
    }

    #tis-carousel-mobile .carousel-inner .item .item-content {
        padding-top: 15px;
        padding-bottom: 20px;
    }

    #tis-carousel-mobile .carousel-indicators {
        bottom: -32px;
    }

    #tis-carousel-mobile .carousel-indicators li {
        background-color: #e7e7e7;
    }

    #tis-carousel-mobile .carousel-indicators li.active {
        background-color: #f78f1e;
    }

    .TIS-teaser-2 {
        margin-top: 0;
    }

    /* Profile Quote */
    .profile-quote {
        margin-top: 0;
        margin-bottom: 88px;
    }

    .profile-quote .carousel-indicators {
        bottom: -46px;
        left: 0;
    }

    span.profile-pos {
        max-width: 300px;
    }

    /* Jumbotron Carousel */
    #jumbotronCarousel {
        height: auto;
		margin-bottom: 0;
    }

    .jumbotron-carousel {
        margin-top: 120px;
        margin-bottom: 32px;
		
    }

    .jumbotron-carousel-content {
        position: relative;
        right: auto;
        top: auto;
        box-shadow: 0 12px 22px 0 rgba(49, 49, 49, 0.26), 0 0 1px 0 rgba(239, 242, 247, 0.4);
        border: solid 0.5px transparent;
		max-width: 100%;
    }

    .jumbotron-carousel-imgBox {
        background-position: center center;
        background-repeat: no-repeat;
        background-size: cover;
        max-width: 867px;
        height: 234px;
    }

    .jumbotron-carousel-textbox {
        padding: 30px 36px 37px 27px;
    }

    .jumbotron-carousel-textbox h3 {
        margin-top: 0;
        margin-bottom: 16px;
    }

    .jumbotron-carousel-textbox p {
        font-size: 16px;
        margin-bottom: 16px;
    }

    #jumbotronCarousel ul.carousel-indicators {
        bottom: auto;
        left: 0;
        width: auto;
        margin-left: auto;
        top: -48px;
        right: auto;
        margin-bottom: 0;
    }

    #jumbotronCarousel ul.carousel-indicators > li {
        display: inline-block;
        margin-bottom: 0;
        margin-right: 16px;
    }

    #jumbotronCarousel ul.carousel-indicators li:first-of-type {
        margin-left: 32px;
    }

    #jumbotronCarousel .line-2 {
        position: absolute;
        left: -19px;
        top: -40px;
    }

    /* TIS carousel */
    .highlight-desc {
        font-size: 16px;
        margin-bottom: 24px;
    }

    .TIS-carousel {
        margin-left: 0;
        margin-right: 0;
    }

    #tis-carousel-mobile .carousel-inner .item .item-content {
        padding: 5px 3px 0 3px;
    }

    .summary-description {
        max-width: 269px;
    }

    #tis-carousel-mobile .carousel-indicators {
        bottom: -24px;
    }

    /* KEI */
    .indicators-mobile {
        margin-top: 37px;
    }

    .indicators-mobile > div {
        text-align: center;
    }

    .indicators-mobile > div .numbers-desc {
        font-size: 14px;
        color: #757575;
    }

    .indicators-mobile h1.numbers i, .minus-sign {
        margin-right: 8px;
    }

    .indicators-mobile h1.numbers:after {
        content: '%';
    }

    .indicators-mobile h1.numbers.positive:before {
        content: "add";
        font-family: 'Material Icons';
        display: inline-block;
        vertical-align: middle;
        font-size: 24px;
        margin-right: 8px;
        color: #2fc2d4;
    }

    .indicators-mobile h1.numbers.negative {
        color: red;
    }

    .indicators-mobile h1.numbers.negative:before {
        content: "-";
        margin-right: 8px;
    }

    .indicator-desc {
        max-width: 280px;
        display: block;
    }

    /* Normal List */
    .list-content {
        margin-left: 16px;
        margin-right: 16px;
        margin-top: 6px;
        padding: 24px 0;
        height: auto;
    }

    .list-content-row .content-container {
        border-bottom: solid 1px #e7e7e7;
    }

    .list-content > div {
        margin-top: 0;
    }

    .list-content-title {
        margin-bottom: 16px;
        font-size: 16px;
    }

    .list-content-details {
        font-size: 18px;
    }

    /* Microsite listing layout */
    .list-content-micro {
        height: auto;
        margin: 0 10px;
    }

    .list-content-details-micro {
        margin-top: 16px;
    }

    /* Details/Article page types styling */
    .col-lg-7 {
        padding-left: 2px;
        padding-right: 2px;
    }

    .article-info {
        margin-top: 24px;
        margin-bottom: 24px;
        margin-left: 32px;
    }
    
    .info-next {
        margin-top: 12px;
        margin-left: 0;
    }

    .article-share {
    }

    .article-share > hr {
        margin-bottom: 0;
        width: 100%;
    }

    .article-share .share-icons {
        margin-top: 10px;
    }

    .panel-content-row > .article-content {
        margin-left: 0;
        margin-right: 0;
    }

    #videoCarousel .carouselControl.carousel-media-teaser {
        right: 0%;
    }

    /* Profile component classes */
    .profile-title-text {
        padding-right: 4px;
        font-size: 16px;
    }

    .profile-title-summary {
        padding-left: 0;
        padding-right: 0;
        padding-top: 10px;
        font-size: 14px;
    }

    .profile-summary-text {
        padding-right: 4px;
        font-size: 14px;
        line-height: 18px;
        margin-top: 4px;
    }

    .profile-button {
        float: right;
        font-size: 24px;
        display: inline-block;
        position: absolute;
        top: 22px;
        right: 0;
    }

    .profile-content {
        font-size: 16px;
    }

    /* Search related stuffs */
    /** Global Search Dialog **/
    .search-modal {
        margin-top: 58px;
        margin-left: 22px;
        margin-right: 22px;
        padding: 0 40px;
        min-height: 600px;
    }

    .sm-close-btn {
        top: 26px;
        right: 26px;
    }

    .sm-close-btn > i {
        font-size: 32px;
    }

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

    .sm-input-text {
        margin-top: 0;
        padding: 16px 36px 16px 0;
        font-size: 16px;
    }

    .sm-input-search {
        top: -44px;
    }

    .sm-input-search > i {
        font-size: 30px;
    }

    .sm-suggest {
        font-size: 16px;
		width: 89%;
    }

    .sm-suggest .sm-suggest-item {
		padding: 10px 0 10px 0;
		font-size: 16px;
    }
	
	.sm-suggest .sm-suggest-item > a {
		margin-left: 0px;
	}

    /** Search Results **/
    .search-input {
        margin-top: 10px;
        margin-left: 0;
        margin-right: 0;
    }

    .result-category {
        margin-top: 28px;
    }

    .result-category-header {
        margin-left: 0;
        margin-right: 0;
    }

    .result-category-header > h3 {
        font-size: 24px;
    }

    .result-category-header > span {
        font-size: 14px;
        margin-left: 14px;
        top: -14px;
    }

    .result-category-summary {
        margin: 28px 0 0 0;
        color: #757575;
        font-size: 16px;
        line-height: 24px;
    }

    .result-category-list {
        margin-left: 0;
        margin-right: 0;
    }

    .view-all-item {
        margin-left: 16px;
    }

    .result-category-empty {
        margin-right: 0;
        margin-left: 0;
    }

    /* Chart */
    .chart-category {
        margin-bottom: 0;
    }
    
    .chart-modes {
        margin-bottom: 20px;
    }

    .chart-category .chart-category-selector-arrow {
        position: relative;
        float: right;
        top: -64px;
        left: 0;
    }

    .charts{
        padding-top: 0;
    }

    .chart-tables {
        padding-top: 0;
    }
    
    .chart-table {
        overflow-x: auto;
    }
    
    .dropdown-generic {
        padding: 18px 36px 18px 4px;
        margin-top: 16px;
    }

    .dropdown-item > a {
        padding: 14px 0 14px 0;
    }

    .chart-category-selector {
        width: 100%;
    }

    .chart-mode-selector {
        width: 49.2%;
    }

    .chart-legend {
        display: block;
        margin-left: 4px;
    }
    
    .legend-label {
        font-size: 16px;
    }
    
    .legend-color {
        margin-right: 4px;
    }

    .primary-search-container .active {
        margin: 10px 21px 0;
    }

    .employee-name {
        margin-left: 0;
        margin-right: 0;
    }

    .accordion-load-more {
        margin-left: 0;
    }
	
    /* Timeline */
    .tl-item-date {
        font-size: 12px;
        color: #f78f1e;
        padding-left: 18px;
        padding-right: 18px;
    }

    .tl-date-selected {
        background-color: #f78f1e;
        color: white;
    }
    
    .tl-content-body {
        padding-right: 0;
        padding-left: 0;
    }
	
	.content-item-row {
		flex-direction: column;
		flex-wrap: nowrap;
	}
    
    .masthead {
        text-align: center;
        padding: 0;
    }
}

@media screen and (max-height: 450px) {
    /*.sidenav {*/
        /*padding-top: 15px;*/
    /*}*/
    
    /*.sidenav a {*/
        /*font-size: 18px;*/
    /*}*/

    #videoCarousel .carouselControl.carousel-media-teaser {
        right: 0%;
    }

    .profile-title-summary {
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 10px;
    }
}

@media screen and (max-width: 320px) {
    div.accordion-title .title {
        display: block;
        max-width: 250px;
    }

    #videoCarousel .carouselControl.carousel-media-teaser {
        right: 0%;
    }

    .profile-title-summary {
        padding-left: 0px;
        padding-right: 0px;
        padding-top: 10px;
    }
	
	.content-item-box {
		width: 320px;
	}
}