html, body {
 margin:0;
 padding:0;
 text-align:center;
 font-family: 'Fira Sans', Sans-serif;
 font-size:16px;
 line-height:135%;
}
html.lang_km, html.lang_km body {
 font-family: 'Nokora__', Sans-serif;
 font-size:19px;
 line-height:145%;
}

a, a:hover, a:visited {
 color:#2c4c7f;
 text-decoration:underline;
}
a:hover {
 text-decoration:none;
}

select {
 margin-top:6px;
 font-family: 'EB Garamond';
 font-size:18px;
 border:1px solid #818ba4;
 border-radius:4px;
 background-color:#f5f5f5;
}

h1 {
 position: absolute;
 top: 13px;
 left: 8%;
 width: 80%;
 margin:0px 0px 15px 0px;
 padding:22px 10px 0px 0px;
 text-align:left;
 font-family: 'Fira Sans';
 font-weight:bold;
 font-variant: small-caps;
 font-size: 400%;
 line-height:120%;
 color:#2c4c7f;
 box-sizing:border-box;
}
html.lang_km h1 {
 top:0px;
 font-family: 'Nokora__';
 line-height:125%;
 font-size:325%;
}
.h1sub {
 position: absolute;
 top: 100px;
 right: 27%;
 font-size: 200%;
 width: 260px;
 text-align: right;
 line-height: 125%;
}
.h1sub span {
 background-color:rgba(248,239,230,0.5);
}
html.lang_km .h1sub {
 top: 115px;
 font-size:180%;
 line-height: 142%;
}

h2 {
 margin:30px 0px 0px 0px;
 padding:0px 0px 2px 0px;
 text-align:left;
 font-family: 'EB Garamond';
 font-weight:bold;
 font-size:160%;
 line-height:120%;
 font-variant:small-caps;
 border-bottom:1px solid #dddddd;
}
html.lang_km h2 {
 font-family: 'Nokora__';
 line-height:145%;
}
h3 {
 margin:40% auto 20px auto;
 padding:0px 10px 0px 0px;
 width:100%;
 max-width:860px;
 text-align:left;
 font-family: 'EB Garamond';
 font-weight:bold;
 font-size:170%;
 line-height:120%;
 color:#FFFFFF;
 text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
 box-sizing:border-box;
}
html.lang_km h3 {
 font-family: 'Nokora__';
 line-height:145%;
 font-size:190%;
}
h4 {
 margin:30px 0px 5px 0px;
 padding:0;
 text-align:left;
 font-family: 'EB Garamond';
 font-weight:bold;
 font-size:140%;
 line-height:120%;
}
html.lang_km h4 {
 font-family: 'Nokora__';
 line-height:145%;
}
h2 + h4 { margin-top:16px !important; }
h4 + p { margin-top:0px !important; }
h5 {
 margin:0;
 padding:0;
 text-align:left;
 font-family: 'Fira Sans';
 font-weight:bold;
 font-size:100%;
 line-height:120%;
}
html.lang_km h5 {
 font-family: 'Nokora__';
 line-height:145%;
}

p {
 margin:16px 0px 16px 0px;
}

ul {
 margin:26px 0px 40px 0px;
 padding:0px 0px 0px 20px;
}
li {
 margin:12px 0px 12px 0px;
}

div.quote_box span.highlight {
 background-color: rgba(255,255,0,0.4);
 box-sizing: content-box;
 padding: 0px 0px 2px 0px;
 border-radius:4px;
}
div.map_popup span.highlight, div#profile span.highlight {
 border-bottom:1px dotted #999999
}

