/* --------------------------------------------- */
/* ~~~~~~~~~~~~~~~ CSS Document ~~~~~~~~~~~~~~~~*/
/* ------------------------------------------- */
/* ~~~~~~~~~~~~~ Coded by  Vepster ~~~~~~~~~~ */
/* ----------------------------------------- */
/* ~~~~~~~~~~~~~~~~~~ TT ~~~~~~~~~~~~~~~~~~~*/
/* --------------------------------------- */
:root {
	/* primary colors */
	--vp_color_green: #65AD43;
	--vp_color_green_btn: #92C47B;
	--vp_color_body: #F6F6F6;
	--vp_color_nav_head: #101214;
	--vp_color_nav_mob: #899492;
	--vp_font: #000000;
	--vp-input-border: #e7e7e7;
	--vp-red-alert: #df4452;
	--vp_color_gray: #D9D9D9;
	--vp_color_white: #FCFCFC;
	--vp_color_purple_45: #A89FA8;
}
body { background-color:var(--vp_color_body); }
main button { outline:none; background-color:inherit; }
footer { font-size:0.9em; margin: 0 auto; text-align:center; }
#footer { margin-top:50px; margin-bottom:34px; }
#footer img { width:50px; height: 50px; opacity:35%; }
#footer img:hover { transition: .5s; opacity:100%; }
#lower-header .nav-size-1 { font-size:1em; }
#lower-header .nav-size-2 { font-size:1em; }
#upper-header { font-size: 1.8em; border-bottom:2px solid var(--vp_color_green); }
#upper-header span { color:var(--vp_color_green); }
#upper-header button { padding: 0.3em 4em; border: 2px solid var(--vp_color_green_btn); font-size:1em; }
#upper-header button:hover, #lower-header a:hover, #vp-slider .slider-dark .dark-content button:hover { transition:.3s; cursor:pointer; background-color:var(--vp_color_green_btn); color:#fff; }
#lower-header a { width: 100%; text-align: center;}
#lower-header button { padding: 12px 12px 26px 12px; width:100%; height:100%; }
#lower-header button:hover { cursor:pointer; }
#vp-slider { position:relative; width:100%; height: 450px; overflow:hidden; }
#vp-slider .slider-img img { max-width:100%; }
#vp-slider .slider-dark .dark-bg { background-color:#000; opacity:37%; width:50%; height: 100%; position:absolute; }
#vp-slider .slider-dark .dark-content { position:absolute; color:#fff; width:50%; padding:24px; box-sizing:border-box; bottom:5%; }
#vp-slider .slider-dark .dark-content .dark-txt h1 { font-size:2.8em; }
#vp-slider .slider-dark .dark-content a { width:100%; text-align:center; }
#vp-slider .slider-dark .dark-content button { font-size:1.5em; padding:12px; width:100%; border:2px solid var(--vp_color_green_btn); }
.sub-item-1, .sub-item-2 { position:relative; }
.sub-item-1, .sub-item-2 { border-top:6px solid var(--vp_color_green); }
.sub-item-1 { width:380px; }
.sub-item-2 { width: 804px; }
#sub-menu button { padding:12px; font-size:1em; border:2px solid var(--vp_color_green_btn); width:100%; }
#sub-menu a:hover button { transition:.3s; background-color:var(--vp_color_green_btn); color:#fff; }
#sub-menu button:hover { cursor:pointer; }
.slider {display: flex;transition: transform 0.9s ease-in-out;height: 100%;}
.slide {min-width: 100%;box-sizing: border-box;}
.sub-title { background-color:rgb(0 0 0 / 59%); color:#fff; text-align:center; position:absolute; width:100%; padding:12px; box-sizing:border-box; }
.sub-title h2 { font-size:1.2em; padding:0px; margin:0px; }
#partner-title h3 { font-size:1.8em; text-align:center; margin-top:66px; }
#partner-list div { width:25%; padding:16px; box-sizing:border-box; }
#partner-list div img { width:100%; filter:grayscale(100%); opacity:65%; }
#partner-list div img:hover { transition: .3s; filter:unset; opacity:100%; }
.register-form label { font-size:.9em; padding:8px 0px; }
.register-form input, .register-form textarea { outline:none; text-decoration:none; padding:16px; font-size:14px; border:1px solid var(--vp-input-border);}
.register-form textarea { resize:none; min-height:180px; }
.register-form input:hover, .register-form textarea:hover { transition:.3s; border:1px solid rgb(77 205 11 / 24%); }
.register-form button { width:100%; padding:24px; font-size:1.3em; background-color:var(--vp_color_green_btn); color:#fff;  }
.register-form button:hover { transition:.3s; cursor:pointer; background-color:var(--vp_color_green); }
#form-msg { text-align:center; padding:12px; color:#fff; display:none; }
.form-color-grn { background-color:var(--vp_color_green_btn); }
.form-color-red { background-color:var(--vp-red-alert); }
#mob-main-nav { display:none; caret-color:transparent; }
.menubar-ico { background-image: url(../menubar.svg); }
.menubar-ico { background-repeat: no-repeat; background-position: center; background-size: contain; }
.ico-30 { width:30px; height:30px; }
#mob-ttlogo img { padding:5px; background-color:#fff; border-radius:50px; }
#vp-primary-btn a:hover, #mob-main-nav a:hover, #mob-main-nav .primary-nav-item-burg:hover {transition: .3s;cursor: pointer;background-color: var(--vp_color_green);color: var(--vp_color_white);}
.primary-nav-text {font-size: 14px;}
#mob-main-nav .primary-nav-item-burg {width: 100%;padding: 10px;}
#mob-main-nav a:hover .ico-30, #mob-main-nav .primary-nav-item-burg:hover .ico-30 {filter: brightness(0) invert(1);}
#mob-footer { width:100%; background-color:var(--vp_color_gray); position:fixed; bottom:0px; width:100%; z-index: 90; caret-color: transparent;}
#mob-nav-system { position:fixed; width:100%; height: 100%; display:none; justify-content:space-between; z-index: 12;caret-color: transparent;}
#mob-nav-closer { width:35%; background-color:var(--vp_color_green); opacity:75%; }
#mob-nav-vert { padding-bottom:100px; }
#mob-nav-options {overflow: auto;max-height: 100vh;padding-top: 20px;background-color: var(--vp_color_gray);text-align: center;}
#mob-nav-options, #mob-filter-options-box {width: 65%;}
#mob-nav-options #mob-nav-vert { margin-top:24px; }
#mob-nav-options #mob-nav-vert div {width: 100%;padding: 14px 16px;font-size: 17px;box-sizing: border-box;}
#mob-nav-options #mob-nav-vert div:hover { transition:.3s; cursor:pointer; color:#fff; background-color:var(--vp_color_green_btn); }
@media(max-width:1250px){
#vp-slider { height:auto; }
main { width:100%; padding-left:12px; padding-right:12px; box-sizing:border-box; }
#vp-slider .slider-dark .dark-bg { height:calc(100% - 7px); }
#vp-slider .slider-dark .dark-content .dark-txt h1 { font-size:2.3em; }
#header { overflow:hidden; height:136px; }
#lower-header {  width: 100%; white-space: nowrap;overflow-x: scroll;overflow-y: hidden; -webkit-overflow-scrolling: touch; }
.sub-item-1 img, .sub-item-2 img, .sub-item-1, .sub-item-2 { width: 100%; }
}
@media(max-width:1090px){
#header { height:130px; }	
}
@media(max-width:950px){
#vp-slider .slider-dark .dark-content .dark-txt h1 { font-size:1.9em; }
#vp-slider .slider-dark .dark-content button { font-size:1.3em; }
}
@media(max-width:850px){
#mob-main-nav { display:flex; }
}
@media(max-width:750px){
#vp-slider .slider-dark .dark-content .dark-txt h1 { font-size:1.5em; }
#vp-slider .slider-dark .dark-content button { font-size:1em; }
#upper-header { font-size:1.5em; }
}
@media(max-width:650px){
.sub-title h2 { font-size:0.9em; font-weight:100; }
#vp-slider .slider-dark .dark-bg, #vp-slider .slider-dark .dark-content { width:100%; }
#vp-slider .slider-dark .dark-content .dark-txt h1 { font-size:1.3em; font-weight:100; padding:0px; margin:0px; }
#upper-header button { display:none; }
#upper-header { font-size:2em; flex-direction:column; align-items:center; }
}
@media(max-width:550px){
#sub-menu .sub-row { flex-wrap:wrap; justify-content:center; }
#sub-menu .sub-row a:not(:first-child) { margin-top:12px; }
}
@media(max-width:400px){
#vp-slider .slider-dark .dark-content .dark-txt h1 { display:none; }
}