@charset "UTF-8";

/* we love king*/

/**img {
     -webkit-filter:grayscale(75%);
     filter:grayscale(75%);
}
 html {
     -webkit-filter:grayscale(75%);
     filter:grayscale(75%);
}
*/

@font-face {
    font-family: 'kitti';
    src: url('/iwov-resources/fonts/KittithadaBold75.eot');
    src: url('/iwov-resources/fonts/KittithadaBold75.eot?') format('embedded-opentype'), url('/iwov-resources/fonts/KittithadaBold75.woff2') format('woff2'), url('/iwov-resources/fonts/KittithadaBold75.woff') format('woff'), url('/iwov-resources/fonts/KittithadaBold75.ttf') format('truetype');
    font-weight: 600;
    font-style: bold;
}
@font-face {
    font-family: 'kitti';
    src: url('/iwov-resources/fonts/KittithadaMedium65.eot');
    src: url('/iwov-resources/fonts/KittithadaMedium65.eot?') format('embedded-opentype'), url('/iwov-resources/fonts/KittithadaMedium65.woff2') format('woff2'), url('/iwov-resources/fonts/KittithadaMedium65.woff') format('woff'), url('/iwov-resources/fonts/KittithadaMedium65.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}
@font-face {
    font-family: 'kitti';
    src: url('/iwov-resources/fonts/KittithadaLight45.eot');
    src: url('/iwov-resources/fonts/KittithadaLight45.eot?') format('embedded-opentype'), url('/iwov-resources/fonts/KittithadaLight45.woff2') format('woff2'), url('/iwov-resources/fonts/KittithadaLight45.woff') format('woff'), url('/iwov-resources/fonts/KittithadaLight45.ttf') format('truetype');
    font-weight: 200;
    font-style: light;
}
.heading1 {
    font-size: 34px;
    text-transform: none;
}
.navbar-header .block-dropdowns {
    left: auto;
}
html, body, p, a, li, h4, td, th
{
    font-family: kitti;
    font-size: 23px;
    line-height: 1em;
    font-weight: lighter
}
.mainnav {
    text-align: -webkit-center;
}


/* Otto 22 Mar 2023 for Big font on 3 col*/
.image-item-wrap .content-text {
    font-size: 25px;

}
                                  
/*.mainnav > li {
    width: 10%;
}
*/

/*.mainnav > li > a {
    padding:0.75em 0;
     width:100%;
     font-size: 20px;
     font-weight: 600;
     height: 50px !important;
}
 by Tah*/



blockquote {
    font-size: 17.5px;
    padding: none;
    margin: none;
    border-left: 20px solid #FFF;
}

*.mainnav > li > a {
    padding: 6px 0;
    width: 100%;
    font-size: 25px;
    font-weight: lighter;
    max-height: 65px
}
.mainnav > li > a {
    vertical-align: top
}
.nav-content .list-unstyled a {
    font-size: 1em;
}
/*.nav-content .list-unstyled a {
    font-size: 22px;
     font-weight: lighter
}
*/

/*a.sublink2 {
     font-size:24px;
     font-weight: lighter
}
*/

/*30 Sep 2021*/
.content-block .row p {
    font-size: 23px;
}

/*20 Jul 2020 --- Remove banner space
.main-banner .description {
    padding: 0px;
}*/


/*11 Aug 2020*/
.tdnoborder {border:0px !important;}


/*29 Jun 2020*/
.grid-items {
    clear: both;
}


/*27 feb 2020*/

.bx-wrapper img {min-height: auto !important;}


/* fix font in listing  on Mobile for Persona TH is too small*/
.select-box .dropdown-menu ul li a {font-size: 20px;}
.sticky-wrapper .section-title .heading2.subtitle + span { font-size:23px}
.btn-1 { font-size:23px}

/* fix Persona TH รายละเอียดห่างเกินไป*/
.group-box .see-more { top: 15px; font-size:20px; top : 15px !important}

.group-box .title {padding: 10px; font-size:20px !important}

/* fix  P font in mobile is too small*/
.content-block .row p strong {
	font-size:23px;
}

/* for default*/
.business-detail-block .business-item {
    padding-bottom: 0px;
}
.business-detail-block .business-block .heading3 {
    font-size: 30px;
 }
.alert span {
    font-size: 23px;
}
/* for default*/
.normal,
.bullet,
.free-text p {
    font-size: 23px;
    font-weight: lighter !important;
}
.navbar-header .block-dropdowns button span {
    font-size: 20px;
}
.grid-content .inner h3 {
    font-size: 25px;
}
.grid-content .inner p {
    font-size: 20px;
}
#footer .nav a,
#footer .block-term a,
#footer .block-term p,
.side-bar a {
    font-size: 20px;
    font-weight: 100;
}
#footer .block-term p {
    font-size: .875rem;
}
.out-dock ul.side-wideget li a {
    font-size: 18px;
    font-weight: 600;
}
.out-dock ul.side-wideget:hover {
    width: 230px !important;
}
.side-bar h2 {
    font-size: 22px;
}
.bx-pager a .bx-pager-tabs {
    font-weight: 600;
    font-size: 25px;
}
.navbar-header .block-dropdowns .dropdown-menu ul li a,
.nav-content,
.mainnav .menu-level2 {
    font-weight: lighter;
}
/*.navbar-header .block-dropdowns .dropdown-menu ul li a, .nav-content, .mainnav .menu-level2 {
    font-weight: 400;
}
 by Tah*/

.text-bold {
    font-weight: 600 !important;
}
.main-banner .btn-1 {
    font-size: 25px;
}
.img100auto {
    width: 100%;
    height: auto;
    margin: 0 auto;
}
.tableforall .normal {
    padding: 10px;
    border: 1px #CCCCCC solid;
}
.tdpadding td {
    padding: 10px;
    border: 1px #CCCCCC solid;
}
.tdpadding0 td {
    padding: 10px;
    border: 0px #CCCCCC solid;
}
.tableforall td {
    padding: 10px;
    border: 1px #CCCCCC solid;
}
.tableforall p.normal {
    border: 0px !important
}
.tableColor td {
    padding: 10px;
    border: 1px #CCCCCC solid;
}
.mw500px {
    width: 500px;
    height: 100%;
}
div .news_header p img {
    width: 100%;
    max-width: 500px;
    height: 100%
}
.news_header span strong {
    text-align: center;
    padding: 20px;
    font-size: 24px !important;
    font-weight: bold;
}
.news_header {
    text-align: center;
    padding: 20px;
    font-size: 24px !important;
    font-weight: bold;
}
.news_subheader {
    text-align: center;
    padding: 20px;
    font-size: 21px;
    font-weight: bold;
}
div .free-text table td {
    padding: 10px;
    border: 1px #CCCCCC solid;
}
div .free-text div .box {
    display: block;
    padding: 10px 10px 50px 10px;
    background: #FFF;
    border: solid 1px #CCCCCC
}
div .box p {
    padding: 10px;
}
div .free-text div .box-grey {
    display: block;
    padding: 10px;
    background: #EEE;
}
div.description p strong {
    font-size: 24px
}
div.description p {
    font-size: 24px
}
div.description desSmall {
    font-size: 14px
}
/*div.content-text strong, p {
     font-size:18px !important
}
*/

div.free-text table.tablenobd tbody tr td {
    border: 0px
}
div.free-text img {
    height: auto
}
div.col h2 {
    font-size: 23px;
}
div.thumb {
    display: none
}
#indent li {
    margin-left: -15%
}
.boxDLform {
    padding: 10px;
    border-bottom: #CCC 2px solid
}
.bttnPromo {
    padding: 10px;
    background-color: #CCC;
    color: #FFFFFF;
    width: 150px;
    text-align: center
}
/*a.iw_disabled {
     font-size:22px;
     color:#FFF
}
*/

