/* ------------------------------------------------------------------------------------------------------------
|  Start  | 
------------------------------------------------------------------------------------------------------------ */

body { font-family: 'Inter', Kanit, Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; font-smoothing: antialiased; font-weight: 400; font-size: 16px; line-height: 1.4; color: var(--color-black); background: var(--color-white); 

--color-white: #fff;
--color-white-drop: #9ebfe3;
--color-blue: #004693;
--color-blue-big: #00205c;
--color-sky: #0052da;
--color-miniblue: #f5f8ff;
--color-miniblue-border: #dee8ff;
--color-drakblue:#00205c;
--color-grayblue: #6d7eb2;
--color-black: #454b57;
--color-gray: #656f88;
--color-gray-big: #8b96a3;
--color-gray-big-hover: #5c6f86;
--color-f0f0f0: #f0f0f0;
--color-yellow: #ffcb33;
--color-999: #999;
--color-mini-gray: #f2f5fc;
--color-minisky-border: #2e56b6;
--color-graydrop:#939aab;

}
a { display: block; color: var(--color-black);  transition: all 0.3s ease; }
a:hover { text-decoration: none; color:var(--color-sky);  }

h1, h2, h3, h4, h5, h6 { position: relative; margin: inherit; padding: 15px 0 ; font-family: 'Inter', Kanit, Arial, Helvetica, sans-serif; font-weight: 400; }
h1 { font-size: 40px; }
h2 { font-size: 36px; }
h3 { font-size: 24px; font-weight:500 }
h4 { font-size: 20px; }
h5 { font-size: 18px; }
h6 { font-size: 14px; }

p { margin: 0; padding: 15px 0;  }

figure { position: relative; }

strong, b { font-weight: bold; }