div#headercontainer {
 padding:0px 0px 0px 0px;
 width:100%;
 background-color:#babfb8;
 background-repeat:no-repeat;
 background-size:cover;
 background-position:center;
}
img.headerlogo {
 width:100%;
 vertical-align:bottom;
}
div#languages {
 position: absolute;
 top: 0px;
 right: 10px;
 padding: 0px 6px 0px 6px;
 height:24px;
 line-height:24px;
 background-color:rgba(0,0,0,0.5);
 color: #fff;
 border-bottom-left-radius: 5px;
 border-bottom-right-radius: 5px;
 font-size: 13px; 
}
div#languages a, div#languages a:hover, div#languages a:visited {
 color:#ffffff;
 text-decoration:underline;
}
div#header {
 margin:0px auto 0px auto;
 padding:0px 20px 0px 20px;
 width:100%;
 max-width:900px;
 box-sizing:border-box;
}
div#bottom {
 padding-bottom:15px;
 background-color:#f5f5f5;
}
div#bottom div.container {
 background-color:transparent;
}
div#bottom div.flexbox {
 background-color:#ffffff;
}
div#footer {
 margin:0px auto 0px auto;
 padding:0px 30px 0px 10px;
 width:100%;
 max-width:900px;
 box-sizing:border-box;
}

div#profile > p:last-child {
 margin-top:0px;
 margin-bottom:50px;
 font-size:110%;
}
div#profile > p.loading {
 margin:30px 20px 30px 20px !important;
 font-size:100%;
 opacity:0.5;
 animation: 0.8s linear 0s infinite alternate fade;
}
@keyframes fade {
 from { 
  opacity:0.5;
 }
 to { 
  opacity:0.15;
 }
}

div.profileheadercontainer {
 padding:0px 0px 0px 0px;
 width:100%;
 background-color:#ededed;
 background-repeat:no-repeat;
 background-size:cover;
 background-position: center;  
}
div.profileheader {
 margin:0px auto 0px auto;
 padding:40px 20px 2px 20px;
 width:100%;
 max-width:900px;
 box-sizing:border-box;
}

div#intro {
 margin:20px 0px 8px 0px;
 padding:1px 0px 5px 0px;
 width:100%;
 max-width:860px;
 background-color:rgba(44,76,127,0.35);
 color:#FFFFFF;
 text-align:left;
}
div#intro p {
 margin:10px;
 padding:0px;
}
div#intro a, div#intro a:visited, div#intro a:hover {
 color:#d4d6dd;
}

div.container { 
 margin:auto;
 padding:5px 20px 10px 20px;
 width:100%;
 max-width:900px;
 text-align:left;
 background-color:#ffffff;
 box-sizing:border-box;
}

div.map_frame {
 position:relative;
 z-index:10;
}
div.map_frame img {
 display: inline-block;
 max-width:100%;
 vertical-align:bottom;
}

div.map_marker {
 position:absolute;
 margin-top:-24px;
 margin-left:-28px;
 padding:10px;
 width:28px;
 height:28px;
 transform:scale(0.6);
 transition:all 0.25s ease-out;
 z-index:6;
}
div.map_marker span:nth-child(1) {
 display:inline-block;
 position:absolute;
 width:28px;
 height:28px;
 border-radius:14px;
 background-color:#2c4c7f;
 opacity:0;
}
div.map_marker.on span:nth-child(1), div.map_marker.active span:nth-child(1) {
 animation: 3s linear 0s infinite ring
}
@keyframes ring {
 0% { 
  transform: scale(1);
  opacity:0.6;
 }
 66% { 
  transform: scale(4);
  opacity:0;
 }
}
div.map_marker span:nth-child(2) {
 display:inline-block;
 width:28px;
 height:28px;
 border-radius: 14px;
 background-color:#818ba4;
 filter:drop-shadow(2px 2px 2px rgba(0,0,0,0.5));
 transform:scale(1);
 transition:all 0.25s ease-out;
}
div.map_marker.off {
 z-index:5;
}
div.map_marker.off span  {
 background-color:#ededed;
}
div.map_marker.on span, div.map_marker.active span {
 background-color:#2c4c7f;
}
div.map_marker:not(.off):hover span:nth-child(2) {
 transform:scale(1.8);
 cursor:pointer;
}

div.map_popup {
 position:absolute;
 visibility:hidden;
 padding:10px 8px 8px 8px;
 width:300px;
 border-radius:6px;
 background-color:rgba(255,255,255,0.9);
 pointer-events:none;
 box-sizing:border-box;
 z-index:7;
}
div.map_popup p {
 margin:5px 0px;
}
div.map popup a, div.map popup a:visited, div.map popup a:hover {
 color:#ff0000;
}