h5.heading5 {
    font-size: 24px
}
/*div.alert.alert-info {
     text-align:center
}
*/

.panel-default > .panel-heading a {
    font-size: 23px;
	font-weight:700;
}

.content-block p {
    font-size: 23px;
}
#header4u span strong {
    font-size: 30px
}
div.main-banner.middle {
    width: 100% !important;
    top: 0px !important
}
div.collapse-body table {
    margin: 20px 0
}
h3.heading3 {
    margin-bottom: 0px !important
}
div.grid-desc {
    padding: 0px !important
}
p.news-header {
    font-size: 23px !important;
    font-weight: bold;
    text-align: center
}
.content-block ul li {
    font-size: 23px
}
.nav-tabs li a {
    font-size: 23px
}
.nav-tabs.nav-justified li a {
    font-size: 23px;
    font-weight: 400
}
div.content-text p {
    font-size: 23px !important
}
.grid-items .grid-desc p {
    font-size: 23px
}
.apply-now-fixed p {
    font-size: 23px
}
.mainnav .menu-level2.open .submenu-level2 h2 {
    font-size: 23px
}
.collapse-block .collapse.fck table tbody td:first-child {
    display: inline-block;
    width: 100%;
}
.apply-now-fixed .btn-1 {
    font-size: 23px;
    font-weight: 400
}
.main-banner .light-banner .description {
    padding-bottom: 0px
}
/*.bxslider .main-banner.right .caption {
     width:auto 
}
*/