::selection { color:var(--color-white); background:var(--color-black); }
::-moz-selection { color:var(--color-white); background:var(--color-black);}
::placeholder { color: #ccc; font-size: 14px; font-weight: 300; opacity: 1; }
:-ms-input-placeholder {  color: #ccc; font-size: 14px;  font-weight: 300; }
::-ms-input-placeholder { color: #ccc; font-size: 14px;  font-weight: 300; }

/* ------------------------------------------------------------------------------------------------------------
|  All  |
------------------------------------------------------------------------------------------------------------ */
header { position: relative; width: 100%; }
section { float: left; width: 100%; position: relative; overflow-x: hidden; }
img { display: block; }

/*:lang(en) .player-home ul li h5 span { display: block; overflow: hidden; text-overflow: ellipsis; max-width: 22px; }*/

.warpper { position: relative; margin: 0 auto; width:100%; height: inherit; max-width: 1280px; padding: 0 15px;  }
.content { position: relative; }

.th .header-fixed nav ul {  }
.th .header-fixed nav ul a { font-weight: 500; font-size:18px; }
.th .header-fixed nav ul dl a { font-size: 17px; font-weight: 400; }
.th .header-fixed aside li:last-child a { padding-top: 8px !important; font-size: 15px !important; }

.th .viewall span a { font-size: 17px; }
.th .player-home ul li p { font-size: 17px; }

.th .menu-text { font-size: 17px; padding-bottom: 2px; }
.th .nav-mobile aside ul li a { font-size: 20px; }
.th .nav-mobile aside ul li .toggle-subnav a {  font-size: 17px; }
.th .nav-mobile aside ul li a { padding-top: 5px; }

.th .subplus { top: 8px; }
.th .nav-mobile aside ul li span:before { top: 3px; }

.th .livescore-table .name .inname { /*font-weight: 400;*/ }

.th .ranking-table h5 { font-weight: 500; }
.th .ranking-table tbody td.ranking-sticky-name h5 { font-weight: 500 }

.th .title:first-letter { font-weight: 500; }

.en { font-size: 16px; }
.en .l-user .m-sub div a { font-size:14px !important; text-transform:inherit !important; }

/* ------------------------------------------------------------------------------------------------------------
|  Header Bar  |
------------------------------------------------------------------------------------------------------------ */
.header-less  { /*height: 60px !important; */ box-shadow: 0 0 10px 3px rgba(0,20,60,0.1); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;  }

/*.header-less header figure { -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.header-less header a { padding: 10px 0 !important; }
*/
.header-fixed { position: fixed; display: table; width: 100%; height: 100px; background: var(--color-white); border-bottom: 1px solid var(--color-blue); overflow: inherit; z-index: 999999;  transition: all 0.3s ease;  }

.header-fixed header { float: left; display: flex; flex-wrap: wrap; width: initial; height: 100%; z-index: 9; }
.header-fixed header a { display: block; position: relative;  height: 100%; padding: 10px 0; vertical-align: middle;  }
.header-fixed header figure { position: relative; display: inline-block;  height: 100%; vertical-align: middle; -webkit-transition: all 0.2s ease;  -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.header-fixed header img { display: block; height: 100%; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; margin-left: auto; -webkit-transition: all 0.2s ease;  -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease;  transition: all 0.2s ease; }
.header-fixed header span { display: inline-block; vertical-align: middle; padding-left: 15px; }
.header-fixed header a.mr-15 { margin-right:15px; }

.header-fixed nav { position: relative; float: right; width: auto; height: 100%; padding-top: 30px; display: flex;  z-index: 1; }
.header-fixed nav ul { margin-top:10px; }
.header-fixed nav li { float: left; display: table; position: relative; height: 100%; padding-left: 30px; text-align: center; }
.header-fixed nav li a { position: relative; display: table-cell; height: 100%; padding: 0 2px; color: var(--color-black); font-weight: 700; text-transform: uppercase; font-size: 15px; line-height: 1.2; vertical-align: middle;  }
.header-fixed nav li a:hover { color: var(--color-sky); }
.header-fixed nav li a.current { color: var(--color-sky);  }
.header-fixed nav li a.current:before { content:''; position:absolute; width: 100%; height:3px; background: var(--color-blue); left: 0; bottom:0; z-index:1; }
/*.header-fixed nav li a:before { opacity: 1; content: ''; position: absolute; width: 0; height: 6px; left: 0; right: 0; bottom: -6px; margin-top: auto; margin-left: auto; margin-right: auto; background: var(--color-blue); -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease; }
.header-fixed nav li a:hover:before { width: 100%; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease;  }
.header-fixed nav li a.current:before { width: 100%; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease;  }*/
.header-fixed nav li span { position: relative;  width: 100%; height: 100%; vertical-align: middle; z-index: 1; }
.header-fixed nav ul li.lang { display: flex; align-items: center; justify-content: center; height: 100%; }
.header-fixed nav ul li.lang span { display: flex; padding-top: 3px; align-items: center; justify-content: center;  }
.header-fixed nav ul li.lang a { width: 40px; height: 40px; border-radius: 50%; background: #deeffd; }
.header-fixed nav ul li.lang a:before { display: none !important; }


.header-fixed nav ul dl { visibility: hidden; opacity: 0; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; position:absolute; width: auto; min-width: 200px; padding:20px 15px; top:100%; margin-top: 1px; left: 30px; background: var(--color-blue);/* -webkit-box-shadow:0 5px 15px rgba(0, 0, 0, 0.2);-moz-box-shadow:  0 5px 15px rgba(0, 0, 0, 0.2); box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);*/ border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px; z-index: 999; }
.header-fixed nav ul dl dt { position: relative; width:100%; height: inherit; padding: 3px 0;  text-align:left; vertical-align:top; }
.header-fixed nav ul dl a { display:inline-block; width:100%; height:inherit; padding: 0 10px; font-weight: 500; color:var(--color-white) !important; text-align: left; background:none; text-overflow: ellipsis; white-space: nowrap;}
.header-fixed nav ul dl a:hover,
.header-fixed nav ul dl a.current { color: var(--color-yellow) !important; background:none; }
.header-fixed nav ul li:hover > dl {  visibility: visible; opacity: 1; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.header-fixed nav ul li:hover > a { color: var(--color-sky); }

.header-fixed aside { position: absolute; width: auto; padding: 10px 0 10px 0; color: #ffe4fa; margin-right: 15px; right: 0; top: 0; z-index: 9; }
.header-fixed aside ul { display: flex; justify-content: flex-end; height: 100%; align-items:center; }
.header-fixed aside li { position: relative; padding: 0 10px; height: 100%; display:flex; align-items:center; }
.header-fixed aside li:last-child { padding-right: 2px; /* border-left: 1px solid #c7d9ee;  margin-left: 3px; padding-right: 0; padding-left: 5px; */ }
.header-fixed aside li a { padding: 7px 2px; color: var(--color-gray); text-transform: uppercase; line-height: 0.8; font-size: 14px; font-weight: 400; }
.header-fixed aside li a:hover,.header-fixed aside li a.current { color: var(--color-sky); }
.header-fixed aside li a.btn-register { padding: 7px 14px; background: var(--color-blue); color: var(--color-white); border-radius: 3px; }
.header-fixed aside li a:hover.btn-register { background: var(--color-sky); } 

.header-fixed aside li .btn-register { display: flex; flex-wrap: wrap; align-items: center; padding:6px; font-size: 14px; background: var(--color-miniblue); color: var(--color-white); border: 1px solid var(--color-miniblue-border); border-radius: 90px; cursor: pointer;transition: all 0.3s ease }
.header-fixed aside li .btn-register:hover { background: var(--color-sky); border: 1px solid var(--color-sky); transition: all 0.3s ease } 
.header-fixed aside li .btn-register .icon-member { width: 22px;  }
.header-fixed aside li .btn-register .icon-member svg { width: 100%; height: 100%; transition: all 0.3s ease }
.header-fixed aside li .btn-register .icon-member path { fill: var(--color-blue); transition: all 0.3s ease }
.header-fixed aside li .btn-register:hover .icon-member path { fill: var(--color-white); transition: all 0.3s ease  }
.header-fixed aside li .btn-register .icon-member .current path { fill: var(--color-white); transition: all 0.3s ease }
.header-fixed aside li .btn-register .in-txt { transition:all 0.3s ease; text-transform:uppercase; font-weight:400  }
.header-fixed aside li .btn-register:hover .in-txt { transition:all 0.3s ease }

/*.header-fixed aside li .btn-register-logon { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; font-size: 14px; background: var(--color-sky); color: var(--color-white); border-radius: 50%; width: 34px; height: 34px; cursor: pointer;transition: all 0.3s ease }*/
.header-fixed aside li .btn-register-logon { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; font-size: 14px; background: var(--color-white); color: var(--color-white); padding: 1px; border: 1px solid var(--color-sky); border-radius: 50%; width: 34px; height: 34px; cursor: pointer;transition: all 0.3s ease }
.header-fixed aside li .btn-register-logon img { border-radius:50% }
.header-fixed aside li .btn-register-logon:hover { background: var(--color-sky); color: var(--color-yellow); transition: all 0.3s ease } 
.header-fixed aside li .btn-register-logon .icon-member { height: 20px; }
.header-fixed aside li .btn-register-logon .icon-member svg { width: 100%; height: 100%; transition: all 0.3s ease }
.header-fixed aside li .btn-register-logon .icon-member path { fill: var(--color-white); transition: all 0.3s ease }

.header-fixed aside li a.btn-search { width: 30px; background: url(../images/icon-search.svg) no-repeat center; background-size: auto 70%; }
.header-fixed aside li a path { fill: var(--color-white);  transition: all 0.3s ease; }
.header-fixed aside li a:hover path { fill: var(--color-white);  transition: all 0.3s ease; }
.header-fixed aside li span { display: flex; vertical-align: middle; line-height:1; font-size:12px; }
.header-fixed aside i { display: inline-flex; width: 20px; height: 12px; margin-right: 6px; align-items: center; vertical-align: middle; border-radius: 4px; }
.header-fixed aside i svg { display: block; width: 100%; height: 100%; }
.header-fixed aside .icon-flag-en { background: url(../images/flag-en.svg) no-repeat center; }
.header-fixed aside .icon-flag-th { background: url(../images/flag-th.svg) no-repeat center; }
.header-fixed aside small { display: inline-block; vertical-align: middle; font-size: 15px; }
.header-fixed aside .icon-call { background: url(../images/icon-call-white.svg) no-repeat center; background-size: 100%; }
.header-fixed aside .icon-line { background: url(../images/icon-line-white.svg) no-repeat center; background-size: 100%; }
.header-fixed aside .icon-facebook { margin-right: 0; background: url(../images/icon-facebook-white.svg) no-repeat center; background-size: 100%; }
.header-fixed aside .icon-youtube { margin-right: 0; background: url(../images/icon-youtube-white.svg) no-repeat center; background-size: 100%; }

.fix-top-social { padding:0; }
.followus-top { color: var(--color-white); text-align: center; }
.followus-top dl { display: flex;flex-wrap: wrap; justify-content: center;}
.followus-top dl dd { width: 28px; height:28px; margin: 0 2px;}
.followus-top dl dd a { text-indent: -9999px; display: block; padding: 0; width: 100%; height: 100%;border: 1px solid #e0e8fe; border-radius:50%  }
.followus-top dl dd a.fb { background: url(../images/icon-facebook-blue.svg) no-repeat center; background-size: 68%; }
.followus-top dl dd a.ig { background: url(../images/icon-instagram-blue.svg) no-repeat center; background-size: 76%; }
.followus-top dl dd a.yt { background: url(../images/icon-youtube-blue.svg) no-repeat center; background-size: 84%; }
.followus-top dl dd a.line { background: url(../images/icon-line-blue.svg) no-repeat center; background-size: 78%; }

.header-full { background: rgba(255,255,255,1) !important; }
.header-full nav li a { position: relative; display: table-cell; height: 100%; color: #333 !important; font-size: 18px; text-transform: uppercase; font-weight: 500; vertical-align: middle;  }
.header-full li a:hover { color: #0089eb !important; }
.header-full li a.current { color: #0089eb !important;  }
.header-full nav li a span:before { opacity: 0 !important; content: ''; position: absolute; width: 0; height: 1px; left: 0; right: 0; bottom: -10px; margin-top: auto; margin-left: auto; margin-right: auto; background: #1b1464; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease; }

.show-box-search { opacity: 1 !important; visibility: visible !important; -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.drop-search { opacity: 0; visibility: hidden; position: absolute; padding: 10px; bottom: -60px; left: 15px; right: 15px; background: var(--color-blue); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease; }
.drop-search input[type="button"], .drop-search  input[type="submit"] { position: absolute; max-width: inherit; min-width: inherit; padding: 2px 20px 0 20px; font-size: 16px; top: 10px; bottom: 10px; right: 10px; border-radius: 0; background: var(--color-blue); z-index: 1; }
.drop-search input[type="button"]:hover, .drop-search  input[type="submit"]:hover { background: var(--color-sky) }
.drop-search input[type="text"] { padding-right: 110px; border: none; font-size: 16px; }
.drop-search input[type="text"]:focus { border: none  !important; }

.login-zone { position: relative; width: 100%; max-width: 480px !important; padding: 0 !important; border-radius: 4px; box-shadow: 0 1px 5px 0 rgba(0,0,0,.2) }
.login-zone .title { display: flex; justify-content: center; margin-top: 0; margin-bottom: 0; align-items: center; height: 58px; font-size: 24px; font-weight: 500; color: var(--color-blue); background: var(--color-whitedrop);  border-bottom: 1px solid var(--color-miniblue-border);}

.login-zone .box { position: relative; padding: 20px 30px; }
.login-zone .box-login .login-social-btn { display: flex; flex-wrap: wrap; margin: 0 -8px; }
.login-zone .box-login .login-social-btn span { width: 50%; padding: 0 8px; }
.login-zone .box-login .login-social-btn button { display: flex; align-items: center; justify-content: center; width: 100%; height: 46px; font-size: 14px; }
.login-zone .box-login .login-social-btn .facebook { background: #1877f2; }
.login-zone .box-login .login-social-btn .facebook i { background: var(--color-white) url(../images/icon-facebook.svg) no-repeat center; background-size: 60%; }
.login-zone .box-login .login-social-btn .google { background: #dc4e41; }
.login-zone .box-login .login-social-btn .google i { background: var(--color-white) url(../images/icon-google.svg) no-repeat center; background-size: 60%; }
.login-zone .box-login .login-social-btn i { display: inline-flex; margin-right: 10px; width: 26px; height: 26px; border-radius: 50%; background: var(--color-white); }
.login-zone .box-login .text { position: relative; padding: 0; margin: 15px 0 0 0; display: flex; justify-content: center; }
.login-zone .box-login .text span { position: relative; padding: 0 15px; background: var(--color-white); }
/*.login-zone .box-login .text:before { content: ''; position: absolute; width: 100%; height: 1px; background: var(--color-border); left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }*/
.login-zone .box-login .login-fill { position: relative; display: flex; flex-direction: column; }
.login-zone .box-login .login-fill .form-group { position: relative; width: 100%;  }
.login-zone .box-login .login-fill .form-group .toggle-password { display: flex; justify-content: center; align-items: center; position: absolute; width: 40px; height: 40px; cursor: pointer; right: 0; bottom: 0; z-index: 1; font-size: 12px; }

.login-zone .box-login .login-fill input[type="email"] { width: 100%; }
.login-zone .box-login .login-fill input[type="password"] { width: 100%; }
.login-zone .box-login .login-fill input[type="text"] { width: 100%;  }
.login-zone .box-login .login-fill label { width: 100%; }
.login-zone .box-login .btn-submit { padding-top: 15px; }
.login-zone .box-login .btn-submit button { width: 100%; margin: 0; border-radius:8px; }
.login-zone .box-login .forgot { display: flex; justify-content: center; padding-bottom: 10px; padding-top:20px }
.login-zone .box-login .remember { font-size: 14px; }
.login-zone .box-login .remember label {  padding-top: 12px; }
.login-zone .box-login .btn-forgot { margin-left: auto; display: flex; align-items: center; }
.login-zone .box-login .register { padding: 20px 0; border-top: 1px solid var(--color-border) }
.login-zone .box-login .register small { display: block; padding-bottom: 10px; font-size:16px; }
.login-zone .box-login .register a { display: inline-flex; width: 100%; height: 46px; justify-content: center; align-items: center; background: var(--color-border) ; border-radius: 4px; }
.login-zone .box-login .register a:hover { color: var(--color-blackdrop); background: var(--color-skydrop) }
.login-zone .box-login .btn-to-register { display:flex; flex-wrap:wrap; margin:0 -5px; }
.login-zone .box-login .btn-to-register span { width: 50%; padding:0 5px }
.login-zone .box-login .btn-to-register span a { background: #f5f5f5; border-radius:8px; border:1px solid #999; }
.login-zone .box-login .btn-to-register span a:hover { border: 1px solid var(--color-blue); color:var(--color-sky); }
.login-zone .box-login .btn-to-register span:first-child a { background:var(--color-black); color:var(--color-white); border:1px solid var(--color-black); }
.login-zone .box-login .btn-to-register span:first-child a:hover { color:var(--color-sky); background:var(--color-white); border:1px solid var(--color-sky); }

.login-zone .box-forgot { display: none; }
.login-zone .box-forgot .form-group { position: relative; width: 100%; }
.login-zone .box-forgot label { width: 100%; }
.login-zone .box-forgot input[type="email"] { width: 100%; }
.login-zone .box-forgot .btn-submit { display: flex; align-items: center; justify-content: center; padding-top: 15px; padding-bottom:15px }
.login-zone .box-forgot .btn-submit button {  display: flex; align-items: center; justify-content: center; width: max-content; min-width: inherit; margin: 0; padding: 0 20px; height: 46px; min-width:120px; }
.login-zone .box-forgot .btn-submit .btn-can { margin-left: 15px;  min-width:120px; }
.login-zone .box-forgot .btn-submit .btn-can span { display: inline-flex; width: 100%; height: 46px; padding: 0 20px; justify-content: center; align-items: center; background: #f0f0f0 ; border-radius: 4px; cursor: pointer; transition: all 0.3s ease }
.login-zone .box-forgot .btn-submit .btn-can span:hover { color:var(--color-sky); transition: all 0.3s ease}

.login-zone .fancybox-close-small::after { content: "×"; position: absolute; top: 0px; right: 0px; width: 40px; height: 40px; color: var(--color-blackdrop); text-align: center; box-sizing: border-box; font: 300 36px / 40px Arial, "Helvetica Neue", Helvetica, sans-serif; border-radius: 50%; border-width: 0px; transition: all 0.3s ease 0s;}

.login-zone .fancybox-slide--html .fancybox-close-small { padding: 0 !important }
.login-zone .fancybox-close-small::after { top: 8px !important; right:5px !important }
.fa-eye { background: url(../images/icon-eye.svg) no-repeat center; background-size: 18px; }
.fa-eye-slash { background: url(../images/icon-eye-hide.svg) no-repeat center; background-size: 18px; }
.fa-eye:before { display: none; }
.fa-eye-slash:before { display: none; }

.box-chage-email { position:relative; max-width: 480px; width: 100%; padding: 0; }
.box-chage-email .box { position: relative; padding: 20px 30px; }
.box-chage-email .form-group { position: relative; width: 100%; }
.box-chage-email label { width: 100%; }
.box-chage-email input[type="email"] { width: 100%; }
.box-chage-email .btn-submit { display: flex; align-items: center; justify-content: center; padding-top: 15px; padding-bottom:15px }
.box-chage-email .btn-submit button {  display: flex; align-items: center; justify-content: center; width: max-content; min-width: inherit; margin: 0; padding: 0 20px; height: 46px; min-width:120px; }
.box-chage-email .btn-submit .btn-can { margin-left: 15px;  min-width:120px; }
.box-chage-email .btn-submit .btn-can span { display: inline-flex; width: 100%; height: 46px; padding: 0 20px; justify-content: center; align-items: center; background: #f0f0f0 ; border-radius: 4px; cursor: pointer; transition: all 0.3s ease }
.box-chage-email .btn-submit .btn-can span:hover { color:var(--color-sky); transition: all 0.3s ease}
.box-chage-email-title { display: flex; justify-content: center; margin-top: 0; margin-bottom: 0; align-items: center; height: 58px; font-size: 20px; font-weight: 500; color: var(--color-blue); background: var(--color-whitedrop);  border-bottom: 1px solid var(--color-miniblue-border);}
.box-chage-email .fancybox-close-small svg { display:none; }
.box-chage-email .fancybox-close-small::after { min-width: 40px;color: currentColor;padding: 10px;right: 5px;top: 0;content: "×";position: absolute;width: 40px;height: 40px;color: var(--color-blackdrop);text-align: center;box-sizing: border-box;font: 300 36px / 40px Arial, "Helvetica Neue", Helvetica, sans-serif;border-radius: 0;border-width: 0px;transition: all 0.3s ease 0s;}
.box-chage-email .fancybox-close-small:hover { background:none !important }

.l-user:hover>.box { visibility: visible; opacity: 1; transition: all .2s ease}
.l-user .box { visibility: hidden; opacity: 0; position: absolute; width: 180px; padding: 10px 0 0; top: 100%; right: 0; z-index: 999}
.l-user .m-sub {position: absolute;width: 100%;padding: 15px;border-top: 4px solid var(--color-sky);background: #f9f9f9;border-radius: 0 0 6px 6px; box-shadow: 0 5px 10px 2px rgba(0,20,60,0.1); z-index: 99999;}
.l-user .m-sub:after {content: "";position: absolute;width: 0;height: 0;bottom: 100%;right: 10px;border: 8px solid transparent;pointer-events: none;border-bottom-color: var(--color-sky)}
.l-user .m-sub div {display: flex;align-items: center;position: relative;width: 100%;height: inherit;padding: 2px 0;border-top: 1px solid var(--color-miniblue-border);}
.l-user .m-sub div:first-child {border-top: none}
.l-user .m-sub div a {position: relative;width: 100%;height: inherit;padding: 10px 0;display: flex!important;align-items: center;text-align: left;color: var(--color-black);font-size: 16px !important;text-transform: inherit !important;font-weight: 400;overflow: hidden;background: 0 0}
.l-user .m-sub div a.current { color:var(--color-sky); }
.l-user .box i { display: inline-flex; width: 20px!important; height: 20px!important; margin-right: 8px!important}

.l-user .box i.icon-member-on { background: url(../images/icon-user-on.svg) center/90% no-repeat}
.l-user .box i.icon-history-on { background: url(../images/icon-history-on.svg) center/90% no-repeat}
.l-user .box i.icon-password-on { background: url(../images/icon-password-on.svg) center/90% no-repeat}
.l-user .box i.icon-logout-on { background: url(../images/icon-logout-on.svg) center/90% no-repeat}

.my-account {position: relative;width: 100%;padding: 40px 0; display: flex;flex-wrap: wrap;background: #f9f9f9;}
.my-account-detail {position: relative;width: 100%; display: flex;flex-wrap: wrap;}
.my-account-detail .box-text-exp { margin-top: 10px; border-radius:4px; padding: 6px; border:1px solid var(--color-sky);  width: 100%;  text-align: center;  }
.my-account-detail .box-text-exp small { color:var(--color-blue) !important; }
.my-account aside {position: relative;width: 250px;padding-right: 30px}
.my-account aside .welcome { display: flex; flex-wrap: wrap; align-items: center;padding: 15px 20px;}
.my-account aside .welcome .img-profile { width: 70px; height: 70px; margin-right: 10px; border-radius:50%; position: relative; overflow: hidden; border: 1px solid #eee;}
.my-account aside .welcome .img-profile img { padding: 3px; width: 100%; border-radius:50%; position:absolute; object-fit: cover; top: 0; left: 0; bottom: 0; right:0; margin: 0 auto; }
.my-account aside .welcome .text {  flex-wrap: wrap; align-items:center; flex:1; }
.my-account aside .welcome p {min-width: 100px;max-width: 180px;padding-top: 0;padding-bottom: 0;font-weight: 400;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.my-account aside .welcome small {display: block; color: #aaa;}
.my-account aside .box { background: var(--color-white); border-radius:10px; position:relative; }
.my-account aside .box li { border-top:1px solid #eee; }
.my-account aside .box li:last-child a {border-radius: 0 0 10px 10px}
.my-account aside a {display: flex;align-items: center;position: relative;height: 100%;padding: 10px 20px}
.my-account aside a.current { color:var(--color-white); background:var(--color-blue); }
.my-account aside i {display: inline-flex;width: 30px;height: 30px;margin-right: 15px;border-radius: 50%}

.my-account aside i.icon-member-on { background: var(--color-white) url(../images/icon-user-on.svg) no-repeat center; background-size: 65%}
.my-account aside i.icon-password-on { background: var(--color-white) url(../images/icon-password-on.svg) no-repeat center; background-size: 65%}
.my-account aside i.icon-history-on { background: var(--color-white) url(../images/icon-history-on.svg) no-repeat center; background-size: 65%}
.my-account aside i.icon-logout-on { background: var(--color-white) url(../images/icon-logout-on.svg) no-repeat center; background-size: 65%}

.my-account aside .current-sub .sub-menu-mini { display: block; opacity:1; visibility:visible; }
.my-account aside .sub-menu-mini {  opacity: 0; visibility: hidden; display: none; padding-bottom: 10px; border-bottom:2px solid var(--color-sky); }
.my-account aside .sub-menu-mini a { padding-top: 10px; padding-bottom: 0; padding-left:65px; font-size:14px; }
.my-account aside .sub-menu-mini a.current-m { color:var(--color-sky); font-weight:600 }

.my-account .box-detail { position: relative; flex: 1; min-height: 300px; padding: 20px 30px;background: var(--color-white); border-radius:10px; }
.my-account .box-detail .title-status { position: relative; display:flex; flex-wrap: wrap; align-items:center; border-bottom:1px solid var(--color-miniblue-border); }
.my-account .box-detail .title-status:after { content:''; position:absolute; width: 40px; height:3px; background:var(--color-yellow); left:0; bottom: 1px }
.my-account .box-detail .title-status h3 { display:flex; align-items:center; }
.my-account .box-detail .title-status h3 span { margin-left: auto; font-size: 16px;  }
.my-account .box-detail .title-status .expire-date { margin-left: auto; }
.my-account .box-detail .title-status .expire-date small { color:var(--color-sky); font-size:16px; }

.my-account .box-detail .title-status .set-add { margin-left:auto; display:flex;  align-items:center; }
.my-account .box-detail .title-status .set-add small { font-size:16px; color:var(--color-sky); }
.my-account .box-detail .title-status .set-add .select { padding-right:15px; }
.my-account .box-detail .title-status .set-add a { display: inline-flex; align-items: center; line-height: 1; color:var(--color-white);  padding:  10px 20px; font-size: 16px;  background:var(--color-sky); border-radius:90px; }
.my-account .box-detail .title-status .set-add a:hover { background:var(--color-blue); }
.my-account .box-detail .title-status .icon-add-data { display: inline-flex; width: 18px; height: 18px; margin-right: 5px; background: url(../images/icon-plus.svg) no-repeat center;background-size: 100%; }

.icon-download { display: inline-flex; width: 18px; height: 18px; margin-right: 8px; background: url(../images/icon-download.svg) no-repeat center;background-size: 100%; }

.my-account .box-detail  button { width: 100%; max-width: 330px}
.my-account .box-detail article { width: 100%; padding: 0 }
.my-account-profile { width: 100%; padding: 0 0 15px}
.my-account-profile li {display: flex;flex-wrap: wrap;width: 50%;padding: 15px 15px 0}
.my-account-profile textarea { height: 60px}
.my-account-password label,.my-account-profile label {width: 100%;padding-bottom: 5px;cursor: default;font-weight: 400}
.my-account-password small,.my-account-profile small { color: var(--color-aaa)}
.my-account-password { position: relative; width: 100%; padding: 0 0 15px}
.my-account-password textarea { height: 150px}
.my-account .btn-submit { padding: 15px 0 30px}
.my-account .toggle-password { display: flex; justify-content: center; align-items: center; position: absolute; width: 40px; height: 40px; cursor: pointer; right: 15px; bottom: 0; z-index: 1; font-size: 12px}

.my-account .box-list { display: flex; flex-wrap: wrap; margin: 0 -10px; }
.my-account .box-50 { width: 50%; padding: 10px ; }
.my-account .box-100 { width:100%; padding: 10px ; }
.my-account .set-plus { width: 100%; padding: 0 20px 20px 20px; border-radius:4px; border:1px solid var(--color-miniblue-border) }
.my-account .btn-etcmore span a { display: inline-flex; min-width: 80px; height: 32px; padding: 0 15px; align-items: center; justify-content: center; font-size: 14px; background: var(--color-border); border-radius: 4px;}

.my-account input[type="button"], .my-account input[type="submit"] { min-width: 150px; padding: 15px 10px; font-size:16px; margin:inherit; }
.my-account .box-btn { position: relative; width: 100%; display:flex; flex-wrap:wrap; padding-top:20px; padding-bottom:15px; align-items:center; justify-content:center }
.my-account .add-data { display:flex; flex-wrap:wrap; margin:0 -5px; }
.my-account .add-data input[type="submit"] {  }
.my-account .box-btn span { padding: 0 5px; }
.my-account .box-btn .btn-cancel a { display: flex; align-items: center; justify-content: center; border-radius:90px; padding: 15px 30px; min-width: 150px; font-size:16px;  color: var(--color-white); background:var(--color-gray-big);; line-height: 1; text-align:center; }
.my-account .box-btn .btn-cancel a:hover { background: var(--color-gray-big-hover);  }
.my-account .showcontent label { padding: 0 }

.my-account .show-table { padding: 0 0 10px 0; border:none; }

.my-account .manage-set { position: relative; display:flex; flex-wrap:wrap; align-items:center; padding-top:15px; padding-bottom:5px; }
.my-account .name-avg { display:flex; flex-wrap:wrap; align-items:center;  }
.my-account .name-avg h4 { padding: 0 0 0 0; margin:0; color: var(--color-sky); font-weight: 600; font-size:20px; }
.my-account .name-avg p { padding:0 0 0 20px; margin: 0; font-size:14px; }
.my-account .name-avg p span { font-weight: 600; border-radius:90px; border:1px solid var(--color-sky); padding: 2px 10px; }
.my-account .sort { display:flex; flex-wrap:wrap; align-items:center; }
.my-account .sort input[type="text"] { width: 60px; text-align:center; margin-left:10px; padding:5px; height:auto; }

.my-account .show-edit-delete { display:flex; flex-wrap:wrap; align-items:center; margin-left:auto; }

.my-account .btn-showhide-element { display: flex; ; margin-left:5px; width: initial; }
.my-account .btn-showhide-element .btn-sh { display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-showhide-element .btn-sh:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-showhide-element a { display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-showhide-element a:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-showhide-element .icon-eye-show { display: inline-flex; width: 20px; height: 20px; margin-right: 5px; background: url(../images/icon-eye.svg) no-repeat center;background-size: 100%; }
.my-account .btn-showhide-element .icon-eye-hide { display: inline-flex; width: 20px; height: 20px; margin-right: 5px; background: url(../images/icon-eye-hide.svg) no-repeat center;background-size: 100%; }

.my-account .btn-delete-element { display: flex; ; margin-left:5px; width: initial; }
.my-account .btn-delete-element .btn-del { display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-delete-element .btn-del:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-delete-element a { display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-delete-element a:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-delete-element .btn-del .icon-delete { display: inline-flex; width: 16px; height: 16px; margin-right: 5px; background: url(../images/icon-trash.svg) no-repeat center;background-size: 100%; }

.my-account .btn-edit-element { display: flex; ; margin-left:5px; width: initial; }
.my-account .btn-edit-element .btn-edit { display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-edit-element .btn-edit:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-edit-element a{ display: flex; align-items: center; cursor: pointer; background: var(--color-white); padding: 5px 8px 5px 5px; font-size: 14px; border-radius:3px; transition: all 0.3s ease; }
.my-account .btn-edit-element a:hover { color:var(--color-sky); transition: all 0.3s ease; }
.my-account .btn-edit-element .icon-edit { display: inline-flex; width: 16px; height: 16px; margin-right: 5px; background: url(../images/icon-edit.svg) no-repeat center;background-size: 100%; }

.my-account .manage { display:flex; flex-wrap:wrap; }
.my-account .manage .btn { padding: 5px; display:flex; flex-wrap:wrap; align-items:center; justify-content:center }
.my-account .manage .btn-sh { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; cursor: pointer; }
.my-account .manage .btn-del { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; cursor: pointer; }
.my-account .manage .line { border-left:1px solid var(--color-miniblue-border); border-right: 1px solid var(--color-miniblue-border);}
.my-account .manage a { display:flex; align-items:center; justify-content:center }
.my-account .manage i { display: inline-flex; width: 20px; height:20px; }
.my-account .manage .icon-eye-show { display: inline-flex; width: 20px; height: 20px;  background: url(../images/icon-eye.svg) no-repeat center;background-size: 100%; }
.my-account .manage .icon-eye-hide { display: inline-flex; width: 20px; height: 20px;  background: url(../images/icon-eye-hide.svg) no-repeat center;background-size: 100%; }
.my-account .manage .icon-edit { display: inline-flex; width: 16px; height: 16px;  background: url(../images/icon-edit.svg) no-repeat center;background-size: 100%; }
.my-account .manage .icon-delete { display: inline-flex; width: 16px; height: 16px;  background: url(../images/icon-trash.svg) no-repeat center;background-size: 100%; }

.my-account .set-date { display:flex; flex-wrap:wrap; margin:0 -2px; }
.my-account .set-date .year { width: 50%; padding: 2px; }
.my-account .set-date .month-day { width: 50%; padding: 2px; }
.my-account .round { display:flex; flex-wrap:wrap; margin:0 -2px; }
.my-account .round .r { width: 25%; padding:0 2px; }
.my-account .round .disabled { opacity:0.5 }

.my-account .set-gallery { position:relative; width: 100%; margin-top:20px; }
.my-account .set-gallery ul { display:flex; flex-wrap:wrap; margin:0 -5px }
.my-account .set-gallery li { position: relative; width: 33.3333%; padding: 5px !important; }

.my-account .set-gallery .box-file-up { display: flex;flex-wrap: wrap;align-items: center;margin-top: 10px;position: relative;width: 100%; height: 300px;border-radius: 4px; padding: 4px;background: var(--color-white);border: 1px solid var(--color-miniblue-border); overflow: hidden;}
.my-account .set-gallery .box-file-up img { display:none; }
.my-account .set-gallery .box-file-up.fix-100 {  width: 100px !important; }
.my-account .set-gallery .btn_upload {cursor: pointer;display: flex; align-items: flex-end; justify-content: center; flex-wrap: wrap;overflow: hidden;position: relative;color: #333;background-color: #f0f0f0;width: 100%; height: 100%;border-radius: 2px;padding: 0 0 6px 0; transition: all 0.3s ease;}
.my-account .set-gallery .btn_upload:before { content: ''; position: absolute; width: 100px; height: 100px; background: url(../images/icon-photo.svg) no-repeat center; background-size: 100%; left: 0; right: 0;  top: 0; bottom: 0; margin: auto; }
.my-account .set-gallery .btn_upload:hover,
.my-account .set-gallery .btn_upload:focus { background-color: #ddd; transition: all 0.3s ease;}
.my-account .set-gallery .btn_upload input { cursor: pointer; width: 100%; height: 100%;position: absolute;filter: alpha(opacity=1);-moz-opacity: 0; opacity: 0;}
.my-account .set-gallery .preview-img { display: block !important; padding: 4px; border-radius: 2px; width: 100% !important; height: 100% !important; position:absolute; z-index:1; top: 0; bottom: 0; object-fit: cover; left: 0; }

.btn-rmv1,.btn-rmv2,.btn-rmv3,.btn-rmv4,.btn-rmv5,.btn-rmv6 { display: none;}

.rmv { cursor: pointer !important; display: block !important; position: absolute !important; border-radius: 50% !important; width: 40px !important; height: 40px !important; min-width: inherit !important; background: var(--color-white) url(../images/icon-delete-red.svg) no-repeat center !important; background-size: 50% !important; z-index: 2; top: 10px !important; right: 15px !important; }
.rmv:hover {}

.my-account .cke_chrome { position: relative; overflow: hidden; border:1px solid var(--color-miniblue-border); !important; border-radius:3px; }
.my-account .cke_bottom { display:none; }
.my-account .cke_top { border-bottom:1px solid var(--color-miniblue-border); !important; }

.line-hr { display: flex;  position: relative;  width: 100%;  margin-top: 15px}
.line-hr:before {content: ''; position: absolute; width: 100%; height: 1px; background: #eee; top: 0; bottom: 0; left: 0; margin-top: auto; margin-bottom: auto}
.line-hr small { position: relative; padding: 0 15px 0 0; font-size: 14px; font-weight: 300; color: #aaa; background: var(--color-white); z-index: 1}

.showtext { width: 100%; padding: 10px; font-size: 16px; font-weight: 400; border-radius: 8px; background: #e4e7ef; }
.showtext u { text-decoration: underline !important; }
.showtext p { padding:0; margin:0; }

.me-profile { width: 100%; position:relative; padding: 0; }

.me-profile-overview { position:relative; width: 100%; padding-top:25px; }
.my-account .box-btn .btn-cancel a { background:var(--color-sky); }
.my-account .box-btn .btn-cancel a:hover { background:var(--color-blue); }
.my-account .box-detail article .box-btn .btn-cancel a { background:var(--color-gray-big); }
.my-account .box-detail article .box-btn .btn-cancel a:hover { background:var(--color-gray-big-hover); }

.me-overview-cover { width: 100%; display:flex; flex-wrap:wrap; padding: 30px; background:var(--color-blue); border-bottom:4px solid var(--color-yellow); border-top-left-radius: 8px; border-top-right-radius: 8px; }
.me-overview-cover .cover-img { padding: 10px; width: 250px; height:250px; border-radius:50%; position:relative; overflow:hidden; background:var(--color-yellow); }
.me-overview-cover .cover-img img { padding: 6px; width: 100%; border-radius:50%; position:absolute; object-fit: cover; top: 0; left: 0; bottom: 0; right:0; margin: 0 auto; }
.me-overview-cover .name-contact { display: flex; flex-wrap: wrap; align-items: center; align-content: center; padding-left:40px; flex: 1; color:var(--color-white); }
.me-overview-cover .name-contact .name { position: relative; width: 100%; font-size:30px; font-weight:700; padding-bottom: 10px; margin-bottom: 15px; text-transform:uppercase; }
.me-overview-cover .name-contact .name:before { content:''; position:absolute; width:20px; height:4px; background:var(--color-yellow); bottom: 0; left: 0 }
.me-overview-cover .name-contact .mini { width: 100%; display:flex; flex-wrap:wrap; color:var(--color-white-drop); }
.me-overview-cover .name-contact span { position: relative; display: flex; flex-wrap: wrap; width: 150px; padding-right:8px; font-weight:600 }
.me-overview-cover .name-contact span i { margin-left: auto; font-style: normal; color: rgba(255, 255, 255, .7);}

.me-title { position: relative; display: flex; align-items: center; margin-top: 30px; margin-bottom: 10px; color: var(--color-blue); font-size:24px; font-weight: 600; }
.me-title:before { content:''; position:absolute; width:20px; height:4px; background:var(--color-sky); right: 0; bottom: 0; top: 0; margin-top: auto; margin-bottom: auto;}
.me-title .stroke { padding:0 0 0 20px; margin: 0 0 0 auto; font-size:16px; color:var(--color-black); }
.me-title .stroke span { font-weight: 600; border-radius:90px; color:var(--color-white);background: var(--color-sky); padding: 2px 10px; }
.no-before:before { display:none !important; }

.me-profile .me-text-show-line:last-child { border-bottom:1px solid var(--color-miniblue-border); }
.me-text-show-line { width: 100%; display: flex; flex-wrap:wrap; border-top:1px solid var(--color-miniblue-border); font-size:14px;  }
.me-text-show-line span { display: inline-flex; min-width: 150px; font-weight: 600; padding: 6px 0; position:relative; background: var(--color-white);  }
.me-text-show-line span:before { content:""; position:absolute; width: 1px; height: 80%; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; left: 100%; border-right:1px dotted #cfd9e2; z-index: 1; }
.me-text-show-line .text-des { display: flex; align-items: center; flex:1 }
.me-text-show-line .in-txt { width: 100%; padding:6px 20px; position:relative; background: var(--color-white); }

.me-profile .in-txt p { margin:0; padding:0; }
.me-profile .full-txt { padding: 6px 0 }
.me-profile .full-txt u { text-decoration:underline !important; }

.me-show-gallery { width: 100%; padding: 20px 0;  border-bottom:1px solid var(--color-miniblue-border); border-top:1px solid var(--color-miniblue-border);}
.me-show-gallery ul { display:flex; flex-wrap: wrap; margin: -3px !important; }
.me-show-gallery ul li { width: 16.6666% !important; padding: 3px !important; }
.me-show-gallery ul li figure { position:relative; width: 100%;  height: 280px !important; border-radius:3px !important; /*border:1px solid var(--color-miniblue-border);*/ }
.me-show-gallery ul li figure img { /*padding: 4px;*/ width: 100%; position:absolute; object-fit: cover; top: 0; left: 0; bottom: 0; right:0; margin: 0 auto; border-radius:8px !important; }

.me-show-tournament { position:relative; width: 100%; }
.me-show-tournament .box-for-table { position:relative; overflow:hidden; width: 100%; }
.me-show-tournament .box-table {  }
.me-show-tournament table { width: 100%; font-size: 14px; font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif; }
.me-show-tournament table thead tr { }
.me-show-tournament table thead tr th { padding: 10px 5px; text-align: center; background: var(--color-miniblue); border: 1px solid var(--color-miniblue-border); border-right: 1px solid var(--color-miniblue-border); border-bottom: 1px solid var(--color-miniblue-border) }
.me-show-tournament table thead tr th:nth-child(1) { width: 80px;  }
.me-show-tournament table thead tr th:nth-child(6) { width: 80px;  }
.me-show-tournament table tbody tr { }
.me-show-tournament table tbody tr:nth-child(even) { background:#f7fbff }
.me-show-tournament table tbody tr td { padding:  5px; text-align: center; border-right: 1px solid var(--color-miniblue-border); border-bottom: 1px solid var(--color-miniblue-border) }
.me-show-tournament table tbody tr td:first-child { border-left: 1px solid var(--color-miniblue-border)}
.me-show-tournament .sticky-no {  }
.me-show-tournament .sticky-data {  }
.me-show-tournament .sticky-tournament { text-align:left; }
.me-show-tournament th.sticky-tournament { text-align:center; }
.me-show-tournament .sticky-course { text-align:left; width: 160px; }
.me-show-tournament th.sticky-course { text-align:center;  }
.me-show-tournament .sticky-class { width: 50px; }
.me-show-tournament .sticky-finish { width: 50px; }
.me-show-tournament .sticky-score { width: 80px; }
.me-show-tournament .sticky-yards { width: 42px; }
.me-show-tournament .sticky-rating { width: 50px; }

/* ------------------------------------------------------------------------------------------------------------
|  Scorecard  |
------------------------------------------------------------------------------------------------------------ */
.scorecard { width: 100%; padding: 30px 0 60px 0 }
.scorecard .current-reject {  }
.scorecard .current-reject:before { content:''; position: absolute; width: 100%; height:100%; background:var(--color-miniblue); left:0; top:0;  z-index:2; opacity: 0.5  }
.scorecard .current-reject .player-name img { filter:grayscale(100%); }
.scorecard .has-user-on figure:before { content:''; position:absolute; width: 10px; height: 10px; border-radius:50%; background: #08c517; left: 0; bottom: -5px; right: 0; margin:auto; animation: blink 1s infinite; }
@keyframes blink { 0%, 30% { background: #08c517; }90%, 100% { background: #1fe72f; }100%, 0% { background: #08c517; } }

.scorecard-tourname { display:flex; flex-wrap:wrap; margin-bottom:10px; }
.scorecard-tourname h2 { font-size:16px; font-weight:700; padding:0; }
.scorecard-tourname .box { display:flex; flex-wrap:wrap; align-items: center; width: 100%; color: var(--color-gray); padding-bottom: 10px; border-bottom: 1px solid var(--color-miniblue-border); }
.scorecard-tourname .round span { display: flex; padding: 5px 7px; border-radius:4px; background:var(--color-sky); color:var(--color-white); font-weight:700; }
.scorecard-tourname .date { padding-left:15px; }
.scorecard-tourname .tee-time { margin-left:auto; }
.scorecard-tourname .tee-time small { font-size:12px; padding-right:7px; }
.scorecard-tourname .tee-time strong { color:var(--color-sky); }

.scorecard-tourname .select-now { display:flex; width: 100%; padding-bottom:15px; }
.scorecard-tourname .select-now select { width: 100%; max-width: 400px; }

.scorecard-lists { position: relative; padding: 20px; border-radius:15px; margin-bottom: 15px; background:var(--color-miniblue); }
.scorecard-lists .player-set { position:relative; user-select:none; }
.scorecard-lists .player-name { position:relative; display:flex; align-items:center; gap:15px; cursor: pointer;  }
.scorecard-lists .name-box { display:flex; flex:1; flex-direction: column; }
.scorecard-lists .class-player { font-weight:normal; font-size:12px; color:var(--color-blue);  }
.scorecard-lists .player-name:hover .toggle-indicator { color:var(--color-gray); transition:all 0.3s ease }
.scorecard-lists .player-name figure { display: block; position:relative; width: 60px; height: 60px; }
.scorecard-lists .player-name img { border-radius:50%; overflow:hidden;  }
.scorecard-lists .player-name h3 { position: static; padding:0 15px 0 0; font-size:15px; font-weight:600;  }
.scorecard-lists .country-name { line-height: 1; font-size:12px; color:var(--color-graydrop); text-transform:uppercase; }
.scorecard-lists .flag-country { display:flex; flex-wrap:wrap; align-items:center; }
.scorecard-lists .flag-country .flag { transform:scale(0.7); margin-left:-3px; }

.scorecard-lists .set-hole { position:relative; display: none; width: 100%; margin-top:10px; }
.scorecard-lists .show-hole { display:block; }
.scorecard-lists .row-hole { display:grid; grid-template-columns:repeat(5, 1fr); gap: 10px; padding-top: 5px; padding-bottom:20px; border-bottom:1px dashed var(--color-miniblue-border); }
.scorecard-lists .set-hole .row-hole:nth-child(2) { border-bottom:none; }
.scorecard-lists .number-hole { position:relative; }
.scorecard-lists .text-hole { display: block; width: 100%; text-align:center; font-weight:600; font-size:14px; color:var(--color-gray); }
.scorecard-lists .number-par { font-size:10px; position:absolute; width: 70%; padding: 0 2px; border-radius:90px; text-align: center; color: #7a8dbb; left: 0; right: 0; margin-left: auto; margin-right: auto; bottom: -6px; z-index: 1; background:var(--color-miniblue-border); }
.scorecard-lists .score-input { font-family: 'Inter', Kanit, Arial, Helvetica, sans-serif;  font-weight: 700; color: var(--color-black); width: 100%; height: 50px;  padding: 5px; font-size: 18px; text-align: center; border-radius: 6px; border: 2px solid var(--color-miniblue-border);}

.player-set.active .toggle-indicator {  transition:all 0.3s ease }
.toggle-indicator { position: absolute; right: 0; font-size: 14px; color: #afbac9; transition: transform 0.3s ease; }

.scorecard-lists .row-hole-total { display:grid; grid-template-columns:repeat(3, 1fr); gap: 10px; /*padding-top: 15px;*/ }
.scorecard-lists .box { width: 100%; padding: 10px 0; text-align: center; border-radius: 6px; background:var(--color-miniblue-border); }
.scorecard-lists .box .text { font-size:12px; font-weight: 600; padding-bottom:0; color:var(--color-gray); }
.scorecard-lists .box .show-sum { font-weight:700; font-size:18px; color:var(--color-blue); }

.scorecard-lists .status-eagles-better { color: #f5b300; /* border: 2px solid #f5b300; background-color: #ffecb8;*/ }
.scorecard-lists .status-birdies { color: #e00000; /* border: 2px solid #e00000; /*background-color: #ffb1b1;*/ }
.scorecard-lists .status-bogeys { color: #158cd4; /* border: 2px solid #158cd4;/*background-color: #c0e7ff;*/ }
.scorecard-lists .status-d-bogey-worse { color: #1ca976; /* border: 2px solid #1ca976;  /*background-color: #cefaea;*/}

.scorecard-status-color { display:grid; grid-template-columns: repeat(4, auto); gap: 5px; padding-bottom:15px; }
.scorecard-status-color > div { display: flex; align-items:baseline; font-size:12px; color:var(--color-graydrop); }
.scorecard-status-color > div > span { display: inline-block; width: 10px; height: 10px; margin-right: 5px; border-radius:50% }
.scorecard-status-color .status-eagles-better { border: 2px solid #f5b300; /*background-color: #ffecb8;*/ }
.scorecard-status-color .status-birdies { border: 2px solid #e00000; /*background-color: #ffb1b1;*/ }
.scorecard-status-color .status-bogeys { border: 2px solid #158cd4;/*background-color: #c0e7ff;*/ }
.scorecard-status-color .status-d-bogey-worse { border: 2px solid #1ca976;  /*background-color: #cefaea;*/}

.scorecard-lists .note {  width: 100%; text-align:center; line-height:1; color:#f98d50; padding-top:10px; font-size:16px }
.scorecard-lists .status-player { position:absolute; right:20px; top: 0; font-size:12px; line-height: 1; padding: 3px 8px; color: var(--color-white); border-radius:0 0 4px 4px; font-weight:300 }
.scorecard-lists .has-live { background:var(--color-sky) }
.scorecard-lists .has-padding { background: #f9a750 }
.scorecard-lists .has-confirmed { background: #04b12a }
.scorecard-lists .has-reject { background: #6d7985 }

.scorecard-history { position: relative; padding: 20px; border-radius:15px; background:var(--color-miniblue); }
.scorecard-history .subject-title { font-size:18px; font-weight:700; padding-bottom:15px; }
.scorecard-history .box { max-height: 220px; overflow-y: auto;  }
.scorecard-history .name-user { font-weight:500; font-size:15px; }
.scorecard-history .event { font-size:14px; font-weight: 400; color:var(--color-gray); }
.scorecard-history .activity-item { position: relative; display: flex; flex-wrap: wrap; flex-direction: column; padding: 12px 15px; border-radius: 10px; margin-bottom: 10px; border-left: 4px solid var(--color-sky);   background:var(--color-white); }
.scorecard-history .activity-item:last-child { margin-bottom:0 }
.scorecard-history .result { display:flex; flex-wrap:wrap; align-items:flex-end; color:var(--color-gray); font-size:14px; }
.scorecard-history .storkes {  }
.scorecard-history .activity-time { margin-left: auto; font-size:12px; color:var(--color-graydrop); }

.scorecard-popup-aleart { position: fixed; width: 100%; justify-content: center; display: flex; flex-wrap: wrap; left:0; bottom:10px; padding: 0 15px; z-index:2 }
.scorecard-popup-aleart a { display: flex; position: relative; width: 100%; max-width: 1250px; padding: 15px 50px 15px 20px; font-size: 14px; color:var(--color-white);  background: var(--color-sky); border-radius:10px; box-shadow:0 3px 8px 1px rgb(0 107 255 / 50%); /*border:1px solid var(--color-blue);*/ }
.scorecard-popup-aleart a:hover {  }
.scorecard-popup-aleart a span { margin-left:auto; position: absolute; right: 20px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 24px; height:24px; }
.scorecard-popup-aleart a i { display: block; position: relative; z-index: 1; display:flex; width: 100%; height: 100%; background:var(--color-yellow) url(../images/icon-arrownext-blue.svg) no-repeat center; background-size: 80%; border-radius:50%; }
.scorecard-popup-aleart .message-text { position: relative; width: 100%; max-width: 1250px; padding: 15px 20px; font-size: 14px; color:var(--color-white); border-radius:10px; box-shadow:0 3px 8px 1px rgb(0 107 255 / 50%);  }
.scorecard-popup-aleart .message-text .text { padding-right: 10px; flex: 1; font-size:14px; }
.scorecard-popup-aleart .message-text .text small { font-size:12px; display:block; line-height:1.2; padding-top:5px; }
.scorecard-popup-aleart .bg-sky { background: var(--color-sky);   }
.scorecard-popup-aleart .bg-red { display: flex; flex-wrap: wrap; align-items: center;   background: #ff5353; box-shadow: 0 3px 8px 1px rgb(255 123 123 / 50%); }
.scorecard-popup-aleart .bg-green { display: flex; flex-wrap: wrap; align-items: center;   background: #49be50; box-shadow: 0 3px 8px 1px rgb(73 190 78 / 50%); }

.scorecard-popup-aleart .message-text span { color:var(--color-white); }
.scorecard-popup-aleart a span:before { content: ''; position: absolute; width: 24px; height: 24px; top: 0; right: 0; bottom: 0; margin: auto; background-color: var(--color-yellow); border-radius: 50%; z-index: 0; -webkit-animation: sk-scaleout 1.7s infinite ease-in-out; animation: sk-scaleout 1.7s infinite ease-in-out}
@-webkit-keyframes sk-scaleout { 0% {  -webkit-transform: scale(0) } 100% { -webkit-transform: scale(2); opacity: 0 } }
@keyframes sk-scaleout { 0% { -webkit-transform: scale(0); transform: scale(0) } 50% { -webkit-transform: scale(1.8); transform: scale(1.8); opacity: 0.3 }100% { -webkit-transform: scale(2); transform: scale(2); opacity: 0} }

.scorecard-popup-aleart .box-btn {width: max-content; margin-left:auto;  }
.retry-button { width: max-content; min-width: max-content; height: 36px; font-size: 14px; text-transform: inherit; background: var(--color-sky); color: white; border: none; padding: 10px 15px; border-radius: 5px; cursor: pointer;  }    
.retry-button:hover {background: var(--color-blue); }

.loading-infix { display: inline-block; width: 20px; height: 20px; border: 2px solid #f3f3f3; border-radius: 50%; border-top: 2px solid #007bff; animation: spin 1s linear infinite;  }   
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }


/* ------------------------------------------------------------------------------------------------------------
|  Acadamy  |
------------------------------------------------------------------------------------------------------------ */
.acadamy-golf {  }
.acadamy-golf .cover-acadamy { position:relative; width: 100%; margin-top: 30px; border-radius:20px 20px 0 0; overflow:hidden; }
.acadamy-golf .cover-acadamy figure { position:relative; width: 100%; height: 360px; }
.acadamy-golf .cover-acadamy figure img { position:absolute; width: 100%; object-fit:cover; }
.acadamy-golf .cover-img { width: 150px; height: 150px; position: relative; border-radius: 50%;  border: 2px solid #fff; background: #fff; overflow: hidden; box-shadow: 0 1px 5px rgba(25,25,25,.15)}
.acadamy-golf .box-name { width: 100%; display:flex; flex-wrap:wrap; padding: 30px; background:var(--color-blue); border-bottom:4px solid var(--color-yellow); }

.acadamy-golf .name-acadamy { display: flex; flex-wrap: wrap; align-items: center; align-content: center; padding-left:40px; flex: 1; color:var(--color-white); }
.acadamy-golf .name-acadamy .name { position: relative; width: 100%; margin-bottom: 20px;}
.acadamy-golf .name-acadamy .name:before { content:''; position:absolute; width:20px; height:4px; background:var(--color-yellow); bottom: 0; left: 0 }
.acadamy-golf .name-acadamy .name h2 { padding-bottom: 0; margin-bottom: 10px; font-weight:700;  font-size:36px;  text-transform:uppercase;  }

.acadamy-golf .social-set {  }
.acadamy-golf .social-set ul { display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 15px; }
.acadamy-golf .social-set ul li { width: 40px; height: 40px; margin-right:7px; }
.acadamy-golf .social-set ul li:last-child { margin-right:0 }
.acadamy-golf .social-set ul li a { display: block; width: 100%; height: 100%; text-indent: -9999px; border-radius: 50%; overflow: hidden; }
.acadamy-golf .social-set ul li a.fb { background-color: var(--color-sky); background-image: url(../images/icon-facebook.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.acadamy-golf .social-set ul li a:hover.fb { background-color: #0866ff;  }
.acadamy-golf .social-set ul li a.tw { background-color: var(--color-sky); background-image: url(../images/icon-twitter.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.acadamy-golf .social-set ul li a:hover.tw { background-color: #0f1419 }
.acadamy-golf .social-set ul li a.ig { background-color: var(--color-sky); background-image: url(../images/icon-instagram.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.acadamy-golf .social-set ul li a:hover.ig { background-color: #c726a3 }
.acadamy-golf .social-set ul li a.yt { background-color: var(--color-sky); background-image: url(../images/icon-youtube.svg); background-repeat: no-repeat; background-position: center; background-size: 65%; }
.acadamy-golf .social-set ul li a:hover.yt { background-color: #d90014 }
.acadamy-golf .social-set ul li a.tk { background-color: var(--color-sky); background-image: url(../images/icon-tiktok.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.acadamy-golf .social-set ul li a:hover.tk { background-color: #69C9D0;  }
.acadamy-golf .social-set ul li a.line { background-color: var(--color-sky); background-image: url(../images/icon-line.svg); background-repeat: no-repeat; background-position: center; background-size: 67%; }
.acadamy-golf .social-set ul li a:hover.line { background-color: #06a90b }

.acadamy-golf .acadamy-detail { width: 100%; padding-bottom:100px; }
.acadamy-golf .tabs-set { display: flex; width: 100%; position:relative; border-bottom:1px solid var(--color-miniblue-border); }
.acadamy-golf .tabs-set a { position:relative; padding:  15px 30px; font-weight:600 }
.acadamy-golf .tabs-set a.current { color:var(--color-sky); }
.acadamy-golf .tabs-set a.current:before { content:''; position:absolute; width: 100%; height:3px; background:var(--color-blue); left:0; bottom: 0; }

.acadamy-golf .acadamy-profile p:first-child { padding-top:30px }
.acadamy-golf .acadamy-profile h3:first-child { padding-top:30px; }
.acadamy-golf .acadamy-touch { width: 100%; padding-top:30px }
.acadamy-golf .acadamy-touch ul { display:grid; grid-template-columns: repeat(4, 1fr); gap:15px }
.acadamy-golf .acadamy-touch ul:has(> :nth-child(2):last-child) {grid-template-columns: repeat(2, 1fr);}
.acadamy-golf .acadamy-touch ul:has(> :nth-child(3):last-child) {grid-template-columns: repeat(3, 1fr);}
.acadamy-golf .acadamy-touch h3 { margin-bottom:10px; font-weight:600 }
.acadamy-golf .acadamy-touch h4 { font-size: 18px; margin-top: 0; padding-bottom: 5px; padding-top: 10px; font-weight:600 }
.acadamy-golf .acadamy-touch p { padding: 0; margin:0; }
.acadamy-golf .acadamy-touch i { width: 40px; height: 40px; display:inline-flex; }
.acadamy-golf .acadamy-touch a { display:inline-flex; }
.acadamy-golf .icon-location { background:url(../images/icon-location.svg) no-repeat center; background-size:100%; }
.acadamy-golf .icon-email { background:url(../images/icon-email.svg) no-repeat center; background-size:100%; }
.acadamy-golf .icon-phone { background:url(../images/icon-phone.svg) no-repeat center; background-size:100%; }
.acadamy-golf .icon-website { background:url(../images/icon-website.svg) no-repeat center; background-size:100%; }

.acadamy-golf .acadamy-players { width: 100%; position:relative; }
.acadamy-golf .acadamy-players h3 { padding-top:30px }
.acadamy-golf .players-list { margin-top:20px; padding-bottom:0 }
.acadamy-golf .search-filter { padding-top:0; position:absolute; right:0; top: 26px; width: 50%; }
.acadamy-golf .search-filter .select-now { padding-left:15px }
.acadamy-golf .search-in { display:flex; flex-wrap:wrap; align-items:center; }
.acadamy-golf .search-in h5 { font-size:14px; }
.acadamy-golf #liResult { width: 100%; position: relative; display: flex; align-items: center;  padding: 5px 20px; text-transform: uppercase; padding-left: 0; font-size: 14px; font-weight: 600; } 
.acadamy-golf #liResult h5 { line-height: 1; padding: 0; font-size: 14px; font-weight: 600;  }
.acadamy-golf .acadamy-players .has-team { width: auto; height: 30px; background-color: var(--color-sky); border-left: 1px solid var(--color-sky); transform: rotate(-0.25turn); position: absolute; right: 10px; top: 9px; color: white; font-family: 'Roboto Condensed', 'Kanit', Arial, Helvetica, sans-serif;
font-weight: 500; text-transform: uppercase; font-size: 13px; line-height: 30px; padding: 0 10px 0 10px; z-index:1 }
.acadamy-golf .acadamy-players .has-team:before { content: ""; position: absolute; display: block; left: -16px; width: 0; height: 0;  border-top: 15px solid transparent; border-bottom: 15px solid transparent; border-right: 15px solid var(--color-blue); }

.acadamy-list { position:relative; width: 100%; }
.acadamy-list ul { display:grid; grid-template-columns:repeat(3, 1fr); gap:30px; padding: 20px 0 30px 0  }
.acadamy-list ul li { position: relative; text-align: center;  }
.acadamy-list ul li a { height: 100%; }
.acadamy-list .photo-radius { position: relative; margin: 60px auto 0 auto; width: 150px; height: 150px;  box-shadow: 0 1px 5px rgba(25,25,25,.15); border: 2px solid #fff; border-radius: 50%; background: #fff; transition: all 0.3s ease; z-index: 1;  }
.acadamy-list .photo-radius figure { position:relative; width: 100%; height: 100%; border-radius:50%; overflow:hidden; }
.acadamy-list .photo-radius img { width: 100%; border-radius: 50%; object-fit: cover;  }

.acadamy-list article { position: relative; height: 100%; background: var(--color-miniblue); border-radius: 8px; border:1px solid var(--color-miniblue-border); padding: 20px; transition:all 0.3s ease }
.acadamy-list article:hover {  border:1px solid var(--color-blue); transition:all 0.3s ease }
.acadamy-list article a:hover h5 { color:var(--color-sky); }
.acadamy-list .box-data { display:grid; grid-template-columns:repeat(2, 1fr); gap:10px 0 }
.acadamy-list .box-data .show-in { text-align:center; padding: 0 10px; }
.acadamy-list .box-data .show-in:last-child { border-left:1px solid #cad5ef; }
.acadamy-list h4 { font-weight:700 }
.acadamy-list h5 { padding: 0; margin:0; font-weight:700; color:var(--color-black); }
.acadamy-list p { padding: 0; font-size:12px; font-weight:400; color:var(--color-black); }
.acadamy-list .cover-acadamy-mini { position:absolute;  height: 150px; top: 6px; left:6px; right: 6px; border-radius:4px 4px 0 0 ; overflow: hidden;}
.acadamy-list .cover-acadamy-mini figure { position:relative; width: 100%; height: 100%; }
.acadamy-list .cover-acadamy-mini figure img { position:absolute; width: 100%; object-fit:cover; }
.acadamy-list .has-link .photo-radius:before { content:''; position:absolute; width: 20px; height: 20px; border-radius:6px; background:var(--color-sky) url(../images/icon-featured.svg) no-repeat center; background-size: 60%; left:0; right:0; bottom:-10px; z-index:1; margin:0 auto; }

.coach-lists-player { width: 100%; padding: 20px 0 }
.coach-lists-player ul { display:flex; flex-wrap:wrap; margin: -10px !important; }
.coach-lists-player li { width: 50% !important; padding: 10px !important; }
.coach-lists-player .box { position:relative; height: 100%; border-radius:8px; border:1px solid var(--color-miniblue-border); background: var(--color-miniblue); transition: all 0.3s ease; overflow:hidden; }
.coach-lists-player .box a { display: flex; height: 100%; flex-wrap: wrap; padding: 15px; }
.coach-lists-player .box a:hover { }
.coach-lists-player .box:hover { border:1px solid var(--color-blue); transition: all 0.3s ease }
.coach-lists-player .des { flex:1; padding-left:15px; }
.coach-lists-player .cover-img {  padding: 10px;  width: 120px; height:120px; border-radius:50%; position:relative; overflow:hidden; background:var(--color-white); }
.coach-lists-player .cover-img img { padding: 4px; width: 100%; border-radius:50%; position:absolute; object-fit: cover; top: 0; left: 0; bottom: 0; right:0; margin: 0 auto; }
.coach-lists-player .name {  position: relative; width: 100%; font-size:18px; font-weight:700; margin-top: 10px; padding-bottom: 10px; margin-bottom: 15px;  text-transform:uppercase; }
.coach-lists-player .name:before { content:''; position:absolute; width:20px; height:3px; background:var(--color-yellow); bottom: 0; left: 0;  }
.coach-lists-player .name span { display: block; width: max-content; font-weight:700 }
.coach-lists-player .mini { width: 100%; padding: 3px 0; display:flex; flex-wrap:wrap; color: var(--color-gray); border-top:1px dotted var(--color-miniblue-border); font-size:14px; }
.coach-lists-player span { position: relative; display: flex; flex-wrap: wrap; width: 120px; padding-right:8px; font-weight:600;  }
.coach-lists-player span i { margin-left: auto; font-style: normal; color: rgba(255, 255, 255, .7);}

.insearch { position: relative; display: flex; flex-wrap: wrap; width: 100%; margin-bottom:15px; }
.insearch label { position: absolute; display: block; overflow: hidden; text-indent: -9999px; }
.insearch input[type="text"] { width: 100%; height: 40px;  padding: 0 40px 0 15px;  }
.insearch input[type="text"]::placeholder { color: #989898; }
.insearch .btn-search-mi {  position: absolute; width: 40px;  height: 40px; right: 0;  bottom: 0; }
.insearch .btn-search-mi button { position: relative; text-indent: -999px; min-width: inherit; max-width: inherit; overflow: hidden; width: 40px; height: 40px;  background: url(../images/icon-search.svg) no-repeat center;  background-size: 20px;}
.insearch .text-search { flex: 1; position:relative; }
.insearch .select { position: relative; width: 160px; padding-left:20px; }

/*Crop Profile*/

.croppie-container {
    width: 100%;
    height: 100%;
}

.croppie-container .cr-image {
    z-index: -1;
    position: absolute;
    top: 0;
    left: 0;
    transform-origin: 0 0;
    max-height: none;
    max-width: none;
}

.croppie-container .cr-boundary {
    position: relative;
    overflow: hidden;
    margin: 0 auto;
    z-index: 1;
    width: 100%;
    height: 100%;
}

.croppie-container .cr-viewport,
.croppie-container .cr-resizer {
    position: absolute;
    border: 2px solid var(--color-white);
    margin: auto;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    box-shadow: 0 0 2000px 2000px rgba(0, 0, 0, 0.5);
    z-index: 0;
}

.croppie-container .cr-resizer {
  z-index: 2;
  box-shadow: none;
  pointer-events: none;
}

.croppie-container .cr-resizer-vertical,
.croppie-container .cr-resizer-horisontal {
  position: absolute;
  pointer-events: all;
}

.croppie-container .cr-resizer-vertical::after,
.croppie-container .cr-resizer-horisontal::after {
    display: block;
    position: absolute;
    box-sizing: border-box;
    border: 1px solid black;
    background: var(--color-white);
    width: 10px;
    height: 10px;
    content: '';
}

.croppie-container .cr-resizer-vertical {
  bottom: -5px;
  cursor: row-resize;
  width: 100%;
  height: 10px;
}

.croppie-container .cr-resizer-vertical::after {
    left: 50%;
    margin-left: -5px;
}

.croppie-container .cr-resizer-horisontal {
  right: -5px;
  cursor: col-resize;
  width: 10px;
  height: 100%;
}

.croppie-container .cr-resizer-horisontal::after {
    top: 50%;
    margin-top: -5px;
}

.croppie-container .cr-original-image {
    display: none;
}

.croppie-container .cr-vp-circle {
    border-radius: 50%;
}

.croppie-container .cr-overlay {
    z-index: 1;
    position: absolute;
    cursor: move;
    touch-action: none;
}

.croppie-container .cr-slider-wrap {
    width: 75%;
    margin: 15px auto;
    text-align: center;
}

.croppie-result {
    position: relative;
    overflow: hidden;
}

.croppie-result img {
    position: absolute;
}

.croppie-container .cr-image,
.croppie-container .cr-overlay,
.croppie-container .cr-viewport {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
}

/*************************************/
/***** STYLING RANGE INPUT ***********/
/*************************************/
/*http://brennaobrien.com/blog/2014/05/style-input-type-range-in-every-browser.html */
/*************************************/

.cr-slider {
    -webkit-appearance: none;
/*removes default webkit styles*/
    /*border: 1px solid white; *//*fix for FF unable to apply focus style bug */
    width: 300px;
/*required for proper track sizing in FF*/
    max-width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    background-color: transparent;
}

.cr-slider::-webkit-slider-runnable-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

.cr-slider:focus {
    outline: none;
}
/*
.cr-slider:focus::-webkit-slider-runnable-track {
background: #ccc;
}
*/

.cr-slider::-moz-range-track {
    width: 100%;
    height: 3px;
    background: rgba(0, 0, 0, 0.5);
    border: 0;
    border-radius: 3px;
}

.cr-slider::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top: -6px;
}

/*hide the outline behind the border*/
.cr-slider:-moz-focusring {
    outline: 1px solid white;
    outline-offset: -1px;
}

.cr-slider::-ms-track {
    width: 100%;
    height: 5px;
    background: transparent;
/*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    border-color: transparent;/*leave room for the larger thumb to overflow with a transparent border */
    border-width: 6px 0;
    color: transparent;/*remove default tick marks*/
}
.cr-slider::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
    border-radius: 10px;
}
.cr-slider::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #ddd;
    margin-top:1px;
}
.cr-slider:focus::-ms-fill-lower {
    background: rgba(0, 0, 0, 0.5);
}
.cr-slider:focus::-ms-fill-upper {
    background: rgba(0, 0, 0, 0.5);
}
/*******************************************/

/***********************************/
/* Rotation Tools */
/***********************************/
.cr-rotate-controls {
    position: absolute;
    bottom: 5px;
    left: 5px;
    z-index: 1;
}
.cr-rotate-controls button {
    border: 0;
    background: none;
}
.cr-rotate-controls i:before {
    display: inline-block;
    font-style: normal;
    font-weight: 900;
    font-size: 22px;
}
.cr-rotate-l i:before {
    content: '↺';
}
.cr-rotate-r i:before {
    content: '↻';
}

 label.cabinet{
    display: block;
    cursor: pointer;
    max-width: 100%;
}

label.cabinet input.file{
    position: relative;
    height: 0;
    width: auto;
    opacity: 0;
    -moz-opacity: 0; display: none;
  filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);
}
label.cabinet figure {     margin: 0; }

.modal-open {
    overflow: hidden;
}

#upload-demo{
    width: 100%;
    height: 300px;
  padding-bottom:25px;
}

.modal-body { position: relative; padding: 15px 15px 25px 15px; }
.modal-dialog {     width: 100%;
    margin: 0 auto;
    position: relative;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0,0,0,.5); }
.modal-header { padding: 10px 15px 5px 15px; border-bottom: 1px solid #e5e5e5; }
.modal-title {
    margin: 0; padding: 0;
    line-height: 1.42857143;
}
.modal-content {
    position: relative;
    background-color: var(--color-white);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #999;
    border: 1px solid rgba(0,0,0,.2);
    border-radius: 6px;
    outline: 0;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
}
.modal-footer {
    padding: 15px;
    text-align: right; display: flex;
    border-top: 1px solid #e5e5e5;
}
.modal-footer button { min-width:inherit; width: 50% !important; }
.modal.in .modal-dialog {
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    -o-transform: translate(0,0);
    transform: translate(0,0);
        -webkit-transition: -webkit-transform .3s ease-out;
    -o-transition: -o-transform .3s ease-out;
    transition: transform .3s ease-out;
}
.btn-default {
    color: #333;
    background-color: var(--color-white);
    border-color: #ccc;
}
.btn {
    display: inline-block;
    padding: 6px 12px;
    margin-bottom: 0;

    font-size: 14px;
    max-width: inherit !important; width: inherit !important;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}
.modal-footer .btn+.btn {
    margin-bottom: 0;
    margin-left: 5px;
}
.btn-primary {
    color: var(--color-white);
    background-color: #005288; max-width: inherit; width: max-content;
}
.btn-default { background:#f9f9f9 }
.btn-default:hover { color:var(--color-white); }
.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}

.close {
    float: right;
    font-size: 20px;
    font-weight: 700;
    display: block;
    line-height: 1;
    width: 28px !important; height: 28px;
    min-width: 28px;
    color: var(--color-black);
    background: #f0f0f0;
    border: 1px solid #eee;
    cursor: pointer !important;
    position: relative; z-index: 1;
}
.close:hover { color:var(--color-white) }

.up-gallery-crop {  position:relative; height: 100%; }
.up-gallery-crop label { padding-top:0; padding-bottom: 0; height: 100%; }
.up-gallery-crop figure { width: 100%; }
.up-gallery-crop label.cabinet figure:after {
    content: '';
    position: absolute;
    width: 100px;
    height: 100px;
    background: url(../images/icon-photo.svg) no-repeat center;
    background-size: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto; z-index: 0;
}
.up-gallery-crop label.cabinet figure { position:  relative; overflow: hidden; width:  100%; height: 100%; border-radius:4px; display:block;
    padding: 4px;
    line-height: 1.42857143;
    background-color: var(--color-miniblue);
    border: 1px solid var(--color-miniblue-border);
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out; }
.up-gallery-crop label.cabinet figure img { object-fit:cover; width: 100%; position:relative; z-index:1 }
.up-gallery-crop label.cabinet figure:hover { border:1px solid var(--color-blue); }
.up-gallery-crop .btn-rmv3 { display:none; }
.txt-choose-picture { position:absolute; width: 100%; text-align: center; z-index:0; bottom: 15px; left: 0; right:0; margin-left:auto; margin-right:auto; }

.img-thumbnail { width: 150px; height: 150px; border-radius:50%; display: inline-block;
    height: auto;
    padding: 4px;
    line-height: 1.42857143;
    background-color: var(--color-miniblue);
    border: 1px solid var(--color-miniblue-border);
    -webkit-transition: all .2s ease-in-out;
    -o-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out; }
.img-thumbnail:hover { border:1px solid var(--color-blue); }
.box-upprofile { margin-top: 15px; width: 150px; text-align:center; position:relative; }
.txt-up { padding-top:15px; }

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto;
}
.fade.in {
    opacity: 1;
}
.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 999999;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}
.fade {
    opacity: 0;
    -webkit-transition: opacity .15s linear;
    -o-transition: opacity .15s linear;
    transition: opacity .15s linear;
}

/**/

.border-bottom { border-bottom:1px solid var(--color-miniblue-border); }
.border-top { border-top:1px solid var(--color-miniblue-border); }
.border-top-none { border-top:none !important; }
.border-bottom-none { border-bottom:none; }
/*.me-about .text-show-line { width: 100%; padding-bottom:15px; display: flex; flex-wrap:wrap; }
.me-about .text-show-line span { display: inline-flex; text-align: center; border-radius:90px; min-width: 200px; justify-content: center; padding:10px 20px; position:relative; background: var(--color-white); border:1px solid #b2bcc5; }
.me-about .text-show-line span:before { content:""; position:absolute; width: 50px; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; left: 100%; background:#b2bcc5 }
.me-about .text-show-line .text-des { display: flex; align-items: center; padding-left:50px; flex:1 }
.me-about .text-show-line .in-txt {  display: inline-flex; text-align: center; border-radius:90px; width: 100%; padding:10px 20px; position:relative; background: var(--color-white); border:1px solid #b2bcc5; }
*/

.pagination { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; margin: 10px 0 15px 0; padding: 0; }
.pagination span { display: inline-flex; width: 40px; height: 40px; margin: 0 4px; justify-content: center; align-items: center; border-radius: 50%; background: var(--color-dropwhitefooter) }
.pagination a { display: inline-flex; width: 40px; height: 40px; margin: 0 4px; font-family:  Arial, Helvetica, sans-serif; justify-content: center; align-items: center; align-content: center; border-radius: 50%; border: 1px solid var(--color-miniblue-border); background: var(--color-miniblue) }
.pagination a:first-child { margin-left: 0; }
.pagination a:last-child { margin-right: 0; }
.pagination a svg { fill: var(--color-black); width: 15px; height: 15px; }
.pagination a:hover { color: var(--color-sky); border: 1px solid var(--color-blue);  }
.pagination a.current { background: var(--color-sky); color: var(--color-white); border:1px solid var(--color-sky); }
.pagination span.prve { text-indent: -9999px; background: var(--color-miniblue) url(../images/icon-back-black.svg) no-repeat center; background-size: 50%; cursor: pointer; transition: all 0.3s ease;  border:1px solid var(--color-miniblue-border);}
.pagination span.prve:hover { background: var(--color-miniblue) url(../images/icon-back-black.svg) no-repeat center; background-size: 50%;  transition: all 0.3s ease; border:1px solid var(--color-blue);} 
.pagination span.next { text-indent: -9999px; background: var(--color-miniblue) url(../images/icon-next-black.svg) no-repeat center; background-size: 50%; cursor: pointer;  transition: all 0.3s ease; border:1px solid var(--color-miniblue-border);}
.pagination span.next:hover { background: var(--color-white) url(../images/icon-next-black.svg) no-repeat center; background-size: 50%;  transition: all 0.3s ease; border:1px solid var(--color-blue);} 
.pagination .none-border { border:none; padding-left:0; }
.pagination .none-border a:hover { border:nene;  }
.pagination .disable { pointer-events: none !important; cursor: default; opacity: 0.5; }
.pagination .dott { width: 20px; }

/* ------------------------------------------------------------------------------------------------------------
|  Nav Mobile  |
------------------------------------------------------------------------------------------------------------ */
.open-nav { opacity: 1; visibility: visible; right: 0 !important; transition-timing-function: cubic-bezier(0.76, 0.22, 0.38, 0.9); transition-duration: 0.5s; webkit-transition: all 0.5s ease;-moz-transition: all 0.5s ease;-o-transition: all 0.5s ease;transition: all 0.5s ease; }
.show-nav { right: 0 !important; background: #ddd; -webkit-transition: all 0.6s cubic-bezier(1, .1, .2, 1); -moz-transition: all 0.6s cubic-bezier(1, .1, .2, 1); -o-transition: all 0.6s cubic-bezier(1, .1, .2, 1); transition: all 0.6s cubic-bezier(1, .1, .2, 1);}

.list-nav {  display: none; float: left; position: relative; width: 115px; height:50px; margin-left: 5px; text-align: center; text-transform: uppercase; background: var(--color-white); }
.list-nav a { display: inline-table; position: relative; width: 100%; height: 100%; color: #333; padding: 6px 0; font-size:16px; font-weight: 500; cursor: pointer; }

.current-nav { background: #333; }
.current-nav a { color: var(--color-white); }
.current-nav .menu-icon::before { background: #0071bc; }

.menu-icon {  position: absolute; top: 20px; left: 15px; width: 30px; height: 2px;  background-color: #0071bc; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%);transform: translateX(-50%) translateY(-50%); -webkit-transition: background-color 0.3s;-moz-transition: background-color 0.3s; transition: background-color 0.3s;}
.menu-icon::before, .menu-icon::after { content: ''; width: 100%; height: 100%; position: absolute; background-color: #0071bc; right: 0;-webkit-transition: -webkit-transform .3s, top .3s, background-color 0s; -moz-transition: -moz-transform .3s, top .3s, background-color 0s;  transition: transform .3s, top .3s, background-color 0s;}
.menu-icon::before { top: -8px; }
.menu-icon::after { top: 8px; }
.menu-icon.is-clicked { background-color: rgba(255, 255, 255, 0); }
.menu-icon.is-clicked::before { background: var(--color-blue); top: 0; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg);-o-transform: rotate(45deg); transform: rotate(45deg); }
.menu-icon.is-clicked::after {  background: var(--color-blue); top: 0; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
.menu-text { position: absolute; right: 40px; vertical-align: middle; text-align: left; color: var(--color-blue); /* color: var(--color-blue)*/; font-size: 14px; line-height: 1.5; text-transform: uppercase;  }

.nav { display: none; position: absolute; width: 30px; height: 40px; right: 15px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; z-index: 9999; cursor: pointer;  }
.nav a { display: flex; align-items: center; position: relative; width: 100%; height: 100%; }

.nav-overay { opacity: 0; visibility: hidden; }

.nav-overay {  position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0,0,0,0.5); z-index: 888; opacity: 0; visibility: hidden; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease;}
.active-nav-overay  { opacity: 1; visibility: visible; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }

/*.over-x { overflow: hidden; }*/

.nav-mobile {  position: fixed; width: 80%; height: 100%; max-height: calc(100vh - 0px); top: 0; right: -80%; z-index: 1; margin: 0; padding: 0;  overflow: auto; z-index: 999; -webkit-transition: all 0.6s cubic-bezier(.42,.19,.23,.92); -moz-transition: all 0.6s cubic-bezier(.42,.19,.23,.92); -o-transition: all 0.6s cubic-bezier(.42,.19,.23,.92); transition: all 0.6s cubic-bezier(.42,.19,.23,.92); }
.nav-mobile:before { content: ''; position: absolute; width: 100%; height: 50px; background: var(--color-white); top: 0; left: 0; z-index: 1; }

.nav-mobile aside { position: relative; display: table; width: 100%; height: 100%; padding-top: 100px; text-align: center; background: var(--color-blue); }
.nav-mobile aside ul { display: inline-block; width: 100%; vertical-align: middle; padding: 20px 0; }
.nav-mobile aside ul li { display: table; width: 100%; padding: 0; text-align: left; vertical-align: middle; border-bottom: 1px solid var(--color-minisky-border); }
.nav-mobile aside ul li:first-child { border-top: 1px solid var(--color-minisky-border); }
.nav-mobile aside ul li a { position: relative; display: inherit; width: 100%; padding: 10px 20px; color: var(--color-white); font-size: 14px; font-weight: 500; text-transform: uppercase; }
.nav-mobile aside ul li a:hover { color: var(--color-yellow);  }
.nav-mobile aside ul li a.current { color: var(--color-yellow); font-weight: 600; background: var(--color-drakblue);  }
/*.nav-mobile aside ul li a.current span:before { background: #edf5ff; border: 1px solid #edf5ff; }*/
.nav-mobile aside ul li span { position: relative; display: table-cell; vertical-align: middle; }
/*.nav-mobile aside ul li span:before { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 50%; border: 1px solid var(--color-white-drop); background: none; left: -20px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }*/
.nav-mobile aside .register { padding: 15px; }
.nav-mobile aside .register span { padding-top: 2px; }
.nav-mobile aside .btn-register { padding: 10px 15px; color: var(--color-blue); font-weight: 500; text-transform: uppercase; font-size: 18px; border-radius: 90px; background: var(--color-yellow);   }

.nav-mobile aside ul li .toggle-subnav { display: none; padding-bottom: 20px; }
.nav-mobile aside ul li .toggle-subnav a { padding: 5px 20px; font-size: 14px; color: var(--color-white-drop); }

.nav-mobile aside .in-lang { padding: 10px 20px 0 20px;  justify-content: flex-end }
.nav-mobile aside .in-lang span { display:flex; align-items:center; padding: 2px 10px; font-size: 14px; border-radius:30px; border:1px solid rgba(148, 181, 222, .5); }
.nav-mobile aside .in-lang a { color:var(--color-white); margin-left:10px; }
.nav-mobile aside .in-lang i { display: inline-flex; width: 20px; height: 12px; margin-right: 6px; align-items: center; vertical-align: middle; border-radius: 4px; }
.nav-mobile aside .in-lang i svg { display: block; width: 100%; height: 100%; }
.nav-mobile aside .in-lang .icon-flag-en { background: url(../images/flag-en.svg) no-repeat center; }
.nav-mobile aside .in-lang .icon-flag-th { background: url(../images/flag-th.svg) no-repeat center; }


.subplus { position: absolute; width: 14px; height: 14px; right: 0; top: 3px; background: url(../images/icon-arrow-down.svg) no-repeat center; background-size: 100%; -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  -ms-transform: rotate(0deg);
  transform: rotate(0deg); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;  }
.subplus-rotate { -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg); -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; transition: all 0.2s ease;  }

/* ------------------------------------------------------------------------------------------------------------
|  Cover  |
------------------------------------------------------------------------------------------------------------ */
.cover { margin-top: 100px; padding:  0;  }
.cover .box-cover { position:relative; }
.cover .box-cover:before { content: ''; position: absolute; width: 100%; height: 100%; background: rgba(0, 70, 147, .9); left: 0; top: 0; }
.cover h1 { color: var(--color-white); font-weight: 600; text-transform: uppercase; border-bottom:none; }
.cover ul { position: absolute; right: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; color: var(--color-white); }
.cover ul li { display: flex; width: auto; padding: 0 15px; border-left: 1px solid var(--color-white-drop); }
.cover ul li:first-child { border-left: none; }
.cover ul li a { color: var(--color-white); font-size: 16px; }
.cover ul li a:hover,.cover ul li a.current { color: var(--color-yellow); }

/* ------------------------------------------------------------------------------------------------------------
|  Banner  |
------------------------------------------------------------------------------------------------------------ */
.banner { display: block; margin-top: 101px; z-index: 0; }
.banner li { position:relative; }
.banner li aside { position: absolute; width: 100%; height: 100%; z-index: 1; }
.banner li aside .warpper { display: flex; align-items: center;  }
.banner li aside article { display: flex; justify-content: center;  width: 100%; color: var(--color-white);  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.8); }
.banner li aside article h1 { padding-bottom: 0; font-size: 60px; line-height: 0.8; font-weight: 800; font-family: 'Montserrat', sans-serif; }
.banner li aside article h1 span { font-family: 'Roboto', sans-serif; font-size: 30px; font-weight: 600; font-style: italic; color: #01369f; text-shadow: 0 0 2px rgba(255, 255, 255, 1);; }
.banner li aside article h2 { font-size: 50px; text-transform: uppercase; font-weight: 300; }
.banner li aside article h3 { padding-top: 20px; font-size: 34px; font-weight: 400; }
.banner li aside article p { line-height: 1.2; font-size: 20px; }
.banner li aside article a { color: var(--color-white); box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.6); }
.banner img { display: block; width: 100%; }
.banner .slick-dots { bottom: 15px; }
.banner .slick-prev, .banner .slick-next { display: none !important; }
.banner .owl-theme .owl-dots .owl-dot { width: inherit; min-width: inherit; }

/* ------------------------------------------------------------------------------------------------------------
|  Feed Content  |
------------------------------------------------------------------------------------------------------------ */
.feed-content { position: relative; width: 100%; }
.feed-content .warpper {  display: flex; flex-wrap: wrap; }
.feed-content main { display: flex; flex-wrap: wrap; width: 100%; margin-top: 60px;  padding: 0;  }
.feed-content main .title { padding-top: 0; color: var(--color-blue); }
.feed-content .box-feed { width: 100%; }
.feed-content .box-feed .lists { width: 100%; padding-top:30px }
.feed-content .box-feed .lists ul { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.feed-content .box-feed .lists li { width: 33.3333%; padding: 0 15px }
.feed-content .box-feed .lists h3 { font-size: 18px; }
.feed-content .box-feed .lists .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.feed-content .box-feed .lists .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }

.feed-content .box-knowledge { width: 100%; padding-bottom:60px; }
.feed-content .box-knowledge .lists { width: 100%; padding-bottom: 15px; padding-top:15px; }
.feed-content .box-knowledge .lists ul { display: flex; flex-wrap: wrap; margin:0 -20px; }
.feed-content .box-knowledge .lists li { display: flex; flex-wrap: wrap; width: 50%; padding: 0 20px;  }
.feed-content .box-knowledge .box { position:relative; width: 100%; padding: 20px 0; display: flex; flex-wrap: wrap; border-bottom:1px solid var(--color-miniblue-border); }
.feed-content .box-knowledge .lists h3 { font-size: 18px; line-height: 1.2; }
.feed-content .box-knowledge .lists .photo { width: 200px; flex: inherit;  }
.feed-content .box-knowledge .lists .photo figure { position: relative; width: 100%;  height: 0;padding: 30%;overflow: hidden; }
.feed-content .box-knowledge .lists .photo img { object-fit: cover; position: absolute; height: 100%;  width: 100%;top: 0; left: 0; margin: auto; }
.feed-content .box-knowledge .lists .text { display: flex; align-items: center; flex: 1; padding-left: 20px; }
.feed-content .box-knowledge .lists .text p { padding: 0 }

/* ------------------------------------------------------------------------------------------------------------
|  Intro & Register  |
------------------------------------------------------------------------------------------------------------ */
.intro-regis { position: relative; width: 100%; padding-bottom:80px; padding-top:30px; }
.intro-regis .warpper {  display: flex; flex-wrap: wrap; }
.intro-regis .title { color:var(--color-blue); }
.intro-regis main { width: 100%; padding: 0 0 30px 0; }
.intro-regis main header { position: relative; }
.intro-regis main ul { display: flex; flex-wrap:wrap; }
.intro-regis main ul li { position: relative;  width: 100%;  }
.intro-regis main ul li a:hover { color: var(--color-blue); }
.intro-regis main img { width: 100%; object-fit: cover; }
.intro-regis main h4 { padding-bottom: 0; font-weight: 600; }
.intro-regis main .date { position: relative; margin-top: 10px; padding: 0 0 0 32px; color: var(--color-blue); background: url(../images/icon-calendar.svg) no-repeat left center; background-size: 24px; }
.intro-regis main .date p { padding: 4px 0 0 0;  }
.intro-regis main .date span { color: var(--color-blue); font-weight: 600; }

.intro-regis main .list-data { display: flex; flex-wrap:wrap; margin: 20px 0 10px 0;  }
.intro-regis main .list-data dd { position: relative;  width: 50%; padding: 0 30px; }
.intro-regis main .list-data a { display: flex; justify-content: center; align-items: center; padding: 10px 15px; color: var(--color-black);  text-transform: uppercase; border-radius: 3px; }
.intro-regis main .list-data a.one { background: #5a7da9; color: var(--color-white); }
.intro-regis main .list-data a:hover.one { background: var(--color-blue); }
.intro-regis main .list-data a.two { background: var(--color-blue); color: var(--color-white); }
.intro-regis main .list-data a:hover.two { background: var(--color-blue); }

.intro-regis main aside { width: 100%; margin-top: 30px; background: none;  }
.intro-regis main aside dl { }
.intro-regis main aside dl dd { border: 1px solid #eef1f5 }

.intro-regis aside { position: relative; width: 100%; padding: 0 60px; color: var(--color-white); overflow: hidden; background: var(--color-sky) url(../images/bg-register.webp) no-repeat center; background-size: cover; border-radius:14px; }
.intro-regis aside:before { content:''; position:absolute; width: 100%; height:100%; background: rgba(0, 70, 147, .8); left:0; top: 0; }
.intro-regis aside .welcome-member { position: relative; padding: 15px; display:flex; flex-wrap:wrap; justify-content:center; align-items:center; }
.intro-regis aside .welcome-member .text { width: 50%;  }
.intro-regis aside .welcome-member .text h3 { padding-bottom:0 }
.intro-regis aside .welcome-member .text p { padding-top:0 }
.intro-regis aside .welcome-member a.one { display: inline-block; color: var(--color-white); } 
.intro-regis aside .welcome-member a:hover.one { color: var(--color-yellow); }
.intro-regis aside .welcome-member .link-re  { width: 50%; padding: 15px 0; }
.intro-regis aside .welcome-member .link-re a { margin-left: auto; width: max-content; padding: 5px 30px; border-radius: 90px; color: var(--color-blue); font-size: 24px; font-weight: 600; background: var(--color-yellow); }
.intro-regis aside .welcome-member .link-re a:hover {}

.intro-regis aside .link-to-stat { display: flex; flex-wrap: wrap; justify-content: center; padding: 15px 30px; font-weight: 300; font-size: 20px; }
.intro-regis aside .link-to-stat a { display: flex; flex-wrap: wrap; padding: 15px; color: var(--color-white); text-transform: uppercase; }
.intro-regis aside .link-to-stat a:hover span { border: 2px solid #ffb0bc;  transition: all 0.3s ease; } 
.intro-regis aside .link-to-stat span { display: flex; margin-left: 15px; width: 30px; height: 30px; border: 2px solid #f35369; border-radius: 50%; background: url(../images/icon-right-arrow.svg) no-repeat center; background-size: 60%;  transition: all 0.3s ease; }

.intro-regis article { padding-top:24px }

.shortcut-link-home { width: 100%; padding-top: 10px; }
.shortcut-link-home ul { display: flex; flex-wrap: wrap; margin: 0 -10px; padding: 0 !important }
.shortcut-link-home li { width: 33.3333% !important; flex: 33.3333% !important; padding: 0 10px; margin: 0; list-style: none !important; }
.shortcut-link-home .box {  width: 100%;  padding: 10px; display: flex; flex-wrap: wrap; align-items: center;  background: var(--color-miniblue); border-radius: 8px; border:1px solid var(--color-miniblue-border);  }
.shortcut-link-home .box a { width: 100%; color: var(--color-blue); font-size: 18px; }
.shortcut-link-home .box a:hover { color:var(--color-sky); }
.shortcut-link-home .img { width: 50px; display: flex; flex-wrap: wrap; align-items: center; }
.shortcut-link-home .img img { width: 100%; }
.shortcut-link-home .text { flex: 1; padding-left: 15px; font-weight: 500; line-height: 1.2; }
.shortcut-link-home .text small { display: block; width: 100%; font-weight: 300; color: var(--color-gray); }

/* ------------------------------------------------------------------------------------------------------------
|  Programes & Table Score  |
------------------------------------------------------------------------------------------------------------ */
.programes-tablescore { position: relative; width: 100%; z-index: 1;  }
.programes-tablescore .warpper {  display: flex; flex-wrap: wrap; }
.programes-tablescore main { width: 50%; padding: 40px 60px 40px 0;  }

.programes-tablescore main ul { display: flex; flex-wrap:wrap; padding-top: 15px; }
.programes-tablescore main ul li { position: relative;  width: 100%; padding-bottom: 30px; }
.programes-tablescore main ul li:first-child { padding-bottom: 0; }
/*.programes-tablescore main ul li a { color: var(--color-blue); }*/
.programes-tablescore main ul li a:hover {  }
.programes-tablescore main img { width: 100%; object-fit: cover; }
.programes-tablescore main h4 { padding-bottom: 0; font-weight: 600; }
.programes-tablescore main .course { color:var(--color-gray); font-weight:300 }
.programes-tablescore main .date { position: relative; margin-top: 10px; padding: 0 0 0 32px; color: var(--color-blue); background: url(../images/icon-calendar.svg) no-repeat left center; background-size: 24px; }
.programes-tablescore main .date p { padding: 4px 0 0 0; color: var(--color-sky); }
.programes-tablescore main .date span { color: var(--color-sky); }

.programes-tablescore main .list-data { display: flex; flex-wrap:wrap; margin: 20px -2px;  }
.programes-tablescore main .list-data dd { position: relative; width: 33.3333%; padding: 0 2px; }
.programes-tablescore main .list-data dd a { display: flex; justify-content: center; align-items: center; padding: 10px;  color: var(--color-blue); font-size: 14px; font-weight: 500; text-transform: uppercase; background: var(--color-miniblue); border: 1px solid var(--color-miniblue-border); border-radius: 6px; }
.programes-tablescore main .list-data dd a:hover { color: var(--color-sky); border: 1px solid var(--color-blue); }
.programes-tablescore main .list-data dd i {  margin-right: 6px; margin-top:2px; }
.programes-tablescore main .list-data dd span { display: inline-flex; }
.programes-tablescore main .resp-tabs-list dt { border-top-left-radius:8px; border-top-right-radius:8px }

.programes-tablescore main aside { width: 100%; margin-top: 30px; background: none;  }
.programes-tablescore main aside dl { }
.programes-tablescore main aside dl dd { border: 1px solid #eef1f5 }
.programes-tablescore .btn-livescore-mini { padding-bottom:20px; max-width:100% }

.programes-tablescore aside { position: relative; width: 50%; color: var(--color-black); background: var(--color-blue); }

.programes-tablescore aside header { position: relative; text-align: center; }
.programes-tablescore aside header a {  padding: 10px 0; color: var(--color-white); }
.programes-tablescore aside .title { color: var(--color-white); padding: 50px 20px 20px 20px; text-align:center; }
.programes-tablescore aside .title:after { width: 100%; }

.programes-tablescore aside .sche {  background: var(--color-miniblue); }
.programes-tablescore aside .sche h4 { padding: 15px 30px; text-transform: uppercase; font-weight: 400; text-align: center; background: #bb152e; }
.programes-tablescore aside .sche table { width: 100%; margin-bottom:20px; }
.programes-tablescore aside .sche table thead { font-size: 16px; }
.programes-tablescore aside .sche table thead tr th { padding: 10px 15px; font-size: 16px; font-weight: 400; color:var(--color-black); }
.programes-tablescore aside .sche table thead tr th:first-child { width: 170px; }
.programes-tablescore aside .sche table tbody { font-weight: 300; font-size: 16px; } 
.programes-tablescore aside .sche table tbody tr { border-top: 1px solid var(--color-miniblue-border);  }
.programes-tablescore aside .sche table tbody tr td { padding: 10px 15px ; text-align: center; }
.programes-tablescore aside .sche table tbody tr td small { font-size: 16px; color: var(--color-gray); font-weight:300 }
.programes-tablescore aside .sche table tbody tr td { padding-top: 10px; color:var(--color-black); font-weight:500 }
.programes-tablescore aside .sche table tbody tr td a { color: var(--color-black); font-weight:500 }
.programes-tablescore aside .sche table tbody tr td a:hover { color:var(--color-sky); }

.programes-tablescore aside .sche .resp-tab-active { color:var(--color-sky); }
.programes-tablescore aside .sche .resp-tab-active:before { content:''; position:absolute; width: 100%; height:3px; background:var(--color-sky); left: 0; bottom: -2px; z-index: 1; }
.programes-tablescore aside .sche .resp-tabs-list dt span { color: var(--color-black); }
.programes-tablescore aside .sche .resp-tabs-list dt:hover span { color: var(--color-sky); }
.programes-tablescore aside .sche .resp-tabs-list dt:hover { background: none;}
.programes-tablescore aside .sche .resp-tab-content { border-top: 1px solid var(--color-blue) !important; }

.programes-tablescore aside .sche .world-ranking-wagr { width: 66px; height: 30px; background-size:90% }
.programes-tablescore aside .sche .world-ranking-jgs { width: 70px; height: 30px; background-size:90% }

.programes-tablescore aside .link-to-stat { display: flex; flex-wrap: wrap; justify-content: center; padding: 15px 30px; font-weight: 300; font-size: 20px; }
.programes-tablescore aside .link-to-stat a { display: flex; flex-wrap: wrap; padding: 15px; color: var(--color-white); text-transform: uppercase; }
.programes-tablescore aside .link-to-stat a:hover span { border: 2px solid #ffb0bc;  transition: all 0.3s ease; } 
.programes-tablescore aside .link-to-stat span { display: flex; margin-left: 15px; width: 30px; height: 30px; border: 2px solid #f35369; border-radius: 50%; background: url(../images/icon-right-arrow.svg) no-repeat center; background-size: 60%;  transition: all 0.3s ease; }

.icon-factsheet { width: 16px; height: 16px; background: url(../images/icon-factsheet.svg) no-repeat center; background-size: 100%; }
.icon-apply { width: 16px; height: 16px; background: url(../images/icon-apply.svg) no-repeat center; background-size: 100%; }
.icon-entrylist { width: 16px; height: 16px; background: url(../images/icon-entrylist.svg) no-repeat center; background-size: 100%; }
.icon-teetimes { width: 16px; height: 16px; background: url(../images/icon-teetimes.svg) no-repeat center; background-size: 100%; }

/* ------------------------------------------------------------------------------------------------------------
|  Player Home  |
------------------------------------------------------------------------------------------------------------ */
.player-home { padding: 40px 0 60px 0; color: var(--color-black); background:var(--color-mini-gray); }
.player-home main { position: relative; width: 100%; }
.player-home header a { color: var(--color-white-drop); }
.player-home header span a:hover { color: var(--color-white); }

.player-home ul { display: flex; flex-wrap: wrap; margin-top: 20px;  }
.player-home ul li { text-align: center; }
.player-home ul li .photo-radius { position: relative; width: 100%; height: 100%; padding: 15px; border-radius: 50%; transition: all 0.3s ease; }
.player-home ul li .photo-radius .flag { position: absolute; bottom: 5px; right: 0px; left: 0px; margin-left: auto; margin-right: auto; z-index: 1; }

.player-home ul li a:hover .photo-radius:before { opacity: 1; transition: all 0.3s ease; }

.player-home ul li a { color: var(--color-black); border-radius: 50%; }
.player-home ul li a:hover { color: var(--color-sky) }
.player-home ul li h5 { display: flex;flex-direction: column; padding: 0; text-transform:uppercase; font-size:16px; }
.player-home ul li h5 a { display: inline-flex; color:var(--color-black); font-weight:500 }
.player-home ul li h5 span { /*padding-left: 8px;*/ }
.player-home ul li p { padding-top: 0; font-size: 14px; color: var(--color-blue); }
.player-home ul li p span { color: var(--color-sky); font-size: 24px; font-weight: 600; }

.player-home ul li figure { position: relative; display: block; height: 0; padding-bottom: 100%; border-radius: 50%; overflow: hidden;  }
.player-home ul li figure img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 50%; }

.players-list { position: relative; width: 100%; padding: 0 0 60px 0; background: var(--color-white); }
.players-list .warpper {  display: flex; flex-wrap: wrap; }
.players-list main { width: 100%;  }
.players-list main h4.title { margin-bottom:20px; }
.players-list ul { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.players-list ul li { width: 25%;  text-align: center; padding: 0 15px 30px 15px; }

.players-list ul li .photo-radius { position: relative; margin: 0 auto; padding: 20px; width: 80%;  overflow: hidden;  transition: all 0.3s ease;  }
.players-list ul li .photo-radius img { width: 100%; border-radius: 50%; object-fit: cover;  }
.players-list ul li .photo-radius a { display: block !important; }
.players-list ul li .photo-radius a:hover img {  }
.players-list ul li .photo-radius .flag { position: absolute; bottom: 8px; right: 0px; left: 0px; margin-left: auto; margin-right: auto; z-index: 1; }

.players-list ul li a { color: var(--color-white); }
.players-list ul li a:hover { color: var(--color-sky) }
.players-list ul li h5 { display: block; padding: 0; color: var(--color-black); font-weight: 600; text-transform: uppercase; font-size:16px; }
.players-list ul li h5 a { display: inline-flex; }
.players-list ul li h5 span { padding-left: 0; display:block; width: 100%; }
.players-list ul li p { padding-top: 0; padding-bottom: 0; font-size: 16px; color: var(--color-blue); }
.players-list ul li p span { color: var(--color-sky); font-size: 24px; font-weight: 600; }

.players-list ul li figure { position: relative; display: block; height: 0; padding-bottom: 100%; border-radius: 50%; overflow: hidden;  }
.players-list ul li figure img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 50%;  }

.players-list ul li article { position: relative; height: 100%; background: var(--color-miniblue); border-radius: 8px; border:1px solid var(--color-miniblue-border); transition:all 0.3s ease }
.players-list ul li article:hover {  border:1px solid var(--color-blue); transition:all 0.3s ease }
.players-list ul li article a:hover h5 { color:var(--color-sky); }
.players-list ul li .left { position: relative; width: 100%; margin: 0 auto;  }
.players-list ul li .right { width: 100%; padding: 0 10px 15px 10px; }

.players-list .search-filter ul li { width: 100%; }

.players-detail { position: relative; width: 560px; padding: 0; background: var(--color-blue); }
.players-detail article { position: relative; width: 100%; }
.players-detail .photo { position: relative; width: 100%; padding: 30px 10px; border-bottom: 5px solid var(--color-yellow); background:; border-radius:0 }
.players-detail .photo figure { display: flex; margin: 0 auto; width: 200px; height: 200px; position: relative; padding: 10px; border-radius: 50%; overflow: hidden; overflow: hidden; }
.players-detail .photo img { width: 100%; object-fit: cover; border-radius: 50%;   }

.players-detail .text { position: relative; width: 100%; padding: 20px 30px 15px 30px; color: var(--color-blue); background:var(--color-miniblue); }
.players-detail .text h4 { padding: 0 0 15px 0; font-weight: 600; text-transform:uppercase; }
.players-detail .name-th { padding-top: 0; font-size: 20px; color: var(--color-sky) }
.players-detail .member-id { position: absolute; display: flex; align-items: center; justify-content: center; width: max-content; height: 40px; padding: 10px 20px; font-weight: 600; line-height: 0; color: var(--color-blue); text-align: center; border-radius: 30px; background: var(--color-yellow); right: 0; left: 0; margin-left: auto; margin-right: auto; top: -22px; z-index: 1; }
.players-detail .has-profile { width: 100%;  padding-bottom:10px; }

.players-detail ul { display: flex; flex-wrap: wrap; margin-top: 20px; }
.players-detail ul li { width: 50%; }
.players-detail ul li.full { width: 100%; }
.players-detail ul li p { padding-top: 0; }
.players-detail ul li small { color: var(--color-gray); }

.btn-view-player-detail a { display:flex; align-items:center; justify-content:center; width: 100%; max-width: 250px; height: 50px; margin: 0 auto; border-radius:90px; color:var(--color-white); background: var(--color-sky); }
.btn-view-player-detail a:hover { background:var(--color-blue); }

.btn-golfacademy-pop { color:var(--color-blue); }

/* ------------------------------------------------------------------------------------------------------------
|  Gallery Home  |
------------------------------------------------------------------------------------------------------------ */
.gallery-home { padding: 40px 0 60px 0; color: var(--color-white); background: var(--color-blue); }
.gallery-home main { position: relative; width: 100%; margin-top: 30px; display: flex; flex-wrap: wrap; overflow-x: hidden; }
.gallery-home .title { color:var(--color-white); border-bottom:1px solid var(--color-minisky-border); }

.gallery-home main article {  width: 50%; padding-right: 15px; }
.gallery-home main article h3 { padding-top: 10px; }
.gallery-home main article small { display: block; margin-top: 10px;  }
.gallery-home main article small a { color: var(--color-white-drop) ; } 
.gallery-home main article small a:hover { color: var(--color-blue) }
.gallery-home main article a { color: var(--color-white);  font-weight: 400; }
.gallery-home main article a:hover { color: var(--color-yellow) }
.gallery-home main article .photo { border: 10px solid var(--color-white); -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4);  }
.gallery-home main aside {  width: 50%; padding-left: 15px; }
.gallery-home main aside ul { display: flex; flex-wrap: wrap; margin: 0 -15px }
.gallery-home main aside ul li { position: relative;  width: 50%; padding: 0 15px 15px 15px; }
.gallery-home main aside ul li a { color: var(--color-white);  font-weight: 400; }
.gallery-home main aside ul li a:hover { color: var(--color-yellow) }
.gallery-home .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.gallery-home .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }

/* ------------------------------------------------------------------------------------------------------------
|  News & Activities Home  |
------------------------------------------------------------------------------------------------------------ */
.news-event-home { padding: 40px 0 60px 0; color: var(--color-white); background: var(--color-mini-gray); }
.news-event-home header a { color: var(--color-white-drop); }
.news-event-home header span a:hover { color: var(--color-white); }

.news-event-home main { position: relative; width: 100%; padding-top: 15px; overflow-x: hidden; }
.news-event-home main ul { display: flex; flex-wrap: wrap; margin: 15px -15px 0 -15px; }
.news-event-home main ul li { position: relative;  width: 25%; padding: 0 15px; }
.news-event-home main ul li a { color: var(--color-black);  font-weight: 500; }
.news-event-home main ul li a:hover { color:var(--color-sky); }
.news-event-home main h3 { font-size:18px; }
.news-event-home .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.news-event-home .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }

.news-event { padding: 0 0 60px 0;  }
.news-event .warpper {  display: flex; flex-wrap: wrap; }
.news-event main {  width: 70%; padding-top: 0; }
.news-event aside {  width: 30%; padding-left: 30px; padding-top: 7px; }

.news-event .search-filter ul li:last-child { flex:1 }

.news-search aside {  width: 100%; padding-top: 15px; padding-left: 0;  }
.news-search .search-filter { padding-bottom:5px; }

.news-all-list-style { position: relative;   width: 100%; }
.news-all-list-style article { position: relative; width: 100%; padding-bottom: 15px; border-bottom: 1px solid var(--color-miniblue-border);  }
.news-all-list-style article h3 { padding: 20px 0 0 0; }
.news-all-list-style article img { display: block; width: 100%; }
.news-all-list-style ul { display: flex;  flex-wrap:wrap;  align-content: flex-start; margin: 0 -15px; }
.news-all-list-style li { display: flex; flex-wrap: wrap; position: relative;  width: 25%; padding: 15px 15px 0 15px; align-content: flex-start; }
.news-all-list-style li .photo { width: 100%;  }
.news-all-list-style li .photo img { display: block; width: 100%  }
.news-all-list-style li .text { width: 100%;  }
.news-all-list-style li .text h4 { padding: 15px 0 5px 0; }
.news-all-list-style li .text h5 { padding: 10px 0 5px 0; }
.news-all-list-style p { padding-top: 10px; color: #888 }

.blog-all-list-style { position: relative; width: 100%; padding-bottom: 20px; }
.blog-all-list-style article { position: relative; width: 100%; padding-bottom: 15px; border-bottom: 1px solid var(--color-miniblue-border);  }
.blog-all-list-style article h3 { padding: 20px 0 0 0; }
.blog-all-list-style .photo figure,.blog-all-list-style .photo picture {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.blog-all-list-style .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }
.blog-all-list-style ul {  display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; }
.blog-all-list-style li { display: flex; flex-wrap: wrap; position: relative; width: 100%; padding: 30px 0; border-bottom: 1px solid var(--color-miniblue-border); }
.blog-all-list-style li .photo { position: relative; width: 40%;  }
.blog-all-list-style li .photo img { display: block; width: 100%  }
.blog-all-list-style li .text { width: 60%;  padding-left: 30px; }
.blog-all-list-style li .text h4 { padding: 15px 0 5px 0; }
.blog-all-list-style li .text h5 { padding: 0 0 5px 0; }
.blog-all-list-style p { padding-top: 10px; color: #888 }

.blog-most-read-style { position: relative;  width: 100%; }
.blog-most-read-style h4 { padding-top:0  }
/*.blog-most-read-style header h4:before { content: ''; position: absolute; width: 30%; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 0; left: 0; background: var(--color-blue); z-index: 1; }
.blog-most-read-style header h4:after { content: ''; position: absolute; width: 100%; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 0; left: 0; background: var(--color-blue) }*/

.blog-most-read-style li { display: flex; position: relative; width: 100%; padding: 15px 0; align-items: center;  border-bottom: 1px solid var(--color-miniblue-border); }
.blog-most-read-style .photo { width: 40%;  vertical-align: top; }
.blog-most-read-style .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.blog-most-read-style .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }

.blog-most-read-style .text { width: 60%;  padding-left: 15px;  }
.blog-most-read-style .text h5 { min-height: 44px; padding: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  text-overflow: ellipsis; overflow: hidden; }
.blog-most-read-style .text p { padding: 0;  }

.news-event-detail { margin-top: 100px; }
.news-event-detail h1 { padding: 20px 0; font-size:30px; font-weight:500; color:var(--color-blue); }
.news-event-detail article { border-bottom: none; }
.news-event-detail article .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.news-event-detail article .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }
.news-event-detail .editor { padding-top: 15px; }
.news-event-detail .editor p { color: var(--color-black) }
.news-event-detail .editor a { color:var(--color-blue); }
.news-event-detail .blog-all-list-style { padding-bottom: 0 }
.news-event-detail .blog-most-read-style h4 { padding-top:20px; }

.news-event-detail .noti-livescore .warpper { display:inherit; }

.blog-other-read-style { position: relative; padding-top: 20px; }
.blog-other-read-style header h4 { color: var(--color-); border-bottom: 1px solid var(--color-miniblue-border);  }
.blog-other-read-style header h4:first-letter { font-weight: 600 }
.blog-other-read-style header h4:before { content: ''; position: absolute; width: 40px; height: 3px; top: 0; bottom: 1px; margin-top: auto; margin-bottom: 0; left: 0; background: var(--color-yellow); z-index: 1; }
.blog-other-read-style ul { display: flex; flex-wrap: wrap; margin: 0 -15px; }
.blog-other-read-style li { display: flex; position: relative; width: 50%;  padding: 15px 15px ; align-items: center;  border-bottom: none; }
.blog-other-read-style .photo { width: 40%;  vertical-align: top; }
.blog-other-read-style .photo img { width: 100%;  object-fit: cover; }
.blog-other-read-style .text { width: 60%;  padding-left: 15px !important;  }
.blog-other-read-style .text h5 { padding: 0 0 0 0 !important; }
.blog-other-read-style .text p { padding: 0;  }

/* ------------------------------------------------------------------------------------------------------------
|  Video  |
------------------------------------------------------------------------------------------------------------ */
.video { padding: 0 0 60px 0;  }
.video .warpper {  display: flex; flex-wrap: wrap; }
.video main { display: flex; flex-wrap: wrap;  width: 100%; padding-top: 0; margin: 0; }
.video main article {  width: 75%; padding: 0 7.5px 0 0; }
.video main article h3 { padding: 20px 0 5px 0 ; }
.video main article .youtube-embed { box-shadow: none; border: none; }
.video main .most-view {  width: 25%; padding: 0 0 0 23px;  }
.video main .most-view h4 { padding-top:0 }
.video main .most-view ul { display: flex; flex-wrap: wrap; }
.video main .most-view ul li { display: flex; position: relative; width: 100%; padding: 15px 0; align-items: center;  border-bottom: 1px solid var(--color-miniblue-border); }
.video main .most-view ul li:last-child { border: none; }
.video main .most-view ul .photo { width: 40%;  vertical-align: top; }
.video main .most-view ul .photo img { width: 100%;  object-fit: cover; }
.video main .most-view ul .text { width: 60%;  padding-left: 15px;  }
.video main .most-view ul .text h5 { min-height: 44px; margin: 0; padding: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  text-overflow: ellipsis; overflow: hidden; }
.video main .most-view ul .text p { padding: 0;  }
.video main .most-view .play-vdo { width: 26px; height: 26px; }
.video main .share-social { border-bottom: none; padding-bottom: 30px; }
.video main .share-social .share-facebook { padding-left: 0; }
.video main .share-social .share-line { padding-right: 0; }

.video aside {  width: 100%; border-top: 1px solid var(--color-miniblue-border); }
.video .search-filter ul li:last-child { flex:1 }
.vdo-search aside { border-top: none; }

.video-all-list-style { position: relative;   width: 100%; }
.video-all-list-style article { position: relative; width: 100%; padding-bottom: 15px; border-bottom: 1px solid var(--color-miniblue-border);  }
.video-all-list-style article h3 { padding: 20px 0 0 0; }
.video-all-list-style .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.video-all-list-style .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }
.video-all-list-style ul { display: flex;  flex-wrap:wrap;  align-content: flex-start; margin: 0 -15px; }
.video-all-list-style li { display: flex; flex-wrap: wrap; position: relative;  width: 33.3333%; padding: 0 15px 30px 15px; align-content: flex-start; }
.video-all-list-style li .photo { width: 100%;  }
.video-all-list-style li .photo img { display: block; width: 100%  }
.video-all-list-style li .text { width: 100%;  }
.video-all-list-style li .text h4 { padding: 15px 0 5px 0; }
.video-all-list-style li .text h5 { padding: 10px 0 5px 0; }
.video-all-list-style p { padding-top: 10px; color: #888 }

/* ------------------------------------------------------------------------------------------------------------
|  Gallery  |
------------------------------------------------------------------------------------------------------------ */
.gallery { padding: 0 0 60px 0;  }
.gallery .warpper {  display: flex; flex-wrap: wrap; }
.gallery .search-filter ul li:last-child { flex:1 }
.gallery main { display: flex; flex-wrap: wrap;  width: 100%; padding-top: 30px; margin: 0; }
.gallery main article {  width: 66%; padding: 0 7.5px 0 0; }
.gallery main article h3 { padding: 20px 0 5px 0 ; }
.gallery main article .youtube-embed { box-shadow: none; border: none; }
.gallery main .most-view {  width: 34%; padding: 0 0 0 23px; margin-top: -14px;  }
.gallery main .most-view header h4 { padding-top: 5px; text-transform: uppercase; color: var(--color-blue);  }
.gallery main .most-view header h4:first-letter { font-weight: 600 }
.gallery main .most-view header h4:before { content: ''; position: absolute; width: 30%; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 0; left: 0; background: var(--color-blue); z-index: 1; }
.gallery main .most-view header h4:after { content: ''; position: absolute; width: 100%; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 0; left: 0; background: var(--color-blue) }
.gallery main .most-view ul { display: flex; flex-wrap: wrap; }
.gallery main .most-view ul li { display: flex; position: relative; width: 100%; padding: 15px 0; align-items: center;  border-bottom: 1px solid var(--color-miniblue-border); }
.gallery main .most-view ul li:last-child { border: none; }
.gallery main .most-view ul .photo { width: 40%;  vertical-align: top; }
.gallery main .most-view ul .photo img { width: 100%;  object-fit: cover; }
.gallery main .most-view ul .text { width: 60%;  padding-left: 15px;  }
.gallery main .most-view ul .text h5 { min-height: 44px; margin: 0; padding: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;  text-overflow: ellipsis; overflow: hidden; }
.gallery main .most-view ul .text p { padding: 0;  }
.gallery main .most-view .play-vdo { width: 26px; height: 26px; }
.gallery main .share-social { border-bottom: none; padding-bottom: 30px; }
.gallery main .share-social .share-facebook { padding-left: 0; }
.gallery main .share-social .share-line { padding-right: 0; }

.gallery aside {  width: 100%; }

.cloud-gallery aside { border-top: none ; }
.gallery .box-name { width: 100%; padding-top: 10px; }
.gallery .box-name h2 { font-size: 30px; }
.gallery .search-share-gallery { display: flex; flex-wrap: wrap; width: 100%; }
.gallery .search-filter { flex: 1; border-bottom: none; }
.gallery .box-share { display: flex; align-items: center; width: auto; margin-left: auto; }
.gallery .box-share .share-social { border-bottom: none; }
.cloud-gallery .search-filter .select-now { flex:none; }
.cloud-gallery .grid { padding-bottom:20px; }

.cloud-gallery .grid .inbox { position:relative; width: 100%; height:100%;  }
.cloud-gallery .grid .box { display: flex; align-items: flex-start;  text-align: center;  left: 0; width: 100%; height: 100%;  overflow: hidden; position: absolute; top: 0; }
.cloud-gallery .grid ul { display: flex; flex-wrap: wrap; margin: -5px}
.cloud-gallery .grid li { position: relative; width: 20%; height: 170px; padding: 5px;}
.cloud-gallery .grid li a { position: absolute; width: 100%; height: 100%; z-index: 1; left: 0; top: 0; text-indent: -9999px; cursor: zoom-in; }
.cloud-gallery .grid img {  width: 100%; margin: auto;}
@media (max-width: 1440px) {
 .cloud-gallery .grid li {  height: 150px; }
}
@media (max-width: 1024px) {
 .cloud-gallery .grid li {  height: 130px; }
}
@media (max-width: 1023px) {
 .cloud-gallery .grid li { width: 25%; height: 125px; }
}
@media (max-width: 767px) {
 .cloud-gallery .grid li { width: 50%; height: 150px; }
}
@media (max-width: 414px) {
 .cloud-gallery .grid li {  height: 120px; }
}
@media (max-width: 413px) {
 .cloud-gallery .grid li {  height: 100px; }
}
/*.cloud-gallery .grid ul { display: flex; flex-wrap: wrap;}
.cloud-gallery .grid li { position: relative; height: 20vh;  flex-grow: 1;}
.cloud-gallery .grid li a { position: absolute; width: 100%; height: 100%; z-index: 1; left: 0; top: 0; text-indent: -9999px; cursor: zoom-in; }
.cloud-gallery .grid li:last-child { flex-grow: 10; }
.cloud-gallery .grid img { max-height: 100%; min-width: 100%; object-fit: cover; vertical-align: bottom; }

@media (max-aspect-ratio: 1/1) {
 .cloud-gallery .grid li { height: 30vh;}
}
@media (max-height: 480px) {
 .cloud-gallery .grid li {  height: 80vh; }
}
@media (max-aspect-ratio: 1/1) and (max-width: 480px) {
 .cloud-gallery .grid ul {  flex-direction: row; }
 .cloud-gallery .grid li { height: auto;  width: 100%; border-bottom: 10px solid var(--color-white); }
 .cloud-gallery .grid img {  width: 100%; max-height: 75vh;  min-width: 0; }
}*/

.gallery-search aside { border-top: none; }

.gallery-all-list-style { position: relative;   width: 100%;  }

.gallery-all-list-style article { position: relative; width: 100%; padding-bottom: 15px; border-bottom: 1px solid var(--color-miniblue-border);  }
.gallery-all-list-style article h3 { padding: 20px 0 0 0; }
.gallery-all-list-style article img { display: block; width: 100%; }

.gallery-all-list-style ul { display: flex;  flex-wrap:wrap;  align-content: flex-start; margin: 0 -15px; }
.gallery-all-list-style li { display: flex; flex-wrap: wrap; position: relative; width: 33.3333%; padding: 0 15px 30px 15px; align-content: flex-start; }
.gallery-all-list-style li .photo { width: 100%;  }
.gallery-all-list-style li .photo figure {  position: relative; width: 100%;  height: 0; padding: 32%; background: var(--color-miniblue); overflow: hidden; }
.gallery-all-list-style li .photo img { object-fit: cover; position: absolute; height: 100%; width: 100%; top: 0; left: 0; margin: auto; }
.gallery-all-list-style li .text { width: 100%;  }
.gallery-all-list-style li .text h4 { padding: 15px 0 5px 0; }
.gallery-all-list-style li .text h5 { padding: 15px 0 5px 0; }
.gallery-all-list-style p { padding-top: 10px; color: #888 }

.popular-gallery { margin:0 auto; width: 100%; }
.popular-gallery img { width: 100%; }
.popular-gallery dt a { display: block; position: relative; width: 100%; color: var(--color-white); }
.popular-gallery dt h4 { position: absolute;  width: 100%; bottom: 0; padding: 10px 15px; background: rgba(52,175,196,.6); display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; text-overflow: ellipsis; overflow: hidden;    transition: all 0.3s ease;  }
.popular-gallery dt a:hover h4 { background: rgba(52,175,196,1); } 
.popular-gallery dt h4 span { float: right; font-size: 16px; padding-top: 3px; }
.popular-gallery .icon-zoom { position: absolute; width: 26px; height: 26px; background: url(../images/icon-zoom.svg) no-repeat center; background-size: 80%; top: 10px; right: 10px; opacity: 0.5;   transition: all 0.3s ease;  }
.popular-gallery dt a:hover .icon-zoom { opacity: 1;   transition: all 0.3s ease;  }

/* ------------------------------------------------------------------------------------------------------------
|  Tournament  |
------------------------------------------------------------------------------------------------------------ */
.schedule { padding: 20px 0 60px 0;  }
.schedule .warpper {  display: flex; flex-wrap: wrap; }
.schedule .t-box { position: relative; width: 100%; padding-bottom: 20px; }
.schedule .t-box h2 { color: var(--color-blue) }
.schedule .t-box h2 span { font-weight: 600; color: var(--color-sky); }
.schedule .t-box h2 span small { font-weight: 300; }
.schedule .t-box p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.schedule .t-box p span { position: relative; color: var(--color-gray);    }

.schedule main {  width: 100%; padding: 0; }
.schedule main ul { display: flex; flex-wrap:wrap;  }
.schedule main ul li { position: relative; display: flex; flex-wrap: wrap; width: 100%; padding: 30px 0; border-bottom: 1px solid var(--color-miniblue-border); }
.schedule main ul li:last-child { border-bottom:none; }
.schedule main ul li a { display: flex; align-items: center; }
.schedule main ul li a:hover { color: var(--color-blue); }

.schedule main article { width: 60%; padding-right: 30px; }
.schedule main article h4 { font-weight: 600; }
.schedule main article .course { font-weight:300; color:var(--color-gray); padding-top:0 }
.schedule main article small { color: var(--color-blue);  }
.schedule main img { width: 100%; object-fit: cover; }
.schedule main h3 { padding-bottom: 0; font-weight: 600; }

.schedule main .date { position: relative; margin-top: 10px; padding: 0 0 0 32px; color: var(--color-blue); background: url(../images/icon-calendar.svg) no-repeat left center; background-size: 24px; }
.schedule main .date p { padding: 4px 0 0 0; color: var(--color-sky); }
.schedule main .date span { color: var(--color-blue); }
.schedule main .date small { color: var(--color-blue);  }

.schedule main .list-data { display: flex; flex-wrap:wrap; width: 100%; max-width: 400px; margin: 20px -2px; }
.schedule main .list-data dd { position: relative; width: 33.3333%; padding: 0 2px; }
.schedule main .list-data dd a { display: flex; justify-content: center; align-items: center; padding: 10px; color: var(--color-blue); font-size: 14px; font-weight: 500; text-transform: uppercase; border: 1px solid var(--color-miniblue-border); background: var(--color-miniblue); border-radius: 6px; }
.schedule main .list-data dd a:hover { color: var(--color-sky); border: 1px solid var(--color-blue); }
.schedule main .list-data dd i { margin-right: 6px; }
.schedule main .list-data dd span { display: inline-flex; }

.schedule main aside { width: 40%; }
.schedule .select-now { width: 150px; }

.schedule-detail { padding: 20px 0 60px 0;  }
.schedule-detail .warpper {  display: flex; flex-wrap: wrap; }
.schedule-detail .box-title { width: 100%; display: flex; align-items: center; position: relative; padding-bottom: 30px;  }
.schedule-detail .box-title h2 { padding-right: 350px; line-height:1.2; font-size:24px; }
.schedule-detail .box-title h2 span { font-weight: 600; color: var(--color-blue); }
.schedule-detail .box-title h2 span small { font-weight: 300; }
.schedule-detail .box-title p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.schedule-detail .box-title p span { position: relative; color: #8093a5;    }
.schedule-detail .box-title p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }

.schedule-detail main { display: flex; flex-wrap: wrap; width: 100%; padding: 0 0 30px 0; }
.schedule-detail .course-gallery { width: 50%; }
.schedule-detail main article { position: relative; width: 50%; padding: 0 60px 40px 60px; }
.schedule-detail main article h4 { padding-bottom:0 }
.schedule-detail main article p span {  }

.schedule-detail .course-gallery img {  }
.schedule-detail .course-gallery .owl-carousel.owl-drag .owl-item { border-radius:8px; overflow:hidden; }
.schedule-detail main .date { position: relative; padding: 5px 0 0 40px; font-size: 20px; color: var(--color-sky); background: url(../images/icon-calendar.svg) no-repeat left center; background-size: 26px; }
.schedule-detail main .date p { padding: 4px 0 0 0;  }
.schedule-detail main .date span {  }
.schedule-detail main .date small { color: var(--color-sky);  }

.schedule-detail aside { position: relative; display: flex; flex-wrap: wrap; width: 100%; }
.schedule-detail aside .tabs { width: 100%; }
.schedule-detail aside .tabs ul { display: flex; flex-wrap: wrap; justify-content: center; margin: 0 -10px; }
.schedule-detail aside .tabs ul li { width: 33.3333%; padding: 0 10px; }
.schedule-detail aside .tabs ul li a { display: flex; justify-content: center; align-items: center; padding: 15px 30px; text-transform: uppercase; line-height: 1; color: var(--color-blue); text-align: center; background: var(--color-miniblue); border: 1px solid var(--color-miniblue-border);; border-radius: 8px; }
.schedule-detail aside .tabs ul li a:hover { color: var(--color-sky); border: 1px solid var(--color-blue); }
.schedule-detail aside .tabs ul li a.current { padding: 20px 30px; color: var(--color-white); border: 1px solid var(--color-sky); background: var(--color-sky);-webkit-border-radius: 8px;-webkit-border-bottom-right-radius: 0;-webkit-border-bottom-left-radius: 0;-moz-border-radius: 8px;-moz-border-radius-bottomright: 0;-moz-border-radius-bottomleft: 0;border-radius: 8px;border-bottom-right-radius: 0;border-bottom-left-radius: 0; }
.schedule-detail aside .tabs ul li a.current .icon-factsheet { background: url(../images/icon-factsheet-white.svg) no-repeat center; background-size: 100%; }
.schedule-detail aside .tabs ul li a.current .icon-apply { background: url(../images/icon-apply-white.svg) no-repeat center; background-size: 100%; }
.schedule-detail aside .tabs ul li a.current .icon-entrylist { background: url(../images/icon-entrylist-white.svg) no-repeat center; background-size: 100%; }
.schedule-detail aside .tabs ul li a.current .icon-teetimes { background: url(../images/icon-teetimes-white.svg) no-repeat center; background-size: 100%; }
.schedule-detail aside .tabs ul li i { width: 24px; height: 24px; margin-right: 10px; }

.schedule-detail aside .schedule-content { width: 100%; padding: 30px 0 0 0; border-top: 1px solid var(--color-blue); }
.schedule-detail aside .schedule-content .register-zone { display: block; border-top: none; }
.schedule-detail aside .schedule-content .register-zone article { padding-top: 0; padding-bottom: 0; }
.schedule-detail aside .schedule-content .register-zone article h4 { color: var(--color-black); }

.schedule-detail aside .schedule-special-content { margin-top: 20px; border-top: 1px solid var(--color-miniblue-border)} 
.schedule-special header { display: flex; align-items: center; }

.facesheet-award {  margin-bottom: 15px; padding: 15px 30px; background: var(--color-blue); color: var(--color-white); }

.schedule-filter { position: relative; width: 100%; padding: 0 20px; background: var(--color-blue) }
.schedule-filter ul { display: flex; flex-wrap:  wrap; margin: 0 -20px; }
.schedule-filter ul li { position: relative; display: flex; align-items: center; padding: 5px 20px; color: var(--color-white); text-transform: uppercase; }
.schedule-filter ul li h5 { line-height: 1; font-size:14px; }
.schedule-filter .select-now { position: relative; padding-left: 10px; flex: 1; }
.schedule-filter .select-now input[type="button"], .schedule-filter .select-now input[type="submit"] { position: absolute; right: 5px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 24px; height: 24px; min-width: 24px; max-width: 24px; background: url(../images/icon-search.svg) no-repeat center; background-size: 80%; }
.schedule-filter .select-now input[type="text"] { /*min-width: 200px; border: none !important;*/ font-size: 16px; }
.schedule-filter select { min-width: 200px;/* text-transform: uppercase;*/ font-size: 16px; border: none !important; }
.schedule-filter select option { font-family: Arial, Helvetica, sans-serif; font-size: 14px; padding: 5px; }
.schedule-filter.border-bottom-minisky { border-bottom:1px solid var(--color-minisky-border) }

.world-ranking { display:flex; flex-wrap:wrap; padding-bottom:15px; }
.world-ranking-wagr { display: inline-block; position: relative; width: 80px; height: 40px; margin: 0 5px 0 0;  padding: 2px; text-indent: -9999px; overflow: hidden; background: var(--color-white) url(../images/logo-wagr.svg) no-repeat center; background-size: 100%; border-radius:4px; border:1px solid var(--color-miniblue-border);  }
.world-ranking-jgs { display: inline-block; position: relative; width: 94px; height: 40px; margin: 0 5px 0 0;  padding: 2px; text-indent: -9999px; overflow: hidden; background: var(--color-white) url(../images/logo-jgs.svg) no-repeat center; background-size: 100%;  border-radius:4px; border:1px solid var(--color-miniblue-border); }
.ptpb-5 { padding-top:5px; padding-bottom:5px; }

.teamcolor { display: inline-flex; width: 20px; height: 20px; margin-right: 5px; background-repeat: no-repeat; background-position: center; background-size: 100%; }

.team-red { background-image: url(../images/icon-team-red.svg);  }
.team-cherry { background-image: url(../images/icon-team-cherry.svg);  }
.team-blood { background-image: url(../images/icon-team-blood.svg);  }
.team-candy { background-image: url(../images/icon-team-candy.svg);  }

.team-pink { background-image: url(../images/icon-team-pink.svg);  }
.team-fuscia { background-image: url(../images/icon-team-pink.svg);  }
.team-strawberry { background-image: url(../images/icon-team-strawberry.svg);  }
.team-punch { background-image: url(../images/icon-team-punch.svg);  }

.team-yellow { background-image: url(../images/icon-team-yellow.svg);  }
.team-lemon { background-image: url(../images/icon-team-lemon.svg);  }
.team-gold { background-image: url(../images/icon-team-gold.svg);  }
.team-corn { background-image: url(../images/icon-team-corn.svg);  }

.team-green { background-image: url(../images/icon-team-green.svg);  }
.team-lime { background-image: url(../images/icon-team-lime.svg);  }
.team-shamrock { background-image: url(../images/icon-team-shamrock.svg);  }
.team-seafoam { background-image: url(../images/icon-team-seafoam.svg);  }

.team-blue { background-image: url(../images/icon-team-blue.svg);  }
.team-sky { background-image: url(../images/icon-team-sky.svg);  }
.team-ocean { background-image: url(../images/icon-team-ocean.svg);  }
.team-cerulean { background-image: url(../images/icon-team-cerulean.svg);  }

.team-purple { background-image: url(../images/icon-team-purple.svg);  }
.team-magenta { background-image: url(../images/icon-team-magenta.svg);  }
.team-violet { background-image: url(../images/icon-team-violet.svg);  }
.team-lavender { background-image: url(../images/icon-team-lavender.svg);  }

.team-orange { background-image: url(../images/icon-team-orange.svg);  }
.team-amber { background-image: url(../images/icon-team-amber.svg);  }
.team-cantaloupe { background-image: url(../images/icon-team-cantaloupe.svg);  }
.team-sandstone { background-image: url(../images/icon-team-sandstone.svg);  }

.team-brown { background-image: url(../images/icon-team-brown.svg);  }
.team-coffee { background-image: url(../images/icon-team-coffee.svg);  }
.team-caramel { background-image: url(../images/icon-team-caramel.svg);  }
.team-peanut { background-image: url(../images/icon-team-peanut.svg);  }

.team-tan { background-image: url(../images/icon-team-tan.svg);  }
.team-fawn { background-image: url(../images/icon-team-fawn.svg);  }
.team-sepia { background-image: url(../images/icon-team-sepia.svg);  }
.team-hazelnut { background-image: url(../images/icon-team-hazelnut.svg);  }

.team-grey { background-image: url(../images/icon-team-grey.svg);  }
.team-iron { background-image: url(../images/icon-team-iron.svg);  }
.team-fling { background-image: url(../images/icon-team-fling.svg);  }
.team-fossil { background-image: url(../images/icon-team-fossil.svg);  }

.cb-star { background-image: url(../images/icon-cb-star.svg);  }
.playoff-star { background-image: url(../images/icon-playoff-star.svg);  }

.entry-list { position: relative; width: 100%; }
.entry-list ul { display: flex; flex-wrap:  wrap; }
.entry-list ul li { position: relative; display: flex; flex-wrap: wrap; width: 100%; justify-content: center; align-items: center; text-align: center; border-bottom: 1px solid var(--color-miniblue-border); }
.entry-list ul li:first-child { border-bottom: 3px solid var(--color-yellow); background:var(--color-miniblue); }
.entry-list ul li:first-child .box { padding: 0; }
.entry-list ul li:first-child h5 {  font-weight: 600; font-size: 16px; color: var(--color-blue); text-transform: uppercase; }
.entry-list ul li .box { display: flex; align-items: center; justify-content: center; width: 20%; padding: 15px 0; }
.entry-list ul li .name { flex: 1; }
.entry-list ul li .box h5 { display: inline-flex; align-items: center; text-transform:uppercase; }
.entry-list ul li .box h5 span { margin-left: 10px; }
.entry-list ul li .photo-avatar { flex: 1; padding-left: 15px; justify-content: flex-start; cursor: pointer; }
.entry-list ul li .photo-avatar:hover h5 { color:var(--color-sky); transition:all 0.3s ease; }
.entry-list ul li .photo-avatar h5 { font-weight:600; transition:all 0.3s ease;   }
.entry-list ul li .photo-radius { position: relative; width: 90px; margin-right: 15px; padding: 0;  }
.entry-list ul li .photo-radius figure { position: relative; display: block; height: 0; padding-bottom: 100%; border-radius: 50%; overflow: hidden;  }
.entry-list ul li .photo-radius figure img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 50%;  }
.entry-list ul li .photo-radius .flag { position:absolute; bottom:-12px; right:0; left:0; margin-left:auto; margin-right:auto; z-index: 2; }
.entry-list ul li .d-confirm { position: relative; padding: 0 0 0 24px; }
.entry-list ul li .d-confirm:before { content: ''; position: absolute; width: 10px; height: 10px; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; border-radius: 50%; background: #50c48f; }
.entry-list ul li .d-reserve { position: relative; padding: 0 0 0 24px; }
.entry-list ul li .d-reserve:before { content: ''; position: absolute; width: 10px; height: 10px; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; border-radius: 50%; background: var(--color-sky); }
.entry-list ul li .x-age h5 span { display: none;  }
.entry-list ul li .x-class h5 { text-transform:inherit; }

.tee-times-list { position: relative; width: 100%; }
.tee-times-list ul { display: flex; flex-wrap:  wrap; }
.tee-times-list ul li { position: relative; display: flex; flex-wrap: wrap; width: 100%; padding: 15px 0; align-items: flex-start; }
.tee-times-list ul li:last-child { border-bottom: none; }
.tee-times-list ul li header { padding-bottom: 0; padding-right: 0; color: var(--color-blue) }
.tee-times-list ul li header h3 { padding-bottom: 0; font-weight: 600 }
.tee-times-list ul li header h3 small { font-weight: 400; }
.tee-times-list ul li .tee-one { width: 50%; padding: 10px 0; text-align: left; }
.tee-times-list ul li .tee-ten { width: 50%; padding: 10px 0; text-align: left; }
.tee-times-list ul li article { position: relative; width: 100%; display: flex; padding: 10px; }
.tee-times-list ul li .tee-group { display: block; width: 100%; padding-left: 15px; text-transform: uppercase;}
.tee-times-list ul li .tee-group h5 { font-weight:600 }
.tee-times-list ul li .tee-group span { position: relative; margin-left: auto; padding-left: 75px; color: var(--color-sky); }
.tee-times-list ul li .tee-group span:before { content: ''; position: absolute; width: 10px; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; left: 15px; background: var(--color-yellow); z-index: 1; }
.tee-times-list ul li .tee-group span:after { content: ''; position: absolute; width: 40px; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; left: 15px; background: var(--color-sky) }

.tee-times-list ul li .photo-avatar { display: flex; align-items: center; width: 100%; justify-content: flex-start; }
.tee-times-list ul li .photo-radius { position: relative; width: 100px; margin-right: 15px;  }
.tee-times-list ul li .photo-avatar h5 { display: inline-flex; align-items: center; font-size: 18px !important; font-weight: 600;  text-transform:uppercase; padding-bottom:5px; }
.tee-times-list ul li .photo-avatar h5 span { margin-left: 10px; }
.tee-times-list ul li .photo-avatar .flag { position:absolute; bottom:-12px; right:0; left:0; margin-left:auto; margin-right:auto; z-index: 2; }
.tee-times-list ul li .photo-radius figure { position: relative; display: block; height: 0; padding-bottom: 100%; border-radius: 50%; overflow: hidden;  }
.tee-times-list ul li .photo-radius figure img { position: absolute; width: 100%; height: 100%; top: 0; left: 0; object-fit: cover; border-radius: 50%;  }
.tee-times-list .show-name-class { display:flex; flex-wrap:wrap; flex:1; flex-direction:column; }
.tee-times-list .show-class-player { display:block; font-style: normal; color: var(--color-blue); font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif; }

/*Competition Rules*/
.competition-rules { padding: 20px 0 60px 0; }
.competition-rules .warpper {  display: flex; flex-wrap: wrap; }
.competition-rules header { position: relative; padding-bottom: 20px; border-bottom: 1px solid var(--color-miniblue-border); }
.competition-rules header h2 { color: var(--color-blue) }
.competition-rules header h2:first-letter { font-weight: 600; }
.competition-rules header h2 span { font-weight: 600; color: var(--color-blue); }
.competition-rules header h2 span small { font-weight: 300; }
.competition-rules header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.competition-rules header p span { position: relative; color: #8093a5;    }
.competition-rules header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }

.competition-rules main {  width: 100%; padding: 20px 0 0 0;  }

.group-age { position: relative; }
.group-age ul { display: flex; flex-wrap: wrap; padding: 15px  0; margin: 0 -6px; }
.group-age ul li {  position: relative; justify-content: center; align-items: center; width: 33.3333%; padding: 6px; list-style: none;  }
.group-age ul li article { height: 100%; padding-bottom: 15px; border-radius: 8px; border: 1px solid var(--color-miniblue-border); background:var(--color-miniblue); }
.group-age ul li .class-name { position: relative; width: 100%; padding: 15px 15px 15px 50px; color: var(--color-blue);  text-transform: uppercase; font-weight:600 }
.group-age ul li .class-name span { position: absolute; display: flex; justify-content: center; align-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--color-yellow); color: var(--color-blue); left: 10px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }
.group-age ul li .class-detail { width: 100%; padding: 0 15px 0 50px; color: var(--color-blue);  }
.group-age ul li .class-detail span { color:var(--color-sky); }
.group-age ul li .class-detail small { color: var(--color-black) }

.competition-rules .content { padding: 30px 0; }
.competition-rules .content h2 { padding-top: 0; }

.point-process {  position: relative; width: 100%; padding: 15px 0; }
.point-process ul { display: flex; justify-content: center; flex-wrap: wrap; padding: 0; margin: 0 -6px; }
.point-process ul li { width: 33.3333%; padding: 6px; list-style: none; }
.point-process ul li article { width: 100%; height: 100%; padding: 30px; background: var(--color-miniblue); border: 1px solid var(--color-miniblue-border); border-radius: 8px;  }
.point-process ul li p { padding: 0; }
.point-process ul li h1 { font-weight: 600; line-height: .5; color: var(--color-yellow); }
.point-process ul li h1 b { font-size: 18px; color: var(--color-black); }
.point-process ul li b { color: var(--color-sky); font-size: 24px; }

.competition-rules main img { width: 100%; object-fit: cover; }

/*Awards*/
.awards { padding: 20px 0 60px 0;  }
.awards .warpper {  display: flex; flex-wrap: wrap; }
.awards main { width: 100%; }
.awards header { position: relative; padding-bottom: 20px; border-bottom: 1px solid var(--color-miniblue-border); }
.awards header h2 { color: var(--color-blue) }
.awards header h2:first-letter { font-weight: 600; }
.awards header h2 span { font-weight: 600; color: var(--color-blue); }
.awards header h2 span small { font-weight: 300; }
.awards header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.awards header p span { position: relative; color: #8093a5;  }
.awards header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }
.awards h4 { color: var(--color-blue) }

.awards-level { position: relative; padding: 0 0 60px 0; }
.awards-level h3 { padding-bottom: 30px; }
.awards-level h3 span { font-family:  Kanit, Arial, Helvetica, sans-serif; font-weight: 300; }
.awards-level h4 { font-weight: 600; }
.awards-level ul { display: flex; flex-wrap: wrap; justify-content: center; text-align: center; padding: 0; }
.awards-level ul li {  width: 25%; padding: 0 15px; border-left: 1px dotted var(--color-miniblue-border);; list-style: none; }
.awards-level ul li:first-child { border-left: none; }
.awards-level ul li h3 { font-weight: 600; color: var(--color-blue); }
.awards-level ul li p { padding-top: 0; }
.awards-level ul li img { max-width: 150px; }

.awards-final { position: relative; padding: 60px 0 0 0;  }
.awards-final article { padding: 20px 60px; background: var(--color-blue); color: var(--color-white); }
.awards-final article h2 { padding: 30px 0; text-align: center; border-bottom: 3px solid var(--color-yellow); }
.awards-sec { position: relative;  }
.awards-sec ul { display: flex; flex-wrap: wrap; padding: 0;   }
.awards-sec ul li {  width: 100%; padding: 15px 0; list-style: none;  }
.awards-sec ul li:last-child { border-bottom: none; }
.awards-sec ul li h3 { padding-top: 0;  color: var(--color-yellow); }
.awards-sec h3 span { font-weight:300 }
.awards-sec ul li h4 { padding: 0; color: var(--color-white); }
.awards-sec ul li h4 span { font-size: 16px; font-weight: 300; }
.awards-sec ul li dl {  }
.awards-sec ul li dl dt { padding: 0 0 10px 0; }
.awards-sec ul li dl dt p { padding-left: 25px; }
.awards-sec p {  }
.awards-sec .color-yellow { color:var(--color-yellow) }
.awards-sec .color-white-drop { color:var(--color-white-drop); }
.awards-sec ol li ul { padding-left:20px; padding-top:10px; }
.awards-sec ol li ul li { padding: 0; color:var(--color-white-drop); }

.awards-national { position: relative; padding: 60px 0 0 0;   }

/* ------------------------------------------------------------------------------------------------------------
|  Ranking |
------------------------------------------------------------------------------------------------------------ */
.ranking { padding: 0 0 60px 0;  }
.ranking .warpper {  display: flex; flex-wrap: wrap; }
.ranking main { position: relative; width: 100%; overflow: hidden; border-bottom: 3px solid var(--color-blue); background: #f8fafd; }

.ranking-table { width: 100%;  border: none; border-collapse: separate;  border-spacing: 0; font-family: 'Roboto Condensed','Kanit', Arial, Helvetica, sans-serif; font-size: 16px; }
.ranking-table h5 { padding:  0; font-size:16px; font-family: 'Roboto Condensed','Kanit', Arial, Helvetica, sans-serif; }
.ranking-table h5 a:hover { color:var(--color-white); }
.ranking-table thead { }
.ranking-table thead th { color: var(--color-white-drop); padding: 15px; text-align: center; font-size: 16px; text-transform: uppercase; font-weight: 600; white-space: nowrap; border-bottom:3px solid var(--color-yellow);  background-color: var(--color-blue);  }
.ranking-table thead th:first-child { border-left: none; }
.ranking-table thead th:last-child { border-right: none; }

.ranking-table tbody td { padding: 5px 15px; text-align: center; white-space: nowrap; font-family: 'Roboto Condensed','Kanit', Arial, Helvetica, sans-serif;  font-size: 16px; border-bottom: solid 1px var(--color-miniblue-border); }
.ranking-table tbody td:first-child { border-left: none; }
.ranking-table tbody td:last-child { border-right: none; font-weight:600; color:var(--color-sky) }
.ranking-table tbody tr { background: none;  transition: all 0.3s ease; }
.ranking-table tbody tr:hover { background: var(--color-sky) !important; color: var(--color-white);  transition: all 0.3s ease; }
.ranking-table tbody tr:nth-child(odd) { background: #edf1f7; }
.ranking-table tbody tr:hover .score-num,.ranking-table tbody tr:hover td:last-child { color: var(--color-white); }
.ranking-table .nat {   }
.ranking-table .nat img { width: 24px; margin: auto; }
.ranking-table .score-num { font-weight: 600; color: var(--color-blue) }

.ranking-table .name-sponsor { display:flex; flex-wrap:wrap; align-items:center; padding: 6px 0 }
.ranking-table .logo-sponsor-player { display:flex; width: 80px; justify-content:flex-start; }
.ranking-table .logo-sponsor-player a { margin:inherit; }
.ranking-table .logo-sponsor-player img { width: 100%; height: 20px; object-fit:contain; opacity: .8; }

.ranking-table thead th:nth-child(2) { width: 500px; }

.ranking-scroll { min-height: 300px; }
.ranking-table .ranking-sticky-pos {  }
.ranking-table .ranking-sticky-name { text-align: left; }
.ranking-table tbody td.ranking-sticky-name h5 { font-weight:600; margin-right:15px; }

.ranking-table .sorting_1 { font-weight:600 }

.ranking .chosen-container-single .chosen-single { border: 1px solid var(--color-miniblue-border);; }
.ranking .chosen-container .chosen-results li:first-child { padding: 5px 6px !important; }
.ranking .chosen-container-single .chosen-drop { border: 1px solid var(--color-miniblue-border);; border-top: none !important; }

.ranking .search-filter .select-now { flex:none;  }
.ranking .search-filter ul li { width: 20%; }

.academy-ranking { margin-left: 0 !important }
.academy-ranking tbody tr:hover a {color: var(--color-white) !important; }
.academy-ranking .ranking-sticky-pos { width: 80px; }
.academy-ranking .ranking-sticky-point { width: 120px; }
.academy-ranking .ranking-table .ranking-sticky-name { width:max-content }
.academy-ranking .ranking-sticky-pos { position:relative !important; left:inherit !important; }
.academy-ranking .ranking-sticky-name { display: table-cell !important; position:relative !important; left:inherit !important;  }

.academy-ranking-filter ul li { width: auto !important; }

/* ------------------------------------------------------------------------------------------------------------
|  Live Score |
------------------------------------------------------------------------------------------------------------ */
.livescore { padding: 0 0 60px 0; min-height: 500px; }
.livescore .warpper {  display: flex; flex-wrap: wrap; }
.livescore main { position: relative; width: 100%; overflow: hidden; border-bottom: 3px solid var(--color-blue); background: #f8fafd; }
.headtable { border-bottom:3px solid var(--color-yellow) !important;  }

.livescore-table { width: 100%;  border: none; border-collapse: separate;  border-spacing: 0; font-size: 14px; font-family: 'Roboto Condensed','Kanit', Arial, Helvetica, sans-serif; }
.livescore-table a { margin: auto; display: flex; align-items: center; }
.livescore-table h5 { padding: 5px 0; font-weight: 600; }
.livescore-table thead th {  color: var(--color-white-drop); padding: 5px; text-align: center; font-size: 14px; text-transform: uppercase; font-weight: 600; white-space: nowrap;  background-color: var(--color-blue); border-right: 1px solid var(--color-minisky-border);  }
.livescore-table thead th:first-child { border-left: none; }
.livescore-table thead th:last-child { border-right: none; }
.livescore-table thead th.no-border-right { border-right: none; }
.livescore-table thead tr .name { cursor: default; font-weight: 600; }

.livescore-table tbody td { padding: 3px; text-align: center; white-space: nowrap; border-bottom: solid 1px var(--color-miniblue-border); border-right: 1px solid #d8dfe8; }
.livescore-table tbody td:first-child { border-left: none; }
.livescore-table tbody td:last-child { border-right: none; }
.livescore-table tbody tr { background: none;  transition: all 0.3s ease; }
.livescore-table tbody tr:nth-child(odd) { /*background: #edf1f7;*/ }
.livescore-table tbody td img { margin: 0 auto }

.livescore-table .fav { width: 30px;  }
.livescore-table .fav a { width: 19px; }
.livescore-table .fav a:hover { color:var(--color-sky); }
.livescore-table .fav .btn-fav { margin: auto; position: relative; z-index: 99; width: 19px; cursor:pointer; transition:all 0.3s ease }
.livescore-table .fav .btn-fav:hover { color:var(--color-sky); transition:all 0.3s ease }
.livescore-table .pos { width: 35px; font-weight:500 }
.livescore-table .name { cursor: pointer; padding: 5px 12px; text-align: left; font-weight: 500 }
.livescore-table .box-player-name { display: flex; align-items:center; flex-wrap:wrap; }
.livescore-table .name .inname { line-height: 1; max-width: 250px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; }
.livescore-table .name .inname .teamcolor { width: 15px; margin-right: 3px; }
.livescore-table .nat { width: 40px; }
.livescore-table .nat img { width: 20px; }
.livescore-table .show-r { width: 30px; line-height: 0; }
.livescore-table .totalpar { width: 50px; }
.livescore-table .hole { width: 30px; line-height: 0; }
.livescore-table .sum-hole { display: none; width: 40px; }
.livescore-table .outhole { width: 35px; }
.livescore-table .inhole { width: 35px; }
.livescore-table .tothole { width: 35px; }
.livescore-table .todaypar { width: 50px; }

.livescore-table .hole-mobile { display: none; position: relative; margin-top: 5px;  width: 100% !important; background: var(--color-white); }
.livescore-table .table-hole-9 { width: 100% !important; height: 100%; font-size: 14px; background: var(--color-white); }
.livescore-table .table-hole-9 table { width: 100%; text-align: center; font-weight: 400; }
.livescore-table .table-hole-9 table tr td {padding: 4px; font-weight: normal; text-transform: uppercase; background: var(--color-white); }
.livescore-table .table-hole-9 table tr:first-child td {  font-weight: bold; border-top: solid 1px var(--color-miniblue-border)  }
.livescore-table .table-hole-9 table tr td:first-child { font-weight: bold; text-transform: uppercase; width: 180px; }
/*.livescore-table .table-hole-9 table tr:nth-child(2) td { background: #f9f9f9 }*/
.livescore-table .m-hole-in { display: none;  }
.livescore-table .m-hole-out { }
.livescore-table .set-hole { position: relative; display: flex; flex-wrap: wrap; width: 100% !important; min-height: 30px; margin-bottom: 10px; align-items: center; /*border-top: solid 1px var(--color-miniblue-border);*/ }

.livescore-table .set-hole .set-close { position: absolute; right: 15px; top: 15px; display: flex; align-items: center; margin-left: auto;  width: 24px; height: 24px; background: #fff url(../images/icon-close-blue.svg) no-repeat center; background-size: 54%; border: 1px solid var(--color-blue-big); border-radius: 50%; cursor: pointer; }
.livescore-table .set-hole .set-close a { position: relative; width: 19px; height: 19px; background: #999 url(../images/icon-close.png) no-repeat center; border-radius: 50%; }
.livescore-table .set-round { display:flex; }
/*.livescore-table .set-round .round-box { padding: 2px 5px; margin-left: 4px; border-radius:2px; border:1px solid #83aad4; font-size:12px; }*/
.livescore-table .set-round .round-box { padding: 4px 10px; margin-right:6px; border-radius:3px; border:1px solid #83aad4; font-size:15px; transition:all 0.3s ease; user-select: none;}
.livescore-table .set-round .round-box:hover { color:var(--color-sky);  border:1px solid var(--color-blue); transition:all 0.3s ease }
.livescore-table .set-round .round-box.current { background:var(--color-blue); color:var(--color-white);border:1px solid var(--color-blue); }
.livescore-table .set-in-set-out { position: absolute; right: 0; bottom: -10px; display:flex; }
.livescore-table .set-in-set-out span { position: relative; display: flex; align-items: center; justify-content: center; height: 100%; font-weight: 600; padding: 3px 0; background: #999; border-radius: 3px 3px 0 0; color: var(--color-white); text-align: center;width: 60px; height: 40px; cursor: pointer; user-select:none; }
.livescore-table .set-in-set-out .set-one {  margin-right: 2px; }
.livescore-table .set-in-set-out .set-two {  }
.livescore-table .set-in-set-out .current { color: var(--color-white-drop); background: var(--color-blue); }
.livescore-table .set-in-set-out .current:before { content: ''; position: absolute; width: 9px; height: 7px; left: 0; right: 0; bottom: 4px; margin-left: auto; margin-right: auto; background: url(../images/icon-arrowdown-mini.png) no-repeat center bottom; }

.livescore-table .score-num { font-weight: 600; color: var(--color-blue) }
.livescore-table .border-bottom { border-bottom: 1px solid var(--color-minisky-border); }
.livescore-table .border-right { border-right: 1px solid var(--color-minisky-border) !important; }
.livescore-table .big { font-weight: 600; }

.livescore-table .teamcolor { display: inline-table; vertical-align: text-bottom; background-position: center 4px; }

.livescore dl { display: flex; flex-wrap: wrap; }
.livescore dl dd { padding-top: 2px; padding-right: 8px; font-size: 14px; font-weight: 600; }
.livescore dl dd:last-child { padding-right: 0; }
.livescore dl dd span { display: inline-block; margin-bottom: 2px; margin-right: 3px; border-radius: 50%; width: 14px; height: 14px; vertical-align: middle; }

.livescore .search-filter { padding-bottom:10px; }
.livescore .search-filter li {  }
.livescore .search-filter li:last-child { flex: 1; justify-content: flex-end; }

.livescore .chosen-container-single .chosen-single { border: 1px solid var(--color-miniblue-border);; }
.livescore .chosen-container .chosen-results li:first-child { padding: 5px 6px !important; }
.livescore .chosen-container-single .chosen-drop { border: 1px solid var(--color-miniblue-border);; border-top: none !important; }

.livescore .logo-sponsor-player { display:inline-flex; margin-left:5px; width: 90px; height:20px; }
.livescore .logo-sponsor-player a { margin:inherit; }
.livescore .logo-sponsor-player img { width: 100%; object-fit:contain; opacity: .8; }

.livescore .player-row { transition: background-color 0.3s; user-select:none; }
.livescore .player-row:hover { background-color: #edf1f7; }
.livescore .player-row:hover .inname span { color:var(--color-sky) }

.livescore .expanded-content { display: none;background-color: #edf1f7;}
.livescore .expanded-content.show {display: table-row;}
.livescore .expanded-content td { padding: 10px; text-align: center; white-space: nowrap; border-bottom: solid 1px var(--color-miniblue-border);  }

.livescore .box-show-full-player { position: relative; min-height: 300px; padding: 30px; border-radius:4px; background:var(--color-white) }
.livescore .box-show-full-player table:first-child {  border-bottom:none !important; }
.livescore .box-show-full-player .set-close { position: absolute; right: 15px; top: 15px; display: flex; align-items: center; margin-left: auto;  width: 24px; height: 24px; background: var(--color-white) url(../images/icon-close-blue.svg) no-repeat center; background-size: 54%; border: 1px solid #c0cee0; border-radius: 50%; cursor: pointer; transition:all 0.3s ease }
.livescore .box-show-full-player .set-close:hover { border:1px solid var(--color-blue); transition:all 0.3s ease }
.livescore .box-show-full-player .show-profile { display:flex; flex-wrap: wrap; position: relative; margin-bottom:15px; padding-bottom: 20px; border-bottom:4px solid #edf1f7; }
.livescore .box-show-full-player .cover-profile { display:block; position:relative; width: 70px; height: 70px; border-radius:50%; background:#edf1f7; cursor: pointer;  }
.livescore .box-show-full-player .cover-profile img { border-radius:50%; }
.livescore .box-show-full-player .cover-profile .flag { position:absolute; bottom:-12px; right:0; left:0; margin-left:auto; margin-right:auto; }
.livescore .box-show-full-player .show-name-class { padding-left:15px; text-align:left; }
.livescore .box-show-full-player .show-name-class .on-name { font-size:20px; font-weight:600; text-transform:uppercase; cursor: pointer; transition:all 0.3s ease }
.livescore .box-show-full-player .show-name-class .on-name:hover { color:var(--color-sky); transition:all 0.3s ease }
.livescore .box-show-full-player .show-name-class .age-class { font-size:15px; color:var(--color-gray); }
.livescore .box-show-full-player .show-name-class .age-class span { padding-left:10px; }
.livescore .box-show-full-player .show-name-class .age-class span em { font-style:normal; color:var(--color-blue); }
.livescore .box-show-full-player .show-name-class .organization { color:var(--color-gray); }
.livescore .box-show-full-player .show-name-class .organization a { display:inline-flex; color:var(--color-gray);}
.livescore .box-show-full-player .show-name-class .organization a:hover { color:var(--color-black); }
.livescore .box-show-full-player .show-btn-profile-sponsor { margin-left:auto; display:flex; flex-wrap:wrap; /*padding-right:50px;*/ align-items:center; }
.livescore .box-show-full-player .show-btn-profile-sponsor .btn-link-profile { padding:0 0 0 30px; order:2 }
.livescore .box-show-full-player .show-btn-profile-sponsor .btn-link-profile a { display:block; padding: 6px 25px; border-radius:90px; border:1px solid #c0cee0; font-size:15px; }
.livescore .box-show-full-player .show-btn-profile-sponsor .btn-link-profile a:hover { border:1px solid var(--color-blue); background:var(--color-blue); color:var(--color-white); }
.livescore .box-show-full-player .show-btn-profile-sponsor .logo-sponsor-player { width: 120px; height:30px; justify-content:center; }
.livescore .box-show-full-player .table-hole-9 tbody tr:first-child td:first-child { background:var(--color-blue); }
.livescore .box-show-full-player .table-hole-9 tr td:first-child { background:var(--color-blue); color:var(--color-white-drop); border-right:1px solid var(--color-minisky-border); border-bottom:1px solid var(--color-minisky-border); border-top:1px solid var(--color-minisky-border) }
.livescore .box-show-full-player .table-hole-9 tr td:last-child { width: 121px; border-right:solid 1px var(--color-miniblue-border) }
.livescore .box-show-full-player .table-hole-9 tbody tr:first-child td { background:var(--color-miniblue); }
.livescore .box-show-full-player .table-hole-9 .in-out-box { width: 80px; }

.livescore .sec-box-player { position:relative; padding-bottom:20px; margin-bottom: 20px; border-bottom:1px dashed #c0cee0; }
.livescore .sec-box-player:last-child { border-bottom:none; padding-bottom:0; margin-bottom:0 }

.livescore .leaderboard-cutline td { border-top:3px solid var(--color-blue); background: #e6eefb; }
.livescore .box-cutline { display: flex; flex-wrap: wrap; justify-content: center; padding:15px; font-size:14px; }
.livescore .box-cutline span { display: flex; flex-wrap: wrap; border-left:1px solid #c0cee0; padding-left: 5px; margin-left: 10px; font-weight:500; cursor: pointer; }
.livescore .box-cutline svg { padding-left: 5px; width: 18px; }

/* สไตล์พื้นฐานสำหรับ Skeleton Preload wait Ajax */
.skeleton-container-livescore { width: 100%; padding: 0; margin: auto; }
.skeleton-item { background-color: #dde3eb;border-radius: 4px; margin-bottom: 10px; overflow: hidden; position: relative; }
/* เอฟเฟกต์การกะพริบ */
.skeleton-item::after { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0) 100% ); animation: shimmer 1.5s infinite; }
@keyframes shimmer {0% { transform: translateX(-100%);  } 100% { transform: translateX(100%);} }
/* รูปแบบต่างๆ ของ Skeleton */
.skeleton-header {  width: 100%; height: 60px; margin-bottom: 15px;}
.skeleton-line { height: 15px; width: 100%;}
.skeleton-line.mini { width: 40%; }
.skeleton-line.less { width: 60%; }
.skeleton-line.short { width: 80%; }
.skeleton-line.medium { width: 90%; }
.skeleton-avatar { width: 50px;height: 50px;border-radius: 50%; }   
.skeleton-image {width: 100%; height: 200px; }
.skeleton-img-full { width: 100%; height:100%; border-radius:20px }

.skeleton-tournament { width: 100%; display: grid; gap: 0 240px; grid-template-columns: 1fr 1fr; padding: 0 0 20px 0; margin: 30px auto auto; border-bottom:1px solid var(--color-miniblue-border) }
.skeleton-tournament .skeleton-text { position:relative; }
.skeleton-tournament .name {  width: 100%; height: 50px; margin-bottom: 15px;}
.skeleton-tournament .skeleton-img { position:relative; }
.skeleton-tournament .skeleton-img-full { height:300px }
.skeleton-tournament:nth-child(2) { border-bottom:none; }

.skeleton-player { width: 100%; display: grid; gap: 30px; grid-template-columns: 1fr 1fr 1fr 1fr; padding: 0 0 20px 0; margin:  auto; }
.skeleton-player .skeleton-box { position:relative;  padding: 20px; width: 100%; background: var(--color-miniblue); border-radius: 8px; border: 1px solid var(--color-miniblue-border); }
.skeleton-player .photo { width: 190px; height:190px; border-radius:50%; margin-left:auto; margin-right:auto; }
.skeleton-player .text-name { width: 80%; height:25px; margin-top:20px; margin-left:auto; margin-right:auto; }
.skeleton-player .text-age { width: 50px; height:15px; margin-top:15px; margin-left:auto; margin-right:auto; }

.skeleton-gallery-photo { width: 100%; display: grid; gap: 30px; grid-template-columns: 1fr 1fr 1fr; padding: 0 0 20px 0; margin:  auto; }
.skeleton-gallery-photo .skeleton-box { position:relative;  width: 100%; }
.skeleton-gallery-photo .photo { width: 100%; position: relative; height: 0; padding: 30%;  overflow: hidden; border-radius:8px; margin-left:auto; margin-right:auto; }
.skeleton-gallery-photo .text-name { width: 90%; height:10px; margin-top:20px;  }
.skeleton-gallery-photo .text-name-two { width: 70%; height:10px; margin-top:0;  }

.skeleton-news-event { width: 100%; display: grid; gap: 30px; grid-template-columns: 1fr; padding:30px 0;  margin-left:auto; margin-right:auto; }
.skeleton-news-event .skeleton-box { position:relative;  width: 100%;  display: grid; gap: 30px; grid-template-columns: 1fr 1fr;  }
.skeleton-news-event .photo { width: 100%; position: relative; height: 0; padding: 30%;  overflow: hidden; border-radius:8px; margin-left:auto; margin-right:auto; }
.skeleton-news-event .text-name { width: 100%; height:20px; margin-top:10px;  }
.skeleton-news-event .text-name-two { width: 90%; height:10px; margin-top:0;  }
.skeleton-news-event .text-name-three { width: 50%; height:10px; margin-top:0;  }

.content-container .error-message {  }
/**/

.ranking-scroll table.dataTable thead th { padding: 15px 10px; border-bottom:3px solid var(--color-yellow);  } 
.ranking-scroll table.dataTable tbody tr:nth-child(odd) { background: #edf1f7 }
.ranking-scroll table.dataTable tbody tr:nth-child(even) { background: #f8fafd }

.livescore-tournament { width: 100%; padding-top: 20px;}
.livescore-tournament h2 { color: var(--color-blue); font-size:24px; }
.livescore-tournament h4 { padding-bottom:0; color:var(--color-gray); }

.full-leaderboard header { display: none; }
.full-leaderboard header h5 { font-weight: 600; padding-left: 10px; }

.my-leaderboard header { display: none ; }
.my-leaderboard header h5 { font-weight: 600; padding-left: 10px; color: var(--color-blue); }
.my-leaderboard .livescore-table tbody tr:nth-child(odd) { /*background: #d1deef;*/ }
.my-leaderboard .livescore-table tbody tr:nth-child(even) { /*background: #e5efff*/ }
.my-leaderboard tbody tr:first-child td  { border-top: solid 1px #c0cee0 !important; }
.my-leaderboard tbody td {  border-right: solid 1px #c0cee0 ; border-bottom: solid 1px #c0cee0 ;  }

.action-board header { display: block; }
.action-board .livescore-table tbody tr:first-child td { border-top: solid 1px var(--color-miniblue-border) ; }

/*Par Table*/
.par-section { width: 100%; }
.par-table { width: 100%;  border: none; border-collapse: separate;  border-spacing: 0; font-family: 'Roboto Condensed','Kanit', Arial, Helvetica, sans-serif;font-size: 14px; }
.par-table a { margin: auto; }
.par-table h5 { padding: 5px 0; font-weight: 600; }
.par-table thead th { color: var(--color-white-drop); padding: 5px; text-align: center; font-size: 14px; text-transform: uppercase; font-weight: 600; white-space: nowrap;  background-color: var(--color-blue); border-right: 1px solid var(--color-minisky-border);  }
.par-table thead th:first-child { border-left: none; }
.par-table thead th:last-child { border-right: none; }
.par-table thead th.no-border-right { border-right: none; }

.par-table tbody td { padding: 5px; text-align: center; white-space: nowrap; border-bottom: solid 1px var(--color-miniblue-border); border-right: 1px solid #d8dfe8; }
.par-table tbody td:first-child { border-left: none; }
.par-table tbody td:last-child { border-right: none; }
.par-table tbody tr { background: none;  transition: all 0.3s ease; }
.par-table tbody tr:nth-child(odd) { background: #edf1f7; }
.par-table tbody td img { margin: 0 auto }
.par-border-right { border-right:1px solid #d8dfe8 !important }
.par-bg-color { background:#edf1f7 !important }
.par-bg-color-none { background:none !important }

.par-table .fav { width: 30px;  }
.par-table .fav a { width: 19px; }
.par-table .pos { width: 40px; }
.par-table .nameClass { width: 80px; padding: 5px 12px; text-align: center; font-weight: 600 }
.par-table .nameClass .innameClass { display: inline-block; align-items: center; }
.par-table .nameClass .innameClass .teamcolor { width: 15px; margin-right: 3px; }
.par-table .nameClass .innameClass span { padding-left: 5px; }
.par-table .nat { width: 40px; }
.par-table .nat img { width: 20px; }
.par-table .totalpar { width: 60px; }
.par-table .hole { width: 35px; }
.par-table .holdColor { text-align: left; }
.par-table .sum-hole { display: none; width: 40px; }
.par-table .outhole { width: 40px; }
.par-table .inhole { width: 40px; }
.par-table .tothole { width: 40px; }
.par-table .todaypar { width: auto; }

.par-table .hole-mobile { display: none; position: relative; margin-top: 5px;  width: 100% !important; background: var(--color-white); }
.par-table .table-hole-9 { width: 100% !important; height: 100%; font-size: 11px; background: var(--color-white); }
.par-table .table-hole-9 table { width: 100%; text-align: center; font-weight: 400; }
.par-table .table-hole-9 table tr td {padding: 4px; font-weight: normal; text-transform: uppercase; background: var(--color-white); }
.par-table .table-hole-9 table tr:first-child td {  font-weight: bold; border-top: solid 1px var(--color-miniblue-border)  }
.par-table .table-hole-9 table tr td:first-child { font-weight: bold; text-transform: uppercase; }
/*.par-table .table-hole-9 table tr:nth-child(2) td { background: #f9f9f9 }*/
.par-table .m-hole-in { }
.par-table .m-hole-out { display: none; }
.par-table .set-hole { position: relative; display: flex; flex-wrap: wrap; width: 100% !important; align-items: center; border-top: solid 1px var(--color-miniblue-border); }
.par-table .set-hole .set-one { width: 60px; height: 30px; margin-right: 1px; }
.par-table .set-hole .set-two { width: 60px; height: 30px; }
.par-table .set-hole .set-close { position: relative; display: flex; align-items: center; margin-left: auto; margin-right: 5px; width: 19px; height: 19px; background: #999 url(../images/icon-close.png) no-repeat center; border-radius: 50%; cursor: pointer; }
.par-table .set-hole .set-close a { position: relative; width: 19px; height: 19px; background: #999 url(../images/icon-close.png) no-repeat center; border-radius: 50%; }
.par-table .set-hole a { position: relative; display: flex; align-items: center; justify-content: center; height: 100%; padding: 3px 0; background: #999; color: var(--color-white); text-align: center; }
.par-table .set-hole a.current { color: var(--color-white-drop); background: var(--color-blue); }
.par-table .set-hole a.current:before { content: ''; position: absolute; width: 9px; height: 7px; left: 0; right: 0; bottom: 0; margin-left: auto; margin-right: auto; background: url(../images/icon-arrowdown-mini.png) no-repeat center bottom; }

.par-table .score-num { font-weight: 600; color: var(--color-blue) }
.par-table .border-bottom { border-bottom: 1px solid var(--color-minisky-border); }
.par-table .border-bottom-td td { border-bottom: 1px solid var(--color-minisky-border); }
.par-table .border-right { border-right: 1px solid var(--color-minisky-border) !important; }
.par-table .big { font-weight: 600; }
.par-table .teamcolor { display: inline-table; }

.par-table .colorcircle { position: relative; padding-left: 20px; text-align: left; }
.par-table .colorcircle:before { content: ''; position: absolute; width: 14px; height: 14px; border-radius: 50%; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; border: 1px solid rgba(0,0,0,0) }
.par-table .Black:before { background: #000 } 
.par-table .White:before { background: var(--color-white); border: 1px solid #d8dfe8; } 
.par-table .Blue:before { background: #0b74cf } 
.par-table .Red:before { background: #fa0000 } 
.par-table .Yellow:before { background: #fdbc00 } 
.par-table .Green:before { background: #63a910 } 
.par-table .Purple:before { background: #8a09b4 } 
.par-table .Gold:before { background: #d4af37 }
.par-table .Pink:before { background: #f62691 } 

/*End*/

.mini-class { min-width: 150px !important; }

.clock { color: var(--color-yellow); padding-left: 10px; width: 140px; display:flex; justify-content:flex-end; }

.adds-leaderboard { margin: auto; position: relative; display: flex; justify-content: center; align-items: center; width: 19px; height: 19px; border: 2px solid var(--color-white-drop); border-radius: 50%;  transition: all 0.3s ease }
.adds-leaderboard:before { content: ""; position: absolute; width: 9px; height: 1px; background: var(--color-white-drop); left: 0; top: 0; right: 0; bottom: 0; margin:  auto; }
.adds-leaderboard:after { content: ""; position: absolute; width: 1px; height: 9px; background: var(--color-white-drop); left: 0; top: 0; right: 0; bottom: 0; margin:  auto; }

.add-leaderboard { margin: auto; position: relative; display: flex; justify-content: center; align-items: center; width: 19px; height: 19px; border: 1px solid var(--color-blue); border-radius: 50%;  transition: all 0.3s ease }
.add-leaderboard:hover { border: 1px solid var(--color-blue);  transition: all 0.3s ease }
.add-leaderboard:before { content: ""; position: absolute; width: 9px; height: 1px; background: var(--color-black); left: 0; top: 0; right: 0; bottom: 0; margin:  auto; }
.add-leaderboard:after { content: ""; position: absolute; width: 1px; height: 9px; background: var(--color-black); left: 0; top: 0; right: 0; bottom: 0; margin:  auto; }

.del-leaderboard {  margin: auto; position: relative; display: flex; justify-content: center; align-items: center; width: 19px; height: 19px; background: #999; border-radius: 50%;  transition: all 0.3s ease }
.del-leaderboard:hover { background: var(--color-blue);  transition: all 0.3s ease }
.del-leaderboard:before { content: ""; position: absolute; width: 9px; height: 1px; background: var(--color-white); left: 0; top: 0; right: 0; bottom: 0; margin:  auto; }

.Eagles {  margin: auto; display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 20px; height: 20px; background: #f5b300; color: var(--color-white); }
.Birdies {  margin: auto; display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 20px; height: 20px; background: #e00000; color: var(--color-white); }
.Bogeys {  margin: auto; display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 20px; height: 20px; background: #158cd4; color: var(--color-white); }
.DBBogey {  margin: auto; display: flex; justify-content: center; align-items: center; border-radius: 50%; width: 20px; height: 20px; background: #1ca976; color: var(--color-white); }

.eagles { background: #f5b300 !important; color: var(--color-white); }
.birdies { background: #e00000 !important; color: var(--color-white); }
.bogeys { background: #158cd4 !important; color: var(--color-white); }
.dbbogey { background: #1ca976 !important; color: var(--color-white); }


/* ------------------------------------------------------------------------------------------------------------
|  About Us |
------------------------------------------------------------------------------------------------------------ */
.aboutus { padding: 20px 0 60px 0; }
.aboutus .warpper {  display: flex; flex-wrap: wrap; }
.aboutus header { position: relative; padding-bottom: 20px; border-bottom: 1px solid var(--color-miniblue-border); }
.aboutus header h2 { color: var(--color-blue) }
.aboutus header h2:first-letter { font-weight: 600; }
.aboutus header h2 span { font-weight: 600; color: var(--color-blue); }
.aboutus header h2 span small { font-weight: 300; }
.aboutus header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.aboutus header p span { position: relative; color: #8093a5;    }
.aboutus header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }

.aboutus main {  width: 100%; padding: 20px 0 0 0;  }

/* ------------------------------------------------------------------------------------------------------------
|  Contact Us |
------------------------------------------------------------------------------------------------------------ */
.contactus { padding: 20px 0 60px 0; }
.contactus .warpper {  display: flex; flex-wrap: wrap; }
.contactus header { position: relative; padding-bottom: 20px; border-bottom: 1px solid var(--color-miniblue-border); }
.contactus header h2 { color: var(--color-blue) }
.contactus header h2:first-letter { font-weight: 600; }
.contactus header h2 span { font-weight: 600; color: var(--color-blue); }
.contactus header h2 span small { font-weight: 300; }
.contactus header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.contactus header p span { position: relative; color: #8093a5;    }
.contactus header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }

.contactus main {  width: 100%; padding: 20px 0 0 0;  }

/* ------------------------------------------------------------------------------------------------------------
|  Register |
------------------------------------------------------------------------------------------------------------ */
.register { padding: 40px 0 60px 0;  }
.register .warpper {  display: flex; flex-wrap: wrap; }
.register header { position: relative; padding-bottom: 20px; }
.register header h2 { color: var(--color-blue) }
.register header h2:first-letter { font-weight: 600; }
.register header h2 span { font-weight: 600; color: var(--color-blue); }
.register header h2 span small { font-weight: 300; }
.register header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.register header p span { position: relative; color: #8093a5;  }
.register header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }

.register main {  width: 100%; }

.register-zone { position: relative; display: flex; flex-wrap: wrap; width: 100%; padding: 0; }
.register-zone form { width: 100%; }

.register-zone aside { position: relative; display: flex; flex-wrap: wrap; width: 100%; align-items: center;  background: var(--color-blue); color: var(--color-white);  }  
.register-zone .pic-left {  width: 55%; height: 100%; background: var(--color-white); }
.register-zone .text {  width: 45%;  padding: 40px;  }
.register-zone .text h4 { padding-bottom: 10px;  }
.register-zone .text h5 { color: var(--color-sky); }

.register-zone article #code { padding-left:35px; }
.register-zone article .fix-tj { position:relative; }
.register-zone article .fix-tj .show-tj { position:absolute; left: 8px; top: 9px; z-index:1 }

.register-zone article { margin: 0 auto;  width: 60%; padding: 30px 0 60px 0; }
.register-zone article.mini { width: 100%; max-width:500px; }
.register-zone article h2 { padding: 30px 0; text-align: center; font-weight: 300; border-bottom: 1px solid var(--color-blue); }
.register-zone article h4 { font-weight: 300; color: var(--color-blue); }
.register-zone article h5 { padding-top: 30px; padding-bottom: 5px; }
.register-zone ul { display: flex; flex-wrap: wrap; margin: 0 -15px; padding: 0;  }
.register-zone ul li { position: relative;  width: 50%; padding: 5px 15px; list-style: none; }
.register-zone ul li.full {  width: 100%;  }
.register-zone dl { display: flex; flex-wrap: wrap; margin: 0 -15px; padding: 0;  }
.register-zone dl dt {  width: 50%; padding: 5px 15px; list-style: none; }
.register-zone dl dt.full {  width: 100%;  }
.register-zone ul li .box-img { width: 100%; margin-top: 10px; }
.register-zone ul li .box-img img { width: 100%; border-radius: 10px; }
.register-zone .select-birth { display: flex; flex-wrap: wrap; margin: 0 -2px; }
.register-zone .select-birth > div { padding: 0 2px; }
.register-zone .dd { width: 25%; }
.register-zone .mm { width: 45%; }
.register-zone .yy { width: 30%; }
.register-zone .pt-20 { padding-top: 20px; }
.register-zone select,.register-zone input { font-family: 'Inter', Kanit, Arial, Helvetica, sans-serif; }
.register-zone select option { font-family: Arial, Helvetica, sans-serif; font-size: 14px; padding: 5px; }

.register-zone .list-table-tournament { position: relative; overflow: hidden;width: 100%; }
.register-zone .list-table-tournament table { width: 100%; font-size: 14px;  }
.register-zone .list-table-tournament table thead tr {  }
.register-zone .list-table-tournament table thead tr th { padding: 10px 5px; text-align: center; background: var(--color-miniblue);     border: 1px solid var(--color-miniblue-border);
    border-right: 1px solid var(--color-miniblue-border);
    border-bottom: 1px solid var(--color-miniblue-border);  }
/*.register-zone .list-table-tournament  table thead tr th:first-child { width: 60px;  }*/
.register-zone .list-table-tournament table thead tr th:nth-child(2) { width: 80px;  }
.register-zone .list-table-tournament table thead tr th:nth-child(7) { width: 80px;  }
.register-zone .list-table-tournament table thead tr th:nth-child(10) { width: 100px; }
.register-zone .list-table-tournament table tbody tr { }
.register-zone .list-table-tournament table tbody tr:nth-child(even) { background:#f8f9fa }
.register-zone .list-table-tournament table tbody tr td { padding:  5px; text-align: center; border-right: 1px solid var(--color-miniblue-border);  border-bottom: 1px solid var(--color-miniblue-border) }
.register-zone .list-table-tournament table tbody tr td:first-child { border-left: 1px solid var(--color-miniblue-border); }
/*.register-zone .list-table-tournament  table tbody tr:nth-child(odd) { background:#f0f0f0 }*/
.register-zone .list-table-tournament table input[type="text"] { text-align:center; width: 40px; }
/*.register-zone table tbody tr td:first-child { background: var(--color-miniblue); }*/
.register-zone .show-infill { padding: 10px 15px; border-radius: 6px; background: var(--color-miniblue-border); }
.register-zone .btn-policy a { display:inline-block; text-decoration:underline; }
.register-zone .toggle-password { display: flex; justify-content: center; align-items: center; position: absolute; width: 40px; height: 40px; cursor: pointer; right: 0; bottom: 0; z-index: 1; font-size: 12px; }
.register-zone .inpass { position:relative; }
.register-zone .repassword { width: 100%; max-width:450px; margin:0 auto; }
.register-zone .repassword li { width: 100% !important; }
.register-zone label { font-size:14px; color:#888 }

.register-zone .list-table-tournament .sticky-sort { width: 50px;  }
.register-zone .list-table-tournament .sticky-data { width: 80px;  }
.register-zone .list-table-tournament .sticky-tournament { text-align:left; }
.register-zone .list-table-tournament th.sticky-tournament { text-align:center; }
.register-zone .list-table-tournament .sticky-course { text-align:left; width: 140px;  }
.register-zone .list-table-tournament th.sticky-course { text-align:center;  }
.register-zone .list-table-tournament .sticky-class { width: 50px;  }
.register-zone .list-table-tournament .sticky-finish { width: 52px;  }
.register-zone .list-table-tournament .sticky-score { width: 80px; }
.register-zone .list-table-tournament .sticky-yards { width: 48px; }
.register-zone .list-table-tournament .sticky-rating { width: 48px; }
.register-zone .list-table-tournament .sticky-manage { width: 100px; }

.register-zone input[type="checkbox"] + label, .register-zone input[type="radio"] + label { padding-top:12px; }
.register-zone table.table-size { width: 100%; font-size: 14px; border: 1px solid var(--color-miniblue-border)}
.register-zone table.table-size thead tr { background: var(--color-miniblue)}
.register-zone table.table-size thead tr th { padding: 10px 5px; text-align: center; border-right: 1px solid var(--color-miniblue-border); border-bottom: 1px solid var(--color-miniblue-border)}
.register-zone table.table-size thead tr th:first-child {  width: 60px}
.register-zone table.table-size tbody tr { border-bottom: 1px solid var(--color-miniblue-border)}
.register-zone table.table-size tbody tr td { padding: 10px 5px; text-align: center; border-right: 1px solid var(--color-miniblue-border)}
.register-zone table.table-size tbody tr td:first-child { background: var(--color-miniblue) }

.fix-player { padding-top:0; padding-bottom: 30px; margin-top: 30px; margin-bottom: 30px; }
.text-mini { padding-top: 10px; font-size: 12px; color: #999; }

/*Regulations & Benefits*/
.regulations-benefits { padding: 20px 0 60px 0; }
.regulations-benefits .warpper {  display: flex; flex-wrap: wrap; }
.regulations-benefits header { position: relative; padding-bottom: 20px; border-bottom: 1px solid var(--color-miniblue-border); }
.regulations-benefits header h2 { color: var(--color-blue) }
.regulations-benefits header h2:first-letter { font-weight: 600; }
.regulations-benefits header h2 span { font-weight: 600; color: var(--color-blue); }
.regulations-benefits header h2 span small { font-weight: 300; }
.regulations-benefits header p { display: flex; align-items: center; position: absolute; right: 0; top: 0; bottom: 20px; }
.regulations-benefits header p span { position: relative; color: #8093a5;    }
.regulations-benefits header p span:before { content: ''; position: absolute; width: 60px; height: 1px; background: var(--color-blue); left: -80px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto;  }
.regulations-benefits main {  width: 100%; padding: 20px 0 0 0;  }

/* ------------------------------------------------------------------------------------------------------------
|  Sponser Lists  |
------------------------------------------------------------------------------------------------------------ */
.sponsor-lists { padding: 30px 0; background: var(--color-mini-gray); overflow: hidden; }
.sponsor-lists h4 { color: var(--color-blue); }
.sponsor-lists main { position: relative; width: 100%; padding: 20px 0 }
.sponsor-lists main ul { display: flex; flex-wrap: wrap; justify-content: center; margin: -10px; }
.sponsor-lists main ul li { 666%; width: 16.6666%; padding: 10px; }
.sponsor-lists main ul li img { width: 100%; }
.sponsor-lists aside { position: relative; width: 100%; padding: 0 0 20px 0 }

/* ------------------------------------------------------------------------------------------------------------
|  Social |
------------------------------------------------------------------------------------------------------------ */
.social-follow { padding: 50px 0 ; color: var(--color-black); text-align: center; }
.social-follow p { text-transform: uppercase; font-weight: 300; }
.social-follow p span { font-weight: 600;  }
.social-follow ul { display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 15px; }
.social-follow ul li { width: 40px; height: 40px; margin: 0 6px; }
.social-follow ul li a { display: block; width: 100%; height: 100%; text-indent: -9999px; border-radius: 50%; overflow: hidden; }
.social-follow ul li a.fb { background-color: var(--color-sky); background-image: url(../images/icon-facebook.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.social-follow ul li a:hover.fb { background-color: #0866ff;  }
.social-follow ul li a.tw { background-color: var(--color-sky); background-image: url(../images/icon-twitter.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.social-follow ul li a:hover.tw { background-color: #0f1419 }
.social-follow ul li a.ig { background-color: var(--color-sky); background-image: url(../images/icon-instagram.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.social-follow ul li a:hover.ig { background-color: #c726a3 }
.social-follow ul li a.yt { background-color: var(--color-sky); background-image: url(../images/icon-youtube.svg); background-repeat: no-repeat; background-position: center; background-size: 65%; }
.social-follow ul li a:hover.yt { background-color: #d90014 }
.social-follow ul li a.line { background-color: var(--color-sky); background-image: url(../images/icon-line.svg); background-repeat: no-repeat; background-position: center; background-size: 67%; }
.social-follow ul li a:hover.line { background-color: #06a90b }

.followus { padding: 10px 0; color: var(--color-white); text-align: center; background: var(--color-blue); }
.followus p { font-weight: 400; color: var(--color-white-drop); font-size: 14px; }
.followus dl { display: flex; flex-wrap: wrap; justify-content: center; padding-bottom: 15px; }
.followus dl dd { width: 36px; height: 36px; margin: 0 3px; }
.followus dl dd a { display: block; width: 100%; height: 100%; text-indent: -9999px; border-radius: 50%; overflow: hidden; }
.followus dl dd a.fb { background-color: var(--color-sky); background-image: url(../images/icon-facebook.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.followus dl dd a:hover.fb { background-color: #204294;  }
.followus dl dd a.tw { background-color: var(--color-sky); background-image: url(../images/icon-twitter.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.followus dl dd a:hover.tw { background-color: #0992e6 }
.followus dl dd a.ig { background-color: var(--color-sky); background-image: url(../images/icon-instagram.svg); background-repeat: no-repeat; background-position: center; background-size: 60%; }
.followus dl dd a:hover.ig { background-color: #c726a3 }
.followus dl dd a.yt { background-color: var(--color-sky); background-image: url(../images/icon-youtube.svg); background-repeat: no-repeat; background-position: center; background-size: 65%; }
.followus dl dd a:hover.yt { background-color: #d90014 }
.followus dl dd a.line { background-color: var(--color-sky); background-image: url(../images/icon-line.svg); background-repeat: no-repeat; background-position: center; background-size: 67%; }
.followus dl dd a:hover.line { background-color: #06a90b }

.share-social { position: relative; display: flex; flex-wrap: wrap; padding: 15px 0; margin: 0 ; border-bottom: 1px solid var(--color-miniblue-border); font-size: 16px; }
.share-social .share-facebook {  position: relative; width: 105px; height: 40px; padding: 0 3px; text-align: center; vertical-align: middle; }
.share-social .share-facebook a { display: block; height: 100%; padding: 5px 16px 5px 12px; color: var(--color-white); background: #3a559f; border-radius: 3px; }
.share-social .share-facebook a:hover { background: #204099; }
.share-social .share-facebook a path { fill: var(--color-white);  transition: all 0.3s ease; }
.share-social .share-facebook a:hover path { fill: #f9f9f9;  transition: all 0.3s ease; }
.share-social .share-facebook svg { display: inline-block; width: 18px; height: 30px; vertical-align: middle; }
.share-social .share-facebook span { display: inline-block; padding: 0 0 0 3px; vertical-align: middle; }
.share-social .share-facebook sup { position: absolute; background: #ff0000;  z-index: 1; }

.share-social .share-twitter {  position: relative; width: 105px; height: 40px; padding: 0 3px; text-align: center; vertical-align: middle; }
.share-social .share-twitter a { display: block; height: 100%; padding: 5px 16px 5px 12px; color: var(--color-white); background: #03a9f4; border-radius: 3px; }
.share-social .share-twitter a:hover { background: #0e9bcc; }
.share-social .share-twitter a path { fill: var(--color-white);  transition: all 0.3s ease; }
.share-social .share-twitter a:hover path { fill: #f9f9f9;  transition: all 0.3s ease; }
.share-social .share-twitter svg { display: inline-block; width: 18px; height: 30px; vertical-align: middle; }
.share-social .share-twitter span { display: inline-block; padding: 0 0 0 3px; vertical-align: middle; }

.share-social .share-line { position: relative; width: 105px; height: 40px; padding: 0 3px; text-align: center; vertical-align: middle; }
.share-social .share-line a { display: block; height: 100%; padding: 5px 16px 5px 12px; color: var(--color-white); background: #00b900; border-radius: 3px; }
.share-social .share-line a:hover { background: #089e08; }
.share-social .share-line a path { fill: var(--color-white);  transition: all 0.3s ease; }
.share-social .share-line a:hover path { fill: #f9f9f9;  transition: all 0.3s ease; }
.share-social .share-line svg { display: inline-block; width: 18px; height: 30px; vertical-align: middle; }
.share-social .share-line span { display: inline-block; padding: 0 0 0 3px; vertical-align: middle; }

.noti-livescore { padding: 12px 0; width: 100%; background:var(--color-yellow); }
.noti-livescore .box { display:flex; flex-wrap:wrap; padding: 0; width: 100%; align-items:center; }
.noti-livescore .text { flex:1; font-weight:600; color:var(--color-blue); padding-right:30px; }
.noti-livescore .btn-show-live { margin-left:auto; }
.noti-livescore .btn-show-live a { background:var(--color-blue); color:var(--color-white); }
.noti-livescore .btn-show-live a:hover { background:var(--color-sky); transition:all 0.3s ease }
.noti-livescore .btn-show-scorecard { margin-left:auto;  margin-right: 10px;}
.noti-livescore .btn-show-scorecard a { background:var(--color-sky); color:var(--color-white);   }
.noti-livescore .btn-show-scorecard a:hover { background:var(--color-blue); transition:all 0.3s ease }
.noti-livescore ul { display:flex; flex-wrap:wrap; margin:0 -20px; position:relative; padding-bottom:0; }
.noti-livescore li { display: flex !important; width: 50% !important; padding: 0 20px !important; border-right:1px solid rgba(0, 0, 0, .3); }
.noti-livescore li:last-child { border-right:none; border-left:1px solid rgba(255, 255, 255, .5); }
.noti-livescore li:only-child { width: 100% !important; border-right:none; border-left:none; }
.noti-livescore a { display:flex; flex-wrap:wrap; height: 100%; font-size:14px; padding: 10px 17px; font-weight: 500; justify-content: center; text-transform: uppercase; border-radius: 90px;  transition:all 0.3s ease  }

/* ------------------------------------------------------------------------------------------------------------
|  Contact Us  |
------------------------------------------------------------------------------------------------------------ */
.contact-us { display:block; float:left; position:relative; width:100%; margin-top: 143px; }
.contact-us header { position: relative; text-align: center; }
.contact-us header h1 { color: var(--color-white); }
.contact-us main { position: relative; margin: 0 auto; width: 100%; max-width: 800px; padding: 30px 50px; color: var(--color-white); background: #0071bc; }

.contact-us .address { position: relative; width: 100%; padding:  60px 0; background-position: center; background-size: auto 100%; background-repeat: no-repeat; overflow: hidden; }
.contact-us .address:before { content: ''; position: absolute; width: 50%; background: url(../uploads/picture/cover-contact.jpg) no-repeat center right; background-size: cover; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
.contact-us .address:after { content: ''; position: absolute; width: 50%; background: #0071bc; right: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
.contact-us .address article { float: right; position: relative; width: 50%; padding: 15px 0 30px 100px; color: var(--color-white); z-index: 1 }
.contact-us .address article h1 { color: var(--color-white); }
.contact-us .address article h3 { padding-bottom: 0 }

.contact-us .contact-form { position: relative; width: 100%; max-width: 720px; margin: 0 auto; padding: 60px 0 80px 0; text-align: center; }
.contact-us .contact-form header h3 { text-transform: uppercase; }
.contact-us .contact-form ol { position: relative; margin: 0 auto;  width: 100%; min-width: inherit; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; }
.contact-us .contact-form ol li {  width: 100%; position: relative; padding: 10px 0; text-align: left; }
.contact-us .contact-form input[type="text"],
.contact-us .contact-form input[type="email"],
.contact-us .contact-form textarea,
.contact-us .contact-form select { display: block; width: 100%; padding-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 5px; border: 1px solid var(--color-white); border-left: none; border-right: none;  border-bottom: 1px solid #ddd; }
.contact-us .contact-form label { text-transform: uppercase; cursor: default; }
.contact-us .contact-form button { overflow:hidden; -webkit-appearance: none; display:block; position:relative; margin:0 auto;  font-family:'sukhumvitbold', Arial, Helvetica, sans-serif; max-width: 280px; min-width: 280px; padding: 20px 0; font-size: 19px; text-transform: uppercase;  line-height: 1; text-align: center; color: var(--color-white); border-radius: 3px; background: #0071bc; cursor: pointer;  transition: all 0.3s ease; }
.contact-us .contact-form button:hover, .contact-us .contact-form button:active { background: #005288; }

.google-map {  position: relative; width:100%; height:100%; background:none; z-index:2;  transition: all 0.3s ease; }
.google-map iframe { position:absolute; top:0;  left:0; right:0;  }

/* ------------------------------------------------------------------------------------------------------------
|  Footer  |
------------------------------------------------------------------------------------------------------------ */
footer { float:left; position: relative; width:100%; padding: 30px 0 50px 0; text-align: center; color: var(--color-white); background:var(--color-blue); }
footer ul { display: flex; justify-content: center; flex-wrap: wrap; margin-bottom: 15px; padding: 40px 0; border-bottom: 1px solid var(--color-minisky-border); }
footer ul li { padding: 0 10px; }
footer ul li a { font-size: 14px; font-weight: 500; color: var(--color-white); text-transform: uppercase; }
footer ul li a:hover,footer ul li a.current { color: var(--color-yellow); }
footer .link-footer { display: flex; flex-wrap: wrap; font-size: 14px; color: var(--color-white-drop);  }
footer .link-footer .link { display:flex; flex-wrap:wrap; padding-top:15px;  }
footer .link-footer .link span {  padding-left:10px; }
footer .link-footer .link span:first-child { padding-left:0 }
footer .link-footer .copy { margin-left:auto; }
footer .link-footer .copy span {  padding-left:10px; }
footer .link-footer .copy span:first-child { padding-left:0 }
footer .link-footer a { color: var(--color-white-drop); }
footer .link-footer a:hover { color: var(--color-white); }
footer p { font-size: 14px; color: var(--color-white-drop); }
footer p span { margin-left: 10px; padding-left: 10px; /*border-left: 1px solid #35455f*/ }
footer p.designed {  color: var(--color-white-drop); }
footer p.designed a { display: inline-flex; color: var(--color-white-drop);  }

.cookie-consent {position:fixed;bottom:20px;right:15px;left:15px;z-index:333}
.cookie-consent .box {position:relative;width:100%;max-width:1250px;margin:0 auto;display:flex;flex-wrap:wrap;font-size:14px;color: var(--color-white);align-items:center;padding:20px;background:var(--color-blue-big);border-radius:4px;box-shadow:0 1px 8px 1px rgb(12 23 83 / 20%)}
.cookie-consent .text {flex:1;padding-right:20px}
.cookie-consent .text p {margin-bottom:0; padding-bottom: 0;padding-top:0}
.cookie-consent .text p a { display:inline-block; text-decoration:underline; color:var(--color-white); }
.cookie-consent .text p a:hover { text-decoration:none; }
.cookie-consent .btn-consent {margin-left:auto;display:flex;flex-wrap:wrap}
.cookie-consent .btn-consent span {display:flex;flex-wrap:wrap;padding:10px 15px;width:150px;height:40px;font-size:14px;font-weight:500;justify-content:center;align-items:center;cursor:pointer;color:var(--color-blue);background:var(--color-yellow);border-radius:6px;transition:.3s}

/* ------------------------------------------------------------------------------------------------------------
|  Other Class  |
------------------------------------------------------------------------------------------------------------ */

.search-filter { position: relative; width: 100%; padding: 20px 0;  }
.search-filter ul { display: flex; flex-wrap:  wrap; margin: 0 -20px; }
.search-filter ul li { position: relative; display: flex; align-items: center; padding: 5px 20px; text-transform: uppercase; }
.search-filter ul li h5 { line-height: 1; padding: 0; font-size:14px; font-weight:600 }
.search-filter .select-now { position: relative; padding-left: 10px; flex: 1; color: var(--color-sky); }
.search-filter .select-now input[type="button"], .search-filter .select-now input[type="submit"] { position: absolute; right: 5px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; width: 24px; height: 24px; min-width: 24px; max-width: 24px; background:  url(../images/icon-search.svg) no-repeat center; background-size: 80%; }
.search-filter .select-now input[type="text"] { width: 100%;  font-size: 16px; }
.search-filter select { min-width: 200px; text-transform: uppercase; font-size: 14px;  }
.search-filter select option { font-family: Arial, Helvetica, sans-serif; font-size: 14px; padding: 5px; }

.fillter-course { position:relative; width:100%; flex:1; height: 40px; padding: 6px 30px 6px 10px; margin-left: 10px; text-transform: none; border-radius: 8px; border: 1px solid var(--color-miniblue-border);; }
.click-fillter-course:before { content: ''; position: absolute; width: 100%; height: 1px; bottom: 0; left: 0; background: var(--color-white); z-index: 2;  }
.fillter-course .box span { position:relative; display:block; padding: 1px 0 0 0; cursor:pointer; color: var(--color-black); -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0.s ease; transition: all 0.s ease; }
.fillter-course .box span:hover:before { content:''; position:absolute; width:100%; height:1px; background:var(--color-white); bottom:-1px; left:0; z-index:2;   -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; transition: all 0s ease;}
.fillter-course .box span:hover { color:var(--color-blue); -webkit-transition: all 0s ease; -moz-transition: all 0s ease; -o-transition: all 0s ease; transition: all 0s ease; }
.fillter-course .icon-arrow-down { position: absolute; width: 18px; height:18px; right: -28px; top: 0; margin-top: auto; margin-bottom: auto; background: url(../images/icon-select.svg) no-repeat 0px 4px; }
/*.fillter-course:hover > .subfillter { visibility: visible; opacity: 1;  }*/
.subfillter { display: none; position:absolute; max-width: auto; width: 100%; min-width: max-content;  padding:15px; margin-top: -1px; top: 100%; left: -1px; z-index:1; background:var(--color-white); border:1px solid var(--color-miniblue-border);; border-radius: 0 4px 4px 4px; box-shadow: 0 2px 3px rgb(0 0 0 / 15%)  }
.subfillter .multi { display:block; padding:4px 0; }
.subfillter .multi span { position: relative; display: block; min-width: 290px; width: auto; vertical-align: middle;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; height:16px; padding:0 0 0 22px; font-size: 14px; border:none !important; cursor: pointer; }
.subfillter .multi span:before { content: ''; position: absolute; width: 15px; height: 15px; background: url(../images/icon-select-fillter.png) no-repeat left 0px !important; left: 0; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
.subfillter .multi span:hover:before { background: url(../images/icon-select-fillter.png) no-repeat left -16px !important  }
.subfillter .multi span:hover { color: var(--color-blue); }
.subfillter .multi span.current:before { background: url(../images/icon-select-fillter.png) no-repeat left -32px !important; }
.subfillter .selected span,.subfillter .selected span:hover { background: url(../images/icon-select-fillter.png) no-repeat left -30px !important; }
.subfillter .clear-multi { padding-bottom:0; }
.subfillter .clear-multi span { display: block; width: 100%; padding:5px; font-size: 14px; text-align:center; border:none !important; background:#edf1f7; border-radius: 3px; cursor: pointer; }
.subfillter .clear-multi span:hover { color: var(--color-white); background: var(--color-blue) }

.content { display: flex; flex-wrap: wrap; margin: 0 -30px; }
.content-box-50 {  width: 50%; padding: 0 30px; }
.align-items-center { align-items: center; }

.distance { padding: 25px 0 15px 0; }

.owl-nav { position: absolute; width: 100%; top: 0; bottom: 0; margin-top: auto !important; margin-bottom: auto; z-index: -1; }
.owl-nav .owl-prev { position: absolute; left: -40px; top: 0; bottom: 0; margin-top: auto !important; margin-bottom: auto !important; }
.icon-Previous { display: block; width: 100%; height: 100%; background: url(../images/icon-arrow-back-white.svg) no-repeat center; background-size: 90%;  }
.owl-nav .owl-next { position: absolute; right: -40px; top: 0; bottom: 0; margin-top: auto !important; margin-bottom: auto !important; }
.icon-Next { display: block; width: 100%; height: 100%; background: url(../images/icon-arrow-next-white.svg) no-repeat center; background-size: 90%; }

.title { position: relative; width: 100%; font-weight: 500; color:var(--color-blue); border-bottom:1px solid var(--color-miniblue-border); }
.title:after { content:''; position:absolute; width: 40px; height:3px; background:var(--color-yellow); left:0; bottom: 1px }
/*.title:first-letter { font-weight: 600; color: var(--color-yellow); }*/
.title span { position: relative; font-weight: 500; color: var(--color-yellow); }

.viewall { position: absolute; right: 15px; top: 30px; display: flex; align-items: center; }
.viewall span { position: relative; }
.viewall span a { text-transform: uppercase; font-size: 14px; font-weight: 400; line-height: 0; }
.viewall span a:hover { color: var(--color-sky) }
/*.viewall span:hover:before { width: 40px; -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; }
.viewall span:before { content: ''; position: absolute; width: 10px; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 1px; left: -60px; background: var(--color-blue); -webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; -o-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 1; }
.viewall span:after { content: ''; position: absolute; width: 40px; height: 1px; top: 0; bottom: 0; margin-top: auto; margin-bottom: 1px; left: -60px; background: var(--color-blue) }
*/
.num-photo { position: absolute; display: flex; justify-content: center; align-items: center; padding: 0; width: 26px; height: 26px; top: 10px; right: 10px; font-weight: 300; color: var(--color-white); font-size: 12px; background: rgb(0,0,0,0.5); z-index: 9; border-radius: 50% }
.play-vdo { position: absolute; display: flex; justify-content: center; align-items: center; padding: 0; width: 60px; height: 60px; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background: rgb(0 82 218 / 80%) url(../images/icon-play.svg) no-repeat center; background-size: 80%;  z-index: 9; border-radius: 50% }

.photo { position: relative;  width: 100%; overflow: hidden; border-radius:10px; }
.photo img { width: 100%; object-fit: cover; -webkit-transition: all 5s ease; -moz-transition: all 5s ease; -o-transition: all 5s ease; transition: all 5s ease;  }
.photo a { display: block !important; }
/*.photo a:hover img { -webkit-transform: scale(1.1); transform: scale(1.1); }
*/
.no-data { position: relative; }
.no-data:before { content: ''; position: absolute; width: 100%; height: 100%; background: rgba(255,255,255,.5); left: 0; top: 0; z-index: 1; }

.fix-gototop { position:fixed; width:30px; height:30px; bottom:0; right:5px; z-index:9; }
.fix-gototop a { display:inline-table; width:100%; height:100%; font-size: 20px; color:var(--color-white) !important; text-align:center; text-transform:uppercase; background:#333 url(../images/icon-top.png) no-repeat center center; border-radius: 50%; }
.fix-gototop a:hover { color:var(--color-white); background:#383b3d  url(../images/icon-top.png) no-repeat center center; }
.fix-gototop i { display:table-cell; vertical-align:middle; }

.top-hide { bottom:-40px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }
.top-show { bottom:10px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; }

.youtube-embed { position: relative; display: block; height: 0; padding: 0 0 56.25%; margin: 0 auto; overflow: hidden; border-radius: 10px; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4); -moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4); box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.4);  }
.youtube-embed iframe { position: absolute; display: block; max-width: 100%; width: 100%; height: 100%;  margin: 0;   top: 0; left: 0; } 

.map-window { text-align: left; }
.map-window p { position: relative; padding: 5px 0; }
.map-window p img { width: 80px; }
.map-window i { position: absolute; left: 0; top: 8px; }
.map-window span { display: block; padding-left: 20px; }

.fancybox-enabled #header-fixed { padding-right:17px; }
.fancybox-button--thumbs { display: none !important; }

.fancybox-button { background:none; min-width: inherit; }

.fix-css-fancybox {display: inline-block;position: relative;padding: 0 !important;margin: 0;border-width: 0;vertical-align: middle;text-align: left;background: none !important;overflow: auto;-webkit-box-shadow: 0px 5px 10px 0px rgba(0,10,25,0.4);-moz-box-shadow: 0px 5px 10px 0px rgba(0,10,25,0.4);box-shadow: 0px 5px 10px 0px rgba(0,10,25,0.4);box-sizing: border-box;-webkit-border-radius: 10px;-moz-border-radius: 10px;border-radius: 10px;}
.fix-css-fancybox .fancybox-close-small { min-width: 40px; width: 40px; height: 40px; padding: 4px !important; opacity: 1; border-radius:50%; background:var(--color-sky); top: 5px !important; right:5px !important; }
.fix-css-fancybox .fancybox-close-small:hover {   }
.fix-css-fancybox .fancybox-close-small svg path { fill:var(--color-white); }
.fix-css-fancybox .fancybox-close-small:hover svg path { fill:var(--color-white) }

.google-captcha { padding: 20px 0 0 0 !important; text-align: center !important; }
.google-captcha  .g-recaptcha { margin: 0 auto;  display: inline-block; }

.error { color: #ff0000; font-size: 14px; }

.text-center { text-align: center; }

.loadmore { display: flex; justify-content: center; }

/*Lazy*/
.lazy-loaded {transition: all .3s ease;opacity: 1}
img[data-src] {opacity: 0}
img.lazyloaded {opacity: 1;transition: all .3s ease}
/*Tags */
.tags-show { position: relative; width: 100%; padding: 20px 0 0 0; }
.tags-show p { color: var(--color-blue); padding-bottom: 5px; }
.tags-show a { display: inline-block; margin: 2px 0px; padding:  4px 10px; font-size: 14px; color: var(--color-blue); background: var(--color-miniblue); border: 1px solid var(--color-miniblue-border); border-radius: 8px; }
.tags-show a:hover { color: var(--color-sky) ;  border: 1px solid var(--color-blue); }

/* ------------------------------------------------------------------------------------------------------------
|  Button Style  |
------------------------------------------------------------------------------------------------------------ */
a.btn-s1  { display: inline-block; min-width: 200px; padding: 10px 10px 14px 10px; text-shadow: none;  text-transform: uppercase; text-align: center; color: var(--color-white); background: var(--color-blue);  border-radius: 3px; }
a.btn-s1:hover { background: var(--color-sky); }
a.btn-s1 span { position: relative; }

a.btn-s2 { position: relative; display: inline-block; padding-right: 20px; text-transform: uppercase; line-height:1; text-align: center; background: none;  }
a.btn-s2:before { content: ''; position: absolute; width: 20px; height: 1px; background: var(--color-white); right: -10px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }
a.btn-s2:after { content: ''; position: absolute; width: 0; height: 1px; background: #1cc7ec; right: -10px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease; }
a.btn-s2:hover:after { width: 20px; -webkit-transition: all 0.3s ease;  -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease;  transition: all 0.3s ease; }
a.btn-s2 span { position: relative; }

a.btn-link { color: var(--color-blue); }
a.btn-link:hover { color:var(--color-sky); }

a.btn-loadmore  { display: inline-block; min-width: 160px; padding: 10px; text-shadow: none; font-size: 16px; text-transform: uppercase; text-align: center; color: var(--color-blue); border: 1px solid var(--color-blue); background: var(--color-white);  border-radius: 90px; }
a.btn-loadmore:hover { color: var(--color-white); background: var(--color-blue); }
a.btn-loadmore span { position: relative; }

.btn-livescore { position: absolute; width: 200px; top: 15px; right: 0; padding: 0; display: flex; justify-content: center; }
.btn-livescore a { width: 100%; padding: 9px 5px 10px 5px; text-align: center; font-weight: 600; border-radius: 90px; color: var(--color-blue); font-size: 20px; text-transform: uppercase; background: var(--color-yellow) }
.btn-livescore a:hover { color: var(--color-white); background: var(--color-sky) }

.btn-livescore-special { position: absolute; right: 0; padding: 0 0 0 15px; display: flex; justify-content: flex-end; margin-left: auto; }
.btn-livescore-special a { display: inline-flex; align-items: center; width: auto; max-width: 390px; height: 46px; padding: 10px 30px; justify-content: center; text-align: center; border-radius: 90px; color: var(--color-white); font-size: 16px; font-weight: 500; text-transform: uppercase; background: var(--color-sky) }
.btn-livescore-special a:hover { color: var(--color-yellow);  box-shadow: 0 3px 8px 1px rgb(136 186 255 / 50%); }
.btn-livescore-special.has-two-btn { display:grid; gap: 0 15px; grid-template-columns:1fr 1fr }
.btn-livescore-special a.btn-to-scorecard { border:1px solid var(--color-sky); color:var(--color-sky); background:var(--color-miniblue); }
.btn-livescore-special a.btn-to-scorecard:hover { color:var(--color-sky) !important; }

.btn-livescore-mini { position: relative; width: 100%; max-width: 400px; display: flex; justify-content: center; }
.btn-livescore-mini a { display: block; width: 100%; padding: 12px 20px; text-align: center; justify-content: center; border-radius: 90px; color: var(--color-white);border:1px solid var(--color-sky);  font-size: 16px; font-weight: 500; text-transform: uppercase; background: var(--color-sky) }
.btn-livescore-mini a:hover { color: var(--color-yellow) !important;  box-shadow: 0 3px 8px 1px rgb(136 186 255 / 50%);  }
.btn-livescore-mini.has-two-btn { display:grid; gap: 0 15px; grid-template-columns:1fr 1fr }
.btn-livescore-mini a.btn-to-scorecard { border:1px solid var(--color-sky); color:var(--color-sky); background:var(--color-miniblue); }
.btn-livescore-mini a.btn-to-scorecard:hover {  color:var(--color-sky) !important; }

.fix-live { left: 266px; }

.btn-tablescore { margin: 0 auto; padding: 0 0 15px 0; display: flex; justify-content: center; }
.btn-tablescore a { width: 100%; padding: 10px 10px 14px 10px; text-align: center; border-radius: 3px; color: var(--color-white); font-size: 24px; background: var(--color-sky) }
.btn-tablescore a:hover { background: var(--color-sky) }

.btn-s1 a { display: inline-block; min-width: 200px; padding: 15px 0; text-transform: uppercase; font-weight: 500; line-height:1; text-align: center; color: var(--color-black); background: var(--color-white); border: 1px solid #0071bc; }
.btn-s1 a:hover { color: var(--color-white); background: #0071bc  }
.btn-s1 a span { position: relative; }

.btn-s11 a { display: table; width: 100%; height: 100%; padding: 15px; text-transform: uppercase; font-weight: 500; line-height:1; text-align: center; color: var(--color-black); background: var(--color-white); border: 1px solid var(--color-black); }
.btn-s11 a:hover { color: var(--color-white);  }
.btn-s11 a:before { content: ''; position: absolute; width: 0; height: 100%; background: var(--color-black); left: 0; top: 0; z-index: 0; -webkit-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1) ;
    -moz-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all .7s cubic-bezier(0.19, 1, 0.22, 1); }
.btn-s11 a:hover:before { width: 100%; -webkit-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1) ;
    -moz-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    -o-transition: all .7s cubic-bezier(0.19, 1, 0.22, 1);
    transition: all .7s cubic-bezier(0.19, 1, 0.22, 1); }
.btn-s11 a span { position: relative; display: table-cell; vertical-align: middle; }

.btn-s2 a { display: inline-block; width: 100%; max-width: 280px; min-width: inherit; padding: 20px 0; font-size: 16px; text-transform: uppercase; font-weight: 500; line-height: 1; text-align: center; color: var(--color-white); background: #0089eb;  }
.btn-s2 a:hover { color: var(--color-white); background: #1946ba; }

.btn-s3 a { display: block; width: 100%; padding: 5px  10px; color: #3a3d45 ; font-size: 16px; text-align: center; background: none; border: 1px solid #919399;  border-radius: 3px; }
.btn-s3 a:hover { color:var(--color-white); background: #3a3d45; border: 1px solid #3a3d45; }

.btn-s4 { padding-bottom: 60px; }
.btn-s4 a { display:inline-block; position: relative; width: auto; height: 40px; padding:7px 20px; color: var(--color-white) !important; text-align: center; background: #ceb071;  border-radius: 3px; }
.btn-s4 a:hover { color: var(--color-white); background: #b58e3e; }

.btn-s4 a span::before { content: attr(data-text-open); display: block; }
.btn-s4 a span::after { content: attr(data-text-close); display: none; }
.btn-s4 a.on span::before { content: attr(data-text-open); display: none; }
.btn-s4 a.on span::after { content: attr(data-text-close); display: block; }

.link-more { position: absolute; width: 90px; height: 34px; right: 15px; top: 0; bottom: 0; margin-top: auto; margin-bottom: auto; }

.but-more-all { position: relative; width: 200px; margin: 0 auto; text-align: center; }

.loading-ajax { position: absolute; width: 100%; text-align: center; left: 0; right: 0; }
.loading-ajax img { display: inline-block; width: 20px; height: 20px; } 

.ui-loader { display:none !important; visibility:hidden !important; }

.blockPage { width: 260px !important; left: 0 !important; right: 0 !important; border:none !important; background:none !important; margin: 0 auto !important;  }
.blockPage .waiting { width: 260px; padding: 15px;
    text-align: center; 
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: var(--color-white);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    -webkit-box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.35);
    -moz-box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.35);
    box-shadow: 0px 10px 25px 0px rgba(0,0,0,0.35); }
.blockPage .waiting img { display: inline-block; padding: 10px 0; }

.animated {
  animation-duration: 1s;
  animation-fill-mode: both;

}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -30%, 0);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.fadeInDown {
  animation-name: fadeInDown;
}

/*Easy Tabs*/

dl.resp-tabs-list {
  margin: 0px;
  padding: 15px 0 0 0;
  display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;  flex-wrap:wrap;  align-content: flex-start; justify-content: center;
  position: relative; z-index: 9;
}
.resp-tabs-list dt {
    display: flex; align-items: center; justify-content: center; position: relative;
  padding: 0;
  margin: 0;
  list-style: none;
  cursor: pointer;
   text-align: center;
  width: 33.3333%;
  font-weight:500; text-transform:uppercase;  transition: all 0.3s ease;

border-top-left-radius: 8px;
border-top-right-radius: 8px;
}
.resp-tabs-list dt span { padding: 8px 10px; color: var(--color-black); font-weight: 400;  transition: all 0.3s ease;   -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
     -khtml-user-select: none; /* Konqueror HTML */
       -moz-user-select: none; /* Old versions of Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently */  }
.resp-tab-active:before { content:''; position:absolute; width: 100%; height:3px; background:var(--color-sky); left: 0; bottom: -2px; z-index: 1; }

.resp-tabs-list dt:hover { background:none;  transition: all 0.3s ease }
.resp-tabs-list dt:hover span { color: var(--color-sky) ;  transition: all 0.3s ease }

.resp-tab-active span { color: var(--color-sky) !important;  transition: all 0.3s ease }
.resp-tab-active dt:hover span { color: var(--color-sky) !important; }


.resp-tab-active:hover { background: none !important; }

.resp-tabs-container {
  padding: 0px;
/*  background-color: var(--color-white);*/
  clear: left;
}

div.resp-accordion {
  cursor: pointer;
  padding: 5px;
  display: none;
}

.resp-tab-content {
  display: none;
  /*padding:15px 15px 10px 15px;*/
}

.resp-tab-active {
  border-bottom: none;

}

.resp-content-active,
.resp-accordion-active { display: block; }
.resp-tab-content { border-top: 1px solid var(--color-miniblue-border); }
.resp-tab-content p { padding-bottom: 0; }
.resp-tab-content dl dt { position: relative; padding: 15px 0 0 20px; }
.resp-tab-content dl dt:before { content: ''; position: absolute; width: 6px; height: 6px; left: 5px; top: 24px; border-radius: 50%; background: var(--color-grayblue); }

div.resp-accordion {
  border: 1px solid #eee;
  border-top: 0px solid #d70a0a;
  margin: 0px;
  padding: 10px 15px;
  font-size:19px;
}

div.resp-tab-active {
  border-bottom: 0px solid #eee !important;
  margin-bottom: 0px !important;
  padding: 10px 15px !important;
}

div.resp-tab-title:last-child {
  border-bottom: 12px solid #eee !important;
  background: blue;
}

/*-----------Vertical tabs-----------*/

.resp-vtabs dl.resp-tabs-list {
  float: left;
  width: 30%;
}

.resp-vtabs .resp-tabs-list dt {
  display: block;
  padding: 15px 15px !important;
  margin: 0;
  cursor: pointer;
  float: none;
}

.resp-vtabs .resp-tabs-container {
  padding: 0px;
  background-color: var(--color-white);
  border: 1px solid #eee;
  float: left;
  width: 68%;
  min-height: 250px;
  border-radius: 4px;
  clear: none;
}

.resp-vtabs .resp-tab-content { border: none; }

.resp-vtabs dt.resp-tab-active {
  border: 1px solid #ddd;
  border-right: none;
  background-color: var(--color-white);
  position: relative;
  z-index: 1;
  margin-right: -1px !important;
  padding: 14px 15px 15px 14px !important;
}

.resp-arrow {
  width: 0;
  height: 0;
  float: right;
  margin-top: 10px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-top: 8px solid #ccc;
}

div.resp-tab-active span.resp-arrow {
  border: none;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 8px solid var(--color-grayblue);
}

/*-----------Accordion styles-----------*/

div.resp-tab-active { background: #333 !important; }

.resp-easy-accordion div.resp-accordion { display: block; }
.resp-easy-accordion .resp-tab-content { border: 1px solid #eee; }
.resp-easy-accordion .resp-tab-content:last-child { border-bottom: 1px solid #eee !important; }
.resp-jfit {
  width: 100%;
  margin: 0px;
}

.resp-tab-content-active { display: block; }

div.resp-accordion:first-child { border-top: 1px solid var(--color-miniblue-border) !important; }

.mt-0 { margin-top:0 !important; }
.mb-60 { margin-bottom:60px !important }

.pl-10 { padding-left:10px !important; }
.pl-15 { padding-left:15px !important; }
.pl-20 { padding-left:20px !important; }
.pl-30 { padding-left:30px !important; }
.pl-35 { padding-left:35px !important; }
.pl-40 { padding-left:40px !important; }

dl.resp-tabs-list { font-size:14px !important }
.horizontalTab .dt-1 dt { width: 100% !important;  }
.horizontalTab .dt-2 dt { width: 50% !important;  }
.horizontalTab .dt-3 dt { width: 33.3333% !important;  }
.horizontalTab .dt-4 dt { width: 25% !important;  }
.horizontalTab .dt-5 dt { width: 20% !important;  }
.horizontalTab .dt-6 dt { width: 16.6666% !important;  }
.horizontalTab .dt-7 dt { width: 14.2857% !important;  }

/* ------------------------------------------------------------------------------------------------------------
|  Enjoy  |
------------------------------------------------------------------------------------------------------------ */