div.quote_box {
 z-index:100;
 display:none;
 padding:10px;
 background-color:rgba(255,255,255,0.75);
 border-radius:16px;
 font-family: 'EB Garamond';
 font-weight:bold;
 font-size:22px;
 text-align:center;
 line-height:140%;
 color:#2c4c7f;
 pointer-events:none;
 box-sizing: border-box;
}
html.lang_km div.quote_box {
 font-family: 'Nokora__';
 line-height:160%;
}
div.quote_box > div {
 opacity: 0;
 transition:all 0.85s ease-out;
}
div.smallquote {
 margin:10px 0px 10px 0px;
 padding:10px !important;
 font-size:125%;
 box-sizing:border-box;
 opacity: 0;
 transition:all 0.85s ease-out;
}
html.lang_km div.smallquote {
 line-height:145%;
}
div.filter_box {
 position:relative; 
}
div.filters {
 margin-bottom:20px;
 padding:15px 0px 12px 0px;
 top:0px;
 left:0px;
 width:100%;
 background-color:#f5f5f5;
 box-sizing: border-box;
 box-shadow: 0px 4px 10px rgba(0,0,0,0.15);
 z-index:1000;
}
div.filters p {
 margin:0;
 padding:5px 10px 10px 10px;
 color:#2c4c7f;
}
div.filters p span {
 color:#000000;
}
div.filters a {
 font-weight:bold;
 transition:all 0.85s ease-out;
}

div.flexbox {
 display:flex;
 flex-direction:row;
 flex-wrap:wrap;
 justify-content:center;
 align-items:stretch;
 margin-top:10px;
 margin-bottom:30px;
 padding:0px 5px 3px 5px;
 background-color:#f5f5f5;
 box-sizing:border-box;
 text-align:center;
 box-shadow: 0px 4px 10px rgba(0,0,0,0.15);
}
div.flexbox.largefont {
 font-size:110%;
}
div.flexbox.center {
 align-items:center;
}
div.flexbox.white {
 padding:0px;
 background-color:#ffffff;
 box-shadow: none;
}
div.flexbox.rtl {
 direction:rtl;
}
div.flexbox > div {
 display: inline-block;
 padding:0px 5px 0px 5px;
 width:33%;
 min-width:200px;
 font-family: 'Fira Sans';
 text-align:center;
 line-height:145%;
 color:#000000;
 vertical-align:top;
 box-sizing:border-box;
}
html.lang_km div.flexbox > div {
 font-family: 'Nokora__';
}
div.flexbox > div.large {
 width:66%;
}
div.flexbox > div.half {
 width:43%;
}
div.flexbox > div.vlarge {
 width:100%;
 font-size:115%;
}
div.flexbox b {
 color:#2c4c7f;
}

span.mfi {
 display:inline-block;
 margin:10px 16px 4px 0px;
 font-family: 'Fira Sans';
 font-weight:bold;
 color: #2c4c7f;
}
html.lang_km span.mfi {
 font-family: 'Nokora__';
}
span.mfi img {
 margin-right:0.4em;
 height:35px;
 vertical-align:middle;
}

span.mfi.acleda {
 color:#183352;
}
span.mfi.acleda::after {
 content: 'ACLEDA';
}
html.lang_km span.mfi.acleda::after {
 content: 'អេស៊ីលីដា';
}

span.mfi.hattha {
 color:#009ea5;
}
span.mfi.hattha::after {
 content: 'Hattha';
}
html.lang_km span.mfi.hattha::after {
 content: 'ហត្ថា';
}

span.mfi.prasac {
 color:#50ac49;
}
span.mfi.prasac::after {
 content: 'Prasac';
}
html.lang_km span.mfi.prasac::after {
 content: 'ប្រាសាក់';
}

span.mfi.amret {
 color:#008349
}
span.mfi.amret::after {
 content: 'Amret';
}
html.lang_km span.mfi.amret::after {
 content: 'អម្រឹត';
}

span.mfi.lolc {
 color:#d92429;
}
span.mfi.lolc::after {
 content: 'LOLC';
}
html.lang_km span.mfi.lolc::after {
 content: 'អិលអូអិលស៊ី';
}