/* Start Modal */

.modal-window {
    position: fixed;
    background-color: rgba(255, 255, 255, 0.15);
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
}
.modal-window:target {
    opacity: 1;
    pointer-events: auto;
}
.modal-window>div {
    width: 1000px;
    position: relative;
    margin: 10% auto;
    padding: 2rem;
    background: #fff;
    color: #444;
}
.modal-window header {
    font-weight: bold;
}
.modal-close {
    color: #aaa;
    line-height: 50px;
    font-size: 80%;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 70px;
    text-decoration: none;

}
.modal-close:hover {
    color: #000;
}
.modal-window h1 {
    font-size: 150%;
    margin: 0 0 15px;
}


.cards-list .card-item span,
.sticky-nav .nav-tabs li .button-compare span,
.sticky-nav .nav-tabs li .button-compare .count,
.button-compare-tab.clear-all .button-compare span,
.cards-list .card-item .btn-1 {
	font-size: 23px;
}
.sticky-nav .nav-tabs li .button-compare span {
	margin-top: -3px;
}
.sticky-nav .nav-tabs li .button-compare .count {
	margin-top: 0;
}
.cards-list .heading2 {
    opacity: 0;
}

.bx-pager a .bx-pager-tabs {
    text-transform: inherit;
}

@media screen and (min-device-width: 768px) {
    ul.mainnav > li {
        height: 0px;
    }
    ul.mainnav > li > a.sublink1 {
        width: 100%;
        height: 100% !important;
        display: table !important;
    }
}
/* Close Modal */

@media only screen and (max-device-width: 1024px) and (min-device-width: 768px) and (orientation: portrait),
only screen and (max-width: 991px) and (min-width: 768px) {
    .block-dropdowns .dropdown-menu ul li a {
        font-size: 21px !important;
    }
    .navbar-header .dropdown-item-heading {
        font-size: 21px !important;
    }
    span.text-bold {
        font-size: 19px !important;
    }
    .mainnav .menu-level2 > a {
        font-size: 23px !important;
    }
}
/*
@media only screen and (max-width: 767px) {
    #coliyc9zv53 ul > li:first-child {
        background-color: rgb(88, 77, 71) !important;
    }
}
*/

@media only screen and (max-width: 767px) {
	#footer .block-socials li a {
		overflow: hidden;
		text-indent: inherit;
	}
	.main-banner .bx-wrapper img[data-uob-tg-mobile="show"] {
		height: auto !important;
	}
}

