.btn_kap { position: relative; pointer-events: auto; display: inline-flex; width: 100%; align-items: center; border-radius: 9999px; background-color: #fff; color: #000 !important; max-width: 318px; padding: 0 36px; height: 77px; } .btn_kap .p1 { font: 500 16px var(--text-font); } .btn_kap .btn_circle { position: absolute; bottom: -1px; left: -1px; right: -1px; top: -1px; z-index: 2; display: flex; align-items: center; border-radius: 9999px; background-color: var(--main-color); padding: 0 36px; font: 500 16px var(--text-font); line-height: 1; color: #fff !important; clip-path: inset(13.66px 18.2133px 13.66px calc(100% - 68.3px) round 38.7033px); transition: clip-path .65s cubic-bezier(.785,.135,.15,.86), transform .65s cubic-bezier(.785,.135,.15,.86); } .btn_kap .btn_circle .center { display: flex; width: 100%; align-items: center; justify-content: space-between; padding-left: 1px; padding-right: 1px; } .btn_kap .btn_circle .center svg { display: block; vertical-align: middle; height: 14px; width: 14px; overflow: hidden; } .btn_kap .btn_circle .center svg path { fill: currentColor; transition: transform .65s cubic-bezier(.785,.135,.15,.86); } .btn_kap .btn_circle .center svg path:first-child { transition-delay: .1s; } .btn_kap .btn_circle .center svg path:last-child { transform: translateX(-100%); transition-delay: 0s; } .btn_kap:hover .btn_circle { clip-path: inset(0 round 4.25rem); } .btn_kap:hover .btn_circle .center svg path:first-child { transform: translateX(100%); transition-delay: 0s; } .btn_kap:hover .btn_circle .center svg path:last-child { transform: translateX(0); transition-delay: .1s; } /*******/ #mainHome { position: relative; padding: 100px 0; } #mainHome .figureKap { display: flex; gap: 30px 30px; padding: 10px; } #mainHome .figureKap figure { position: relative; overflow: hidden; } #mainHome .figureKap figure img { width: 100%; height: 100%; object-fit: cover; } #mainHome .figureKap figure:after { content: ""; position: absolute; width: 200%; height: 0%; left: 50%; top: 50%; background-color: rgba(255, 255, 255, .3); transform: translate(-50%, -50%) rotate(-45deg); z-index: 1; } #mainHome .figureKap figure:hover:after { height: 250%; transition: all 600ms linear !important; background-color: transparent; } #mainHome .figureKap .k0 { position: absolute; top: 10px; left: 10px; width: 370px; background-color: #f9f9f9; border-radius: 20px; padding: 30px; display: flex; flex-direction: column; gap: 15px; height: 181px; } #mainHome .figureKap .k1 { align-self: flex-end; width: calc(40% - 15px); text-align: left; position: relative; overflow: hidden; border-radius: 20px; height: 414px; } #mainHome .figureKap .k1 img { object-fit: cover; width: 100%; max-width: 100%; height: 100%; } #mainHome .figureKap .k2 { -webkit-mask-image: url(/r/bg-shape.svg); -webkit-mask-size: contain; -webkit-mask-position: center center; -webkit-mask-repeat: no-repeat; height: 100%; width: calc(60% - 15px); } #mainHome .text-box { padding: 10px 10px 0 45px; display: flex; flex-direction: column; gap: 20px; } #mainHome .text-box .title { letter-spacing: 0.3em; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #mainHome .text-box .title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #mainHome .text-box .subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #mainHome .text-box .subtext { margin: 0px 0px 20px 0px; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; } #mainHome .text-box .content { padding: 40px 0; margin: 0 0 20px; border-top: 1px solid #eeeded; border-bottom: 1px solid #eeeded; } #mainHome .text-box .content table { border: none; width: 100%; } #mainHome .text-box .content table tbody { } #mainHome .text-box .content table tbody tr { display: flex; gap: 30px; } #mainHome .text-box .content table tbody tr td { vertical-align: top; width: calc(50% - 15px); display: flex; flex-direction: column; gap: 30px; } #mainHome .text-box .content table tbody tr td strong { font: 400 20px var(--title-font); line-height: 1.1em; color: #262626; } #mainHome .text-box .content table tbody tr td p { color: #838383; font: 400 16px var(--text-font); line-height: 1.6em; } #mainHome .text-box .content table tbody tr td ul { } #mainHome .text-box .content table tbody tr td ul li { margin: 10px 0 0; padding: 0 0 10px; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; display: flex; align-items: center; justify-content: flex-start; gap: 7px; } #mainHome .text-box .content table tbody tr td ul li:first-child { margin: 0; } #mainHome .text-box .content table tbody tr td ul li:before { content: ""; width: 21px; height: 21px; position: relative; background-image: url(/r/check-mark.png); background-size: contain; background-repeat: no-repeat; flex-shrink: 0; } #mainHome .text-box .link-box { display: flex; align-items: center; justify-content: flex-start; gap: 30px; } #mainHome .text-box .link-box a.review { background: var(--main-color); color: #fff; } #mainHome .text-box .link-box a.call-us { background: transparent; border: 1px solid var(--main-color); } /*********/ #services { background-color: #f9f9f9; position: relative; overflow: hidden; padding: 100px 0; } #services .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #services .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #services .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #services .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #services .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #services .cat-content .see-all { background: var(--main-color); color: #fff; } #services .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #services .item { position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #services .item:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; opacity: 50%; width: 100%; height: 100%; z-index: 1; background: #262626; } #services .item figure { height: 390px; width: 100%; overflow: hidden; border-radius: 20px; } #services .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #services .item:hover figure img { transform: scale(1.1); } #services .item .text-box { position: absolute; top: 30px; left: 30px; bottom: 30px; right: 30px; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; } #services .item .text-box .title { color: #fff; font: 400 20px var(--title-font); width: 210px; max-width: 100%; line-height: 1.1em; text-transform: lowercase; } #services .item .text-box .more { display: flex; align-items: center; justify-content: space-between; font: 500 16px var(--text-font); color: #fff; fill: #fff; line-height: 1.2em; } #services .item .text-box .more i { display: flex; align-items: center; } #services .item .text-box .more i svg { } /*********/ .cta-btns { position: relative; overflow: hidden; display: block; text-align: center; background-color: #f1eff0; fill: var(--main-color2); color: #000000; font: 500 16px var(--text-font); line-height: 1.2em; width: fit-content; border-radius: 10px; padding: 16px 20px; } .cta-btns:before { content: ''; display: block; position: absolute; top: 0; bottom: 0; left: -15%; right: 0; width: 0; height: 106%; transform: skew(45deg); transition: all 0.4s ease-in-out; } .cta-btns span { position: relative; z-index: 1 !important; display: flex; flex-direction: row; gap: 11px; justify-content: center; text-decoration: inherit; align-items: center; } .cta-btns:hover, .cta-btns:focus { color: #ffffff; } .cta-btns:hover:before { width: 100%; transform: skew(0deg); left: 0; background: var(--main-color2); z-index: 0; } /*********/ #whyUs { padding: 100px 0; position: relative; overflow: hidden; } #whyUs .flex { display: flex; gap: 30px; } #whyUs .bgFigure { width: calc(33% - 15px); position: relative; border-radius: 20px; overflow: hidden; height: 795px; } #whyUs .bgFigure img { width: 100%; height: 100%; object-fit: cover; } #whyUs .item { width: calc(67% - 15px); display: flex; flex-direction: column; gap: 15px; } #whyUs .item .text-box { display: flex; flex-direction: column; gap: 15px; } #whyUs .item .text-box .title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #whyUs .item .text-box .title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #whyUs .item .text-box .subtext { margin: 0 0 15px; font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #whyUs .item .text-box .subtitle { margin: 0 0 25px; font: 400 16px var(--text-font); color: #838383; line-height: 1.6em; } #whyUs .item .text-box .key-value { margin: 0 0 25px; display: flex; align-items: center; gap: 30px; flex-wrap: wrap; } #whyUs .item .text-box .key-value .keybox { width: calc(50% - 15px); display: flex; align-items: center; } #whyUs .item .text-box .key-value .keybox .icon { margin: 0px 10px 0px 0px; color: #f9f9f9; fill: #f9f9f9; height: 40px; width: 40px; padding: 6px; background-color: var(--main-color); border-radius: 8px; position: relative; display: flex; align-items: center; justify-content: center; } #whyUs .item .text-box .key-value .keybox .icon:before { content: ''; display: block; position: absolute; top: 0; left: 0; background: var(--main-color2); border-radius: 8px; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out; z-index: 0; } #whyUs .item .text-box .key-value .keybox:hover .icon:before { transform: scale(1); } #whyUs .item .text-box .key-value .keybox .icon img { filter: invert(1); } #whyUs .item .text-box .key-value .keybox .text { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; } #whyUs .item .kap { display: flex; gap: 30px; align-items: center; } #whyUs .item .kap .smFigure { width: calc(50% - 15px); position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #whyUs .item .kap .smFigure img { width: 100%; height: 100%; object-fit: cover; } #whyUs .item .kap .text-2 { width: calc(50% - 15px); } #whyUs .item .kap .text-2 .text-k { font: 400 16px var(--text-font); color: #838383; line-height: 1.6em; } #whyUs .item .kap .text-2 .text-k strong { margin: 0 0 15px; display: block; font: 400 20px var(--title-font); line-height: 1.1em; color: #262626; } #whyUs .item .kap .text-2 .call-us { background: var(--main-color); color: #fff; margin: 15px 0 0; } /*********/ .figure-action { position: relative; overflow: hidden; } .figure-action:after { content: ""; position: absolute; width: 200%; height: 0%; left: 50%; top: 50%; background-color: rgba(255, 255, 255, .3); transform: translate(-50%, -50%) rotate(-45deg); z-index: 1; } .figure-action:hover:after { height: 250%; transition: all 600ms linear !important; background-color: transparent; } /*********/ #team { padding: 100px 0; position: relative; overflow: hidden; background: linear-gradient(180deg, #f9f9f9 24%, #fff 22%); } #team .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #team .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #team .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #team .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #team .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #team .cat-content .see-all { background: var(--main-color); color: #fff; } #team .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #team .item { position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #team .item figure { height: 390px; width: 100%; overflow: hidden; border-radius: 20px 20px 0 0; position: relative; } #team .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #team .item .text-box { background: #f9f9f9; padding: 30px; height: calc(100% - 392px); } #team .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; margin: 0 0 5px; } #team .item .text-box .subtitle { color: #838383; font: 400 16px var(--text-font); line-height: 1.6em; } /*********/ #exams { padding: 100px 0; position: relative; overflow: hidden; } #exams .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #exams .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #exams .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #exams .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #exams .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #exams .cat-content .see-all { background: var(--main-color); color: #fff; } #exams .item figure { height: 100%; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; margin: 0 0 20px; } #exams .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #exams .item .text-box { } #exams .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; } #exams .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: var(--main-color); fill: var( --main-color); line-height: 1.1em; gap: 10px; } #exams .item .text-box .more i { display: flex; align-items: center; } #exams .item .text-box .more i svg { } /*********/ #programs { padding: 100px 0; position: relative; overflow: hidden; background: linear-gradient(180deg, #f9f9f9 57%, #fff 22%); } #programs .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #programs .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #programs .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #programs .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #programs .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #programs .cat-content .see-all { background: var(--main-color); color: #fff; } #programs .programsSwiper { border-radius: 20px; } #programs .item { position: relative; overflow: hidden; border-radius: 20px; } #programs .item:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-image: radial-gradient(#26262600 65.21%, #262626CC 100%); } #programs .item figure { height: 610px; width: 100%; overflow: hidden; border-radius: 20px; position: relative; } #programs .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #programs .item .badge { width: fit-content; padding: 10px; /* background: #fff; */ backdrop-filter: blur(10px); font: 400 16px var(--text-font); color: #fff; border-radius: 12px; } #programs .item .text-box { position: absolute; top: 30px; left: 30px; width: calc(100% - 60px); height: calc(100% - 60px); display: flex; flex-direction: column; justify-content: space-between; /* align-items: center; */ z-index: 99; } #programs .item .text-box .title { color: #fff; font: 400 48px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; /* text-align: center; */ } #programs .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: #fff; fill: #fff; line-height: 1.1em; gap: 10px; } #programs .item .text-box .more i { display: flex; align-items: center; } #programs .item .text-box .more i svg { } /*********/ #process { padding: 100px 0; position: relative; overflow: hidden; background: #f9f9f9; } #process .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #process .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #process .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #process .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #process .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #process .cat-content .see-all { background: var(--main-color); color: #fff; } #process .item { display: flex; gap: 40px; padding: 10px; } #process .item .keybox { width: calc(25% - 30px); display: flex; flex-direction: column; gap: 30px; } #process .item .keybox .icon { height: 100px; width: 100px; display: flex; align-items: center; justify-content: center; z-index: 1; position: relative; color: #ffffff; font: 500 50px var(--text-font); line-height: 1.1em; background: var(--main-color); border-radius: 8px; } #process .item .keybox .icon:before { content: ''; display: block; position: absolute; top: 0; left: 0; background: var(--main-color2); border-radius: 8px; width: 100%; height: 100%; transform: scale(0); transition: all 0.4s ease-in-out; z-index: -1; } #process .item .keybox:hover .icon:before { transform: scale(1); } #process .item .keybox .text-box { width: 216px; max-width: 100%; } #process .item .keybox .text-box .key { margin: 0 0 10px; font: 400 20px var(--title-font); color: #262626; text-transform: lowercase; } #process .item .keybox .text-box .value { color: #838383; font: 400 16px var(--text-font); line-height: 1.6em; } #process .item .keybox:nth-child(odd) { background-image: url(/r/how-work-step-arrow-1.svg); background-position: center right; background-repeat: no-repeat; background-size: 60% auto; } #process .item .keybox:nth-child(even) { flex-direction: column-reverse; background-image: url(/r/how-work-step-arrow-2.svg); background-position: center right; background-repeat: no-repeat; background-size: 60% auto; } #process .item .keybox:last-child { background-image: none; } /*********/ #blogs { padding: 100px 0; position: relative; overflow: hidden; } #blogs .cat-content { display: flex; padding: 10px; margin: 0 0 60px; align-items: center; justify-content: space-between; } #blogs .cat-content .kap { width: 50%; display: flex; flex-direction: column; gap: 15px; } #blogs .cat-content .main-title { letter-spacing: 1px; color: var(--main-color); font: 500 14px var(--text-font); line-height: 1.1em; padding-left: 18px; text-transform: uppercase; position: relative; } #blogs .cat-content .main-title:before { content: ""; position: absolute; top: 50%; left: 0; bottom: 0; transform: translateY(-50%); width: 8px; height: 8px; background: currentColor; border-radius: 50%; } #blogs .cat-content .main-subtitle { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; } #blogs .cat-content .see-all { background: var(--main-color); color: #fff; } #blogs .item figure { height: 100%; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; margin: 0 0 20px; } #blogs .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #blogs .item .text-box { } #blogs .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; } #blogs .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: var(--main-color); fill: var( --main-color); line-height: 1.1em; gap: 10px; } #blogs .item .text-box .more i { display: flex; align-items: center; } #blogs .item .text-box .more i svg { } /*********/ footer { background: #f9f9f9; } footer .footer-sec-1 { background: var(--main-color); padding: 20px 0; } footer .footer-sec-1 .container { display: flex; justify-content: space-between; align-items: center; } footer .footer-sec-1 .text { color: #ffffff; font: 400 48px var(--title-font); line-height: 1.1em; } footer .footer-sec-1 .footer-cta { display: flex; align-items: center; justify-content: space-between; gap: 15px; } footer .footer-sec-1 .footer-cta a { font: 500 16px var(--text-font); line-height: 1.2em; position: relative; display: inline-block; overflow: hidden; transition: all 0.6s ease-in-out; z-index: 1; background-color: #ffffff1a; border-radius: 10px; padding: 16px 20px 16px 20px; color: #fff; } footer .footer-sec-1 .footer-cta a span { } footer .footer-sec-2 { padding: 50px 0; } footer .footer-sec-2 a { width: fit-content; display: block; } footer .footer-sec-2 a img { width: 100%; max-width: 160px; } footer .footer-sec-3 { display: flex; align-items: flex-start; justify-content: space-between; margin: 0 0 50px; gap: 16px; } footer .footer-sec-3 .footer-text { width: calc(45.67% - 15px); display: flex; flex-direction: column; gap: 20px; } footer .footer-sec-3 .slogan { font: 400 48px var(--title-font); line-height: 1.1em; color: #262626; margin: 0 0 29px; } footer .footer-sec-3 .footer-text .footer-contact { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 22px; } footer .footer-sec-3 .footer-text .footer-contact .cont-box { width: fit-content; flex: 0 0 39%; } footer .footer-sec-3 .footer-text .footer-contact .cont-box .title { color: #838383; margin: 0 0 10px; font: 400 16px var(--text-font); line-height: 1.6em; } footer .footer-sec-3 .footer-text .footer-contact .cont-box .link { color: #262626; font: 400 17px var(--text-font); line-height: 1.1em; } footer .footer-sec-3 .footer-social { display: flex; flex-direction: column; gap: 15px; /* width: calc(19.33% - 30px); */ flex: 0 0 39%; } footer .footer-sec-3 .footer-social .social-text { } footer .footer-sec-3 .footer-social .social-text .social-title { margin: 0 0 15px; font: 400 20px var(--title-font); color: #262626; line-height: 1.1em; } footer .footer-sec-3 .footer-social .social-text .social-subtitle { font: 400 16px var(--text-font); margin: 0px 0px 10px 0px; color: #838383; line-height: 1.6em; } footer .footer-sec-3 .social-box { } footer .footer-sec-3 .social-box a { margin: 0px 12px 0px 0px; text-align: center; text-decoration: none; border-radius: 50% 50% 50% 50%; width: 36px; height: 36px; line-height: 32px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--main-color); } footer .footer-sec-3 .social-box a svg { fill: var(--main-color); width: 18px; height: auto; } footer .footer-sec-3 .social-box a svg path { } footer .footer-sec-4 { padding: 50px 0; display: flex; align-items: center; justify-content: space-between; margin: 20px 0 0; border-top: 1px solid #eeeded; } footer .footer-sec-4 .footer { } footer .footer-sec-4 .footer ul { display: flex; flex-wrap: wrap; } footer .footer-sec-4 .footer ul li { cursor: pointer; padding-right: 20px; color: #262626; font: 400 16px var(--title-font); line-height: 1.6em; } footer .footer-sec-4 .footer ul li a { color: #262626; } footer .footer-sec-4 .signature { } footer .footer-sec-4 .signature a { color: #838383; font: 400 16px var(--text-font); } footer .footer-disclaimer { /* max-width: 363px; */ /* margin-bottom: 30px; */ width: calc(50.67% - 15px); } footer .footer-disclaimer strong { display: block; margin-bottom: 8px; font: 500 16px var(--text-font); color: #262626; margin: 0 0 15px; } footer .footer-disclaimer p { font: 400 14px var(--text-font); line-height: 1.6em; color: #838383; text-align: justify; } /*********/ #contactPage { } #contactPage .infos { margin-bottom: 36px; } #contactPage .infos .info { } #contactPage .infos .info .infoTitle { margin-bottom: 12px; font: 500 17px var(--title-font); line-height: 24px; color: #333; } #contactPage .infos .info .infoContent, #contactPage .infos .info .infoContent a { width: 320px; max-width: 100%; font: 500 17px var(--text-font); line-height: 24px; color: #000; } #contactPage .maps { } #contactPage .maps iframe { width: 100%; filter: grayscale(1); } #contactPage .forms { margin: 50px 0; background: #f9f9f9; padding: 80px; border-radius: 16px; } #contactPage .forms .iletForm { padding: 0 0 0 15px; display: grid; grid-template-columns: 1fr 1fr; gap: 15px; } #contactPage .forms .iletForm .adKap { } #contactPage .forms .iletForm .satir { color: #303133; font-weight: 600; line-height: 1.75; text-align: left; } #contactPage .forms .iletForm .satir.textarea { grid-column: span 2; min-height: 175px; } #contactPage .forms .iletForm .adKap .satir { padding: 0 9px 0 0; } #contactPage .forms .iletForm .adKap .cl6:not(:first-child) .satir { padding: 0 0 0 9px; } #contactPage .forms .iletForm input, #contactPage .forms .iletForm textarea { background-color: #ffffff; width: 100%; text-align: left; transition: color 400ms cubic-bezier(.785,.135,.15,.86), background-color 400ms cubic-bezier(.785,.135,.15,.86), border-color 400ms cubic-bezier(.785,.135,.15,.86); display: block; line-height: initial; font-weight: 400; border: 1px solid transparent; font-family: inherit; padding: 16px 20px 16px 20px; width: 100%; height: 58px; border-radius: 10px 10px 10px 10px; color: #838383; } #contactPage .forms .iletForm input::placeholder, #contactPage .forms .iletForm textarea::placeholder { color: inherit; font-family: inherit; font-weight: inherit; } #contactPage .forms .iletForm input:focus, #contactPage .forms .iletForm textarea:focus { border-color: #115cfa; } #contactPage .forms .iletForm textarea { height: 100%; } #contactPage .forms .iletForm button { cursor: pointer; /* margin-top: 18px; */ color: #ffffff !important; background-color: #303133 !important; border-color: #303133 !important; width: 100%; border-radius: 24px; display: inline-block; transition: color 200ms ease-in-out, background-color 200ms ease-in-out, border-color 200ms ease-in-out; text-align: center !important; vertical-align: middle; outline: none; white-space: nowrap; box-shadow: none; font-size: 17px !important; padding: 18px 44px !important; font-family: inherit !important; letter-spacing: -.02em; text-transform: initial; font-weight: 500 !important; border: 1px solid transparent; } #contactPage .forms .iletForm button:hover { color: #303133 !important; background-color: transparent !important; border-color: #303133 !important; } #contactPage .forms .iletForm .guvenlik { display: flex; gap: 15px; align-items: center; justify-content: space-between; } #contactPage .forms .iletForm .guvenlik label { } #contactPage .forms .iletForm .guvenlik label img { } #contactPage .forms .iletForm .guvenlik input { } /*******/ #blogCat { padding: 100px 0; position: relative; overflow: hidden; } #blogCat .col4 { padding: 0 15px; margin: 0 0 30px; } #blogCat .item figure { height: 100%; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; margin: 0 0 20px; } #blogCat .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #blogCat .item .text-box { } #blogCat .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; } #blogCat .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: var(--main-color); fill: var( --main-color); line-height: 1.1em; gap: 10px; } #blogCat .item .text-box .more i { display: flex; align-items: center; } #blogCat .item .text-box .more i svg { } /*********/ #blogDet { position: relative; margin: 0 0 186px; } #blogDet .kap { background: #FFFFFF; border-radius: 16px; padding: 90px 0 90px; } #blogDet .kapsul { display: flex; justify-content: space-between; align-items: flex-start; padding: 0 0 52px; margin: 0 0 60px; border-bottom: 1px solid #b5b5b5; } #blogDet .kapsul .title { text-align: center; font: 400 36px var(--title-font); color: #000000; line-height: 132%; width: 625px; max-width: 100%; text-align: left; margin: 0; } #blogDet .kapsul .kapPub { text-align: right; } #blogDet .kapsul .kapPub .tets { font: 400 18px var(--title-font); color: #000; } #blogDet .kapsul .kapPub .conts { font: 500 24px var(--title-font); color: #0834FF; margin: 7px 0 0; } #blogDet figure.tepe { overflow: hidden; border-radius: 16px; aspect-ratio: 1288/564; position: relative; } #blogDet figure.tepe img { width: 100%; height: 100%; object-fit: cover; object-position: center; } #blogDet .metin { position: relative; margin: 30px 0 0; padding: 0 0 68px; border-bottom: 1px solid #b5b5b5; } #blogDet .metin .icerik { font: 300 18px var(--text-font); line-height: 170%; color: #222; columns: 2; } #blogDet .metin .icerik p { margin: 0 0 35px; } #blogDet .metin .icerik blockquote { border-style: solid; border-width: 0px 0px 0px 5px; border-color: #edbcb1; transition: background 0.3s, border 0.3s, border-radius 0.3s, box-shadow 0.3s; padding: 0px 40px 0px 40px; margin: 20px 0 40px; } #blogDet .metin .icerik blockquote p { padding: 10px; color: #231908; font-family: "Inter", Sans-serif; font-size: 18px; font-weight: 400; text-transform: none; font-style: normal; text-decoration: none; line-height: 1.5em; letter-spacing: 0px; margin: 0px 60px 0px 0px; } #blogDet .metin .icerik h2 { margin-bottom: 20px; color: #231908; font-size: 25px; font-weight: 400; text-transform: none; font-style: normal; text-decoration: none; line-height: 1.3em; letter-spacing: -0.4px; } #blogDet .metin .icerik ul { font-size: 15px; color: #000000; padding: 0; margin: 6px 0 0 0; } #blogDet .metin .icerik ul li { position: relative; /* display: flex; */ /* align-items: center; */ font-weight: 400; font-size: 16px; line-height: 26px; color: #5e6d77; margin-bottom: 16px; padding-left: 27px; } #blogDet .metin .icerik ul li:before { content: "\2713"; background: #CEF2E5; color: #10AC58; border-radius: 50%; font-size: 10px; width: 10px; height: 10px; text-align: center; line-height: 1; padding: 5px; margin-right: 10px; position: absolute; left: 0; top: 3px; } #blogDet .metin .icerik ol { color: #000; } #blogDet .metin .icerik ul li, #blogDet .metin .icerik ol li { margin-bottom: 20px; } /**************/ .blogGaleri { max-width: 800px; margin-right: auto; margin-left: auto; position: relative; padding: 10px; } .blogGaleri .bloggaleriSwiper { } .blogGaleri .bloggaleriSwiper figure { } .blogGaleri .bloggaleriSwiper figure img { height: auto; max-width: 100%; border: none; border-radius: 0; box-shadow: none; } .blogGaleri .swiper-pagination { } .blogGaleri .swiper-pagination-bullet { } .blogGaleri .swiper-pagination-bullet-active { background: #000; } /*******/ .otherBlogs { margin: 90px 0 0; position: relative; } .otherBlogs .otherTitle { margin: 0 0 60px; text-align: center; font: 500 34px var(--title-font); color: #171717; } .otherBlogs .item figure { height: 100%; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; margin: 0 0 20px; } .otherBlogs .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } .otherBlogs .item .text-box { } .otherBlogs .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; } .otherBlogs .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: var(--main-color); fill: var( --main-color); line-height: 1.1em; gap: 10px; } .otherBlogs .item .text-box .more i { display: flex; align-items: center; } .otherBlogs .item .text-box .more i svg { } /*******/ .otherBlogs svg { fill: #000000; width: 20px; height: 20px; } .otherBlogs .swiper-button-next:after { content: ''; width: 50px; height: 50px; position: absolute; background: #e5e5e5d6; z-index: -1; border-radius: 50%; } .otherBlogs .swiper-button-prev:after { content: ''; width: 50px; height: 50px; position: absolute; background: #e5e5e5d6; z-index: -1; border-radius: 50%; } .otherBlogs .swiper-button-next { top: 260px; right: -15px; left: initial; } .otherBlogs .swiper-button-prev { top: 260px; left: -14px; transform: rotate(180deg); } /*********/ #teamsCat { padding: 100px 0; position: relative; overflow: hidden; } #teamsCat .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #teamsCat .item { position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #teamsCat .item figure { height: 390px; width: 100%; overflow: hidden; border-radius: 20px 20px 0 0; position: relative; } #teamsCat .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #teamsCat .item .text-box { background: #f9f9f9; padding: 30px; height: calc(100% - 392px); } #teamsCat .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; margin: 0 0 5px; } #teamsCat .item .text-box .subtitle { color: #838383; font: 400 16px var(--text-font); line-height: 1.6em; } /*********/ #teamsDet { padding: 100px 0; position: relative; } #teamsDet .grid { display: flex; } #teamsDet .personal-info { width: 33.33%; } #teamsDet .personal-info .item { position: sticky; top: 30px; padding: 10px; } #teamsDet .personal-info .item figure { width: 100%; max-width: 100%; height: 402px; border-radius: 20px 20px 0px 0px; position: relative; overflow: hidden; } #teamsDet .personal-info .item figure img { width: 100%; max-width: 100%; aspect-ratio: 1 / 0.975; object-fit: cover; } #teamsDet .personal-info .item .text-box { } #teamsDet .personal-info .item .text-box ul { background-color: #f9f9f9; padding: 30px; } #teamsDet .personal-info .item .text-box ul li { display: flex; align-items: center; position: relative; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; } #teamsDet .personal-info .item .text-box ul li:not(:last-child) { padding-block-end: calc(40px / 2); } #teamsDet .personal-info .item .text-box ul li:not(:first-child) { margin-block-start: calc(40px / 2); } #teamsDet .personal-info .item .text-box ul li:not(:last-child):after { content: ""; inset-block-end: 0; position: absolute; width: 100%; border-color: #eeeded; border-block-start-style: solid; border-block-start-width: 1px; } #teamsDet .personal-info .item .text-box ul li strong { width: 35%; display: inline-flex; font: 400 20px var(--title-font); color: #262626; flex-shrink: 0; } #teamsDet .personal-info .item .text-box ul li a { font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; } #teamsDet .personal-info .item .text-box .teams-follow { background-color: #9b9a84; padding: 12px 30px; display: flex; align-items: center;,: 0 1auto; gap: 20px; border-radius: 0 0 20px 20px; } #teamsDet .personal-info .item .text-box .teams-follow span { font: 400 20px var(--title-font); line-height: 1.1em; color: #fff; } #teamsDet .personal-info .item .text-box .teams-follow .socials { display: flex; align-items: center; justify-content: flex-start; gap: 9px; } #teamsDet .personal-info .item .text-box .teams-follow .socials a { border: 1px solid #fff; border-radius: 50%; background: transparent; display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; color: #fff; } #teamsDet .personal-info .item .text-box .teams-follow .socials a svg { width: 18px; height: auto; fill: currentColor; } #teamsDet .personal-detail { width: 66%; padding: 10px 10px 10px 50px; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; } #teamsDet .personal-detail h2 { font: 400 41px var(--title-font); line-height: 1.1em; color: #262626; margin: 0 0 20px; } #teamsDet .personal-detail p { line-height: 1.6em; margin-bottom: 1.6em; } #teamsDet .personal-detail ul { margin: 0 0 15px; } #teamsDet .personal-detail ul li { margin: 10px 0 0; padding: 0 0 10px; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; position: relative; padding: 0 0 0 31px; } #teamsDet .personal-detail ul li:first-child { margin: 0; } #teamsDet .personal-detail ul li:before { content: ""; width: 21px; height: 21px; position: absolute; background-image: url(/r/check-mark.png); background-size: contain; background-repeat: no-repeat; flex-shrink: 0; display: inline-block; left: 0; top: 3px; } /*********/ #kurumsal { padding: 100px 0; } #kurumsal .banner { margin: 0 auto; padding-bottom: 108px; max-width: 100%; color: #292929; font-size: 55px; font-weight: 100 !important; line-height: 67px; margin: 0; } #kurumsal .banner strong { color: var(--main-color); display: block } #kurumsal .banner-content { margin: 15px 0 50px; font-size: 21px; color: #585858; line-height: 36px; font-weight: 300; } #kurumsal .banner-content p:not(:first-child) { margin: 15px 0 0; display: block; } #kurumsal figure.figure-action { height: 60vh; border-radius: 16px; } #kurumsal figure.figure-action img { width: 100%; height: 100%; object-fit: cover; } #kurumsal .about-us { display: flex; margin: 75px 0 0; } #kurumsal .about-us .title { padding: 0 0 0 36px; margin: 0; font-size: 24px; color: #303133; line-height: 1.5; font-weight: 500 !important; width: 33.33%; } #kurumsal .content { padding: 0px 0px 0px 36px; font-size: 18px; line-height: 1.75; text-align: left; color: #777; font-weight: 300; width: 66.67%; } #kurumsal .content h2 { margin: 0; font-size: 24px; color: #303133; line-height: 1.5; font-weight: 500 !important } #kurumsal .content h2:not(:first-child) { margin-top: 18px; padding-top: 36px; } #kurumsal .content p:not(:first-child) { margin-top: 18px; } #kurumsal .content ul { margin-top: 18px; list-style: disc; margin-left: 37px; } #kurumsal .content ul li { } /**********/ #servicesCat { position: relative; overflow: hidden; padding: 100px 0; } #servicesCat .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #servicesCat .item { position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #servicesCat .item:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; opacity: 50%; width: 100%; height: 100%; z-index: 1; background: #262626; } #servicesCat .item figure { height: 390px; width: 100%; overflow: hidden; border-radius: 20px; } #servicesCat .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #servicesCat .item:hover figure img { transform: scale(1.1); } #servicesCat .item .text-box { position: absolute; top: 30px; left: 30px; bottom: 30px; right: 30px; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; } #servicesCat .item .text-box .title { color: #fff; font: 400 20px var(--title-font); width: 210px; max-width: 100%; line-height: 1.1em; text-transform: lowercase; } #servicesCat .item .text-box .more { display: flex; align-items: center; justify-content: space-between; font: 500 16px var(--text-font); color: #fff; fill: #fff; line-height: 1.2em; } #servicesCat .item .text-box .more i { display: flex; align-items: center; } #servicesCat .item .text-box .more i svg { } /*********/ #faqPage { margin: 75px 0; overflow: hidden; } #faqPage .row.wrap { margin: 0 -15px; } #faqPage .item { position: relative; background: #f7f7f7; margin: 0 15px 30px; padding: 25px; overflow: hidden; cursor: pointer; } #faqPage .item a.baslik { position: relative; font: 600 18px var(--text-font); color: #252525; display: flex; align-items: flex-start; width: 100%; justify-content: space-between; gap: 15px; } #faqPage .item a.baslik h3 { font: 500 17px var(--text-font); color: #000; margin: 0; line-height: 25px; } #faqPage .item:hover a.baslik h3 { color: #fff } #faqPage .item a.baslik .showBox { position: relative; width: 32px; height: 32px; background: #ffffff; border-radius: 100%; } #faqPage .item a.baslik .showBox:before { content: ""; position: absolute; background: #000; width: 16px; height: 1px; top: 50%; left: 50%; transform: translate(-50%,-50%); } #faqPage .item a.baslik .showBox:after { content: ""; position: absolute; background: #000; width: 1px; height: 16px; top: 50%; left: 50%; transform: translate(-50%,-50%); } #faqPage .item .icerik { z-index: 1; position: relative; margin: 20px 0 10px; font: 400 16px var(--text-font); line-height: 25px; color: #252525; display: none; } #faqPage .item:before { content: ''; display: block; position: absolute; top: 0; bottom: 0; left: -15%; right: 0; width: 0; height: 106%; transform: skew(45deg); transition: all 0.4s ease-in-out; } #faqPage .item:hover, #faqPage .item:focus { color: #ffffff; } #faqPage .item:hover:before { width: 100%; transform: skew(0deg); left: 0; background: var(--main-color2) !important; z-index: 0; } #faqPage .item:hover .baslik { color: #ffffff; } #faqPage .item:hover .icerik { color: #ffffff; } #faqPage .item.active { height: auto; } #faqPage .item.active a.baslik { } #faqPage .item.active .icerik { } #faqPage .item a.baslik .showBox:before, #faqPage .item a.baslik .showBox:after { transition: transform 0.3s ease, opacity 0.3s ease; } #faqPage .item.active a.baslik .showBox:after { transform: rotate(90deg); top: 8px; opacity: 0; } /*******/ .icerikDet { padding: 50px 0 75px; } .icerikDet .kisaOzet { font-size: 18px; font-style: italic; font-weight: 500; line-height: 30px; letter-spacing: 1px; } .icerikDet .icerik { font-size: 16px; line-height: 27px; letter-spacing: 1px; color: #333 } .icerikDet .icerik p { margin: 10px 0; } .icerikDet .icerik ul { list-style: circle; margin-left: 25px; line-height: 35px; } .icerikDet .icerik ul li { } .icerikDet .icerik ul li::marker { color: var(--main-color) } .icerikDet .icerik a { } .icerikDet .icerik span { } /*******/ .icerikSag { padding-left: 25px !important; } .icerikSag .icerikDetsag { padding: 32px 32px 32px 32px; background: #ababab2b; margin-bottom: 40px; } .icerikSag .icerikDetsag .title { color: #333; margin: 0 0 20px; font: 700 24px var(--title-font); line-height: 36px; text-transform: uppercase; } #icerikDetCat { } #icerikDetCat ul { } #icerikDetCat ul li { list-style: none; position: relative; padding-left: 16px; font-size: 18px; line-height: 1.5; margin-bottom: 16px; padding-bottom: 16px; } #icerikDetCat ul li:before { position: absolute; content: ""; left: 0; top: 12px; height: 6px; width: 6px; background-color: var(--main-color); } #icerikDetCat ul li:after { content: ""; position: absolute; left: 0; bottom: 0; height: 1px; width: 100%; background-color: rgba(72, 30, 11, 0.07); } #icerikDetCat ul li a { display: flex; justify-content: space-between; align-items: center; } #icerikDetCat ul li span { } #icerikDetCat ul li:last-child { margin-bottom: 0; padding-bottom: 0; } #icerikDetCat ul li:last-child::after { display: none } #icerikDetson { } #icerikDetson ul { } #icerikDetson ul li { display: flex; align-items: center; margin-bottom: 20px; } #icerikDetson ul li .resim { flex: 0 0 auto; margin-right: 20px; width: 100px; height: 100px; } #icerikDetson ul li .resim img { width: 100%; height: 100%; object-fit: cover; } #icerikDetson ul li .kap { } #icerikDetson ul li .kap .baslik { } #icerikDetson ul li .kap .baslik a { margin-bottom: 13px; color: #333; font: 600 16px var(--title-font); line-height: 24px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } #icerikDetson ul li .kap time { font: 400 14px var(--text-font); line-height: 25px; display: flex; align-items: center; color: #333; } #icerikDetson ul li .kap time i { margin-right: 5px; display: flex; align-items: center; justify-content: center; } #icerikDetson ul li .kap time i svg { fill: var(--main-color2); margin-top: -2px; } #icerikDetson ul li:last-child { margin-bottom: 0 } #icerikfollow { } #icerikfollow .social { display: flex; align-items: center; } #icerikfollow .social a { color: #020e27; padding: 10px; display: flex; align-items: center; justify-content: center; margin-right: 10px; background: #bfaaa3; } #icerikfollow .social a:hover { opacity: 1; background: #fbfbfb; box-shadow: 0 0 2px 2px #0000000f; } #icerikfollow .social a svg { display: block; fill: #fff; width: 20px; height: 20px; } #icerikfollow .social a:hover svg { fill: var(--main-color); } #icerikfollow .social a.yout:hover svg path { fill: var(--main-color); } #icerikfollow .social a.inst svg .st0 { stroke: #fff; } #icerikfollow .social a.inst:hover svg .st0 { stroke: var(--main-color); } /***********/ .servicesTepe { margin: 50px 0 0; position: relative; z-index: 45; } .servicesTepe .row { align-items: flex-end; } .servicesTepe .kap0 { } .servicesTepe .kap0 h1 { color: #232323; margin: 0; font: 700 64px var(--title-font); line-height: 160%; } .servicesTepe .shares { } .servicesTepe .shares .share-item { } .servicesTepe .shares .share-wrapper { } .servicesTepe .shares .share-wrapper li { } .servicesTepe .shares .share-wrapper li a { } .servicesTepe .shares .share-wrapper li a svg { } /*******/ .servicesTepe button.share { background: #FFFFFF; border: 1px solid #DEDEDE; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 4px 12px rgba(0, 0, 0, 0.05); border-radius: 40px; width: 44px; height: 44px; display: block; text-align: center; line-height: 44px; margin: -56px 0 0 auto; z-index: 99; position: relative; } .servicesTepe button.share svg { width: 16px; height: auto; vertical-align: middle; } .servicesTepe button.share span { color: #444; font-size: 15px; font-weight: 400 } .servicesTepe button.share:hover span { color: #000 } /*******/ .servicesTepe .sharKap { position: relative; margin: 0px 0px 0 0; } .servicesTepe .sharKap ul { margin: 15px 0 0; } .servicesTepe .sharKap ul li { display: inline-block; } .servicesTepe .sharKap ul li a { color: var(--main-color2); background-color: transparent; border: 1px solid var(--main-color2); text-align: center; padding: 8px 0px 0px 0px; border-radius: 50px 50px 50px 50px; width: 32px; height: 32px; line-height: 0px; display: block; cursor: pointer; overflow: hidden; position: relative; margin-left: auto; } .servicesTepe .sharKap ul li a:hover { background: var(--main-color2); color: #fff; } .servicesTepe .sharKap ul li a i { } .servicesTepe .sharKap ul li a i svg { width: 12px; height: auto; vertical-align: middle; display: inline-block; fill: currentColor; } /******/ #services-figure { position: relative; overflow: hidden; width: 100%; height: 55vh; margin: 25px 0; } #services-figure figure { width: 100%; height: 100%; overflow: hidden; } #services-figure figure img { width: 100%; height: 100%; object-fit: cover; object-position: center; } /******/ .servicesGalery { height: 59vh; margin: 0 0 50px; position: relative; } .servicesGalery .servicesGalerySwiper { height: 100%; } .servicesGalery figure { position: relative; display: block; width: 100%; height: 100%; aspect-ratio: 16/9; } .servicesGalery figure img { width: 100%; height: 100%; position: relative; display: block; object-position: center; object-fit: cover; } .servicesGalery .swiper-button-next, .servicesGalery .swiper-button-prev { width: 42px; height: 42px; display: flex; justify-content: center; align-items: center; border-radius: 100%; font-size: 25px; z-index: 1; margin: 0 40px; cursor: pointer; position: absolute; top: 50%; transform: translateY(-50%); border: 1px solid #fff; fill: #fff; } .servicesGalery .swiper-button-prev { transform: rotate(180deg); top: calc(50% - 21px); } .servicesGalery .swiper-button-next:after, .servicesGalery .swiper-button-prev:after { display: none; } .servicesGalery .swiper-button-next svg, .servicesGalery .swiper-button-prev svg { width: 1em; height: 1em; position: relative; overflow: hidden; transition: all 0.3s ease-in-out; } /*******/ #servicesDet { margin-top: 50px; } #servicesDet .services-info { } #servicesDet .services-info .kisaOzet { font-size: 18px; line-height: 26px; color: #232323; margin: 0 0 20px; } #servicesDet .services-info .icerik { font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; } #servicesDet .services-info .icerik h2 { font: 400 41px var(--title-font); line-height: 1.1em; color: #262626; margin: 0 0 20px; } #servicesDet .services-info .icerik p:not(:last-child) { margin: 0 0 20px; } #servicesDet .services-info .icerik ul { margin: 0 0 15px; } #servicesDet .services-info .icerik ul li { margin: 10px 0 0; padding: 0 0 10px; font: 400 16px var(--text-font); line-height: 1.6em; color: #838383; position: relative; padding: 0 0 0 31px; } #servicesDet .services-info .icerik ul li:first-child { margin: 0; } #servicesDet .services-info .icerik ul li:before { content: ""; width: 21px; height: 21px; position: absolute; background-image: url(/r/check-mark.png); background-size: contain; background-repeat: no-repeat; flex-shrink: 0; display: inline-block; left: 0; top: 3px; } #servicesDet blockquote { background: #f9f9f9; margin: 35px 0; padding: 30px; border-radius: 16px; } /*********/ #servicesDet .services-faq { padding: 25px 0 0; margin: 30px 0 0; border-top: 1px solid #eaeef3; } #servicesDet .services-faq h2 { font: 700 26px var(--text-font); line-height: 36px; color: #232323; margin: 0 0 20px; text-transform: capitalize; } #servicesDet .services-faq #collapsouter { margin-top: 32px; } #servicesDet .services-faq .collapsible { background: #FCFCFC; border: 1px solid #DEDEDE; box-sizing: border-box; border-radius: 16px; padding: 16px; margin-bottom: 12px; } #servicesDet .services-faq h3.collapsible-header { font: 500 18px var(--text-font); line-height: 28px; color: #1a2b48; margin: 0; width: 100%; display: flex; align-items: center; cursor: pointer; gap: 5px; } #servicesDet .services-faq h3.collapsible-header svg { margin-right: 13px; width: 20px; height: auto; flex-shrink: 0; } #servicesDet .services-faq .toggle-icon { flex-shrink: 0; width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; position: relative; cursor: pointer; margin: 0 0 0 auto; transition: transform 0.3s; border: 1px solid #232323; border-radius: 50%; } #servicesDet .services-faq .toggle-icon::before, #servicesDet .services-faq .toggle-icon::after { content: ''; width: 12px; height: 1px; background-color: currentColor; position: absolute; transition: all 0.3s ease-out; } #servicesDet .services-faq .toggle-icon::after { transform: rotate(90deg); } #servicesDet .services-faq .collapsible-content { max-height: 0; overflow: hidden; transition: max-height 0.4s ease-out, padding 0.3s ease-out; padding: 0 0 0 0; color: #444; line-height: 26px; } #servicesDet .services-faq .collapsible-content p { margin: 18px 0; } #servicesDet .services-faq .collapsible.open { } #servicesDet .services-faq .collapsible.open .collapsible-content { display: block; } #servicesDet .services-faq .collapsible.open .toggle-icon, #servicesDet .services-faq .collapsible.open .toggle-icon { background: var(--main-color); border-color: var(--main-color); color: #fff; } #servicesDet .services-faq .collapsible.open .toggle-icon::before, #servicesDet .services-faq .collapsible.open .toggle-icon::after { transform: rotate(180deg); } /******/ #servicesBilgi { border: 1px solid #ebebeb; padding: 15px; margin-left: 35px; position: sticky; top: 50px; } #servicesBilgi form { display: block; padding: 0; position: relative; } #servicesBilgi form .formRez { } #servicesBilgi form .formRez .baslik { color: var(--main-color2); font: 600 18px var(--text-font); padding-bottom: 20px; } #servicesBilgi form .formRez .satir1 { } #servicesBilgi form .formRez .satir2 { } #servicesBilgi form .formRez .satir3 { } #servicesBilgi form .formRez .satir1 input, #servicesBilgi form .formRez .satir1 textarea { cursor: pointer; position: relative; padding: 12px 15px; background: #fff; width: 100%; line-height: 22px; text-transform: none; color: #8e8e8e; border: 1px solid #dedede; box-shadow: none; border-radius: 1px; transition: all ease .3s; font-size: 15px; margin-bottom: 15px; } #servicesBilgi form .formRez input::placeholder, #servicesBilgi form .formRez textarea::placeholder { font: 400 16px var(--text-font); color: #8e8e8e !important; } #servicesBilgi form .formRez input:focus, #servicesBilgi form .formRez textarea:focus { outline: none; box-shadow: none; background: #fff; color: #8e8e8e !important; } #servicesBilgi form .formRez .satir2 select { display: none; } #servicesBilgi form .formRez .satir2 .select-satir { cursor: pointer; position: relative; padding: 12px 15px; background: #fff; width: 100%; line-height: 22px; text-transform: none; color: #8e8e8e; border: 1px solid #dedede; box-shadow: none; border-radius: 1px; transition: all ease .3s; font-size: 15px; margin-bottom: 15px; } #servicesBilgi form .formRez .satir2 .select-selected { color: #8e8e8e; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: block; font: 400 16px var(--text-font); line-height: 23px; } #servicesBilgi form .formRez .satir2 .select-hide { display: none; } #servicesBilgi form .formRez .satir2 .select-items { position: absolute; top: 44px; max-height: 500px; overflow-y: auto; width: 100%; z-index: 50; left: 0; box-shadow: 0px 2px 2px 1px #00000008; } #servicesBilgi form .formRez .satir2 .select-items div { padding: 10px 30px; background: #fff; color: #8e8e8e; border-top: 1px solid #ececec; text-align: center; width: 100%; cursor: pointer; font: 400 16px var(--text-font); line-height: 25px; } #servicesBilgi form .formRez .satir2 .select-items div:hover { background: #aa8453; color: #fff; } #servicesBilgi form .formRez .satir2 .select-items div:first-child { border-top: none } #servicesBilgi form .formRez .satir2 .select-items div:first-child { border-bottom: 1px solid #ececec; } #servicesBilgi form .formRez .satir2 .select-items div.same-as-selected { background: #aa8453; color: #fff; } #servicesBilgi form .formRez button { display: block; padding: 0; border: none; margin: 0; width: 100%; background: var(--main-color); border: 1px solid var(--main-color); color: #fff; font: 500 15px var(--text-font); text-decoration: none; line-height: 62px; position: relative; cursor: pointer; transition: all 0.3s ease-out; letter-spacing: 3px; text-transform: uppercase; } /********/ #ilgiliUrun { margin: 80px 0px 40px; border-top: 1px solid rgba(119, 119, 119, 0.2); padding: 40px 0px; overflow: hidden; } #ilgiliUrun .kap { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin: 0 0 70px; } #ilgiliUrun h2 { font: 700 36px var(--title-font); line-height: 46px; margin: 0; color: #232323; } #ilgiliUrun .ilgiliSwiper { } #ilgiliUrun .item { position: relative; overflow: hidden; height: 100%; border-radius: 20px; } #ilgiliUrun .item:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; opacity: 50%; width: 100%; height: 100%; z-index: 1; background: #262626; } #ilgiliUrun .item figure { height: 390px; width: 100%; overflow: hidden; border-radius: 20px; } #ilgiliUrun .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #ilgiliUrun .item:hover figure img { transform: scale(1.1); } #ilgiliUrun .item .text-box { position: absolute; top: 30px; left: 30px; bottom: 30px; right: 30px; z-index: 9; display: flex; flex-direction: column; justify-content: space-between; } #ilgiliUrun .item .text-box .title { color: #fff; font: 400 20px var(--title-font); width: 210px; max-width: 100%; line-height: 1.1em; text-transform: lowercase; } #ilgiliUrun .item .text-box .more { display: flex; align-items: center; justify-content: space-between; font: 500 16px var(--text-font); color: #fff; fill: #fff; line-height: 1.2em; } #ilgiliUrun .item .text-box .more i { display: flex; align-items: center; } #ilgiliUrun .item .text-box .more i svg { } /*******/ #ilgiliUrun .oklar { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; } #ilgiliUrun .swiper-button-next, #ilgiliUrun .swiper-button-prev { position: relative; width: 40px; height: 40px; border: 1px solid #DEDEDE !important; box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.08), 0px 4px 12px rgba(0, 0, 0, 0.05); border-radius: 50px; left: initial; right: initial; } #ilgiliUrun .swiper-button-next { } #ilgiliUrun .swiper-button-prev { } #ilgiliUrun .swiper-button-next:after, #ilgiliUrun .swiper-button-prev:after { font-size: 18px; color: #232323; } /*********/ nav.icMenu { background: transparent; margin-right: 30px; } nav.icMenu a { position: relative; display: block; color: #252525; text-decoration: none; margin-bottom: 8px; font-size: 16px; padding: 15px 22px 15px 15px; font-weight: 400; border-radius: 4px; background: #dedede; } nav.icMenu a:hover { color: var(--main-color); background: #e5e5e5; } nav.icMenu a.active { color: #fff; background: var(--main-color); } nav.icMenu a.active:after { position: absolute; top: 50%; right: 10px; width: 8px; height: 8px; content: ''; margin-left: -5px; border-right: 2px solid #ffffff; border-bottom: 2px solid #ffffff; transform: rotate( -45deg) translateY(-50%); box-sizing: border-box; } /****/ nav.sayfaMenu a { display: block } nav.sayfaMenu a.first { display: none } /********/ #kurumsal { /* margin: 50px 0; */ } #kurumsal .icerik { font: 400 16px var(--text-font); line-height: 33px; color: #252525; } #kurumsal .icerik h2 { color: #b3771e; font: 700 26px var(--title-font); margin: 0 0 10px; position: relative; } #kurumsal .icerik img { height: auto !important; } #kurumsal .icerik p { margin-bottom: 10px; } #kurumsal .icerik a { color: #0080ff; } #kurumsal .icerik a:hover { color: var(--main-color); } #kurumsal .icerik ul { list-style: disc; margin-left: 30px } #kurumsal .icerik ul li { padding-bottom: 3px; position: relative; line-height: 30px } #kurumsal .icerik ul li::marker { color: #252525; } #kurumsal .icerik table { width: 100% !important; height: auto !important; border: 1px solid #dedede; } #kurumsal .icerik table tbody { } #kurumsal .icerik table tbody tr { height: auto !important; } #kurumsal .icerik table tbody tr:hover { background: #f1f1f1; } #kurumsal .icerik table tbody tr td { height: auto !important; padding: 10px; cursor: pointer; } #kurumsal .col4.partKap { padding: 0 12px; margin: 0 0 24px; } #kurumsal .item.partner { border-radius: 12px; background-color: #f3f3f3; min-height: 100px; padding-right: 1.2rem; padding-left: 1.2rem; display: flex; flex-wrap: nowrap; justify-content: center; width: 100%; } #kurumsal .item.partner figure { } #kurumsal .item.partner figure img { filter: grayscale(1); transition: .4s ease; mix-blend-mode: darken; } #kurumsal .item.partner:hover figure img { filter: grayscale(0); } /****************/ #sozlesmeCat { padding: 75px 0; position: relative; background: linear-gradient(180deg, white 0%, white 356px, #f6f6f6 356px, #f6f6f6 100%); } #sozlesmeCat .item { background: #e9e9e9; transition: .3s linear; position: relative; margin: 0 10px 30px; overflow: hidden; display: flex; align-items: flex-start; flex-direction: column; height: calc(100% - 20px); } #sozlesmeCat .item .metin { padding: 44px 30px 30px 30px; width: 100%; } #sozlesmeCat .item .metin .baslik { display: block; font: 600 20px var(--text-font); padding: 0; margin: 0; margin-bottom: 8px; line-height: 28px; color: #313033; word-wrap: break-word; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; } #sozlesmeCat .item .more { font: 400 14px var(--text-font); background: none; color: #6f5948; text-transform: capitalize; position: relative; /* margin-top: 15px; */ display: flex; align-items: center; justify-content: flex-end; width: 100%; /* padding: 15px 0; */ } #sozlesmeCat .item .more svg { margin-left: 5px; } #sozlesmeCat .item .more svg g { fill: currentColor; } #sozlesmeCat .item:hover { } /*************/ #programsCat { position: relative; overflow: hidden; padding: 100px 0; } #programsCat .grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 30px; padding: 10px; } #programsCat .item { position: relative; overflow: hidden; border-radius: 20px; } #programsCat .item:before { content: ''; position: absolute; top: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: 1; background-image: radial-gradient(#26262600 65.21%, #262626CC 100%); } #programsCat .item figure { height: 610px; width: 100%; overflow: hidden; border-radius: 20px; position: relative; } #programsCat .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #programsCat .item .badge { width: fit-content; padding: 10px; /* background: #fff; */ backdrop-filter: blur(10px); font: 400 16px var(--text-font); color: #fff; border-radius: 12px; } #programsCat .item .text-box { position: absolute; top: 30px; left: 30px; width: calc(100% - 60px); height: calc(100% - 60px); display: flex; flex-direction: column; justify-content: space-between; /* align-items: center; */ z-index: 99; } #programsCat .item .text-box .title { color: #fff; font: 400 48px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; /* text-align: center; */ } #programsCat .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: #fff; fill: #fff; line-height: 1.1em; gap: 10px; } #programsCat .item .text-box .more i { display: flex; align-items: center; } #programsCat .item .text-box .more i svg { } /*********/ #examsCat { position: relative; overflow: hidden; padding: 100px 0; } #examsCat .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #examsCat .item { position: relative; } #examsCat .item figure { height: 295px; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; margin: 0 0 20px; } #examsCat .item figure img { width: 100%; height: 100%; object-fit: cover; transition: all 0.4s ease-in-out; } #examsCat .item .text-box { } #examsCat .item .text-box .title { color: #262626; font: 400 20px var(--title-font); line-height: 1.1em; display: block; margin-bottom: 15px; text-transform: capitalize; } #examsCat .item .text-box .more { display: flex; align-items: center; justify-content: flex-start; font: 500 16px var(--text-font); color: var(--main-color); fill: var( --main-color); line-height: 1.1em; gap: 10px; } #examsCat .item .text-box .more i { display: flex; align-items: center; } #examsCat .item .text-box .more i svg { } /*********/ #partnersCat { position: relative; overflow: hidden; padding: 100px 0; } #partnersCat .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 30px 30px; padding: 10px; } #partnersCat .item { position: relative; border: 1px solid var(--main-color); border-radius: 16px; overflow: hidden; padding: 10px; } #partnersCat .item figure { height: 137px; width: 100%; overflow: hidden; border-radius: 20px; position: relative; aspect-ratio: 1 / 0.72 !important; } #partnersCat .item figure img { width: 100%; height: 100%; object-fit: contain; transition: all 0.4s ease-in-out; } /*********/ #kariyerCat { position: relative; overflow: hidden; padding: 100px 0; } #kariyerCat .grid { display: grid; grid-template-columns: 1fr; gap: 30px 30px; padding: 10px; } #kariyerCat .item { height: 121px; margin: 0 0 30px; border: 1px solid #ededed; border-radius: 12px; padding: 30px 35px; } #kariyerCat .item .text-box { display: flex; align-items: center; justify-content: space-between; } #kariyerCat .item .text-box .title { font: 400 24px var(--text-font); line-height: 66px; color: #000; } #kariyerCat .item .text-box .more { padding: 18px 30px; background: var(--main-color); border-radius: 64px; font: 600 18px var(--text-font); color: #fff; width: 245px; height: 61px; display: flex; align-items: center; justify-content: space-between; } #kariyerCat .item .text-box .more i { display: flex; align-items: center; } #kariyerCat .item .text-box .more i svg { } #kariyerCat .item .text-box .more:hover { background: #2E468A } /*********/ #kariyerDet { margin: 100px 0 0 0; position: relative; } #kariyerDet .metin { } #kariyerDet .metin .kisaOzet { display: flex; align-items: flex-start; justify-content: space-between } #kariyerDet .metin .kisaOzet h2 { width: 25%; display: block; font: 500 24px var(--title-font); color: #000; line-height: 32px; margin: 0; } #kariyerDet .metin .kisaOzet ul { width: 75%; } #kariyerDet .metin .kisaOzet ul li { margin: 0 0 25px; position: relative; padding: 0 0 0 30px; font: 400 20px var(--text-font); line-height: 32px; color: #838383; } #kariyerDet .metin .kisaOzet ul li:last-child { margin: 0 } #kariyerDet .metin .kisaOzet ul li:before { content: ""; position: absolute; top: 13px; left: 5px; width: 4px; height: 4px; background: var(--main-color3); border-radius: 50%; } #kariyerDet .metin .kisaOzet ul li:after { content: ""; position: absolute; width: 14px; height: 14px; top: 8px; left: 0; background: var(--main-color3); opacity: .1; border-radius: 50%; } #kariyerDet .metin .icerik { display: flex; align-items: flex-start; justify-content: space-between; margin: 104px 0 0; } #kariyerDet .metin .icerik h2 { width: 25%; display: block; font: 500 24px var(--title-font); color: #000; line-height: 32px; margin: 0; } #kariyerDet .metin .icerik ul { width: 75%; } #kariyerDet .metin .icerik ul li { margin: 0 0 25px; position: relative; padding: 0 0 0 30px; font: 400 20px var(--text-font); line-height: 32px; color: #838383; } #kariyerDet .metin .icerik ul li:before { content: ""; position: absolute; top: 13px; left: 5px; width: 4px; height: 4px; background: var(--main-color2); border-radius: 50%; } #kariyerDet .metin .icerik ul li:after { content: ""; position: absolute; width: 14px; height: 14px; top: 8px; left: 0; background: var(--main-color2); opacity: .1; border-radius: 50%; } /**************/ #kariyerBasvuru { margin: 116px 0 50px 0; } #kariyerBasvuru .solKap { height: 100%; display: flex; flex-direction: column; justify-content: space-between; } #kariyerBasvuru .solKap .baslik { font: 500 24px var(--title-font); color: #000; line-height: 32px; width: 168px; max-width: 100%; margin-top: 30px } #kariyerBasvuru .solKap .wantMore { margin: 0 0 85px 0; } #kariyerBasvuru .solKap .wantMore span { font: 300 16px var(--text-font); color: #000; margin: 0 0 25px; display: block; } #kariyerBasvuru .solKap .wantMore .back { width: 202px; height: 46px; font: 300 16px var(--text-font); padding: 12px 21px; background: var(--main-color); border-radius: 40px; color: #fff; display: block; width: fit-content; } /**************/ #kariyerBasvuru .formKap { border: 1px solid #e6e6e6; border-radius: 12px; padding: 66px 70px 34px 70px; } #kariyerBasvuru .formKap .tit { font: 400 18px var(--text-font); color: #000; margin: 0 0 48px; } #kariyerBasvuru .cvForm { } #kariyerBasvuru .cvForm .form-floating { position: relative; } #kariyerBasvuru .cvForm .mb-3 { margin-bottom: 20px !important; } #kariyerBasvuru .form-control { display: block; width: 100%; font-size: 1rem; font-weight: 400; color: #212529; appearance: none; background-color: #fff; background-clip: padding-box; border: 1px solid #dee2e6; border-radius: 8px; transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out; } #kariyerBasvuru .form-floating > .form-control { height: 65px; line-height: 1.25; padding: 42px 20px 21px 20px; font-size: 20px; } #kariyerBasvuru .form-floating > label { display: inline-block; position: absolute; top: 0; left: 0; z-index: 2; height: 100%; padding: 21px 20px; overflow: hidden; text-align: start; text-overflow: ellipsis; white-space: nowrap; pointer-events: none; border: 1px solid transparent; transform-origin: 0 0; transition: opacity .1s ease-in-out, transform .1s ease-in-out; font-size: 18px; color: #000; font-weight: 400; } #kariyerBasvuru .form-floating > .form-control:focus, #iletFormBil .form-floating > .form-control:not(:placeholder-shown) { padding-top: 1.625rem; padding-bottom: .625rem; } #kariyerBasvuru .form-floating > .form-control:not(:placeholder-shown) ~ label { color: #212529a6; transform: scale(.85) translateY(-.5rem) translateX(.15rem); } #kariyerBasvuru .form-floating > .form-control:focus ~ label::after, #iletFormBil .form-floating > .form-control:not(:placeholder-shown) ~ label::after { position: absolute; inset: 1rem 0.375rem; z-index: -1; height: 1.5em; content: ""; background-color: #fff; border-radius: 0.375rem; } #kariyerBasvuru .form-floating > .form-control::placeholder { color: transparent; } #kariyerBasvuru .form-floating > .form-control:focus { padding-top: 1.625rem; padding-bottom: .625rem; border-color: var(--main-color); } #kariyerBasvuru .form-floating > .form-control:focus ~ label { color: #212529a6; transform: scale(.85) translateY(-.5rem) translateX(.15rem); } #kariyerBasvuru form .satir { margin-bottom: 15px; width: 100%; } #kariyerBasvuru form .satir.guvenlik { display: flex; align-items: center; justify-content: space-between; } #kariyerBasvuru form .satir.guvenlik label { padding-left: 0; height: 74px; width: 136px; } #kariyerBasvuru form .satir.guvenlik label img { width: 100%; margin-top: 14px; } #kariyerBasvuru form .satir.guvenlik .form-floating { margin: 0 0 0 10px; width: 80%; } #kariyerBasvuru form .satir.guvenlik .form-floating label { width: auto; height: 100%; padding: 1rem .75rem; } #kariyerBasvuru form button { color: #fff; background: var(--main-color); display: flex; font: 600 16px var(--text-font); align-items: center; justify-content: center; gap: 60px; cursor: pointer; margin: 25px auto 0; border: none; padding: 16px 45px; width: 100%; text-align: center; } /**************/ #kariyerBasvuru .satirFile { color: #000000; text-align: center; display: block; position: relative; vertical-align: middle; cursor: pointer; user-select: none; border: 0; border-radius: 4px; appearance: none; font: 600 14px var(--text-font); line-height: 20px; background-color: #fff; background-clip: padding-box; border: 1px solid #dee2e6; padding: 1rem .75rem; } #kariyerBasvuru .satirFile input[type="file"] { position: absolute; margin: 0; padding: 0; left: 0; top: 0; width: 100%; opacity: 0; font-size: 0; } #kariyerBasvuru .satirFile input[type="file"]::placeholder { font-size: 1rem; font-weight: 400; color: #212529; } #kariyerBasvuru .satirFile label { cursor: default; font: 400 18px var(--text-font); color: #212529; padding: 8px; text-align: center; overflow-wrap: break-word; display: flex; align-items: center; justify-content: space-between; gap: 7px; width: 100%; margin: -14px 0; } #kariyerBasvuru .satirFile label .upText { } #kariyerBasvuru .satirFile label .upFile { display: flex; align-items: center; justify-content: center; width: fit-content; background: var(--main-color); color: #fff; gap: 10px; padding: 9px 12px; border-radius: 6px; } #kariyerBasvuru .satirFile label .upFile svg path { stroke: currentColor; } /**************/ /* Responsive */ @media (max-width: 768px) { footer .footer-disclaimer { width: 100% } footer .footer-sec-3 { flex-direction: column; align-items: flex-start; gap: 30px; } footer .footer-sec-3 .footer-text { width: calc(100% - 15px); } footer .footer-sec-3 .footer-text .slogan { font-size: 28px; } footer .footer-sec-3 .footer-text .footer-contact { flex-direction: column; gap: 20px; } footer .footer-sec-3 .footer-social { width: calc(100% - 30px); } footer .footer-sec-4 { flex-direction: column; gap: 20px; padding: 25px 0; align-items: flex-start; } footer .footer-sec-4 .footer { width: 100%; } footer .footer-sec-4 .footer ul { margin: 0; white-space: nowrap; margin: 10px 0 0 0; width: 100%; text-align: left; overflow-x: auto; display: block } footer .footer-sec-4 .footer ul li { width: fit-content; display: inline-block; } footer .footer-sec-4 .signature { display: flex; align-items: center; justify-content: center; width: 100%; gap: 6px; } footer tr td { text-align: center !important; } /*************/ nav.icMenu { margin: 0 0 20px; } nav.icMenu.sayfaMenu a { display: none } nav.icMenu.sayfaMenu a.first { display: block; padding-right: 43px !important; display: flex; justify-content: space-between; } nav.icMenu.sayfaMenu a.first span { font-size: 13px; } nav.icMenu a.active:after { top: 43%; right: 15px; border: none; border-right: 2px solid #ffffff; border-top: 2px solid; } nav.icMenu a.active.acilmadi:after { border: none; border-left: 2px solid #ffffff; border-bottom: 2px solid; } /****/ .servicesGalery figure { /* height: 32vh; */ } #servicesBilgi { margin: 35px 0 0; } /*************/ #mainHome { padding: 50px 0; } #mainHome .figureKap .k0 { width: 225px; height: 110px; } #mainHome .figureKap .k2 { width: calc(60% - 10px); } #mainHome .figureKap .k1 { width: calc(40% - 10px); height: 248px; } #mainHome .text-box { padding: 10px; } #mainHome .text-box .subtitle { font-size: 26px; line-height: 1.4em; } #mainHome .text-box .subtext { margin: -5px 0 10px 0; } #mainHome .text-box .content table tbody tr { flex-direction: column; gap: 20px; } #mainHome .text-box .content table tbody tr td { width: calc(100% - 15px); } #mainHome .text-box .link-box { gap: 20px } /*************/ #services { padding: 50px 0; } #services .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #services .cat-content .kap { width: 100%; } #services .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } #services .grid { grid-template-columns: 1fr; gap: 20px; } #services .item figure { height: 340px; } /*************/ #whyUs { padding: 50px 0; } #whyUs .flex { flex-direction: column-reverse; gap: 20px; } #whyUs .item { width: calc(100% - 15px); } #whyUs .item .text-box .subtext { font-size: 26px; line-height: 1.3em; } #whyUs .item .text-box .key-value { flex-direction: column; align-items: flex-start; gap: 20px; } #whyUs .item .text-box .key-value .keybox { width: calc(100% - 15px); } #whyUs .item .kap { flex-direction: column-reverse; align-items: flex-start; } #whyUs .item .kap .text-2 { width: calc(100% - 15px); } #whyUs .item .kap .smFigure { width: 100%; } #whyUs .bgFigure { width: calc(100% - 15px); height: 285px; } /*************/ #programs { padding: 50px 0; } #programs .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #programs .cat-content .kap { width: 100%; } #programs .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } #programs .item figure { height: 437px; } /*************/ #exams { padding: 50px 0; } #exams .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #exams .cat-content .kap { width: 100%; } #exams .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } /*************/ #team { padding: 50px 0; } #team .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #team .cat-content .kap { width: 100%; } #team .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } #team .grid { grid-template-columns: 1fr; gap: 20px; } #team .item figure { } /*************/ #process { padding: 50px 0; } #process .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #process .cat-content .kap { width: 100%; } #process .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } #process .item { flex-direction: column; gap: 30px; } #process .item .keybox { width: calc(100% - 30px); flex-direction: row; align-items: center; } #process .item .keybox:nth-child(odd) { background-image: none; } #process .item .keybox:nth-child(even) { background-image: none; flex-direction: row; } #process .item .keybox .icon { width: 60px; height: 60px; font-size: 30px; } #process .item .keybox .text-box { width: calc(100% - 90px); } /*************/ #blogs { padding: 50px 0; } #blogs .cat-content { flex-direction: column; align-items: flex-start; gap: 15px; } #blogs .cat-content .kap { width: 100%; } #blogs .cat-content .main-subtitle { font-size: 26px; line-height: 1.3em; } /*************/ #kurumsal { padding: 50px 0; } #kurumsal .banner { font-size: 29px; line-height: 43px; padding-bottom: 46px; } #kurumsal figure.figure-action { height: 36vh; } #kurumsal .about-us { flex-direction: column; margin: 50px 0 0; } #kurumsal .about-us .title { width: 100%; margin: 0 0 26px; padding: 0; } #kurumsal .content { width: 100%; padding: 0; } /*************/ #servicesCat { padding: 50px 0 } #servicesCat .grid { grid-template-columns: 1fr; gap: 20px; } #servicesCat .item figure { height: 340px; } /*************/ .servicesTepe .kap0 h1 { font-size: 40px; } .servicesTepe button.share { margin: 27px 0 0 auto; } /*************/ #services-figure { height: auto; } /*************/ #ilgiliUrun .kap { flex-direction: column; } #ilgiliUrun .item figure { height: 340px; } /*************/ #programsCat { padding: 50px 0 } #programsCat .grid { grid-template-columns: 1fr; gap: 20px; } #programsCat .item figure { height: 340px; } /*************/ #examsCat { padding: 50px 0 } #examsCat .grid { grid-template-columns: 1fr; gap: 20px; } #examsCat .item figure { height: 340px; width: 100%; aspect-ratio: auto !important; } #examsCat .item { width: 100%; } /*************/ .servicesGalery { height: 43vh; } .servicesGalery .swiper-button-next, .servicesGalery .swiper-button-prev { margin: 0 10px; } /*************/ #teamsCat { padding: 50px 0; } #teamsCat .grid { grid-template-columns: 1fr; gap: 20px; } #teamsCat .item figure { } /*************/ #teamsDet { padding: 50px 0; } #teamsDet .grid { flex-direction: column; } #teamsDet .personal-info { width: 100%; } #teamsDet .personal-info .item figure img { aspect-ratio: auto; height: 100%; } #teamsDet .personal-info .item .text-box ul { padding: 30px 20px; } #teamsDet .personal-info .item .text-box .teams-follow { padding: 12px 20px; justify-content: space-between; } #teamsDet .personal-detail { width: 100%; padding: 50px 0 0; } /*************/ #partnersCat { padding: 50px 0; } #partnersCat .grid { grid-template-columns: 1fr; gap: 20px; } /*************/ #kariyerCat { padding: 50px 0; } #kariyerCat .kapsul { margin: 0 0 35px; } #kariyerCat .kapsul .title { font-size: 34px; } #kariyerCat .item { display: block; padding: 20px 30px; margin-bottom: 12px; height: auto; } #kariyerCat .item .text-box { display: block; } #kariyerCat .item .text-box .title { font-size: 20px; line-height: 32px; margin-bottom: 12px } #kariyerCat .item .text-box .more { font-size: 16px; width: fit-content; height: 46px; border-radius: 49px; padding: 11px 20px 13px 20px; /* margin-top: 15px; */ gap: 21px; } /*********/ #kariyerDet .metin .kisaOzet, #kariyerDet .metin .icerik { flex-direction: column; gap: 20px; } #kariyerDet .metin .kisaOzet h2, #kariyerDet .metin .icerik h2 { width: 100%; } #kariyerDet .metin .kisaOzet ul, #kariyerDet .metin .icerik ul { width: 100%; } #kariyerDet .metin .icerik { margin: 50px 0 0; } /*********/ #kariyerBasvuru .row { } #kariyerBasvuru .row { display: flex; flex-wrap: wrap } #kariyerBasvuru .row .col3 { order: 2; margin-top: 36px; } #kariyerBasvuru .row .col8 { order: 1 } #kariyerBasvuru .formKap { padding: 0; border: none; } #kariyerBasvuru .solKap .baslik { width: 100%; margin: 0 0 22px; } /*********/ #blogCat { padding: 50px 0; } /*************/ #blogDet .kap { padding: 60px 0px 90px; } #blogDet .kapsul { flex-direction: column; gap: 35px; padding: 0 0 45px; margin: 0 0 30px; } #blogDet .kapsul .title { font-size: 28px; } #blogDet .kapsul .kapPub { text-align: left; } #blogDet .kapsul .kapPub .tets { font-size: 16px; } #blogDet .kapsul .kapPub .conts { font-size: 20px; } /******/ #blogDet figure.tepe { } /******/ #blogDet .metin { margin: 35px 0 0; } #blogDet .metin .icerik { columns: 1; font-size: 18px; } #blogDet .metin .icerik p { margin: 0 0 15px; } /******/ .otherBlogs { margin: 50px 0 0; } .otherBlogs .otherTitle { font-size: 27px; margin: 0 0 50px; } .otherBlogs .item figure { height: 275px; } .otherBlogs .item .content { padding: 20px 25px; } /******/ .otherBlogs .swiper-button-prev { left: 11px; } .otherBlogs .swiper-button-next { right: 10px; } .otherBlogs .item .content .baslik { -webkit-line-clamp: 3; } /*************/ #contactPage .infos .info { margin: 0 0 30px; } #contactPage .forms { padding: 40px 25px; } #contactPage .forms .iletForm { padding: 0; display: block; } #contactPage .forms .iletForm .satir { width: 100%; margin: 0 0 21px; } #contactPage .forms .iletForm .guvenlik { display: flex; flex-wrap: nowrap; } #contactPage .forms .iletForm .guvenlik input { width: fit-content } #contactPage .forms .iletForm .satir.textarea { min-height: auto } /*********/ }