html {-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none;text-size-adjust: none;/*scrollbar-gutter: stable;*/scrollbar-gutter: stable both-edges;overflow-x: hidden;position: relative;touch-action: pan-y; -webkit-overflow-scrolling: touch;}
::-webkit-scrollbar { width: 0px; background: transparent;}
header { position: fixed; top: 0; left: 0; width: 100%; z-index: 100; transition: all .25s ease; }
main { position: relative; z-index: 2; background-color: white;}
footer { position: relative; z-index: 2; background-color: #dcdcdc;}
subfooter { position: relative; z-index: 2; background-color: #0f3146;display: block;}
.footer-row { height: 56px; background: #fff; width: 100%; display: flex; justify-content: center; align-items: center; }
body { background: url('img/parallax-2.webp') no-repeat; /*background-size: cover;*/ background-attachment: fixed; margin: 0; padding: 0; color: rgb(34, 34, 34);font-family: 'Poppins', sans-serif;font-size: 16px;font-weight: 400;line-height: 24px;background-color: #17466e; overflow-x: hidden;width: 100vw;position: relative;touch-action: pan-y;-webkit-overflow-scrolling: touch;}
/* Custom modal size at different breakpoints */
@media (min-width: 0px) { .modalform {width: 85vw;height: 300px;} .body-bg { background-size: 650px;background-position: calc(50% + 38px) 70px; } .logo-h { height: 130px; } .logo-h { height: 130px; } .topup-size {width:45px; height:45px; right:20px; bottom:20px;}.flyyboxi {position: relative;margin-bottom: 20px !important;} .flybh { min-height: 220px; } }
@media (min-width: 612px) { .modalform {width: 85vw;height: 300px;} .body-bg { background-size: 950px;background-position: calc(50% + 20px) 10px;/*calc(50% - 50px) -40px*/ } .logo-h { height: 130px; } .topup-size {width:45px; height:45px; right:20px; bottom:20px;}.flyyboxi { position: relative;margin-bottom: 20px !important; } .flybh { min-height: 230px; } }
@media (min-width: 768px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1200px;background-position: calc(50% + 40px) -20px;/*center top*/ } .logo-h { height: 130px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 200px; } }
@media (min-width: 880px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1350px;background-position: calc(50% + 20px) -30px;/*center top*/ } .logo-h { height: 130px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 200px; } }
@media (min-width: 992px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1440px;background-position: calc(50% + 0px) -40px; } .logo-h { height: 73px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 200px; } }
@media (min-width: 1100px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1440px;background-position: calc(50% + 0px) -40px; } .logo-h { height: 73px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 230px; } }
@media (min-width: 1470px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1440px;background-position: calc(50% + 0px) -40px; } .logo-h { height: 73px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 230px; } }
@media (min-width: 1700px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1440px;background-position: calc(50% + 0px) -40px; } .logo-h { height: 73px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 230px; } }
@media (min-width: 1880px) { .modalform {width: 580px;height: 300px;} .body-bg { background-size: 1440px;background-position: calc(50% + 0px) -40px; } .logo-h { height: 73px; } .topup-size {width:55px; height:55px; right:30px; bottom:30px;}.flyyboxi { position: relative; max-height: 310px; } .flybh { min-height: 230px; } }
@media (min-width:0px){
#onas{scroll-margin-top:140px;}
#sluzby{scroll-margin-top:120px;}
#reference{scroll-margin-top:135px;}
#kontakt{scroll-margin-top:135px;}
#last-gallery-row{scroll-margin-top:130px;}
}
@media (min-width:768px){
#onas{scroll-margin-top:70px;}
#sluzby{scroll-margin-top:56px;}
#reference{scroll-margin-top:70px;}
#kontakt{scroll-margin-top:70px;}
#last-gallery-row{scroll-margin-top:70px;}
}
/* ========================== DESIGN SHARED ====================== */
.max-w{max-width:1170px;}
.justify { text-align: justify; }
.basic-txt {font-size: calc(14px + (17 - 14) * ((100vw - 400px) / (2650 - 400)));font-weight:400;color: #5a6a81; text-decoration: none;transition: color 0.3s ease;line-height: 1.5;letter-spacing: 0.1px;}
.ref-txt {font-size: calc(13.6px + (15.2 - 13.6) * ((100vw - 400px) / (2650 - 400)));font-weight:400;color: #5a6a81; text-decoration: none;transition: color 0.3s ease;line-height: 1.5;letter-spacing: 0.1px;}
@media (min-width:2650px){ .basic-txt { font-size: 17px; } }
.lh-ul {line-height: calc(22px + (28.5 - 22) * ((100vw - 400px) / (2650 - 400))) !important;}
@media (min-width:2650px){ .lh-ul { line-height: 28.5px !important; } }
/* ========================== MENU + LOGO ====================== */
.logo-bg { background: white !important; height: 130px; }
.logo-bg-scroll { background: rgba(255,255,255,0.95) !important; border-bottom: 1px solid #c2c2c2; }
.logo-header { width:100%; display: inline-block; max-width: 380px; vertical-align: middle; }
.logo-max { max-height: 65px }
@media (min-width:0px){ .logo-max-min { max-height: 65px; } }
@media (min-width:992px){ .logo-max-min { max-height: 55px; } }
/* top menu ---------- */
.ul { margin: 0; padding: 0; list-style: none; }
.uli { margin:0; position: relative; list-style: none; padding: 0; display: inline-block; }
.ulix { margin:0; position: relative; list-style: none; padding: 0; display: inline-block; }
.ulix a {font-size:calc(13.5px + (17 - 13.5) * ((100vw - 400px) / (2650 - 400))); font-weight:800;padding: 0px 0px 0px;text-transform:uppercase;border-bottom: 1px solid transparent;color: #008bc1; text-decoration: none;transition: all 0.3s ease-in-out;letter-spacing: 0.2px; }
.uli a {font-size:calc(13.5px + (17 - 13.5) * ((100vw - 400px) / (2650 - 400))); font-weight:400;padding: 0px 0px 0px;text-transform:uppercase;border-bottom: 1px solid transparent; text-decoration: none;transition: all 0.3s ease-in-out;letter-spacing: 0.2px;color: #5a6a81; }
.uli a:hover { font-weight:800;color: #008bc1; background-color: transparent; /*border-bottom:1px solid #e9e9e9;*/ }
@media (min-width:2650px){ .uli a, .ulix a { font-size: 17px; } }
/* ========================== HERO ====================== */
.head-h1-ico { font-size: 125px; font-weight: 700; color: rgb(253, 147, 16);}
.head-h1-icox { font-size: 60px; font-weight: 700; color: rgb(253, 147, 16);}
.head-h1-icoxy { font-size: 95px; font-weight: 700; color: rgb(253, 147, 16);}
.b-head-h1-ico { font-size: 125px; font-weight: 700; color: #61e7fd;margin-top: -55px;}
.b-head-h1-icox { font-size: clamp(3rem, 11vw, 3.7rem); font-weight: 700; color: #61e7fd;margin-top: -35px;}
.b-head-h1-icoxy { font-size: 95px; font-weight: 700; color: #61e7fd;margin-top: -55px;}
.head-h1-left { font-size: 50px; font-weight: 700; margin-bottom: 14px; color: #fff; font-family: 'Inter', sans-serif;line-height: 1.2;letter-spacing: 2px;white-space: nowrap;text-align: left;width: 100%;text-transform:uppercase;}
.head-h1-leftxy { font-size: 38px; font-weight: 700; margin-bottom: 14px; color: #fff; font-family: 'Inter', sans-serif;line-height: 1.1;letter-spacing: 2px;white-space: nowrap;text-align: left;width: 100%;text-transform:uppercase;}
.head-h1-leftx { font-size:calc(23px + (33 - 23) * ((100vw - 400px) / (800 - 400))); /*clamp(1.4rem, 4.3vw, 2.2rem)*/; font-weight: 700; margin-bottom: 14px; color: #fff; font-family: 'Inter', sans-serif;line-height: 1.2;letter-spacing: 0.7px;white-space: nowrap;text-align: left;width: 100%;text-transform:uppercase;}
@media (min-width:800px){ .head-h1-leftx { font-size: 33px; } }
.h1-txt {font-family: 'Inter', sans-serif; font-size: 19px; font-weight: 300; color: #fff; text-decoration: none; transition: all 0.3s ease-in-out; line-height: 28px; letter-spacing: 0.1px; width: 650px;}
.h1-txtx {font-family: 'Inter', sans-serif; font-size: 18px; font-weight: 300; color: #fff; text-decoration: none; transition: all 0.3s ease-in-out; line-height: 28px; letter-spacing: 0.1px; width: 500px;}
.h1-txtxy {font-size:calc(13px + (16.5 - 13) * ((100vw - 400px) / (800 - 400))); /*clamp(0.95rem, 2.2vw, 1.08rem)*/font-family: 'Inter', sans-serif; font-weight: 300; color: #fff; text-decoration: none; transition: all 0.3s ease-in-out; line-height: 1.5; letter-spacing: 0.1px; width: 400px;}
@media (min-width:800px){ .h1-txtxy { font-size: 16.5px; } }
.a-dot {font-size:calc(12px + (16 - 12) * ((100vw - 400px) / (800 - 400))); /*clamp(0.95rem, 2.2vw, 1.08rem)*/margin-left: 6px; color: #10406b;}
.b-dot {font-size:calc(12px + (16 - 12) * ((100vw - 400px) / (800 - 400))); margin-left: 6px; color: #ff9a03;}
.c-dot {font-size:calc(12px + (16 - 12) * ((100vw - 400px) / (800 - 400))); margin-left: 2px; color: #009ee0;}
@media (min-width:800px){ .a-dot,.b-dot,.c-dot { font-size: 16px; } }
/* buttons ---------- */
.hs-btns {font-size: calc(13px + (18 - 13) * ((100vw - 400px) / (2650 - 400)));position: relative !important;z-index: 99 !important; display: inline-block;font-weight: 400;outline: none;border: none;border-color: #00b4ff !important; color: white !important; line-height: 1; background-color: #1c91e9 !important; background-image: linear-gradient(to bottom right, #137dbb, #1c91e9) !important; cursor: pointer; transition: background-color 0.3s ease; text-transform: uppercase; letter-spacing: 1px; padding: 12px 26px; text-decoration: none; font-family: "Archivo Narrow", sans-serif;}
.hs-btns:hover{background-color: #0a99ed !important; background-image: linear-gradient(to bottom right, #0a99ed, #389cd7) !important;}
.hollow-btns {font-size: calc(13px + (18 - 13) * ((100vw - 400px) / (2650 - 400)));position: relative !important;z-index: 99 !important; display: inline-block;font-weight: 400;outline: none;border: 2px solid #83b4d3 !important; color: white !important; line-height: 1; background-color:rgba(255,255,255,0); cursor: pointer; transition: background-color 0.3s ease; text-transform: uppercase; letter-spacing: 1px; padding: 10px 26px; text-decoration: none; font-family: "Archivo Narrow", sans-serif;}
.hollow-btns:hover{background-color:rgba(255,255,255,0) !important; border: 2px solid #abcee5 !important;}
@media (min-width:2650px){ .hs-btns, .hollow-btns { font-size: 18px; } }
/* ========================== OBSAH + TEXTY A HEADERY ====================== */
.head-h2 { font-size: calc(25px + (37.5 - 25) * ((100vw - 400px) / (2650 - 400))); font-weight: 700;color: #10496b; text-decoration: none; transition: color 0.3s ease; line-height: 1.2; }
@media (min-width:2650px){ .head-h2-proc { font-size: 37.5px; } }
.head-h3-proc {font-size: calc(22px + (29 - 22) * ((100vw - 400px) / (2650 - 400))); font-weight:600;text-decoration: none;transition: color 0.3s ease;line-height: 28px;white-space: nowrap;font-family: "Archivo Narrow", sans-serif;color: #375464;}
@media (min-width:2650px){ .head-h3-proc { font-size: 29px; } }
.head-h3 {font-size: calc(23px + (29 - 23) * ((100vw - 400px) / (2650 - 400))); font-weight:600;color: #008bc1; text-decoration: none;transition: color 0.3s ease;line-height: 28px;white-space: nowrap;font-family: "Archivo Narrow", sans-serif;}
@media (min-width:2650px){ .head-h3 { font-size: 29px; } }
.head-h4 {font-size: calc(19px + (21 - 19) * ((100vw - 400px) / (2650 - 400))); font-weight: 500; color: #008bc1; text-decoration: none; transition: color 0.3s ease; line-height: 1.2; font-family: "Archivo Narrow", sans-serif;margin-bottom: 5px !important;}
@media (min-width:2650px){ .head-h4 { font-size: 21px; } }
.box-ref {background-color: white; transition: background-color 0.3s ease;}
.cv-bg {background-color: white; transition: background-color 0.3s ease;}
/* ========================== FORM CONTACT ====================== */
.ico-call { font-size: 1.5em; color: #00c597; }
.head-call {font-size: calc(24px + (30 - 24) * ((100vw - 400px) / (2650 - 400)));text-transform: uppercase;font-weight: 400;line-height: 1.2;color: #0b6093;white-space: nowrap;}
@media (min-width:2650px){ .head-call { font-size: 30px; } }
.star-input {color: #f00; }
.text-input { }
.text-input-area { }
.form_honey { position: absolute; left: -9999px;}
.head-input {font-size: calc(16px + (18 - 16) * ((100vw - 400px) / (2650 - 400)));margin-bottom: 5px;font-weight: 700;color: #0b6093; display: block;line-height: 1.45;}
@media (min-width:2650px){ .head-input { font-size: 18px; } }
.text-input {font-size: calc(16px + (18 - 16) * ((100vw - 400px) / (2650 - 400)));background: #ffffff;color: #174889;font-weight: 300;outline: none;border: none;border-bottom: 1px solid #c2c2c2; height:48px; }
@media (min-width:2650px){ .text-input { font-size: 18px; } }
.text-input-area {font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400)));background: #ffffff;color: #174889;font-weight: 300;outline: none;border: none;border-bottom: 1px solid #c2c2c2;opacity: 1; height: 180px;}
@media (min-width:2650px){ .text-input-area { font-size: 17px; } }
/* buttons ---------- */
.form-btns {font-size: calc(16px + (17.5 - 16) * ((100vw - 400px) / (2650 - 400)));position: relative !important;z-index: 99 !important; display: inline-block;font-weight: 400;outline: none;border: none;border-color: #00b4ff !important; color: white !important; line-height: 1; background-color: #1c91e9 !important; background-image: linear-gradient(to bottom right, #137dbb, #1c91e9) !important; cursor: pointer; transition: background-color 0.3s ease; text-transform: uppercase; letter-spacing: 1px; padding: 12px 35px; text-decoration: none; font-family: "Archivo Narrow", sans-serif;}
.form-btns:hover{background-color: #0a99ed !important; background-image: linear-gradient(to bottom right, #0a99ed, #389cd7) !important;}
@media (min-width:2650px){ .form-btns { font-size: 17.5px; } }
/*form placeholder*/
::placeholder { color:#898989; font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400))); }
::-webkit-input-placeholder { color: #898989; font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400))); }
:-moz-placeholder { color: #898989; font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400))); }
::-moz-placeholder { color: #898989; font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400))); }
:-ms-input-placeholder { color: #898989; font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400))); }
@media (min-width: 2650px) {
::placeholder { font-size: 17px; }
::-webkit-input-placeholder { font-size: 17px; }
:-moz-placeholder { font-size: 17px; }
::-moz-placeholder { font-size: 17px; }
:-ms-input-placeholder { font-size: 17px; }
}
.b-ulix a {font-size: 17px;font-weight:800;padding: 0px 0px 0px;text-transform:uppercase;border-bottom: 1px solid transparent;color: #61e7fd; text-decoration: none;transition: all 0.3s ease-in-out;letter-spacing: 0.2px; }
.b-uli a {font-size: 17px;font-weight:400;padding: 0px 0px 0px;text-transform:uppercase;border-bottom: 1px solid transparent; text-decoration: none;transition: all 0.3s ease-in-out;letter-spacing: 0.2px;color: #5a6a81; }
.b-uli a:hover { font-weight:800;color: #61e7fd; background-color: transparent; /*border-bottom:1px solid #e9e9e9;*/ }
.card-bicon { font-size:48px;color: #5a6a81;line-height: 48px;margin-bottom: 15px;padding-top: 10px;transition: color 0.3s ease; }
.bicon-wrap { height:50px;margin-bottom: 15px; margin-top: 5px; }
.card-head {font-size: clamp(1.3rem, 3vw, 1.45rem);font-weight:600;color: #fd9310; text-decoration: none;transition: color 0.3s ease;line-height: 28px;margin-bottom: 15px;letter-spacing: 0.7px;white-space: nowrap;}
.b-card-head {font-size: clamp(1.3rem, 3vw, 1.45rem);font-weight:600;color: #00c4ff; text-decoration: none;transition: color 0.3s ease;line-height: 28px;margin-bottom: 15px;letter-spacing: 0.7px;white-space: nowrap;}
.card-bg {background-color: white; transition: background-color 0.3s ease;}
.ref-bg {background-color: white; transition: background-color 0.3s ease; max-height: 120px;}
.cv-lquo { display: inline-block;left: -5px; position: relative; line-height: 0; font-size: 26px;}
.cv-rquo {display: inline-block; right: -5px; position: relative; top: 10px; transform: scale(-1, -1); font-size: 26px; line-height: 0; margin-top: -20px;}
.cv-color {color: #39a7ff;}
.cv-img { width: 100px; border-radius: 50%;margin-right: 20px;}
.b-card-bg {background-color: white; transition: background-color 0.3s ease;}
.flyer { background-repeat: no-repeat; background-position: top left;background-size: 100% auto;cursor: pointer;transition: all 0.3s ease-in-out; position: relative;}
.flyer .flyer-head {font-size: 18px; text-decoration: none; font-weight: 500; color: rgba(255, 255, 255, 1);transition: all 0.3s ease-in-out;}
.flyer .flyer-text {font-size: clamp(0.90rem, 3vw, 1.0rem); text-decoration: none; font-weight: 300; color: rgba(255, 255, 255, 1);transition: all 0.3s ease-in-out;}
.flyer .flyer-accent { padding: 25px 20px; position: absolute; z-index: 2; bottom: 0; background-color: #063856;/*#28a0e9*/ /*border-radius: 0 2rem 0 2rem;*/ line-height: 1; border-radius: 2rem 0 2rem 0;transition: all 0.3s ease-in-out;min-width: 170px;}
.flyer:hover .flyer-accent { background-color: #28a0e9;/*#595959*/;min-width: 188px;}
.flyer .flyer-info {font-size: clamp(0.90rem, 3vw, 1.0rem);font-weight:400;color: #5a6a81; text-decoration: none;transition: all 0.3s ease-in-out;line-height: 24px;letter-spacing: 0.1px; opacity: 0;transform:translateX(-15px);}
.flyer .flyer-bg {background: rgba(255, 255, 255, 0.15);transition: all 0.3s ease-in-out; }
.flyer:hover { box-shadow: inset 0 0 0 1px #efefef; background-size: 110% auto; }
.flyeri { background-repeat: no-repeat; background-position: top center;background-size: 100% auto;cursor: pointer;transition: all 0.3s ease-in-out; position: relative;}
.flyyhide-hide { display: none; }
.flyyhide-show { display: block; }
.flyyer-headi { font-size: 18px !important; font-weight: 600 !important; color: #2180a5; text-decoration: none; transition: all 0.3s ease-in-out; line-height: 24px; letter-spacing: 0.3px; padding-top: 20px; }
.flyyer-bgi { transition: all 0.3s ease-in-out;background: rgba(250, 250, 250, .5);background: linear-gradient(90deg,rgba(250, 250, 250, .85) 0%, rgba(250, 250, 250, .35) 57%, rgba(250, 250, 250, 0.2) 100%); border: 1px solid #e4e7e9;/*box-shadow: inset 0 0 0 1px #e4e7e9;*/ }
.flyyer-infoi { font-size: clamp(0.90rem, 3vw, 1.0rem);font-weight:400;color: #5a6a81; text-decoration: none;transition: all 0.3s ease-in-out;line-height: 24px;letter-spacing: 0.1px;}
.flyer-cena { font-weight: 900;font-size: 18px;color: #e4ffb3; }
.flybox { position: relative; }
.c-card-blue {background-color: #28a0e9 !important; }
.c-card-head {font-size: 18px;font-weight:600;color: #fff; text-decoration: none;transition: color 0.3s ease;line-height: 28px;margin-bottom: 15px;letter-spacing: 0.7px;white-space: nowrap;}
.c-card-txt {font-size: 14px;font-weight:400;color: #fff; text-decoration: none;transition: color 0.3s ease;line-height: 24px;letter-spacing: 0.1px;}
.c-card-num {font-size: 12px; color: white; margin: 2px 6px 2px 0px; padding: 0px 5px 0px 5px; font-weight: bold; background-color: #97cf56; width: 18px; display: inline-block; text-align: center; line-height: 17px;}
.sub-card-head {font-size: clamp(1.3rem, 3vw, 1.45rem);font-weight:600;color: /*#515e6a*/#4f646e; text-decoration: none;transition: color 0.3s ease;line-height: 28px;margin-bottom: 15px;letter-spacing: 0.7px;/*white-space: nowrap;*/}
.sub-card-head-gd {font-size: clamp(1.1rem, 3vw, 1.45rem);font-weight:600;color: /*#515e6a*/#008bc1; text-decoration: none;transition: color 0.3s ease;line-height: 28px;margin-bottom: 5px;letter-spacing: 0.7px;/*white-space: nowrap;*/}
.sub-card-bg {background-color: #E5E5E5; transition: background-color 0.3s ease;}
.b-head-h2-gd {font-size: clamp(1.4rem, 3vw, 2rem);font-weight:600;color: #256983; text-decoration: none;transition: color 0.3s ease;line-height: 28px;letter-spacing: 0.7px;white-space: nowrap;}
/*.head-h2 {font-size: clamp(1.7rem, 3vw, 2rem);font-weight:600;color: #fd9310; text-decoration: none;transition: color 0.3s ease;line-height: 28px;letter-spacing: 0.7px;white-space: nowrap;}
.head-h4 {font-size: clamp(1.2rem, 1.8vw, 1.32rem); font-weight: 500; color: #008bc1; text-decoration: none; transition: color 0.3s ease; line-height: 1.2; font-family: "Archivo Narrow", sans-serif;margin-bottom: 5px !important;}*/
.faq-bg {background-color: white; box-shadow: rgba(149, 157, 165, 0.12) 0px 3px 15px;font-size: clamp(0.90rem, 3vw, 1.0rem);font-weight:400;color: #5a6a81; text-decoration: none;line-height: 24px;letter-spacing: 0.1px; border: 1px solid #f1f1f1;cursor: pointer;}
.faq-head {font-size: clamp(1.05rem, 3vw, 1.13rem);font-weight:600;color: #fd9310; text-decoration: none;line-height: 24px;letter-spacing: 0.4px;cursor: pointer;}
.b-faq-head {font-size: clamp(1.05rem, 3vw, 1.13rem);font-weight:600;color: #1c79b1; text-decoration: none;line-height: 24px;letter-spacing: 0.4px;cursor: pointer;}
.faq-txt {font-size: clamp(0.90rem, 3vw, 1.0rem);font-weight:400;color: #434C5E; text-decoration: none;line-height: 24px;letter-spacing: 0.1px;}
.faq-down {background-color: #fd9310;width: 30px;height: 30px;color: white;cursor: pointer;flex-shrink: 0;transition: transform 0.3s}
.b-faq-down {background-color: #00c4ff;width: 30px;height: 30px;color: white;cursor: pointer;flex-shrink: 0;transition: transform 0.3s}
/*.faq-up {background-color: #d5d5d5;width: 30px;height: 30px;color: white;cursor: pointer;transform: rotate(180deg);flex-shrink: 0;}*/
.head-input-x {margin-bottom: 5px;font-weight: 700;color: #0b6093; display: block;font-size: clamp(1.7rem, 3vw, 2rem);line-height: 1; }
.slogan{}
.slogan-img{width: 70%; max-width: 750px;min-width: 420px;}
.hb-menu-white{ font-size: 38px;color: #ffffff;text-shadow: 0px 1px 5px #555;margin-right: 10px;}
.hb-menu-gold{ color: #c3a354;font-size: 38px;margin-right: 10px;}
.hb-bg{ background-image: url('img/hb.png'); background-repeat: no-repeat; background-position: top right;}
/*a.hb-menu:hover{ color: rgb(149, 144, 132);}*/
.fot{ text-align: center; font-size: 14px; /*font-family: Roboto, sans-serif;*/ color: #403f3c;}
a.fot:hover{ color: rgb(149, 144, 132);}
.asocial { width: 32px; height: 32px; margin: 6px; background-color: rgb(95, 99, 104); background-image: linear-gradient(rgb(95, 99, 104), rgb(95, 99, 104)); border-radius: 50%; display: inline-block; vertical-align: middle; text-align: center; line-height: 0; font-size: 10pt; }
a.asocial:hover { background-color: rgb(155, 144, 119); background-image: linear-gradient(rgb(155, 144, 119), rgb(155, 144, 119)); }
.imgsocial { width: 28px; height: 28px; margin: 2px; }
.thumb { margin-right: 5px;margin-bottom: 5px;margin-top: 5px;height: 100px;}
.thumb-mini { position: relative; height: 49px; width: 69px; float: right; top: -3px; margin-left: 3px;}
.shadw { box-shadow: 0px 0px 20px 0px #00000005; }
.menu-li { min-width: 250px; transition: background-color 0.2s ease-in-out; }
.menu-li-border { border-bottom: 1px solid #efefef; min-width: 250px; transition: background-color 0.2s ease-in-out; }
.menu-li:hover { background-color: #f5f3ef; }
.menu-li-border:hover { background-color: #f5f3ef; }
.menu-modal { position: fixed;top: 65px; right: 10px; background-color: white; }
/*strong { color: #002a2a; }*/
.acc { color: #dbb363; }
.acc-li { color: #dbb363; font-size: clamp(1.0rem, 2vw + 0.5rem, 1.25rem); }
.acc-lis { color: #dbb363; font-size: clamp(0.98rem, 1.8vw + 0.5rem, 1.25rem); }
.acc-line { /* background-color: #cdb179; */ /* color: white; */ border-bottom: 4px solid #dbb363; width: 50%; position: relative; left: -2px; margin-bottom: 6px; max-width: 300px; }
.pheader { margin-bottom: 4px; font-size: 19px; font-weight: bold; color:#83734f; /*rgb(155, 144, 119);*/ line-height: 1.25; }
.pheadermain { font-weight: bold;/*color: rgb(151, 130, 84);*/color: #7a5e21;line-height: 1.25;margin-bottom: 5px; font-size: clamp(1.4rem, 2vw + 0.5rem, 1.78rem); /*font-size: clamp(1.3rem, 2vw + 0.5rem, 1.5rem);font-size: 25px;*/}
.fheader { font-size: 24px; font-weight: normal; color: rgb(155, 144, 119); margin-bottom: 40px; }
.thumb-header { font-weight: 300; text-transform: uppercase;color: #174889; font-size: clamp(1.05rem, 3vw, 1.13rem); white-space: nowrap;}
.finput { margin-bottom: 2px; font-size: clamp(0.90rem, 3vw, 1.0rem); font-weight: normal; color: rgb(155, 144, 119); }
.input-project { border-color: rgba(130, 113, 83, 1) !important; color: rgba(130, 113, 83, 1) !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; padding: 5px 5px !important; border-radius: 4px; transition: background-color 0.3s ease; background-color: white !important; width: 65%; cursor: text !important;}
.margin-small { margin: 40px 0px !important;}
.padding-small { padding: 5px 40px !important;}
.padding-big { padding: 5px 80px !important;}
.bubble-top { width:0;height:0;border-left: 14px solid transparent;border-right: 14px solid transparent;border-top: 14px solid #ffffff;}
.bubble-bottom { width:0;height:0;border-left: 8px solid transparent;border-right: 28px solid transparent;border-top: 25px solid #a1d3ee;}
.h2-pad {padding: 5px 0px 0px 0px; margin: 0px 0px 5px 0px;}
/*.head-h3 {font-size: 21px;font-weight:700;text-transform:uppercase;color: #174889; text-decoration: none; white-space: nowrap; text-align: left;margin: 20px 0 10px 0;width: 100%; }
.head-h3-desc {font-size: 20px;font-weight:300; text-decoration: none; line-height: 1.45; color: #174889;width: 100%;text-align: left;margin-left: 25px;list-style-type: disc; }
.head-h3-desc li {display: list-item; }*/
.head-hr { border-top: 1px solid #c2c2c2;}
.head-img { width: 100%; max-width:480px; }
.head-img-b { width: 100%; }
.max-800 { width: 800px; }
#highlighted { background: #a1d3ee; position: relative; border-top:5px solid #fff; }
blockquote {font-size: 24px; font-style: italic; padding: 0 0 0 50px; border-left: none; position: relative; margin: 40px 0px 50px 0px;font-weight: 300;}
blockquote p { font-weight: 300; line-height: 1.44; }
.footer-area blockquote { padding-left: 70px; }
/*blockquote quote symbol*/
blockquote:after { position: absolute; font-family: 'PT Serif', Georgia, Times, Times New Roman, Serif; content: "“"; left: 0px; top: 0; color: #4187d1;
font-style: normal; font-size: 140px; line-height: 1; }
.footer-area blockquote:after { left: 0; font-size: 130px; }
.btn-project { border-color: rgba(130, 113, 83, 1) !important; color: rgba(130, 113, 83, 1) !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; transition: background-color 0.3s ease; background-color: white !important; }
.btn-project:hover, .btn-project:focus { border-color: rgba(130, 113, 83, 1) !important; color: rgba(130, 113, 83, 1) !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; background-color: #F2F1ED !important; outline: none; }
.btn-project:active { border-color: rgba(130, 113, 83, 1) !important; color: rgba(130, 113, 83, 1) !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; background-color: #fff !important; outline: none; }
.btn-fproject { border-color: rgb(157, 138, 107) !important; color: white !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; background-color: rgb(157, 138, 107) !important; transition: background-color 0.3s ease; }
.btn-fproject:hover, .btn-fproject:focus { border-color: rgb(145, 123, 88) !important; color: white !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; background-color: rgb(145, 123, 88) !important; outline: none; }
.btn-fproject:active { border-color: rgb(145, 123, 88) !important; color: white !important; font-family: 'Open Sans', sans-serif; font-size: 12pt; line-height: 22px; border-radius: 4px; background-color: rgb(145, 123, 88) !important; outline: none; }
.btn-form {min-width: 160px;font-weight: 400;outline: none;border: none; border-color: #fd9310 !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #fd9310 !important; transition: background-color 0.3s ease; text-transform: uppercase; letter-spacing: 0.5px;}
.btn-form:hover, .btn-form:focus {min-width: 160px;font-weight: 400;border: none; border-color: #616f7a !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #616f7a !important; outline: none;text-transform: uppercase; letter-spacing: 0.5px;}
.btn-form:active { min-width: 160px;font-weight: 400;border: none; border-color: #616f7a !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #616f7a !important; outline: none;text-transform: uppercase; letter-spacing: 0.5px; }
.b-btn-form {min-width: 160px;font-weight: 400;outline: none;border: none; border-color: #28a0e9 !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #28a0e9 !important; transition: background-color 0.3s ease; text-transform: uppercase; letter-spacing: 0.5px;}
.b-btn-form:hover, .b-btn-form:focus {min-width: 160px;font-weight: 400;border: none; border-color: #616f7a !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #616f7a !important; outline: none;text-transform: uppercase; letter-spacing: 0.5px;}
.b-btn-form:active { min-width: 160px;font-weight: 400;border: none; border-color: #616f7a !important; color: white !important; font-family: 'Poppins', sans-serif !important; font-size: clamp(0.8rem, 2.7vw, 0.95rem); line-height: 1; background-color: #616f7a !important; outline: none;text-transform: uppercase; letter-spacing: 0.5px; }
/* ========================== FOOTER ====================== */
.p-foot {font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400)));margin: 0; padding: 0 0 15px 0;color: #9eabb7;font-weight: 300; line-height: 1.2;}
@media (min-width:2650px){ .p-foot { font-size: 17px; } }
.p-foot a {font-size: calc(15px + (17 - 15) * ((100vw - 400px) / (2650 - 400)));text-decoration: underline;margin: 0; padding: 0 0 15px 0;color: #9eabb7;font-weight: 300; line-height: 1.45;}
@media (min-width:2650px){ .p-foot a { font-size: 17px; } }
.p-foot a:hover { text-decoration: none; }
/* ========================== GALLERY ====================== */
/* GALLERY - img effects*/
.fmore { display: none !important;}
#foto-spacer { display: none;}
.lightboxcaptions{ background: rgba(0,0,0,0.6);color: #fff;padding: 10px 15px;font-size: 14px;text-align: left;}
.fncGallery img { opacity: 1; transition: opacity 0.2s ease-in-out; cursor: pointer;}.fncGallery img:hover { opacity: 0.5;}
.fotoGallery img { opacity: 1; transition: opacity 0.2s ease-in-out; cursor: pointer;}.fotoGallery img:hover { opacity: 0.5;}
.lightbox img { opacity: 1; transition: opacity 0.2s ease-in-out; cursor: pointer;}.lightbox img:hover { opacity: 0.8;}
.opacity img { opacity: 1; transition: opacity 0.2s ease-in-out; cursor: pointer;}.opacity img:hover { opacity: 0.75;}
.lightbox2 img { opacity: 1; transition: opacity 0.2s ease-in-out; cursor: pointer;}.lightbox2 img:hover { opacity: 0.8;}
/* ========================== CAROUSEL ====================== */
/* Carousel Buttons */
.carousel-btn { position: absolute; top: 0; bottom: 0; z-index: 1; display: flex; align-items: center; justify-content: center; width: auto; /* let it shrink to fit inner button */ padding: 0 36px; /* optional spacing from edge */ color: #000000; text-align: center; background: transparent; border: 0; opacity: 0.75; transition: opacity 0.15s ease; }
.carousel-btn.prev { left: 0; }
.carousel-btn.next { right: 0; }
.carousel-btn div.inner-btn { cursor: pointer; position: absolute; /*top: 44%;*/ color: #fff; background-color: rgb(32, 33, 36); opacity: 0.9; border-radius: 50%; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; transition: background-color 0.2s ease; /* added transition for hover */ }
.carousel-btn div.inner-btn:hover { background-color: #AEAEAE; /* lighter gray on hover */ opacity: 0.8; }
.carousel-btn div.inner-btn svg { width: 36px; height: 36px; }
.carousel-btn.next div.inner-btn { transform: rotate(180deg); }
/* arrows */
.control-circle { background-color: rgba(255,255,255,0.85); border-radius: 50%; width: 48px; height: 48px; }
/* Carousel bullets */
.carousel-bullets-wrapper { display: flex; justify-content: center; gap: 8px; }
.carousel-bullet { width: 10px; height: 10px; border-radius: 50%; background-color: rgb(189,193,198); cursor: pointer; transition: background-color 0.3s, transform 0.3s; }
.b88 { width: 8px !important; height: 8px !important; margin-top: 1px !important; }
.b66 { width: 6px !important; height: 6px !important; margin-top: 2px !important; }
.carousel-bullet.active { background-color: #827153; transform: scale(1.0); }
/* Carousel size */
#mainCarousel .carousel-inner { width: 100%; max-height: 655px; /* optional max height */ overflow: hidden; }
#mainCarousel .carousel-item img { width: 100%; height: auto; /* image scales proportionally */ object-fit: cover; /* fills the container while keeping ratio */ }
/* Carousel anim */
.carousel.carousel-fade .carousel-item { opacity: 0; transition: opacity .8s ease-in-out; }
.carousel.carousel-fade .carousel-item.active, .carousel.carousel-fade .carousel-item-next.carousel-item-start, .carousel.carousel-fade .carousel-item-prev.carousel-item-end { opacity: 1;}
.carousel.carousel-fade .active.carousel-item-start, .carousel.carousel-fade .active.carousel-item-end { opacity: 0;}
/* Remove Bootstrap transform animations (cause of white flash) */
.carousel.carousel-fade .carousel-item, .carousel.carousel-fade .carousel-item.active { transform: none !important; }
/* ========================== REVEAL ANIMATIONS ====================== */
.reveal-upzoom { opacity: 0; transform: translateY(100px); }
.revealed-upzoom { animation: revealUpzoomAnim .6s ease forwards;}
@keyframes revealUpzoomAnim {
0% { opacity: 0; -webkit-transform: scale3d(.8,.8,.8);transform: scale3d(.3,.3,.3) translateY(100px); }
100% { opacity: 1; -webkit-transform: scale3d(1,.1,1);transform: scale3d(1,1,1) translateY(0); }
}
.reveal-basic { opacity: 0; transform: translateY(80px); }
.revealed-basic { animation: revealBasicAnim 1s ease forwards;}
@keyframes revealBasicAnim {
0% { opacity: 0; transform: translateY(80px); }
100% { opacity: 1; transform: translateY(0); }
}
.reveal-basic,.revealed-basic { will-change: opacity, transform; transform: translateZ(0); backface-visibility: hidden;}
.rev1eal-zoom { opacity: 0; transform: translateY(50px);}
.rev1ealed-zoom {animation:zoom 1.0s ease-out forwards;}
@keyframes zoom {
0% {opacity: 0;-webkit-transform: scale3d(.3,.3,.3);transform: scale3d(.3,.3,.3) translateY(50px);}
50% {opacity: 1}
100% {-webkit-transform: scale3d(1,.1,1);transform: scale3d(1,1,1) translateY(0);}
}
.reveal-flyinform-L { opacity: 0.8; transform: translateX(-2200px); }
.revealed-flyinform-L {animation:flyinBounceFL .8s ease-out forwards;}
@keyframes flyinBounceFL {
0%{opacity:.8;transform:translateX(-2200px);}
55%{transform:translateX(28px);}
72%{transform:translateX(-12px);}
88%{transform:translateX(6px);}
100%{transform:translateX(0);}
}
.reveal-flyin-L { opacity: 0.8; transform: translateX(-1100px); }
.revealed-flyin-L {animation:flyinBounceL .8s ease-out forwards;}
@keyframes flyinBounceL {
0%{opacity:.8;transform:translateX(-1100px);}
55%{transform:translateX(28px);}
72%{transform:translateX(-12px);}
88%{transform:translateX(6px);}
100%{transform:translateX(0);}
}
.rev2eal-flyin-L { opacity: 0.8; transform: translateX(-1100px); }
.rev2ealed-flyin-L {animation:flyinBounceL .8s ease-out forwards;}
@keyframes flyinBounceL {
0%{opacity:.8;transform:translateX(-1100px);}
55%{transform:translateX(28px);}
72%{transform:translateX(-12px);}
88%{transform:translateX(6px);}
100%{transform:translateX(0);}
}
/* Normal right fly-in */
.rev1eal-flyin-R {opacity:.8;transform:translateX(1550px);}
.rev1ealed-flyin-R {animation:flyinBounceR .8s ease-out forwards;}
@keyframes flyinBounceR {
0%{opacity:.8;transform:translateX(1550px);}
55%{transform:translateX(-28px);}
72%{transform:translateX(12px);}
88%{transform:translateX(-6px);}
100%{transform:translateX(0);}
}
/* filter anim */
.filterhide {
pointer-events: none;
animation:filteroff 0.3s ease-out forwards;
}
.filtershow {
pointer-events: auto;
animation:filteron 0.3s ease-out forwards;
}
@keyframes filteroff {
0% { opacity: 1; transform: scale(1); }
100% { opacity: 0; transform: scale(0); }
}
@keyframes filteron {
0% { opacity: 0; transform: scale(0); }
100% { opacity: 1; transform: scale(1); }
}
/* ========================== SCROLL TO TOP ====================== */
.topup {border-radius:50%; background:rgba(37,37,37,0.8); position:fixed; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:9999;transition: background-color 0.2s ease-in-out;}
.topup:hover {background:rgba(37,37,37,1);}
.arrowup {color:#fff; font-size:28px;}
.topup-anim-show {animation:topupShow .4s ease forwards;}
@keyframes topupShow {
0% {opacity:0; transform:scale(0);}
100% {opacity:1; transform:scale(1);}
}
.topup-anim-hide {animation:topupHide .4s ease forwards;}
@keyframes topupHide {
0% {opacity:1; transform:scale(1);}
100% {opacity:0; transform:scale(0);}
}
.topup-anim-off {opacity:0; transform:scale(0);}