@media screen and (max-device-width: 480px) {
    .mainnav > li {
        width: 100%;
        text-align: left;
    }
    .sublink1 {
        padding-left: 2.5em !important;
    }
    .mainnav .menu-level2 > a {
        font-size: 23px;
    }
    /*.mainnav .menu-level2 > a {
        font-size: 19px;
    }
    */
    .mainnav .menu-level1.open .sublink1,
    .mainnav .menu-level2.open .submenu-level2 a,
    .mainnav .menu-level2.open .sublink2 > span,
    .mainnav .menu-level1.open > a > span {
        font-size: 23px;
    }
    /* .mainnav .menu-level1.open .sublink1, .mainnav .menu-level2.open .submenu-level2 a, .mainnav .menu-level2.open .sublink2 > span, .mainnav .menu-level1.open > a > span {
        font-size: 19px;
    }
    */
    .mainnav .menu-level1.open .sublink1:before {
        margin-top: -9px;
    }
    .mainnav .menu-level2.open .sublink2:before {
        margin-top: -2px;
    }
    ul.key-wideget img {
        height: 1.5em;
        margin-bottom: 10px;
    }
    .out-dock ul.key-wideget li {
        padding: 10px 0;
    }
    .out-dock ul.key-wideget {
        width: 100vw;
    }
    #footer .block-term p {
        white-space: inherit;
    }
    #footer .block-term .list-unstyled a {
        font-size: 18px;
    }
}
/*
#main-navbar {
    font-family:kitti;
     font-weight:600;
}
 .mainnav {
    text-align:center;
    display: initial;
}
 .mainnav li {
    text-align: left;
}
 .mainnav > li > a {
    font-size:1.4em;
     height: 2.2em !important;
     padding: 17px 0px 6px 0px;
     width: 100%;
     padding-left: 2.5em;
}
 .mainnav .menu-level1.open .sublink1 {
    font-size: 1.3em;
    padding: 11px;
    padding-left: 2.5em;
}
 .mainnav .menu-level1 .lv1 {
    padding: 12px 10px;
}
 .submenu-level1 {
    top: 180%;
}
 .mainnav .menu-level2 > a {
    margin-top:-3px;
}
 .mainnav .menu-level2 {
    padding: 0.25em;
}
 .mainnav .menu-level2 > a, .nav-content .list-unstyled a {
    font-size:1.3em;
    padding-left: 2.5em;
}
 .nav-content .list-unstyled a {
    padding: 0.5em;
}
 .heading1 {
    font-size: 36px;
    font-family: kitti;
}
 .bx-pager-tabs {
    font-size: 25px !important;
     font-family: kitti;
     font-weight: 600;
}
 .side-bar a {
    font-size: 18px;
}
 .side-bar h2 {
    font-size: 22px;
}
 .tbl-content {
    font-family:kitti;
}
 .grid-content .inner h3 {
    font-size: 27px;
     margin-top: 1.5em;
}
 .grid-content .inner p {
    font-size: 22px;
}
 .side-wideget {
    width:225px !important;
}
 .out-dock ul.side-wideget li a {
    font-size: 18px;
    font-weight: 600;
    font-family: kitti;
}
 a.dtm-anchor, .block-term .float-l {
    font-family: kitti;
    font-size: 18px !important;
    font-weight: 600;
}
 .caption {
    font-family: kitti;
}
 .main-banner .btn-1 {
    font-size: 1.5em;
}
 .submenu-level1 .menu-level2 .lv2 {
    margin-top: 0px;
     padding: 12px 10px;
}
*/


/* add css 1 Oct 2018 */
.list-item ol {
    counter-reset: item;
}
.list-item ol li {
    display: block;
    position: relative;
}
.list-item ol li:before {
    content: counters(item, ".")".";
    counter-increment: item;
    position: absolute;
    margin-right: 100%;
    right: 10px;
}
.align-top {
    vertical-align: top;
}
.align-middle {
    vertical-align: middle;
}
.align-bottom {
    vertical-align: bottom;
}
.align-text-top {
    vertical-align: text-top;
}
.align-text-bottom {
    vertical-align: text-bottom;
}

.m-0 {
    margin: 0!important;
}
.m-5 {
    margin: 5px!important;
}
.m-10 {
    margin: 10px!important;
}
.m-15 {
    margin: 15px!important;
}
.m-20 {
    margin: 20px!important;
}

.mt-0 {
    margin-top: 0!important;
}
.mt-5 {
    margin-top: 5px!important;
}
.mt-10 {
    margin-top: 10px!important;
}
.mt-15 {
    margin-top: 15px!important;
}
.mt-20 {
    margin-top: 20px!important;
}