span.mfi.amk {
 color:#a43c6f;
}
span.mfi.amk::after {
 content: 'AMK';
}
html.lang_km span.mfi.amk::after {
 content: 'អេអឹមខេ';
}

span.mfi.wbfinance {
 color:#0082c8; 
}
span.mfi.wbfinance::after {
 content: 'WB Finance';
}
html.lang_km span.mfi.wbfinance::after {
 content: 'ដាប់ប៊ែលយូប៊ី ហ្វាយនែន';
}

span.mfi.sathapana {
 color:#1e3e79;
}
span.mfi.sathapana::after {
 content: 'Sathapana';
}
html.lang_km span.mfi.sathapana::after {
 content: 'ស្ថាបនា';
}

span.mfi.phillipbank {
 color:#163755
}
span.mfi.phillipbank::after {
 content: 'Phillip';
}
html.lang_km span.mfi.phillipbank::after {
 content: 'ហ្វីលីព';
}

span.mfi.aba {
 color:#005b7a;
}
span.mfi.aba::after {
 content: 'ABA';
}

span.mfi.funan {
 color:#157ab9;
}
span.mfi.funan::after {
 content: 'Funan';
}
html.lang_km span.mfi.funan::after {
 content: 'ហ្វូណន';
}

span.mfi.smile {
 color:#753d94;
}
span.mfi.smile::after {
 content: 'Smile';
}
html.lang_km span.mfi.smile::after {
 content: 'ស្មាយល៍';
}

span.mfi.bayon {
 color:#6e644a;
}
span.mfi.bayon::after {
 content: 'Bayon';
}
html.lang_km span.mfi.bayon::after {
 content: 'បាយ័ន';
}

span.mfi.niron {
 color:#000094;
}
span.mfi.niron::after {
 content: 'Niron';
}
html.lang_km span.mfi.niron::after {
 content: 'និរន្តរ';
}

span.mfi.lyhour {
 color:#d35055;
}
span.mfi.lyhour::after {
 content: 'Ly Hour';
}
html.lang_km span.mfi.lyhour::after {
 content: 'លី ហួរ';
}

span.mfi.mohanokor {
 color:#fcd603;
}
span.mfi.mohanokor::after {
 content: 'Mohanokor';
}
html.lang_km span.mfi.mohanokor::after {
 content: 'មហានគរ';
}

span.mfi.tropkhnhom {
 color:#e68a03;
}
span.mfi.tropkhnhom::after {
 content: 'Trop Khnhom';
}
html.lang_km span.mfi.tropkhnhom::after {
 content: 'ទ្រព្យខ្ញុំ';
}

span.mfi.cp {
 color:#fbab2c;
}
span.mfi.cp::after {
 content: 'CP Bank';
}
html.lang_km span.mfi.cp::after {
 content: 'ប្រៃសណីយ៍កម្ពុជា';
}


span.mfi.chamroeun {
 color:#f172ac;
}
span.mfi.chamroeun::after {
 content: 'Chamroeun';
}
html.lang_km span.mfi.chamroeun::after {
 content: 'ចម្រើន';
}

iframe {
 margin:10px 0px 5px -15px;
 width:560px;
 max-width:100%;
 height:315px;
}
p.caption {
 margin-top:0px;
 margin-bottom:0px;
 font-style:italic;
}
@media (max-width: 950px) {
 html.lang_de h1 { top: -5px; line-height: 100%; }
 html.lang_de .h1sub { right: 20px; }
}
@media (max-width: 720px) {
 h1 { top:-10px; font-size: 220%; }
 html.lang_km h1 { font-size: 160%; width: 94%; }
 .h1sub {
  right:auto;
  left:8%;
  text-align:left;
  font-size: 150%;
  top:48px;
 }
 html.lang_km .h1sub { top:64px; font-size: 140%; }
}
@media (max-width: 642px) {
 div.flexbox > div.large { width:100%; }
 div.flexbox > div.half { width:100%; }
 div.flexbox > div { width:50%; }
}
@media (max-width: 444px) {
 div.flexbox > div.large { width:100%; }
 div.flexbox > div { width:100%; }
}
