html { scroll-behavior: smooth; }
@font-face {
 font-family: 'Open Sans', sans serif;
 src: url('../font/OpenSans.ttf') format('truetype'); 
}
body { background-color: #fff; font-family: "Open Sans", sans-serif; color: #393939; }
/* h1 {font-weight: 800; color: #f85386; font-size: 64px; letter-spacing: 5px; line-height: 1.5;} */
h2 {font-weight: 100; font-size: 21px; text-align: justify; line-height: 1.5;}
h3 { text-transform: uppercase; color: #f85386; font-weight: 800; }
.btn-secondary:not(:disabled):not(.disabled):active:focus,.btn-secondary:not(:disabled):not(.disabled).active:focus,.show>.btn-secondary.dropdown-toggle:focus { box-shadow: none; }
.btn-secondary:focus,.btn-secondary.focus { color: #fff; background-color: #5a6268; border-color: #545b62; box-shadow: none; }
.btn { font-size: 14px; text-transform: uppercase; font-weight: 400; background-color: #f85386; border-color: #f85386; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
.marg-0 { margin: 0; }
.pad-left-0 { padding-left: 0; }
.pad-right-0 { padding-right: 0; }
.pad-top-0 { padding-top: 0; }
.pad-bttm-0 { padding-bottom: 0; }
.pad-bttm-15 { padding-bottom: 15px; }
a { color: #f85386; text-decoration: none; background-color: transparent; }
a:hover:not(.nav_contact) { color: #fff; text-decoration: none; }
.row { margin-left: 0; margin-right: 0; }
.btn { border-radius: 1px; }
.container-fluid { padding-left: 0; padding-right: 0; }
.nav_right_top a { font-weight: 300; font-size: 14px; }
.header_logo { float: left; margin-right: 15px; }
.logo_slogan01 { color: #f85386; font-weight: 900; font-size: 36px; }
.logo_slogan02 { color: #393939; font-weight: 300; }
.logo_slogan03 { float: left; color: #393939; font-family: "Open Sans", Arial, Helvetica, sans-serif; font-weight: 300; font-size: 13px; text-transform: uppercase; letter-spacing: 5.1pt; padding-left: 2px; margin-top: -10px; }
.row_nav { position: relative; z-index: 999; padding-left: 25px; padding-right: 25px}
.navbar { padding: 15px 0; }
.navbar-brand { margin-right: 0; }
.nav_right_cont { margin-top: 25px; }
.nav_right_top .phonenr { padding-top: 15px; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
.nav_right_top .btn:hover,.form-group .btn:hover,.btn-secondary:hover { background-color: #fff; color: #f85386; border-color: #393939; }
.nav_right_bottom { padding-left: 10px; padding-top: 10px; }
.nav_right_bottom a { font-size: 14px; font-weight: 300; padding: 0.5rem 0.25rem; padding-top: 0; letter-spacing: 0.75pt; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; }
#mobil_tel { position: fixed; top: 57px; right: 0; margin-right: -145px; transition: all 0.5s ease-out; }
#mobil_tel i,#mobil_cntct i,#mobil_lng i { margin-right: 5px; }
#mobil_tel:hover,#mobil_tel:active { margin-right: -15px; }
#mobil_cntct { position: fixed; top: 100px; right: 0; margin-right: -145px; background-color: #f85386; transition: all 0.5s ease-out; }
#mobil_lng { position: fixed; top: 143px; right: 0; margin-right: -145px; background-color: #f85386; transition: all 0.35s ease-out; }
#mobil_tel button,#mobil_cntct button,#mobil_lng button { width: 190px; text-align: left; }
#mobil_cntct:hover,#mobil_cntct:active { margin-right: -25px; }
#mobil_cntct a:hover,#mobil_cntct a:active,#mobil_tel a:hover,#mobil_tel a:active,#mobil_lng a:hover,#mobil_lng a:active { color: #f85386; }
#mobil_lng:hover,#mobil_lng:active { margin-right: -90px; }
.content { margin-top: -140px; overflow: hidden; }
.content_01_txt { padding-top: 300px; text-align: justify; }
.slogan_zero { font-weight: 800; color: #f85386; font-size: 64px; letter-spacing: 5px; line-height: 0.7; }
.txt_01 { max-width: 665px; font-size: 21px; font-weight: 100; text-align: justify; margin-left: 35px; }
.txt_sec { position: relative; display: inline; color: #f85386; hyphens: none; font-weight: 400; }
.txt_sec svg { position: absolute; top: 1.4em; left: 0; width: 100%; overflow: visible; opacity: 0.75; }
.txt_sec svg path { fill: none; stroke: #f85386; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
#psy_vid { width: 100%; }
.scrollhint { position: absolute; font-size: 62px; color: #f85386; text-align: center; width: 100%; bottom: 0; transition: all 0.5s ease-out; cursor: pointer; }
.scrollhint:hover { transform: translate(0px, 10px); }
.content_02 { padding-top: 40px; scroll-margin-top: 100px; padding-bottom: 50px; background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); margin-top: -5px; text-align: center; }
.content_02_txt { padding-top: 25px; max-width: 500px; padding-bottom: 25px; margin: auto; text-align: center; }
.content_02_1_img { padding: 0; }
.content_02_txt div { text-align: justify; }
.content_02_1 { margin-left: 0; margin-right: 0; text-align: center; }
.content_02_txt_01 { text-align: center; padding-top: 65px; }
.content_02_txt_01 span { color: #f85386; font-weight: 600; text-transform: uppercase; }
.content_02_txt_02 { max-width: 500px; margin: auto; padding: 0 15px 65px 15px; }
.content_02_1_img img { object-fit: cover; height: 100%; width: 100%;}
.content_03 { padding-bottom: 50px; scroll-margin-top: 100px; background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); }
.content_03_txt { padding-bottom: 25px; padding-top: 65px; max-width: 500px; margin: auto; text-align: center; }
.content_03_txt_01 { text-align: center; }
.portfoliogallery { margin-left: -15px; }
.portfoliogallery .card { width: 25%; float: left; padding: 15px; border: none; background: none; }
.portfoliogallery .card .card-body { padding: 10px; }
.portfoliogallery .card .card-body .card-text { font-size: 12px; font-weight: 300; }
.port_more { display: block; text-align: center; padding: 15px; }
.port_more .btn { width: 125px; }
.content_03_5 { padding-top: 50px; padding-bottom: 50px; }
.content_03_5_txt { text-align: center; }
#accordionfaq { max-width: 500px; margin: 0 auto; }
#accordionfaq button { background-color: #fdfbfb; border: none; text-transform: none; font-size: 1rem; width: 100%; text-align: left; padding-right: 30px; }
#accordionfaq i { position: absolute; top: 20px; margin-left: 15px; right: 30px; transition: all 0.5s; }
#accordionfaq .collapsed i { position: absolute; top: 20px; margin-left: 15px; right: 30px; transform: rotate(180deg); transition: all 0.5s; }
#accordionfaq .card-header { background-color: #fff; border: none; }
#accordionfaq .card { border: none; text-align: center; }
#accordionfaq .card-body { text-align: left; font-style: italic; padding-top: 0; padding-left: 30px; padding-right: 30px; }
#accordionfaq .btn:focus,#accordionfaq .btn.focus { box-shadow: none; }
#accordionfaq .card a:hover {color:#393939;}
.content_04_txt { text-align: center; }
.pswp__bg { background: #f1f1f1; }
.pswp__top-bar { background: #f1f1f1; }
.pswp__ui--fit .pswp__top-bar,.pswp__ui--fit .pswp__caption { background-color: #f1f1f1; }
.pswp__caption__center { max-width: 800px; color: #393939; text-align: center; padding-top: 0; }

/*resetting form */
.cntform input,.cntform select,.cntform textarea,.cntform fieldset,.cntform legend { -webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; }

/*contact form */
.cntheader { max-width: 800px; margin: auto; }
.cntheader a:hover { color: #393939; background-color: #f1f1f1; }
.cntform .form-message { width: 100%; }
.contact-form { .form-field { position: relative; margin: 32px 0; }
 .input-text { display: block; width: 100%; height: 36px; border-width: 0 0 1px 0; border-color: #393939; line-height: 26px; font-weight: 400; padding-left: 10px; background-color: #fff;

        &:focus { outline: none; border-color: #f85386; color: #f85386; }
 &:focus,&.not-empty { +.label { transform: translateY(-30px); font-size: 12px; }
 }
 }
 .input-text-area { display: block; width: 100%; border-width: 0 0 1px 0; border-color: #393939; line-height: 26px; font-weight: 400; padding-left: 10px; background-color: #fff; resize: none;

        &:focus { outline: none; border-color: #f85386; color: #f85386; }
 &:focus,&.not-empty { +.label { transform: translateY(-105px); font-size: 12px; }
 }
 }
 .label { position: absolute; left: 25px; bottom: -7px; line-height: 35px; font-weight: 400; cursor: text; transition: transform .2s ease-in-out; -webkit-transition: transform .2s ease-in-out; }
 .submit-btn { display: inline-block; background-color: #000; color: #fff; text-transform: uppercase; letter-spacing: 2px; font-size: 16px; line-height: 24px; padding: 8px 16px; border: none; cursor: pointer; }
}
.chkbox { padding-left: 20px; float: left; }
.chkboxtxt { margin-left: 50px; margin-bottom: 15px; text-align: left; }
input[type="checkbox"] { box-sizing: border-box; width: 20px; height: 20px; margin-bottom: -11px; padding: 0; border: 1px solid #393939; background-color: #fff; outline: none; transition: outline 0.1s; -webkit-transition: outline 0.1s; }
input[type="checkbox"]:checked { background-size: cover; padding: 2px; }
input[type="checkbox"]:not(:disabled):checked { border-color: #393939; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAgElEQVR4nO2VQQqAIBBF3yWMuv9JWkVYm1x0nNoMESGhokPBPHDpPGaYr2AYRhkdsAKjtjQABzBrSR2wiXQHepPWxMb77fFOwCLZK8lpyLx74TMLVJHGRjaguL0uQd4sMu5F3jynLiJXexy6x/JUWaRU7l2q/jJId15O804N45+cDxpD3zLXsAsAAAAASUVORK5CYII='); }
input[type="checkbox"]:disabled { background-color: var(--checkbox-disabled-bg-color); }
input[type="checkbox"]:disabled:checked { background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="20" height="20" viewBox="0 0 32 32" xml:space="preserve"><path style="fill: %23393939" d="M11.941,28.877l-11.941-11.942l5.695-5.696l6.246,6.246l14.364-14.364L32,8.818"/></svg>'); }
.content_04 { padding-top: 50px; padding-bottom: 50px; background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); }
.cntform { padding-top: 50px; max-width: 800px; margin: auto; }
.form-txt { font-size: 12px; }
.req_field { position: absolute; left: 25px; font-size: 12px; padding-top: 5px; color: #f85386; transition: all 0.5s; opacity: 0; }
.slogan_footer { max-width: 500px; margin: auto; padding: 50px 0; }
.map { height: 350px; }
.map img { object-fit: cover; height: 100%; width: 100%; }
.slogan_footer_txt { max-width: 70%; float: right; padding-left: 25px; }
.slogan_footer_txt span { text-align: justify; font-weight: 200; font-style: italic; }
.slogan_footer_txt img { padding-top: 10px; max-width: 200px; margin-left: -5px; }
.slogan_footer_img { max-width: 30%; float: left; }
.footer { padding: 25px; font-size: 14px; font-weight: 300; color: #393939; background-image: linear-gradient(120deg, #fdfbfb 0%, #ebedee 100%); }
.footercnt { font-size: 14px; color: #393939; text-align: center; }

.datah3 {text-transform: uppercase; color: #f85386; font-weight: 800;font-size: 1.75rem; margin-bottom: 0.5rem; line-height: 1.2;}
.datah4 {font-size: 1.5rem; margin-bottom: 0.5rem;font-weight: 500;line-height: 1.2;}
.datap { color: #f85386; text-decoration: none; background-color: transparent; margin-bottom: 10px; }
.datap span:hover { color: #393939; background-color: #f1f1f1; cursor: pointer; }
.datap a:hover {color: #393939;}
.datatxt {top: 0; position: absolute; width: 100%; background-color: #f1f1f1; padding: 25px 50px; margin-top: 140px; margin-top: 140px; }
.datatxt a {color: #fff;}
.datatxt a:hover {color: #f85386;}
.datashow { display: block; }
.slick-dots li button:before { color: #f85386; opacity: 1; }
.pswp .card { background-color: #f1f1f1; border: none; }

/*slick end */
/* media queries */
@media (min-width:1700px) {
 .txt_01 { margin-left: 140px; }
}
@media (max-width:1480px) {
 .scrollhint { display: none; }
}
@media (min-width:1200px) and (max-width:1480px) {
 .slogan_zero { font-size: 48px; }
 .txt_01 { padding-right: 15px; }
}
@media (max-width:1200px) {
 .txt_01 { max-width: 100%; margin-right: 35px; }
 .content_01_txt { padding-top: 200px; }
}
@media (min-width:1200px) {
 .txt_01 { margin-left: 35px; }
 #mobil_tel,#mobil_cntct,#mobil_lng { display: none; }
}
@media (max-width:576px) {
 .row_nav { padding-left: 15px; padding-right: 15px; }
 .slogan_zero { font-size: 28px; }
 .txt_01 { margin-left: 15px; margin-right: 15px; }
}
@media (min-width:576px) and (max-width:768px) {
 .slogan_zero { font-size: 38px; }
}
@media (max-width:380px) {
 .slogan_zero { font-size: 24px; }
}