.mr-0 {
    margin-right: 0!important;
}
.mr-5 {
    margin-right: 5px!important;
}
.mr-10 {
    margin-right: 10px!important;
}
.mr-15 {
    margin-right: 15px!important;
}
.mr-20 {
    margin-right: 20px!important;
}

.mb-0 {
    margin-bottom: 0!important;
}
.mb-5 {
    margin-bottom: 5px!important;
}
.mb-10 {
    margin-bottom: 10px!important;
}
.mb-15 {
    margin-bottom: 15px!important;
}
.mb-20 {
    margin-bottom: 20px!important;
}

.ml-0 {
    margin-left: 0!important;
}
.ml-5 {
    margin-left: 5px!important;
}
.ml-10 {
    margin-left: 10px!important;
}
.ml-15 {
    margin-left: 15px!important;
}
.ml-20 {
    margin-left: 20px!important;
}

.p-0 {
    padding: 0!important;
}
.p-5 {
    padding: 5px!important;
}
.p-10 {
    padding: 10px!important;
}
.p-15 {
    padding: 15px!important;
}
.p-20 {
    padding: 20px!important;
}

.pt-0 {
    padding-top: 0!important;
}
.pt-5 {
    padding-top: 5px!important;
}
.pt-10 {
    padding-top: 10px!important;
}
.pt-15 {
    padding-top: 15px!important;
}
.pt-20 {
    padding-top: 20px!important;
}

.pr-0 {
    padding-right: 0!important;
}
.pr-5 {
    padding-right: 5px!important;
}
.pr-10 {
    padding-right: 10px!important;
}
.pr-15 {
    padding-right: 15px!important;
}
.pr-20 {
    padding-right: 20px!important;
}

.pb-0 {
    padding-bottom: 0!important;
}
.pb-5 {
    padding-bottom: 5px!important;
}
.pb-10 {
    padding-bottom: 10px!important;
}
.pb-15 {
    padding-bottom: 15px!important;
}
.pb-20 {
    padding-bottom: 20px!important;
}

.pl-0 {
    padding-left: 0!important;
}
.pl-5 {
    padding-left: 5px!important;
}
.pl-10 {
    padding-left: 10px!important;
}
.pl-15 {
    padding-left: 15px!important;
}
.pl-20 {
    padding-left: 20px!important;
}

.d-none {
    display: none!important;
}
.d-inherit {
    display: inherit!important;
}
.d-block {
    display: block!important;
}
.d-inline-block {
    display: inline-block!important;
}
.d-table {
    display: table!important;
}
.d-table-row {
    display: table-row!important;
}
.d-table-cell {
    display: table-cell!important;
}
.d-flex {
	display: -webkit-flex!important;
	display: flex!important;
}
.d-flex > div {
	-webkit-flex: 1;
	-ms-flex: 1;
	flex: 1;
}
.d-table.w-100 {
    width: 100%;

}

@media screen and (max-width: 767px) {
    .d-xs-none {
        display: none!important;
    }  
	.d-xs-inherit {
		display: inherit!important;
	}	 
    .d-xs-block {
        display: block!important;
    }
    .d-xs-inline-block {
        display: inline-block!important;
    }
    .d-xs-table {
        display: table!important;
    }
    .d-xs-table-row {
        display: table-row!important;
    }
    .d-xs-table-cell {
        display: table-cell!important;
    }
	.d-xs-flex {
		display: -webkit-flex;!important;
		display: flex!important;
	}
	.d-xs-flex > div {
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}
}

@media screen and (min-width: 768px) {
    .d-sm-none {
        display: none!important;
    }  
	.d-sm-inherit {
		display: inherit!important;
	}
    .d-sm-block {
        display: block!important;
    }
    .d-sm-inline-block {

        display: inline-block!important;
    }
    .d-sm-table {
        display: table!important;
    }
    .d-sm-table-row {
        display: table-row!important;
    }
    .d-sm-table-cell {
        display: table-cell!important;
    }
	.d-sm-flex {
		display: -webkit-flex;!important;
		display: flex!important;
	}
	.d-sm-flex > div {
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}	
}

