﻿@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Open+Sans');
/* MME UI */
/* 20230823 */

:root { 
    --defaultFont: "Open Sans",Arial,sans-serif;

    --defaultBlue:#0a3a58;
    --defaultOrange:#c65e00;
    --defaultYellow:#ffc114;
    --defaultLightBlue:#e5f1fe;
    
    --divider-bg: #dee5e8;
    --nav-shadow: 0 4px 10px -4px rgba(0, 0, 0, 0.25);
    --nav-box-inner-shadow: inset -0 -1px #7892a7;
    --nav-box-outer-shadow: 0 2px 2px rgba(0, 0, 0, .12);
    --nav-button-shadow: 0 0 0px 1px #7892a7;
    --transition: all .28s ease-in-out;
}

/*------------------- 
    Common 
------------------- */
* { font-family: 'Open Sans', Arial, 'sans-serif'; }
body { margin: 0; padding: 0; font-family: 'Open Sans', Arial, 'sans-serif'; font-weight: normal; font-size: 16px; color: #334d65; }
.container { width: 100%; margin: 0; padding: 0; }
.content { min-width: 970px; margin: 0 auto; padding: 20px 25px; border-radius:.267em; background:#fff; box-sizing: border-box; /*transform:translateY(-70px);*/ }
.header { background: var(--defaultBlue); }
.footer { width:100%; margin:50px auto 20px auto; font-size:12px; text-align:center; color:#666; /*transform:translateY(-50px);*/ }
div { box-sizing:border-box; }
ul, li { margin: 0; padding: 0; }
dl, dd { margin: 0; padding: 0; }
li { display: inline-block; list-style: none; }
a { border: none; outline: none; }
.txt_c { text-align:center; }
.txt_b { font-weight: bold; }
.txt_underline { text-decoration:underline; }
.hide { display:none!important; transition:var(--transition); }
input[type="checkbox"] { width:16px; height:16px; }

/*------------------- 
    Grid 
------------------- */
.header dl { display: grid; grid-template-columns: 290px 1fr; grid-template-rows: 1fr; grid-column-gap: 50px; grid-row-gap: 0px; }
.header dl dd:nth-child(1) { grid-area: 1 / 1 / 2 / 2; }
.header dl dd:nth-child(2) { grid-area: 1 / 2 / 2 / 3; }

.content { display: grid; grid-template-columns: 290px 1fr; grid-template-rows: 1fr; grid-column-gap: 20px; grid-row-gap: 0px; }
.left-menu { grid-area: 1 / 1 / 2 / 2; }
.main-contents { grid-area: 1 / 2 / 2 / 3; }

.lender-container .item dl { display: grid; grid-template-columns: 1fr; grid-template-rows: 160px 1fr; grid-column-gap: 0px; grid-row-gap: 10px; }
.lender-container .item dd { grid-area: 1 / 1 / 2 / 2; }
.lender-container .item dt { grid-area: 2 / 1 / 3 / 2; }

.fav-container dl { display: grid; grid-template-columns: 38px 1fr; grid-template-rows: 1fr; grid-column-gap: 0px; grid-row-gap: 0px; align-items: stretch; justify-content: space-around; justify-items: start; align-content: space-evenly; }
.fav-container dt { grid-area: 1 / 1 / 2 / 2; }
.fav-container dd { grid-area: 1 / 2 / 2 / 3; }

/*------------------- 
    Header 
------------------- */
.header { width:100%; padding:10px 0 12px 25px; }
.header dl dd { vertical-align:bottom; }
.header dl dd:nth-child(1) img { max-width: 270px; vertical-align:middle; }

/*search box*/
.header .search-box { width: 500px; height: 40px; border-radius: 5px; background: #fff; transform:translateY(40px); }
.header .search-box input[type="text"] { width: 440px; height: 30px; margin: 4px 0 4px 15px; border: none; color: #334d65; font-size: 1.2rem; outline: none; }
.header .search-box i { color: #91afbb; font-size: 1.3rem; vertical-align:-1px; cursor:pointer; }
.header .search-box i:is(:focus, :active, :hover) { opacity:.8; }

/*------------------- 
    Layout 
------------------- */

/*left menu*/
.left-menu { width:290px; height:fit-content; padding:0 10px; }
.left-menu img { width:90%; margin:0 auto; }

/*main contents*/
.main-contents { padding-left:30px; border-left:1px solid #b0c0c9; }

/*------------------- 
    Login 
------------------- */
.login-container {
display: grid;
grid-template-columns: 1fr 450px;
grid-template-rows: 80px 1fr;
grid-column-gap: 20px;
grid-row-gap: 0px;
}
.login-container { max-width:1200px; margin:0 auto; padding:0 0 0 20px; }
.login-container .login-logo  { grid-area: 1 / 1 / 2 / 2; }
.login-container .login-intro { grid-area: 2 / 1 / 3 / 2; }
.login-container .login-form { grid-area: 1 / 2 / 3 / 3; }

.login-container .login-logo { padding:15px; border-bottom:1px solid #ddd; text-align:left; }
.login-container .login-logo img { max-height:300px; }

.login-container .login-intro { /*position:relative;*/ padding:6.5vh 10px; height:80vh; box-sizing:border-box; }
.login-container .intro-custom { /*position:absolute; top:50%;*/ color:inherit; word-break:break-word; /*transform: translateY(-50%);*/ }


/*Broker Portal custom color*/

body {
    --custom-login-bg: var(--defaultBlue);
    --custom-nav-color: #3b5c74;
    --custom-btn-color: #334d65;
    --custom-nav-bg-0: "url('/images/Menu/button_transparent.png') no-repeat top left ";
    --custom-nav-bg-0-sandbox: "url('/images/Menu/button_transparent.png') no-repeat top left";
    --custom-nav-bg-1: "url('/images/Menu/button_transparent.png') no-repeat top left ";
    --custom-nav-bg-2: "url('/images/Menu/button_transparent.png') no-repeat top left ";
    --custom-nav-bg-3: "url('/images/Menu/button_transparent.png') no-repeat top left ";
    --custom-nav-bg-quick: "url('/images/Menu/button_transparent.png') no-repeat top left ";
    --custom-nav-bg-quick-text: "url('/images/Menu/button_transparent.png') no-repeat top left";
}

.login-container .login-form { position:relative; height:100vh; min-height:530px; margin:0; padding:10vh 30px; background:var(--custom-login-bg); color:#fff; }
.login-container .login-form dt { margin:6vh 0 40px 0; padding:0 0 0 15px; color:#fff; font-size:30px; font-weight:700; text-align:left; }
.login-container .login-form dd { position:relative; margin:8px 0; }
.login-container .login-form dd i { position:absolute; top:13px; right:18px; color:#fff; font-size:18px; opacity:.2; pointer-events:none; }
.login-container .login-form input:not([type="checkbox"]) { overflow:hidden; width:100%; height:46px; padding:2px 38px 2px 18px; border:1px solid #fff; border-radius:5.382rem; background:transparent; color:#fff; font-size:16px; white-space:nowrap; text-overflow:ellipsis; box-sizing:border-box; }
.login-container .login-form input:is(:focus, :active, :hover) { background:transparent; color:#fff; outline:none; }
.login-container .login-form input:is(:focus, :active, :hover):not(:-webkit-autofill) { background:transparent; color:#fff; outline:none; }
/*.login-container .login-form input:is(:focus, :active, :hover):not(:-webkit-autofill) { background:var(--defaultLightBlue); color:var(--defaultBlue); outline:none; }*/
/*.login-container .login-form input:is(:focus, :active, :hover) + i { color:var(--defaultBlue); }*/
/*.login-container .login-form input[type="checkbox"]:checked + label { color:var(--defaultYellow); }*/
.login-container .login-form label { margin-left:3px; vertical-align:4px; cursor:pointer; }
.login-container .login-form .btn-login { width:100%; margin-top:30px; padding:.72rem 2rem; border:1px solid var(--defaultLightBlue); border-radius:5.382rem; background:var(--defaultLightBlue); color:var(--defaultBlue); font-size:18px; outline:none; box-shadow:none; }
.login-container .login-form .btn-login:is(:focus, :active, :hover) { border:1px solid #5496bf; background:#5496bf; color:#fff; text-decoration:underline; cursor:pointer; /*; outline:4px solid rgba(80, 165, 220, 0.3);*/ }
.login-container .login-form .sub-txt { margin-top:15px; font-size:.8em; text-align:center; cursor:pointer; }
.login-container .login-form .sub-txt input[type="checkbox"] { margin-left:9px; }
.login-container .login-form a.txt_link { margin:0 auto; color:#fff; opacity:.5; text-decoration:none; }
.login-container .login-form a.txt_link:is(:focus, :active, :hover) { opacity:.8; text-decoration:underline; }
.login-container .login-form a.txt_underline { margin:0 auto; color:#fff; }
.login-container .login-form a.txt_underline :is(:focus, :active, :hover) { opacity:.8; }
.login-container .login-form .copyright-container { position:absolute; bottom:20px; width:390px; }
.login-container .login-form .copyright-container dd { text-align:center; }
.login-container .login-form .copyright { color:#fff; font-size:10px; opacity:.5; }

/*------------------- 
    Main Contents 
------------------- */

/*index*/
.list-index dl { display: flex; justify-content: flex-start; align-items: start; justify-items: center; align-content: space-between; flex-wrap: wrap; flex-direction: row; grid-column-gap: 5px; grid-row-gap: 5px; }
.lender-container .item { align-items: flex-start; align-content: flex-start; flex-direction: column; justify-content: flex-start; }

.list-index { margin:6px 0 25px 0; }
.list-index dl dd { width:32px; height:32px; border:1px solid #dfdfdf; border-radius:2px; color:#538fc5; text-align:center; line-height:32px; box-sizing:border-box; }
.list-index dl dd:is(:focus, :active, :hover) { border:1px solid var(--defaultBlue); background:var(--defaultBlue); color:#fff; cursor:pointer; }
.list-index dl dd.on { border:1px solid var(--defaultBlue); background:var(--defaultBlue); color:#fff; }
.list-index dl dd.on:is(:focus, :active, :hover) { opacity:.94; }
.list-index dl dd.disabled { background:#ebebeb; color:#a5a5a5; }
.list-index dl dd.disabled:is(:focus, :active, :hover) { border:1px solid #dfdfdf; background:#ebebeb; cursor:default; } 
.list-index dl dd:nth-child(1) { width:58px; }

/*Lender list*/
.list-wrap { position:relative; }
.lender-container { /*width:1110px;*/ width:100%; margin:0 auto; }
.lender-container { display: flex; justify-content: flex-start; align-items: start; justify-items: center; align-content: space-between; flex-wrap: wrap; flex-direction: row; grid-column-gap: 10px; grid-row-gap: 5px; }
.lender-container .item { align-items: flex-start; align-content: flex-start; flex-direction: column; justify-content: flex-start; }

.lender-container .item { display: inline-block; width: 270px; min-height: 220px; padding: 5px 0; background: none; text-align: left; box-sizing: border-box; transition:var(--transition); }
.lender-container .item dt { text-align: center; word-break:break-word; }
.lender-container .item dd { position: relative; border: 1px solid #dedede; border-radius: 5px; text-align:center; line-height:160px; box-shadow: 0 4px 10px -4px rgba(0, 0, 0, 0.18); }
.lender-container .item dd img { max-width:260px; max-height: 150px; vertical-align:middle; }
.lender-container .title { display:block; width:49%; min-height:40px; color:var(--defaultBlue); font-size:18px; font-weight:600; line-height:40px; box-sizing:border-box; }

/*Favorites list*/
.fav-container { /*width:1110px;*/ width:100%; margin:0 auto; padding-bottom:30px; }
.fav-container { display: flex; justify-content: flex-start; align-items: stretch; justify-items: center; align-content: center; flex-wrap: wrap; flex-direction: row; grid-column-gap: 10px; grid-row-gap: 5px; }

.fav-container dl { min-height:38px; }
.fav-container dd { padding:7px 7px 7px 0; text-align:left; word-break:break-word; }
.fav-container .title { display:block; width:100%; min-height:40px; margin-bottom:5px; color:var(--defaultBlue); font-size:18px; font-weight:600; line-height:40px; box-sizing:border-box; }
.fav-container .item { position:relative; width:270px; border: 1px solid #dedede; border-radius: 5px; background:#fff; text-align:center; box-shadow: 0 3px 8px -4px rgba(0, 0, 0, 0.18); }
.fav-container .item i.fa-star { top: 9px; left: 8px; }
.item i.fa-star { position: absolute; top: 7px; left: 7px; z-index: 2; color:#ffc114; font-size: 18px; cursor:pointer; }
.item i.fa-star:not(.disabled):is(:focus, :active, :hover) { cursor:pointer; opacity:.85; }
.item i.fa-star.disabled { color:#ddd; }

/*sort option*/
.sort-container { width:49%; min-width:230px; text-align:right; }
.sort-container i { width:40px; height:40px; margin-left:5px; border-radius:40px; background:#ededed; text-align:center; font-size: 20px; line-height:40px; }
.sort-container span { color:var(--defaultBlue); font-size:16px; font-weight:600; }
.sort-container span:is(:focus, :active, :hover) { opacity:.9; cursor:pointer; }

/*------------------- 
    Popups 
------------------- */
.popup_wrap { position:absolute; top:20%; left:255px; z-index:3; width:600px; border:2px solid var(--defaultBlue); border-radius:.267em; background:#fff; text-align:center; box-shadow:0 4px 10px -4px rgba(0, 0, 0, .55); }
.popup_wrap .popup_title { height:40px; padding:8px 0 0 8px; background:var(--defaultBlue); color:#fff; text-align:left; }
.popup_wrap i.btn_close { display:inline-block; position:absolute; top:8px; right:8px; overflow:hidden; float:right; width:24px; height:24px; color:#fff; font-size:24px; font-weight:bold; line-height:24px; vertical-align:middle; cursor:pointer; }
.popup_wrap i.btn_close:is(:focus, :active, :hover) { cursor:pointer; }
.popup_wrap .popup_cont { margin:55px auto; }
.popup_wrap .btn-group { width:100%; min-width:inherit; height:50px; margin:0 0 20px 0; border-bottom-left-radius:5px; border-bottom-right-radius:5px; text-align:center; }
.popup_wrap .btn-group dl dd { display:inline-block; width:40%; }
.popup_wrap .btn-group dl dd:only-child { width:90%; max-width:250px; }
.popup_wrap .btn-group dl dd button { width:100%; }
.btn_comm { min-width:200px; padding:.72rem 2rem; border:1px solid var(--defaultBlue); border-radius:.382rem; background:var(--defaultBlue); font-size:calc(.9rem + .2vw); color:#fff; outline:none; box-shadow:none; }
.btn_comm:is(:focus, :active, :hover) { opacity:.9; cursor:pointer; }


/*------------------- 
    Scales 
------------------- */
.pdL15 { padding-left: 15px; }
.mgT10 { margin-top: 10px; }
.mgT15 { margin-top: 15px; }
.mgT20 { margin-top: 20px; }
.mgT25 { margin-top: 25px; }
.mgT30 { margin-top: 30px; }
.mgT35 { margin-top: 35px; }
.mgB10 { margin-bottom: 10px; }
.mgB15 { margin-bottom: 15px; }
.mgB20 { margin-bottom: 20px; }
.mgB25 { margin-bottom: 25px; }
.mgB30 { margin-bottom: 30px; }
.mgB35 { margin-bottom: 35px; }
.mgB40 { margin-bottom: 40px; }
.mgB45 { margin-bottom: 45px; }
.mgB50 { margin-bottom: 50px; }
.mgB55 { margin-bottom: 55px; }


/*placeholder_color*/
input:not([type="checkbox"])::-webkit-input-placeholder { color: #607d8b !important; }
input:not([type="checkbox"]):-moz-placeholder { color: #607d8b !important; }
input:not([type="checkbox"])::-moz-placeholder { color: #607d8b !important; }/* Firefox 18- */
input:not([type="checkbox"]):-ms-input-placeholder { color: #607d8b !important; }/* Firefox 19+ */

.login-form input:not([type="checkbox"])::-webkit-input-placeholder { color: #fff !important; opacity:.5; }
.login-form input:not([type="checkbox"]):-moz-placeholder { color: #fff !important; opacity:.5; }
.login-form input:not([type="checkbox"])::-moz-placeholder { color: #fff !important; opacity:.5; }/* Firefox 18- */
.login-form input:not([type="checkbox"]):-ms-input-placeholder { color: #fff !important; opacity:.5; }/* Firefox 19+ */

.login-form input:not([type="checkbox"]):is(:focus, :active, :hover)::-webkit-input-placeholder { color: #fff !important; }
.login-form input:not([type="checkbox"]):is(:focus, :active, :hover):-moz-placeholder { color: #fff !important; }
.login-form input:not([type="checkbox"]):is(:focus, :active, :hover)::-moz-placeholder { color: #fff !important; }/* Firefox 18- */
.login-form input:not([type="checkbox"]):is(:focus, :active, :hover):-ms-input-placeholder { color: #fff !important; }/* Firefox 19+ */

input:autofill,
input:autofill:is(:focus, :active, :hover),
textarea:autofill,
textarea:autofill:is(:focus, :active, :hover),
select:autofill,
select:autofill:is(:focus, :active, :hover) { border:1px solid #fff; background:none!important; font-size:16px; font-family:var(--defaultFont); -webkit-text-fill-color:#fff; text-fill-color:#fff; -webkit-box-shadow:none; box-shadow:none; -webkit-background:transparent; transition:background-color 5000s ease-in-out 0s; }


input:-internal-autofill-selected,
input:-internal-autofill-selected:is(:focus, :active, :hover),
input:-webkit-autofill,
input:-webkit-autofill:is(:focus, :active, :hover),
textarea:-webkit-autofill,
textarea:-webkit-autofill:is(:focus, :active, :hover),
select:-webkit-autofill,
select:-webkit-autofill:is(:focus, :active, :hover) { border:1px solid #fff; background:none!important; font-size:16px; font-family:var(--defaultFont); -webkit-text-fill-color:#fff; text-fill-color:#fff; -webkit-box-shadow:none; box-shadow:none; -webkit-background:transparent; /*transition:background-color 5000s ease-in-out 0s;*/ }

/*------------------- 
    Media Query 
------------------- */
/*@media screen and (max-width:920px) {
    .lender-container .item .title { width:60%; }
    .lender-container .item .sort-container { width:38%; }
}*/


/*default css*/
p { margin-top:1em; margin-bottom:1em; }