﻿@import url("/MandiriEUCTheme/Theme.MandiriEUCTheme.css?107");

/* ================================================

Primary color customization
For additional color customizations, you can change the color code for the colors below

  ================================================ */

:root {

    /* Color - Brand */
    --color-primary: #1a5289;
    --color-primary-light: #459dda;
    --color-secondary: #ffb700;
    --color-tertiary: #cab076;
    
}

/* #2469a5 */

@font-face {
    font-family: MyriadPro;
    src: url(/WebLelangFrontEnd/MyriadPro-Regular.woff) ;
}

@font-face {
    font-family: MyriadPro-SemiBold;
    src: url(/WebLelangFrontEnd/MyriadPro-Semibold.woff) ;
}

html {
    font-family: MyriadPro;
}

.font-semibold {
    font-family: MyriadPro-SemiBold;
}

/* App Icon */
.app-logo {
    width: 100px;
    border-radius: var(--border-radius-none);
    height: auto;
}

.layout .header-top {
    height: 72px;
    font-size: 17.6px;
}

/*
.layout .header {
    background-color: var(--color-primary);
}

.header a,
.header .Menu_TopMenu a {
    color: var(--color-neutral-0);
}

.header a:hover {
    color: var(--color-secondary);
}

.header .Menu_TopMenu:hover > div .fa,
.header .Menu_TopMenu:hover > div a,
.header .Menu_TopMenu:hover > div a:visited {
    color: var(--color-secondary);
}

.header .Menu_TopMenu > div a,
.header .Menu_TopMenu > div a:visited {
    color: var(--color-neutral-0);
}

.header .Menu_DropDownButton {
    color: var(--color-neutral-0);
}

.header .Menu_DropDownButton:hover {
    color: var(--color-secondary);
}

.Menu_TopMenu > div .Menu_DropDownArrow:before,
.Menu_TopMenu > div .Menu_DropDownArrow:after {
    background-color: var(--color-neutral-0);
}

.Menu_TopMenu:hover > div .Menu_DropDownArrow:before,
.Menu_TopMenu:hover > div .Menu_DropDownArrow:after {
    background-color: var(--color-secondary);
}

.header .Menu_TopMenuActive > div a,
.header .Menu_TopMenuActive > div a:visited,
.header .Menu_TopMenuActive > div a:hover,
.header .Menu_TopMenu:hover.Menu_TopMenuActive > div a {
    color: var(--color-secondary);
    font-weight: var(--font-semi-bold);
}

.header .header-right {
    color: var(--color-neutral-0);
}

.header .badge-icon .icon {
    color: var(--color-neutral-0);
}
*/

/* Menu Styles */
.Menu_TopMenu > div a,
.Menu_TopMenu > div a:visited {
    color: var(--color-neutral-10);
}

.Menu_TopMenu > div a:hover {
    color: var(--color-primary-light);
}

.Menu_TopMenuActive > div a,
.Menu_TopMenuActive > div a:visited,
.Menu_TopMenuActive > div a:hover,
.Menu_TopMenu:hover.Menu_TopMenuActive > div a {
    font-weight: var(--font-regular);
}

.Menu_TopMenuActive > div a,
.Menu_TopMenuActive > div a:hover,
.Menu_TopMenu:hover.Menu_TopMenuActive > div a {
    color: var(--color-tertiary);
}

.Menu_TopMenuActive > div a:visited {
    color: var(--color-neutral-8);
}

.header .Menu_TopMenu:hover,
.header .Menu_TopMenu.Menu_TopMenuActive {
    border-bottom: var(--border-size-l) solid var(--color-secondary);
}

.header-content {
    display: flex;
    align-items: center;
}

/* Common Menu */
.header .Menu_TopMenu {
    padding: var(--space-s);
}

.Menu_TopMenu > div {
    font-weight: var(--font-regular);
}

.Menu_DropDownPanel a:hover {
    background: var(--color-neutral-2);
}

/* Menu Dropdown */
.dropdown-scroll {
    height: 480px;
    overflow-y: scroll;
}

/* Search */
.header-center {
    /*justify-content: center;*/
}

.header .search {
    width: 400px;
}

.header .search {
    position: absolute;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
}

/* Login Info */
.LoginInfo_Wrapper {
    width: auto;
    position: relative;
}

.LoginInfo_Wrapper .dropdown .dropdown-header.select {
    border: none;
    padding: var(--space-xs);
    
    background-color: transparent;
    color: #1a5289;
}