@media screen and (min-width: 992px) {
    .d-md-none {
        display: none!important;
    }  
	.d-md-inherit {
		display: inherit!important;
	} 
    .d-md-block {
        display: block!important;
    }
    .d-md-inline-block {
        display: inline-block!important;
    }
    .d-md-table {
        display: table!important;
    }
    .d-md-table-row {
        display: table-row!important;
    }
    .d-md-table-cell {
        display: table-cell!important;
    }   
	.d-md-flex {
		display: -webkit-flex;!important;
		display: flex!important;
	}
	.d-md-flex > div {
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}	
}

@media screen and (min-width: 1200px) {
    .d-lg-none {
        display: none!important;
    }  
	.d-lg-inherit {
		display: inherit!important;
	}  
    .d-lg-block {
        display: block!important;
    }
    .d-lg-inline-block {
        display: inline-block!important;
    }
    .d-lg-table {
        display: table!important;
    }
    .d-lg-table-row {
        display: table-row!important;
    }
    .d-lg-table-cell {
        display: table-cell!important;
    }   
	.d-lg-flex {
		display: -webkit-flex;!important;
		display: flex!important;
	}
	.d-lg-flex > div {
		-webkit-flex: 1;
		-ms-flex: 1;
		flex: 1;
	}	
}
/* add css at 20-oct-2022 fix navlink uob convenient & deposit */
.mainnav ul.sub2{
	min-height: 400px !important;
}
/*changes font size and color page security awareness */

.section-title > .heading2{
	font-size : 1.4rem;
    color: #005EB8;
}

/* Add CSS for link interaction */
.section-content .content-block a:not([href^="https://www.uob.co.th/personal/promotions"]),
.section-content .content-block a:link:not([href^="https://www.uob.co.th/personal/promotions"]) {
    color: #0044a0;
  	/*text-decoration: underline 1px;*/
}

.section-content .content-block a:hover:not([href^="https://www.uob.co.th/personal/promotions"]),
.section-content .content-block a:active:not([href^="https://www.uob.co.th/personal/promotions"]),
.section-content .content-block a:focus:not([href^="https://www.uob.co.th/personal/promotions"]) {
  	cursor: pointer;
    text-decoration: underline 1px;
}
.main-banner .description a[href^="/personal/promotions/i-plan"],
.main-banner .description a[href^="/personal/promotions/i-plan"]:link { 
  color: #0044a0;
  text-decoration: underline 1px;
}
.main-banner .description a[href^="/personal/promotions/i-plan"]:hover,
.main-banner .description a[href^="/personal/promotions/i-plan"]:focus {
  color: #0044a0;
  cursor: pointer;
  text-decoration: underline 1px;
}
/*.main-banner .description a[href^="/personal/promotions/i-plan"],
  .main-banner .description a[href^="/personal/promotions/i-plan"]:link,
.session-content a,
.session-content a:link,
.section-content a,
.section-content a:link { 
  color: #0044a0;
  text-decoration: underline 1px;
}
.main-banner .description a[href^="/personal/promotions/i-plan"]:hover,
.main-banner .description a[href^="/personal/promotions/i-plan"]:focus,
.session-content a:hover,
.session-content a:focus,
.section-content a:hover,
.section-content a:focus {
  color: #0044a0;
  cursor: pointer;
  text-decoration: underline 1px;
}*/

/* Add CSS for Download TMRW Floating Bottom */
.apply-now-fixed.tmrw {
    width: 1180px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    left: 50%;
    transform: translateX(-50%);
}
.content-flex {
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
}
.content-flex a:not(:first-child) {
    margin-left: 8px;

}
.content-flex a {
    margin-bottom: 16px;
}
@media (min-width: 767px){
    .content-flex {
        flex-direction: row;
        text-align: left;
    }
    .content-flex a {
        margin-bottom: 0;
    }
}

/* t9wsup1 Add CSS For All Promotion Page*/
.main-banner .light-banner .description {
	width: 100%;
	text-align: center;
}