.LoginInfo_Wrapper .dropdown.is--visible .dropdown-content {
    width: 160px;
    position: absolute;
    right: 0;
}

.LoginInfo_Wrapper .dropdown.is--visible .dropdown-content .dropdown-content-list {
    padding: var(--space-s);
    max-height: unset;
    width: 165px;
}

.LoginInfo_Wrapper .dropdown .Detail {
    padding-bottom: var(--space-s);
    border-bottom: var(--border-size-s) solid var(--color-primary-20);
}

/* Home Carousel */
.main-carousel .carousel .tns-ovh {
    height: 500px;
    overflow: hidden;
}

.main-carousel .Carousel_Info .carousel .carousel-arrow-left,
.main-carousel .Carousel_Info .carousel .carousel-arrow-right {
    background: var(--color-neutral-0);
    height: 40px;
    width: 40px;
    color: var(--color-neutral-7);
    font-weight: normal;
}

/* Home Icon Categories */
.iconCategory .carousel {
    background: #2469a5;
}

.iconCategory .carousel .carousel-arrow-left,
.iconCategory .carousel .carousel-arrow-right {
    height: 50px;
    background-color: rgba(0,0,0,.4);
    color: var(--color-neutral-0);
}

.iconCategory .carousel .carousel-arrow-left:hover,
.iconCategory .carousel .carousel-arrow-right:hover {
    background-color: rgba(0,0,0,.8);
}

.iconCategory .carousel .carousel-arrow-left {
    border-radius: 0 8px 8px 0;
}

.iconCategory .carousel .carousel-arrow-left {
    left: 0 !important;
}

.iconCategory .carousel .carousel-arrow-right {
    border-radius: 8px 0 0 8px;
}

.iconCategory .carousel .carousel-arrow-right {
    right: 0 !important;
}

.iconCategory .carousel .tns-ovh {
    padding: 30px 60px;
}

/* Table Header */
.TableRecords_Header a,
.TableRecords_Header a:visited {
    color: var(--color-neutral-0);
}

.TableRecords .TableRecords_Header,
.EditableTable thead th {
    font-weight: var(--font-regular);
}

.desktop-hd .ThemeGrid_Container {
    max-width: 1920px;
}

/* Detail Agunan Tabs Content */
.tabs .tabs-content {
    min-height: 220px
}

.tabs .tabs-content ol {
    margin-block-start: 0px;
    margin-block-end: 0px;
    padding-inline-start: 12px;
}

/* Footer Web Lelang */
.layout-top .content-bottom .footer.ThemeGrid_Container {
    padding: var(--space-none);
    margin: var(--space-none);
    max-width: 100%;
}

.range-slider-values {
    display: none;
}

/* Custom Sticky */

.hideHeader {
    display: none;
}

.layout .header {
    top: 50px;
    position: unset;
}

.layout .content {
    top: 50px;
}

.layout .header {
    box-shadow: 0 3px 4px 0 rgba(21, 24, 26, .1);
}
/* Custom Class */
.center-custom {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

/* Desktop Menu Tweak */
.desktop .header-center {
    padding: var(--space-none) var(--space-none) var(--space-none) var(--space-xl);
}

.desktop .header .Menu_TopMenus {
    flex-direction: row;
    justify-content: flex-end;
}

.desktop .socialMedia .LoginInfo_Wrapper .dropdown-content {
    z-index: 101;
}

/* Phone Class */
.phone .layout .main {
    padding-top: var(--space-none);
}

.phone .headerWebLelang .socialMedia {
    right: 0;
}

.phone .headerWebLelang .search {
    display: none;
}

.phone .footerweblelang {
    padding: var(--space-base);
}

.phone .main-carousel .carousel .tns-ovh {
    height: 160px;
}

.phone .iconCategory .carousel .tns-ovh {
    padding: 10px 30px;
}




.phone .layout .content {
    top: unset;
}

.phone .main-carousel {
    height: 160px;
}

.phone .main-carousel .tns-item img {
    height: 160px !important;
}

.phone .header .Menu_TopMenu {
    padding: var(--space-none) var(--space-s);
}

.phone .Menu_TopMenu > div {
    height: unset;
}

.phone .header .Menu_DropDownPanel,
.tablet .header .Menu_DropDownPanel {
    position: absolute ;
}

.phone .dropdown-scroll {
    height: unset;
    overflow-y: unset;
}
