h1,h2,h3,h4,p,strong,b,ul,li { margin:0px; padding:0px; list-style:none; } a { text-decoration:none; color:#666 } button, input { outline: none; } body { margin: 0; padding: 0; font-family: 'Poppins', sans-serif ; font-size: 16px; overflow-x:hidden; content: none; } input,select,textarea,button { font-family: 'Poppins', sans-serif; border-radius: 9px; } .bold { font-weight: bold;} .ciz { text-decoration: line-through; } .innerbox { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .txtcrop { width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .clear:after { display: inline-table; clear: both; content: ''; } .COMPUTER { } .MOBILE { display: none; } @media screen and (max-width: 1000px) { .COMPUTER { display: none; } .MOBILE { display: block; } } .mobil-menu-ikonu { position: fixed; top: 10px; right: 10px; z-index: 900; background: #000; color: #fff; padding: 10px; } .mobil-menu-ikonu i { font-size: 24px} .mobil-menu-ikonu:hover { cursor: pointer; } .mobil-kategori-ikonu { position: fixed; top: 10px; left: 10px; z-index: 900; background: #000; color: #fff; padding: 10px; } .mobil-kategori-ikonu i { font-size: 24px} .mobil-kategori-ikonu:hover { cursor: pointer; } .fullbg { width: 100%; height: 350px; object-fit: cover; position: relative; z-index: 30} #clear { clear:both } .ara:hover { cursor: pointer } .ara-u { width:100%; height:100%; background:rgba(0,0,0,0.8); position:fixed; top:0; left:0; z-index:9000; text-align:center; color:#fff; transition:All 0.2000s ease; -webkit-transition:All 0.2000s ease; -moz-transition:All 0.2000s ease; -o-transition:All 0.2000s ease; } .footer-link a { display: inline-block; padding: 6px 7px; font-size: 13px; color: #000; letter-spacing: 1px; text-decoration: underline; } .footer-link a:hover { color: #FD0662} .share { text-align: center; } .paylas-gurubu { display: inline-block; color: #000; } .paylas-gurubu a { display: inline-block; } .paylas-gurubu a:hover { cursor: pointer; opacity: 0.5 } .paylas-gurubu i { line-height: 35px; width: 35px; height: 35px; text-align: center; color: #000; } .ara-u h1 { font-size:40px; font-weight:100; padding:10% 0px 20px 0px; letter-spacing:1px } .ara-u .ara-i { border:1px solid #fff; background:none; outline:none; padding:0px 20px; color:#fff; width:calc(50% - 150px); height:80px; font-size:28px;} .ara-u .ara-kapat { font-size:30px; position:fixed; top:30px; left:50%; margin-left:-20px; color:#fff; padding:10px; } .ara-u .ara-kapat:hover { background:#000; color:#fff; cursor:pointer; } .ara-u .ara-b { border:1px solid #fff; background:none; outline:none; padding:0px 20px; color:#fff; width:calc(90px); height:82px; font-size:28px;} .ara-u .ara-b:hover { background:#FFF; color:#000; cursor:pointer; } .ara-u .gelendegerler { background:#fff; width:calc(50% - 108px); margin:0 auto; } .ara-u .gelendegerler .s-li { padding:20px 15px; color:#000; text-align:left; } .ara-u .gelendegerler .s-li:hover { background:#f4f4f4 } .ara-K { -webkit-transform: scale(0); -moz-transform: scale(0); -o-transform: scale(0); -ms-transform: scale(0); transform: scale(0); } .ARANANYOK { border: 1px solid #ccc; background: #f2f2f2; text-align: center; padding: 40px} .YUKLENME { background:#fff; position:fixed; left:0; top:0; width:100%; height:100%; z-index:50000; } .YUKLENME img { width:90px; position:absolute; left:50%; top:40%; margin-left:-45px; -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */ filter: grayscale(100%); } .loaderLOGO { position:absolute; left:50%; top:50%; width: 400px; margin-left:-200px; margin-top:-200px; animation: bounce 0.2s; animation-direction: alternate; animation-timing-function: cubic-bezier(.5,0.05,1,.5); animation-iteration-count: infinite;} .loaderX { position:absolute; left:50%; top:50%; width: 80px; height: 80px; margin-left:-40px; margin-top:-40px; border: 2px solid #004e9c; border-top:2px solid #fff; border-radius: 50%; animation: spin 1s linear infinite; } .loaderTXT { position: fixed; width: 100%; text-align: center; top: 50%; margin-top: -20px; font-size: 20px } .loaderTXT i { font-size: 40px; color: #004e9c;} blockquote { background-color: #f2f2f2; border-left: 1em solid #000; margin: 1.5em 0 1.5em; padding: 1em 1.5em 1em 2.5em; position: relative; } blockquote:before { color: #000; content: "\201C"; font-size: 5em; position:absolute; left:5px; top: 0.6em; line-height: 0.1em; } blockquote:after { color: #000; content: "\201D"; font-size: 5em; position:absolute; right:3px; bottom: 0em; line-height: 0.1em; } @-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } } @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } } @keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } } /********************************** MESAJ UYARISI *********************************/ .UYARIBOX { position:fixed; width:100%; height:100%; z-index:5000; background:rgba(0,0,0,0.8); left:0; top:0; display:none } .UYARIBOX .uyari-a { font-size:18px; color:#fff; text-align:center; } .UYARIBOX .uyari-a .uyari-kapat { padding:8px; background:#FFF; color:#000; font-size:30px; display:inline-block; position:absolute; top:50px; right:50px; } .UYARIBOX .uyari-a .uyari-kapat:hover { background:#000; color:#fff; cursor:pointer; } .UYARIBOX .uyari-a .mesaj { position:fixed; top:45%; text-align:center; padding:0px 10%; width:80%; } /********************************** MESAJ UYARISI *********************************/ /********************************** MESAJ UYARISI *********************************/ .UYARIBOX-2 { position:fixed; width:100%; height:100%; z-index:5000; background:rgba(0,0,0,0.8); left:0; top:0; display:none } .UYARIBOX-2 .uyari-a-2 { font-size:18px; color:#000; text-align:center; padding: 20px; width: 400px; background: #fff; position: fixed; left: 50%; top: 40%; margin-left: -150px; border-radius: 8px } .UYARIBOX-2 .uyari-a-2 .uyari-kapat { padding:8px; background:#FFF; color:#000; font-size:24px; display:inline-block; position:absolute; top:10px; right:10px; border-radius: 6px; } .UYARIBOX-2 .uyari-a-2 .uyari-kapat:hover { background:#000; color:#fff; cursor:pointer; } .UYARIBOX-2 .uyari-a-2 .mesaj-2 { padding: 30px 0px } /********************************** MESAJ UYARISI *********************************/ @media screen and (max-width: 1000px) { .UYARIBOX-2 .uyari-a-2 { width: calc(90% - 40px); left: 5%; margin-left: 0; } .UYARIBOX .uyari-a { width: calc(90% - 40px); left: 5%; margin-left: 0; } } .IN:after { clear: both; content: ""; display: table; } .clear:after { clear: both; content: ""; display: table; } .INCONTENT { position: relative; width: 100%; z-index: 2; background: #fff; box-shadow: 0px 0px 25px -16px rgba(0,0,0,0.75); transition:All 0.5s ease; } .NLOGIN { position:fixed; width: 100%; height: 100%; left: 0; top:0; background: rgba(0,0,0,0.5); z-index:4000; overflow: auto; display: none; } #NLOGIN { width: 400px; left: 50%; margin-left: -200px; background: #fff; top: 30%; position: absolute; margin-bottom: 100px; } #NLOGIN .loginkapat { position: absolute; right: 0px; top: -30px; font-size: 19px; background: #fff; color:#000; padding: 10px } #NLOGIN .loginkapat:hover { background: #000; color: #fff; cursor: pointer; } ul.LOGINTAB { list-style: none; margin: 0; padding: 10px; } ul.LOGINTAB li { width: calc(100% / 2 - 20px); padding:10px; color: #fff; background: #000; float: left; text-align: center; } ul.LOGINTAB li.active { background: #fff; color:#000} ul.LOGINTAB li:hover { background: #fff; color: #000; cursor: pointer} ul.LOGINCONTENT { list-style: none; margin: 0; padding: 10px; } ul.LOGINCONTENT li { display: none } ul.LOGINCONTENT li.active { display: block } .RESFORM { padding:10px; } .RESFORM p { padding:10px 0px; } .RESFORM .text-i { width: calc(100% - 2px - 30px); height: 50px; border: 1px solid #ccc; padding: 0px 15px; outline: none; } .RESFORM .BUTON { background: #000; color: #fff; padding: 0px 15px; height: 50px; line-height: 50px; margin-top: 10px; text-align: center; } .RESFORM .BUTON:hover { background: #464646; cursor: pointer; } .allbg { position: absolute; width: 100%; height: 100%; left: 0; top: 0; background-position:center center; background-size: cover; } .KUTU { padding:5px; text-align: center; } .KUTU .DROP1 { width: calc(50% - 10px); height: 510px; float: left; margin: 5px; position: relative; background: #000 } .KUTU .DROP2 { width: calc(50% - 10px); height: 250px; float: left; margin: 5px; position: relative; } .KUTU .DROP3 { width: calc(50% - 10px); height: 250px; float: left; margin: 5px; position: relative; } .KUTU h2 { padding-top: 90px; font-weight: 400 } .KUTU a { display: inline-block; padding: 8px 10px; background: #000; color: #fff; margin-top: 10px } .KUTU a:hover { background: #555; } .KUTU .DI { position: absolute; bottom: 50px; width: calc(100% - 60px); padding: 0px 30px } .KUTU h2, p { } .G-CONTENT { } .G-CONTENT .IN { max-width: 1200px; margin: 0 auto; text-align: center; position: relative; } .G-CONTENT .IN h1 { color: #fff; } .G-CONTENT .IN .li { width: calc(100% / 3); float: left; color: #fff; } .TAGS { padding-top: 40px } .TAGS a { display: inline-block; padding:8px 10px; color: #fff; background: #000; font-size: 12px; border-radius:6px; } .TAGS a:hover { background:#666} .ARAMA { padding: 60px 0px; background: #f2f2f2 } .ARAMA .IN { max-width: 1200px; margin: 0 auto; position: relative; } .SONUCLARI { padding: 60px 0px; } .SONUCLARI .IN { max-width: 1200px; margin: 0 auto; position: relative; } .SONUCLARI .IN .li { padding: 40px 0px;} .SONUCLARI .IN .li h2 { font-size: 18px; text-transform: uppercase; } .SONUCLARI .IN .li p { font-size: 14px; } .SONUCLARI .IN .li .item-btn { padding: 8px 10px; background: #000; color: #fff; font-size: 14px; border-radius: 30px; margin-top: 15px; display: inline-block } .SONUCLARI .IN .li .item-content { } .content { max-width: 1300px; margin: 0 auto; } .min-content{ max-width: 650px; box-sizing: border-box } @media screen and (max-width: 1000px) { .min-content{ max-width: 100%; } } .minder { border-bottom: 1px solid #ccc; font-size: 14px } .minder a { display: inline-block; padding: 0px 10px; } .minder a:first-child { font-weight: 700; color: #000 } .ust-tasarim { } .ust-tasarim p { display: inline-block; padding: 0px 15px } .ust-tasarim p i { color: #000; } .ust-tasarim a { display: inline-block; } .ust-tasarim a i { padding: 0px 8px; color: #000; } .IKONBAR { font-size: 14px; background: #047862; color: #fff; } .IKONBAR i { display: inline-block; width: 100%; font-size: 36px; text-align: center; padding: 6px 0px; } .IKONBAR .colon { } .IKONBAR .colon p { padding: 30px; border-radius: 8px; } .allow { background: #fff; box-shadow: 15px 15px 20px #f2f2f2; border: 1px solid #f2f2f2; color: #828282; } .page-sayfalama { padding: 35px } .page-sayfalama a { display: inline-block; line-height: 35px; color: #fff; background: #047862; width: 35px; height: 35px; border-radius: 4px; text-align: center; } .page-sayfalama .aktif { background: #152d47; } .icerik-yok { background: #FFECD7; color: #000; padding: 30px; text-align: center; border-radius: 9px; } .menu-bar-2 { background: #047862; } .ikon-menu img { width: 55px; } .ikon-menu .colon { color: #fff; } .ikon-menu .colon a {font-weight: 600; letter-spacing: 1px; } .ikon-menu .colon:hover { background: rgba(0,0,0,0.1)} .menu-bar { background: #047862; } ul.MENU { transition: 0.5s; } ul.MENU > div { } ul.MENU > div > a { color: #000; display: inline-block; padding: 0px 15px; box-sizing: border-box; font-weight: 800; position: relative; z-index: 5; float: left; letter-spacing: 1px; } ul.MENU > div > a span { font-size: 12px; font-weight: 500; opacity: 0.5} ul.MENU > div > a:hover { color: #047862 } ul.MENU .bf a::before { position: absolute; left: 0; bottom: 0; content: ''; z-index: -1; width: 100%; height: 7%; transition: all 0.5s ; background: #000} ul.MENU .bf a:hover::before { height: 100%; } @media screen and (max-width: 1000px) { ul.MENU { position: fixed; z-index: 800; left: -100%; top: 0; width: 100%; height: 100%; background: #fff; display: flex; align-content: stretch; align-items: center } ul.MENU > div > a { display: inline-table; width: 100%; line-height: 40px; } } .top-menu { background: #047862; color: #fff; } header { position: relative; z-index: 600; } header .logo { transition: 0.5s; padding: 5px 30px; height: 100px; } header .MENULER { float: right; line-height: 70px; height: 70px; position: absolute; top: 20px; right: 0px; } header .MENULER .sepetlink { color: #000; padding: 0px 20px } header .MENULER .sepetlink i { padding: 0px 4px} header .MENULER > a { color: #000; padding: 0px 8px } header .sepetlink > a { color: #000; padding: 0px 8px } header .DIL { position: absolute; top: 12px; right: 20px; z-index: 2000 } header .DIL a { display:inline-block; } header .DIL a.acdil { } header .DIL img { width: 25px; } @media screen and (max-width: 1000px) { header { } header .logo { width: 90%; height: auto } } .border-1 { border: 1px solid #f2f2f2; } .sol-menu { } .sol-menu a { line-height:40px; color: #000 } .bg-tema { background:#3f3f3f; color: #fff; } .VIDEOLU { background: #f4dfd3} .VIDEOLU .IN { max-width: 1300px; margin: 0 auto; padding: 40px 0px; position: relative; } .VIDEOLU .IN .col-2 { width: calc(100% / 2); float: left; position: relative; min-height: 350px; } .VIDEOLU .IN .col-2 .FILM { position: absolute; width: 100%; height: 100%; object-fit: cover; left: 0; top: 0; -webkit-box-shadow: 0px 0px 33px -16px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 33px -16px rgba(0,0,0,0.75); box-shadow: 0px 0px 33px -16px rgba(0,0,0,0.75); } .VIDEOLU .IN .col-2 .txt { padding: 0px 0px 0px 80px} .VIDEOLU .IN .col-2 .txt img { padding-right: 15px} @media screen and (max-width: 1000px) { .VIDEOLU { background: #f4dfd3; margin: 20px; border-radius: 15px; overflow: hidden; } .VIDEOLU .IN { padding: 0px 0px; position: relative; } .VIDEOLU .IN .col-2 { width: calc(100% / 1); } .VIDEOLU .IN .col-2 .txt { padding:20px} .VIDEOLU .IN .col-2 .txt h1 { font-size:20px} } .black-bg { } .ISARET { height:45px; position: absolute; top: 0; right:50px; z-index: 60} @media screen and (max-width: 1000px) { .ISARET { display: none; } } .VIDEOLU2 { position: relative; } .VIDEOLU2 .IN { max-width: 1300px; margin: 0 auto; padding: 60px 0px; position: relative; } .VIDEOLU2 .IN .AB-CNT { width: calc(100% / 2 - 60px); float: left; position: relative; min-height: 350px; padding: 0px 60px 0px 0px } .VIDEOLU2 img { width: 50%; height: 100%; top: 0; right: 0; object-fit: cover; position: absolute; } .VIDEOLU2 p { } @media screen and (max-width: 1000px) { .VIDEOLU2 { display: none } } .LINKLI { position: relative; } .LINKLI .IN { max-width: 1200px; margin: 0 auto; padding: 40px 0px; position: relative; } .LINKLI .IN .AB-CNT { width: calc(100% / 2 - 60px); float: left; position: relative; min-height: 350px; padding:100px 60px 100px 0px } .LINKLI img { width: 50%; height: 100%; top: 0; right: 0; object-fit: cover; position: absolute; } .LINKLI p { line-height: 80px; border-bottom: 1px solid #ccc} .LINKLI p a { display: inline-block; float: right; } .LINKLI p:hover { background: #f4f4f4} .SOCIAL { } .SOCIAL .IN { max-width: 1200px; margin: 0 auto; padding: 90px 0px; position: relative; text-align: center; } .SOCIAL .IN a { display: inline-block; color: #000; padding: 8px 15px; margin-top: 10px; font-weight:900; letter-spacing: 1px; border: 1px solid #000 } .SOCIAL .IN a:hover { color: #fff; background: #000} .SOCIAL .IN .col-2 { width: 50%; float: left;} @media screen and (max-width: 1000px) { .SOCIAL { display: none } } .KUTUM { width:80px; height: 90px; position: relative; display: inline-block; } .KUTUM .box-fx { text-align: center; background-color: #3ecd3b; transform-origin: center; border-radius: 500px; z-index: 60; width: 60px; height: 60px; position: absolute; left: 50%; top: 50%; margin-left: -30px; margin-top:-30px; } .KUTUM .box-fx i { line-height: 60px; font-size: 30px; color: #fff; font-weight: normal } .KUTUM .box-1 { animation-duration: 2s; animation-iteration-count: infinite; background-color: #3ecd3b; transform-origin: center; border-radius: 500px; z-index: 20; width: 0px; height: 0px; position: absolute; left: 50%; top: 50%; margin-left: 0; margin-top: 0; } .KUTUM .box-2 { animation-duration: 3s; animation-iteration-count: infinite; background-color: #3ecd3b; transform-origin: center; border-radius: 500px; z-index: 30; width: 0px; height: 0px; position: absolute; left: 50%; top: 50%; margin-left: 0; margin-top: 0; } .KUTUM .bounce-2 { animation-name: bounce-2; animation-timing-function: ease; } @keyframes bounce-2 { 0% { width: 0px ; height: 0px; } 80% { width: 200px ; height: 200px; margin-left: -100px; margin-top:-100px; } 100% { opacity: 0} } .bg-mavi { background-color: #228ae6 !important;} .MYCONTACT { position: fixed; width: 100px; height: 100px; bottom: 50px; right: 0px; z-index: 5000; text-align: center} .MYCONTACT p { position: relative; z-index: 80; font-size: 11px; display: inline-block; background: #fff; padding: 8px; border-radius: 30px; line-height: 15px; } @media screen and (max-width: 1000px) { .MYCONTACT { display: none } } .VIDEOLU3 { position: relative; background: #ecf0f1 } .VIDEOLU3 .IN { margin: 0 auto; padding: 0px 0px; position: relative; } .VIDEOLU3 .IN .AB-CNT { width: calc(100% / 2 - 200px); float:right; position: relative; min-height: 350px; padding: 100px 100px } .VIDEOLU3 img { width: 50%; height: 100%; top: 0; left: 0; object-fit: cover; position: absolute; } .VIDEOLU3 .IN .AB-CNT .PFORM { position: relative; z-index: 10} .bg-anim-1 { animation-name: soldansaga; animation-timing-function: ease; animation-duration: 2s; animation-iteration-count: infinite; position: absolute; z-index: 0; width: 35px; height: 100%; left: 0; top: 0; background: #fff } @keyframes soldansaga { 0% { width: 0px ; } 80% { width: 20% ; } 100% { opacity: 0; left: 80%; } } @media screen and (max-width: 1000px) { .VIDEOLU3 { border-radius: 15px; margin:20px; overflow: hidden; } .VIDEOLU3 img { display: none } .VIDEOLU3 .IN .AB-CNT { width: calc(100% / 1 - 70px); float:right; position: relative; padding: 30px 35px } } @keyframes flipXa { 0% { opacity:0; transform: perspective(400px) translateZ(0) rotateY(0) scale(1); } 100% { opacity:1; transform: perspective(400px) translateZ(0) rotateY(360deg) scale(1); } } .flipXa{ opacity:0; animation: flipXa 2s cubic-bezier(0.2, 0.3, 0.25, 0.9) forwards; animation-iteration-count: infinite; animation-timing-function: ease; } .USTBAR { width: 100%; margin: 0 auto; z-index: 10; background: rgb(198,108,214); background: -moz-linear-gradient(90deg, rgba(198,108,214,1) 0%, rgba(50,36,175,1) 100%); background: -webkit-linear-gradient(90deg, rgba(198,108,214,1) 0%, rgba(50,36,175,1) 100%); background: linear-gradient(90deg, rgba(198,108,214,1) 0%, rgba(50,36,175,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#c66cd6",endColorstr="#3224af",GradientType=1); } .USTBAR .IN { max-width: 1200px; margin: 0 auto; text-align: center; position: relative;} .USTBAR .LOGINLER { float: right;} .USTBAR .LOGINLER .col {position: relative; float: left; padding: 0px 15px; font-size: 14px; color: #fff; } .USTBAR .LOGINLER .col i { line-height: 50px; padding-right: 10px } .USTBAR .LOGINLER .col .bildirim { position: absolute; background: rgba(255,0,4,1.00); padding: 2px; font-size: 12px; right: 0px; top: 0px; line-height: normal; color: #fff; } .USTBAR .LOGINLER .col:hover { background: #000; color: #fff; } .USTBAR .LOGINLER .col-btn { background: #FCC400; color: #000} .WP-FIX { position: fixed; z-index: 2000; right: 20px; bottom: 20px; background: #2cb742; color: #fff; width: 50px; font-size: 28px; text-align: center; display: none; } .WP-FIX i { line-height: 50px; } .WP-FIX:hover { cursor: pointer; background:#000 } .PH-FIX { position: fixed; z-index: 2000; left: 20px; bottom: 20px; background: #21c4b3; color: #fff; width: 50px; font-size: 28px; text-align: center; display: none; } .PH-FIX i { line-height: 50px; } .PH-FIX:hover { cursor: pointer; background:#000 } .MENU-M { position: fixed; z-index: 2000; right: 8px; top: 8px; color: #fff; background: #000; width: 50px; font-size: 28px; text-align: center; display: none; } .MENU-M i { line-height: 50px; } .MENU-M:hover { cursor: pointer; background:#000 } .MENU-MOBIL { position: fixed; left:-100%; top:0; z-index:5; width: 100%; height: 100%; background: #fff } .MENU-MOBIL ul { margin: 0px 0px 0px 30%} .MENU-MOBIL ul li { line-height: 60px; font-size:26px; color: #000; border-bottom: 1px solid #ccc; } .MENU-MOBIL .DIL { position: absolute; bottom: 10px; width: 100%; text-align: center; } .MENU-MOBIL .DIL .li { display: inline-block; color: #666; font-size: 15px; line-height: 50px; margin-right: 15px } .MENU-MOBIL .DIL .li:after { content: ''; clear: both; display: table; } .MENU-MOBIL .DIL .li img { height: 20px; float:left; padding-right: 10px; margin-top: 15px } .in-co-1 { left:0%; } .MOBIL-HEADER { padding: 0px 0px; display: none; } .MOBIL-HEADER img { height: 70px; padding-left: 30px; } @media screen and (max-width: 1000px) { .BAR { display: none; } .PH-FIX, .WP-FIX, .MENU-M, .MOBIL-HEADER { display: block; } /**:first-child { color: lime;} **/ } @media screen and (max-width: 1400px) { } .GUS { left: 0; top: 0; z-index: 1; position: relative; } .GUS .slides-container { z-index:10 } .GUS .slides-navigation { z-index:200; display:none ;} .GUS .slides-navigation .prev { left:20px; } .GUS .slides-navigation .next { right:20px; } .GUS .slides-navigation .material-icons { background:#fff; padding:10px; color:#000 } .GUS .slides-navigation .material-icons:hover { color:#fff; background:#b7a165; } .GUS .slides-pagination { position:absolute; top:300px; right: 0px; z-index:20; width:auto; text-align: center; padding: 15px; } .GUS a { background: #506d7f; border-radius: 25px; width: 15px; height: 15px; display:block; margin-bottom: 5px; overflow: hidden; text-indent: -200%; } .GUS a.current { background: #000 } .IMG-BANNER { background:#2355a1; color: #fff; } .IMG-BANNER > div { padding: 10px 0px; } .IMG-BANNER > div i { line-height: 40px; width: 100%; font-size: 30px; } .tepe-arama { position: relative; z-index: 0; } .tepe-arama button { position: absolute; font-size: 20px; top: 10px; right: 10px; background: none; outline: none; border:none } .tepe-arama button:hover { cursor: pointer; color: #ccc; } .DERGILIK { position: absolute; bottom: 30px; right: 30px; z-index: 60; padding-left: 180px} .DERGILIK img { width: 180px; position: relative; z-index: 10} .DERGILIK .li { background: #000; padding: 8px 0px 8px 0px; width: 100%; position: absolute; color: #fff; top: 30%; left: 0; z-index: 1;} .DERGILIK .li .baslik { font-size: 16px; font-weight: 700; padding-left: 15px; } .DERGILIK .li .icerik { font-size: 14px; padding-left: 15px; } .DARSLIDER { position: relative; } .DARSLIDER .owl-nav { position: absolute; width: 100%; bottom: 10px; right: 0; text-align: center; z-index: 9999; display: none} .DARSLIDER .owl-nav i { padding: 10px; color: #000; background: #fff; margin: 0px } .DARSLIDER .owl-dots { display: block; position: absolute; width:100%; bottom: 10px; left: 0px; text-align: center; z-index: 9999; display: none } .DARSLIDER .owl-dots .owl-dot { display: inline-block; width: 25px; height: 8px; border: 1px solid #000; margin: 2px; border-radius: 100px} .DARSLIDER .owl-dots .active { background: #000; } .DARSLIDER .li { position: relative; z-index: 1 } .DARSLIDER .li .text { position: absolute; bottom:0px; left:0px; width: 100%; height: 100%; padding: 0px 0px 0px 0px; color: #fff; } .DARSLIDER .li .text a { display: inline-block; background: #006ab5; color: #fff; padding: 9px 25px; margin-top: 15px; border-radius: 30px; letter-spacing: 1px ; font-size: 13px; font-weight: 800; } .DARSLIDER .li .text a:hover { background: #fff; color: #000} .DARSLIDER .li .text > div { box-sizing: border-box; width:90%; margin: 0 auto; } .DARSLIDER .li .text h1 { opacity: 0; padding: 0px 0px; } .DARSLIDER .li .text p { font-size: 19px; font-weight: 300; opacity: 0; padding: 0px 0px;} .DARSLIDER .li .text strong { display: inline-block; background: rgba(0,0,0,0.6); font-weight: 500; padding: 4px 15px; margin-bottom: 10px; border-radius: 6px;} .DARSLIDER .active .text h1:nth-of-type(1){ animation-duration: 1s; animation-iteration-count: 1; animation-name: data-1; animation-timing-function: ease; animation-fill-mode:both; } .DARSLIDER .active .text h1:nth-of-type(2){ animation-duration: 3s; animation-iteration-count: 1; animation-name: data-1; animation-timing-function: ease; animation-fill-mode:both; } .DARSLIDER .active .text h1:nth-of-type(3){ animation-duration: 5s; animation-iteration-count: 1; animation-name: data-1; animation-timing-function: ease; animation-fill-mode:both; } .DARSLIDER .active .text p { animation-duration:2s; animation-iteration-count: 1; animation-name: data-2; animation-timing-function: ease; animation-fill-mode:both; } .DARSLIDER .slider-maske { position: absolute; left: 0; bottom: -3px; z-index: 500; width: 100%; } .DARSLIDER .cat-ikon { position: absolute; bottom: 0px; z-index: 500; width: 100%; color: #fff; height: 90px; } .DARSLIDER .cat-ikon a { color: #fff; background: #047862; position: relative; z-index: 0; padding: 8px 10px; display: inline-block; margin: 0px 6px } .DARSLIDER .cat-ikon a::before { position: absolute; left: 0; bottom: 0; content: ''; z-index: -1; width: 100%; height: 0%; transition: all 0.5s ; background: #000} .DARSLIDER .cat-ikon a:hover::before { height: 100%; } @keyframes data-1 { 0% { transform: translate(0px, -50px); opacity: 0 } 100% { transform: translate(0px, 0px); opacity: 1 } } @keyframes data-2 { 0% { transform: translate(0, 100px); opacity: 0 } 100% { transform: translate(0px, 0px); opacity: 1 } } .gliste { } .gliste .li { line-height: 40px; background: #fff; padding: 0px 15px ; margin-bottom: 9px; } .gliste .li i { float: right; line-height: 40px; } .gliste .li:hover { background: #f6f6f6 } .K-HOME { } .K-HOME .li { } .K-HOME .li .baslik { font-size: 13px; padding: 15px 10px; } .K-HOME .li .baslik:hover { background: #000; color: #fff; } @media screen and (max-width: 1000px) { .K-HOME { display: none} } .KAROSER { position: relative; } .KAROSER .IN { margin: 0 auto; position: relative; padding:10px } .KAROSER .owl-nav { position: absolute; width: 100%; bottom: 10px; right: 0; text-align: center; z-index: 9999; display: none} .KAROSER .owl-nav i { padding: 10px; color: #000; background: #fff; margin: 0px } .KAROSER .owl-dots { display: block; position: absolute; width:100%; bottom: -20px; left: 0px; text-align: center; z-index: 9999; } .KAROSER .owl-dots .owl-dot { display: inline-block; width: 10px; height: 10px; border: 1px solid #ccc; margin: 2px; border-radius: 100px} .KAROSER .owl-dots .active { background: #ccc; } .KAROSER .owl-item { margin: 0; padding: 0; text-align: center } .KAROSER .owl-item img { width: 100% ; height: 200px; object-fit: cover } .KAROSER .owl-item h2 { font-size: 16px; padding: 15px 0px } @media screen and (max-width: 1000px) { .KAROSER .IN { padding:0px } .KAROSER .owl-item .li { background: #f5f5f5; margin: 15px; overflow: hidden; border-radius: 15px; -webkit-box-shadow: 0px 0px 25px -16px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 25px -16px rgba(0,0,0,0.75); box-shadow: 0px 0px 25px -16px rgba(0,0,0,0.75); } .KAROSER .owl-item .li img { height: 260px;} } .KAROSER-2 { position: relative; } .KAROSER-2 .IN { margin: 0 auto; position: relative; padding: 0px 0px } .KAROSER-2 .owl-nav { position: absolute; width: 100%; bottom: 10px; right: 0; text-align: center; z-index: 9999; display: none} .KAROSER-2 .owl-nav i { padding: 10px; color: #000; background: #fff; margin: 0px } .KAROSER-2 .owl-dots { display:none; position: absolute; width:100%; bottom: 10px; left: 0px; text-align: center; z-index: 9999; } .KAROSER-2 .owl-dots .owl-dot { display: inline-block; width: 10px; height: 10px; border: 1px solid #ccc; margin: 2px; border-radius: 100px} .KAROSER-2 .owl-dots .active { background: #ccc; } .KAROSER-2 .owl-item { } .KAROSER-2 .owl-item img { opacity: 0.5; -webkit-filter: grayscale(100%); filter: grayscale(100%); } .KAROSER-2 .owl-item:hover img { opacity: 1; -webkit-filter: grayscale(0%); filter: grayscale(0%); } .liste-4 { background: #fff; border-radius: 10px; margin:30px 0px ; } .liste-4 .tit { font-size: 24px; font-weight: 600; padding-bottom: 10px; padding-top: 10px; color: #000 } .liste-4 .ozet { color: #555; font-size: 14px; line-height: 30px; padding-top: 15px; border-top: 1px solid #ccc; } .renk-1 { color: #D3CAFA } .renk-2 { color: #FFD3D3 } .renk-3 { color: #BFEEF3 } .renk-4 { color: #BFF3CD } .renk-5 { color: #E8BF64 } .bg-1 { background: #D3CAFA } .bg-2 { background: #FFD3D3 } .bg-3 { background: #BFEEF3 } .bg-4 { background: #BFF3CD } .bg-5 { background: #E8BF64 } .div-buton { line-height: 50px; display: inline-block; border-radius: 50px; padding: 0px 20px; min-width: 240px; background:#000 ; color: #fff; border: none; outline: none; } .div-buton:hover { background: #004A93 ; cursor: pointer; } .a-buton { display: inline-block; color: #000; border: 1px solid #000; text-align: center; width: 100%; box-sizing: border-box; line-height: 40px; } .a-buton i { margin-right: 6px } .a-buton:hover { cursor: pointer; background: #f2f2f2 } .a-buton-2 { line-height: 30px; display: inline-block; padding: 0px 0px; color: #71B62C; border: none; outline: none; font-size: 15px; text-decoration: underline; } .a-buton-2:hover { color: #004A93 ; cursor: pointer; } .a-buton-3 { display: inline-block; color: #fff; text-align: center; width: 100%; box-sizing: border-box; line-height: 40px; background: #0dc143; } .a-buton-3 i { margin-right: 6px } .a-buton-3:hover { cursor: pointer; background: #000 } .div-buton-tam { line-height: 50px; padding: 0px 0px; background:#000; color: #fff; border: none; outline: none; text-align: center; box-sizing: border-box; width: 100%; margin: 0px} .div-buton-tam:hover { background: #404040 ; cursor: pointer; } .div-buton-tam-2 { padding: 0px 25px; background:#C41114; color: #fff; border: none; outline: none; text-align: center; box-sizing: border-box; margin: 0px; display: inline-block; } .div-buton-tam-2:hover { background: #000 ; cursor: pointer; } .lg-menu-sol { } .lg-menu-sol a { display: inline-table; width: 100%; padding: 0px 15px; font-size: 14px; color: #152d47; line-height: 40px; margin-bottom: 5px; position: relative; border: 1px solid #f2f2f2 ; border-radius: 6px; } .lg-menu-sol a.secili { box-shadow: 10px 10px 30px #ddd } .lg-menu-sol a i { display: inline-block; color: #047862; text-align: center; float: right; line-height: 40px; } .lg-menu-sol a:hover i { color: #152d47; } .lg-menu-sol a:hover { box-shadow: 10px 10px 30px #ddd} .lg-menu-sol h2 { color: #047862; padding-left: 15px } * { box-sizing: border-box; } .kapakvar { width: 100%; } .kapakvar img { width: 100%; } .TXT-HEADER { background: #f2f2f2; height: 250px; position: relative; z-index: 0; overflow: hidden; } .TXT-HEADER .opafont { position: absolute; left: 0; top: 0; font-weight: 800; font-size: 250px; color: #8E8E8E; opacity: 0.2 } .TXT-HEADER .content { position: relative; z-index: 10; } .megan-lg { } .liste-8 { border-radius: 10px; position: relative; z-index: 0; overflow: hidden; } .liste-8 h4 { color: #004A93; font-size: 18px; font-weight: 400; padding: 6px 20px} .liste-8 .loc { color: #9B9B9B; font-size: 13px; padding: 4px 20px; } .liste-8 .buton { color: #71B62C; font-size:13px; text-decoration: underline; } .liste-8 .buton:hover { color: #004A93; } .liste-9 { background: #ccc; position: relative; z-index: 0; overflow: hidden; } .liste-9 .img-kare { position: relative; z-index: 0; } .liste-9 .cover-mask { position: absolute; bottom: 0; right: 0; z-index: 10; width:200%; height: 100%; -webkit-transform-origin: 100% 0%; -moz-transform-origin: 100% 0%; -o-transform-origin: 100% 0%; -ms-transform-origin: 100% 0%; transform-origin: 100% 0%; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,1) 0%); transition: all 0.5s; display: none } .liste-9:hover .cover-mask{ -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .liste-9 .cover-text { position: absolute; bottom: 0px; right:0px; z-index: 20; color: #000; background: #fff; border-top-left-radius: 6px; } .fullkutu { } .fullkutu a {display: inline-block; padding: 8px 15px; margin-top: 15px; border-radius: 6px; border: 1px solid #000; color: #000 } .fullkutu a:hover { background: #000; color: #fff; } .urun { position: relative; z-index: 0; margin:10px; padding:10px; color: #000; background: #fff; box-sizing: border-box; transition: 0.5s ; border: 1px solid #f2f2f2; } .urun .isim { font-size: 12px; padding: 6px 0px ; font-weight: 400; font-weight: 600 } .urun .text { padding: 10px 0px; position: relative; z-index: 1} .urun .buton { line-height: 35px; font-size: 14px; padding: 0px 15px; display: inline-block; border-radius: 6px; margin-top: 8px; background: rgb(103,0,1); background: linear-gradient(346deg, rgba(103,0,1,1) 0%, rgba(237,20,20,1) 100%); color: #fff; } .urun:hover .buton { background: #000; color: #fff; } .urun .kategori { font-size: 13px; font-weight: 400; letter-spacing: 0px} .urun:hover { box-shadow: 10px 10px 30px #ddd; } .urun .fiyat { padding: 9px 0px } .urun .ciz { color: #888} .urun .ikonlar { position: absolute; bottom: 10px; right: 0px; z-index: 15; width: 35px; } .urun .ikonlar i { display: inline-block; line-height: 35px; width: 35px; background: #2cbdb0; color: #fff; font-size: 18px; text-align: center; border-radius: 50px} .urun .image_1 { z-index: 10; } .urun .image_2 { z-index: 5; } .urun:hover .image_2 { z-index: 15} .urun .miniindirim { position: absolute; z-index: 60; top: 10px; left: 10px; padding: 3px; color: #fff;background: #d52929; text-align: center; } .urun .miniindirim .lg-1 { font-size: 18px; font-weight: 600; } .urun .miniindirim .lg-2 { font-size: 11px; } .urun .yeni { position: absolute; z-index: 60; top: 10px; right: 10px; padding: 3px; color: #fff;background: #d52929; text-align: center; font-size: 11px;} .yenisezon .yeni { display: inline-block; padding: 3px; color: #fff;background: #d52929; text-align: center; font-size: 11px;} .yenisezon strong { color: #006ab5; } .URUN_CONTENT { } .URUN_CONTENT .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .URUN_CONTENT .IN li { width: calc(100% / 2 - 62px); float: left; padding: 20px; margin: 10px; border: 1px solid #f2f2f2 } .URUN_CONTENT .IN li img { text-align: center; width: 100%; } .URUN_CONTENT .IN li .li { padding: 30px 0px; } .URUN_CONTENT .IN li .li h2 { font-size: 20px; color: #999; padding-bottom: 8px; } .URUN_CONTENT .IN li .li .fiyat1 { } .URUN_CONTENT .IN li .li .fiyat1 span { text-decoration: line-through; color: #FF0004; } .URUN_CONTENT .IN li .li .fiyat2 { font-size: 23px; color: #000; } .URUN_CONTENT .IN li a { padding: 8px 20px; background: #999; color: #fff; } .URUN_CONTENT .IN li a:hover { background: #000} .URUN_DETAY .IN { max-width: 1200px; margin: 0 auto; } .URUN_DETAY .IN .SOL { width: 50%; float: left; } .URUN_DETAY .IN .SAG { width: calc(50% - 80px); float: left; padding-left: 80px; } .URUN_DETAY .IN .SAG h1 { font-size: 30px; color: #666; padding-bottom: 8px; font-weight: 600; } .URUN_DETAY .IN .SAG h2 { font-size: 20px; color: #999; padding-bottom: 8px; font-weight: 300; } .URUN_DETAY .IN .SAG h3 { cursor: pointer } .URUN_DETAY .IN .SAG .li p { font-size: 16px} .URUN_DETAY .zoom { display:inline-block; position: relative; } .URUN_DETAY .zoom:after {content:''; display:block; width:33px; height:33px; position:absolute; top:0; right:0; } .URUN_DETAY .zoom img { display: block; } .URUN_DETAY .zoom img::selection { background-color: transparent; } .URUN_DETAY .adetler { line-height:37px; color:#666; font-weight:600; padding: 15px 0px } .URUN_DETAY .adetler input { border:1px solid #000; width:30px; height:40px; margin:0px 3px; text-align:center; float:left; } .URUN_DETAY .adetler .eksilt { width:30px; background:#000; color:#fff; text-align:center; float:left; line-height:44px; } .URUN_DETAY .adetler .eksilt:hover { cursor:pointer; background:#666; } .URUN_DETAY .EKLE { padding:10px 10px; text-align: center; background: #000; color: #fff; } .URUN_DETAY .EKLE:hover { background: #555; cursor: pointer; } @media screen and (max-width: 1000px) { .URUN_DETAY .IN .SOL { width: calc(100% - 60px); float: left; padding: 0px 30px } .URUN_DETAY .IN .SAG { width: calc(100% - 60px); float: left; padding: 50px 30px } } .HABERLER { } .HABERLER h1 { text-align: center; line-height: 90px; background-size: cover; background-repeat: no-repeat; background-position: center center; position: relative; z-index: 20 } .HABERLER h1:after { display: block; content: ''; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index:0 } .HABERLER h1 span { position: relative; z-index: 10; padding: 6px 15px; } .HABERLER .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .HABERLER .IN .li { width: calc(100% / 2 - 10px); float: left; padding: 30px 30px; margin: 5px;} .HABERLER .IN .li h2 { font-size: 19px; color: #000; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .HABERLER .IN .li strong { font-size: 12px; } .HABERLER .IN .li p { font-size: 14px; color: #000; line-height: 30px ; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .HABERLER .IN .li .img { height: 90px; background-color: #f2f2f2; width: 150px; float: left; background-position: center center; background-size: cover; background-repeat: no-repeat; } .HABERLER .IN .li .txt { width: calc(100% - 150px); float: left; padding: 5px 0px 0px 30px } .HABERLER .IN .li:hover { -webkit-box-shadow: 0px 0px 22px -9px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 22px -9px rgba(0,0,0,0.75); box-shadow: 0px 0px 22px -9px rgba(0,0,0,0.75);} .DERGILER .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .DERGILER .IN .li { width: calc(100% / 3 - 10px); float: left; padding: 30px 30px; margin: 5px;} .DERGILER .IN .li h2 { font-size: 25px; color: #000; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .DERGILER .IN .li strong { font-size: 12px; } .DERGILER .IN .li p { font-size: 14px; color: #000; line-height: 30px ; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .DERGILER .IN .li .img { height: 200px; width: 150px; background-color: #f2f2f2; float: left; background-position: center center; background-size: cover; background-repeat: no-repeat; } .DERGILER .IN .li .txt { width: calc(100% - 150px); float: left; padding: 5px 0px 0px 30px } .ALT-BANNER { } .ALT-BANNER .IN li { width: calc(100% / 2 - 10px); float: left; padding: 10px 10px; margin: 5px;} .ALT-BANNER .IN li img { width:100%; height: 150px; object-fit:cover; } .ALT-BANNER .IN li h2 { font-size: 16px; padding: 4px 0px } @media screen and (max-width: 1000px) { .ALT-BANNER .IN li { width: calc(100% / 1 - 0px); float: left; padding: 10px 0px; margin: 0px;} .ALT-BANNER .IN li img { width:100%; height: 190px; } } .UN-PAGE { } .UN-PAGE .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .UN-PAGE .U-CO { width:70%; float: left; padding: 0px 30px 0px 0px } .UN-PAGE .U-CO .IMGE img { width: 100%; padding-bottom: 30px; } .UN-PAGE .U-CO h2 { font-size: 22px; color: #000; padding-bottom: 30px } .UN-PAGE .U-CO p { font-size: 14px; color: #000; line-height: 30px ; } .UN-PAGE .U-DI { width:30%; float:right; } .UN-PAGE .U-DI .li { padding: 30px 30px; margin: 5px; background: #f2f2f2} .UN-PAGE .U-DI .li h2 { font-size: 19px; color: #000; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .UN-PAGE .U-DI .li strong { font-size: 12px; } .UN-PAGE .U-DI .li p { font-size: 14px; color: #000; line-height: 30px ; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden } .UN-PAGE .U-DI .li .img { height: 90px; background-color: #f2f2f2; background-position: center center; background-size: cover; background-repeat: no-repeat; } .UN-PAGE .U-DI .li:hover { background: #f6f6f6 } .PAKET { background:#f2f2f2; } .PAKET .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .PAKET .IN .li { width: calc(100% / 3 - 80px); float: left; padding: 30px; margin: 10px; background: #fff; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; position: relative; overflow: hidden; } .PAKET .IN .li .fiyat { color: #000; font-size: 28px; font-weight: 600; } .PAKET .IN .li i { position: absolute; font-size:25px; color: #000; right: 10px; top: 10px } .PAKET .IN .li ul { padding: 25px 0px} .PAKET .IN .li ul li { line-height: 36px;} .PAKET .IN .li h2 { } .PAKET .IN .li .buton { padding: 15px; text-align: center; background:#000; color: #fff; -webkit-border-radius: 8px;-moz-border-radius: 8px;border-radius: 8px; margin-top: 40px } .PAKET .IN .li .buton:hover { background: #000; cursor: pointer; } .PAKET .IN .li p { font-size: 14px; color: #666; line-height: 36px; } .BLOG-INFO { } .BLOG-INFO .IN { max-width: 1200px; margin: 0 auto; padding: 50px 0px } .WEB { } .WEB .IN { max-width: 1200px; margin: 0 auto; padding: 0px 0px 50px 0px } .WEB .IN .li { width: calc(100% / 3 - 20px); float: left; background: #fff; position: relative; overflow: hidden; margin: 10px; } .WEB .IN .li img { width: 100%; height: 350px; object-fit: cover; position: relative; z-index: 10; transition:All 0.2000s ease; -webkit-transition:All 0.2000s ease; -moz-transition:All 0.2000s ease; -o-transition:All 0.2000s ease; } .WEB .IN .li h2 { font-weight: 700; font-size: 25px; height: 45px; padding: 15px 0px; color: #666; } .WEB .IN .li p { color: #000; line-height:30px; font-size: 14px; } .WEB .IN .li a { display: inline-block; padding: 8px 0px; color: #000; border-bottom: 1px solid #000} .WEB .IN .li:hover img { -webkit-transform: scale(1.20); -moz-transform: scale(1.10); -o-transform: scale(1.10); -ms-transform: scale(1.10); transform: scale(1.10); } .WEB .IN .li-1 { width: calc(100% / 1 - 20px); float: left; background: #fff; position: relative; overflow: hidden; margin: 10px; } @media screen and (max-width: 1000px) { .WEB { } .WEB .IN .li { width: calc(100% / 1 - 20px); } .WEB .IN { max-width: 1200px; margin: 0 auto; padding:30px } .WEB .IN .li img { width: 100%; float:left; } .WEB .IN .li .txt { width: 100%; float:left; padding: 30px } } @keyframes move_wave { 0% { transform: translateX(0) translateZ(0) scaleY(1) } 50% { transform: translateX(-25%) translateZ(0) scaleY(0.55) } 100% { transform: translateX(-50%) translateZ(0) scaleY(1) } } .waveWrapper { position: relative; height: 200px; overflow: hidden; } .waveWrapperInner { position: absolute; width: 100%; overflow: hidden; height: 100%; bottom: -1px; background:#fff; } .bgTop { z-index: 15; opacity: 0.5; } .bgMiddle { z-index: 10; opacity: 0.75; } .bgBottom { z-index: 5; } .wave { position: absolute; left: 0; width: 200%; height: 100%; background-repeat: repeat no-repeat; background-position: 0 bottom; transform-origin: center bottom; } .waveTop { background-size: 50% 100px; } .waveAnimation .waveTop { animation: move-wave 3s; -webkit-animation: move-wave 3s; -webkit-animation-delay: 1s; animation-delay: 1s; } .waveMiddle { background-size: 50% 120px; } .waveAnimation .waveMiddle { animation: move_wave 10s linear infinite; } .waveBottom { background-size: 50% 100px; } .waveAnimation .waveBottom { animation: move_wave 15s linear infinite; } .BLOG-HOME { } .BLOG-HOME .IN { max-width: 1200px; margin: 0 auto; padding: 90px 0px } .BLOG-HOME .IN .li { width: calc(100% / 3 - 20px); float: left; background: #fff; position: relative; overflow: hidden; margin: 10px; } .BLOG-HOME .IN .li img { width: 100%; height: 250px; object-fit: cover; position: relative; z-index: 10; transition:All 0.2000s ease; -webkit-transition:All 0.2000s ease; -moz-transition:All 0.2000s ease; -o-transition:All 0.2000s ease; } .BLOG-HOME .IN .li h2 { font-weight: 800; font-size: 19px; padding: 15px 0px; color: #666;} .BLOG-HOME .IN .li p { line-height:30px; font-size: 14px} .BLOG-HOME .IN .li a { display: inline-block; padding: 8px 0px; color: #000; border-bottom: 1px solid #000} .BLOG-HOME .IN .li:hover img { -webkit-transform: scale(1.20); -moz-transform: scale(1.10); -o-transform: scale(1.10); -ms-transform: scale(1.10); transform: scale(1.10); } .GALERI-img { padding: 15px; } .GALERI-img .img-li { width: calc(100% / 4); float: left; padding: 10px; } .GALERI-img .img-li img { width: 100%; height: 200px; object-fit:cover } .GALERI-img .img-li:hover { cursor: pointer} @media screen and (max-width: 1000px) { .GALERI-img .img-li { width: calc(100% / 1); } } .oylama { margin-bottom:20px ; opacity: 0.3; filter: alpha(opacity=30); } .oylama:hover { opacity: 1; filter: alpha(opacity=100);} .oylama i:hover { cursor:pointer; } .ALI_ZOOM { } .ALI_ZOOM .al-1 .li { width:calc(100% - 12px); margin-bottom:10px; padding:5px; border:1px solid #f2f2f2; cursor:pointer; } .ALI_ZOOM .al-1 .li img { width:100%; } .ALI_ZOOM .al-1 { width:100px; float:left; } .ALI_ZOOM .al-2 { width:calc(100% - 112px); float:right; border:1px solid #f2f2f2 } .ALI_ZOOM .al-2 img { width:100%; } .SAGSEPET { background:rgba(0,0,0,0.5); width:100%; height:100%; position: fixed; left:0%; top:-100%; z-index:2500; } .sepetac { position:fixed; right: 10px; top: 200px; width: 35px; height: 35px; line-height: 35px; text-align: center; background: #000; font-size: 20px; color: #fff; z-index: 2800; -webkit-border-radius: 90px; -moz-border-radius: 90px; border-radius: 90px; } .sepetac:hover { cursor: pointer; background: #f2f2f2; color: #000} @media screen and (max-width: 800px) { } .SEPETLISTE { position: absolute; width: 90%; height: 90%; left: 5%; top: 5%; background: #fff; overflow: auto; } .SEPETLISTE .li { border-bottom: 1px solid #ccc; position: relative; padding:20px; font-size:16px; color: #000; } .SEPETLISTE .li span { font-size:12px; color: #888; } .SEPETLISTE .li .sepsil { color: #000; padding: 5px; position: absolute; right: 5px; top: 5px; font-size: 16px; } .SEPETLISTE .li .sepsil:hover { color:#D9191C } .SEPETLISTE .li .st-0 { width: 70px; float: left} .SEPETLISTE .li .st-0 img { width: 100% } .SEPETLISTE .li .st-1 { width: calc(70% - 100px); float: left} .SEPETLISTE .li .st-2 { width: calc(30% - 15px); float:right; padding-right: 15px; text-align: right } .SEPETLISTE .li:hover { background:#f6f6f6 } .SEPETLISTE .SEPSOL { width: calc(50% - 100px); float: left; padding: 50px } .SEPETLISTE .SEPSAG { width: 50%; height: 100%; position:absolute; background: url(../../../index.html) center center no-repeat; background-size: cover; right: 0; top: 0} .SEPETLISTE .BUTONSET { text-align: center; padding: 10px 0px } .SEPETLISTE .BUTONSET a { display: inline-block; padding: 9px 15px; margin: 3px; background: #000; color: #fff; } .SEPETLISTE .BUTONSET a:hover { background: #666} @media screen and (max-width: 800px) { .SEPETLISTE { position: absolute; width: 100%; height: 90%; left: 0%; top: 0%; background: #fff; overflow: auto; } .SEPETLISTE .SEPSAG { display: none; } .SEPETLISTE .SEPSOL { width: calc(100% - 40px); float: none; padding: 20px } } .SEPETLISTE2 { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .SEPETLISTE2 .li { border-bottom: 1px solid #ccc; position: relative; padding:20px; font-size:16px; color: #000; } .SEPETLISTE2 .li span { font-size:12px; color: #888; } .SEPETLISTE2 .li .sepsil { color: #000; padding: 5px; position: absolute; right: 5px; top: 5px; font-size: 16px; } .SEPETLISTE2 .li .sepsil:hover { color:#D9191C } .SEPETLISTE2 .li .st-0 { width: 70px; float: left} .SEPETLISTE2 .li .st-0 img { width: 100% } .SEPETLISTE2 .li .st-1 { width: calc(70% - 100px); float: left} .SEPETLISTE2 .li .st-2 { width: calc(30% - 15px); float:right; padding-right: 15px; text-align: right } .SEPETLISTE2 .li:hover { background:#f6f6f6 } .SEPETLISTE2 .BUTONSET { text-align: center; padding: 10px 0px } .SEPETLISTE2 .BUTONSET a { display: inline-block; padding: 9px 15px; margin: 3px; background: #000; color: #fff; } .SEPETLISTE2 .BUTONSET a:hover { background: #666} .no-border { border: none !important; } .li-table { padding: 30px 0px } .li-table .li-tr { } .li-table .li-tr .li-td { padding: 8px 0px; } .li-table .li-tr .li-td span { color: #DD0306} .li-table .li-tr .fiyat { font-size: 38px;} .HABER-HOME { padding:100px 0px; } .HABER-HOME .IN { max-width: 1200px; margin: 0 auto; } .HABER-HOME .owl-carousel .owl-nav { position:absolute; bottom:-40px; text-align: center; width: 100%; } .HABER-HOME .owl-carousel .owl-prev { } .HABER-HOME .owl-carousel .owl-next { } .HABER-HOME .owl-carousel .owl-nav i { display:inline-block; width: 35px; height: 35px; line-height: 35px; text-align: center; border-radius: 8px; margin: 2px; background: #000; color: #fff; } .HABER-HOME .owl-carousel .owl-next:hover { } .HABER-HOME .owl-carousel .owl-prev:hover { } .HABER-HOME .owl-item { margin:0px; line-height: 36px; background: #f7f7f7; border-radius: 10px; } .HABER-HOME .owl-item .y-com { font-size: 15px; padding: 5px 30px} .HABER-HOME .owl-item .y-title { font-size: 15px; padding: 5px 30px} .HABER-HOME .active { background: #f2f2f2 } .HABER-HOME h2 { text-align: center} .COMMEND { background:#2b2b2b; z-index: 10; max-width: 90%; margin: 0 auto 50px; color: #fff } .COMMEND .IN { max-width: 1200px; margin: 0 auto; } .BLOG_112 { position:relative; z-index:10; padding:50px; } .BLOG_112 .ikon { position: absolute; left: 0; top: 50px; font-size: 150px;} .BLOG_112 .owl-carousel { margin: 0 auto; position: relative; z-index: 0} .BLOG_112 .owl-carousel .owl-nav { width:100%; text-align:right; position: absolute; top: -80px; } .BLOG_112 .owl-carousel .owl-prev { font-size: 35px; display:inline-block; padding:5px 10px; } .BLOG_112 .owl-carousel .owl-next { font-size: 35px; display:inline-block; padding:5px 10px; } .BLOG_112 .owl-carousel .owl-next:hover { } .BLOG_112 .owl-carousel .owl-prev:hover { } .BLOG_112 .owl-item { margin:0px; padding: 0; position: relative;} .BLOG_112 .owl-item .musteri { padding: 40px 0px; margin: 0 auto; } .BLOG_112 .owl-item .musteri .isim { padding: 20px 0px; font-size: 28px;} .BLOG_112 .owl-item .musteri p { line-height: 30px; font-size: 15px; font-weight: 300; letter-spacing: 1px } .BLOG_112 h1 { font-weight: 300; } @media screen and (max-width: 1000px) { .COMMEND { } .BLOG_112 { position:relative; width: calc(100% - 100px); z-index:10; padding: 150px 50px; } .BLOG_112 .owl-carousel .owl-nav { width:100%; text-align:center; position: absolute; top: -120px; } .BLOG_112 h1 { font-size: 22px; font-weight: 600; } } .SOP { margin: 0 auto; background: url(../../../index.html) left center no-repeat; background-size: contain; } .SOP .IN { margin: 0 auto; padding: 0px 0px ; max-width: 1200px; } .SOP .IN .pot { padding: 50px 0px} .SOP .IN .TXT { width: 70%; float:right; padding: 50px 30px; } .SOP .IN .TXT h2 { font-size: 22px; padding-bottom: 15px } .SOP .IN .TXT p { font-size: 14px; line-height: 26px } .SOP .IN .LOG { width: 30%; float: left; background: #e0e5e9; padding: 50px 30px; position: relative} .SOP .IN .LOG h2 { color: #7c94a2; font-size: 20px; } .SOP .IN .LOG .OHE { position: absolute; top: -20px; text-align: center; width: 100%; left: 0; } .SOP .IN .LOG .OHE .ONBAGIS { padding: 8px 20px; background: #44b838; color: #fff; display: inline-block; font-size: 14px } .SOP .IN .LOG .OHE .ONBAGIS i { padding-left: 10px;} .SOP .IN .LOG .OHE .ONBAGIS:hover { background: #000 } @media screen and (max-width: 1000px) { .SOP { background:none; text-align: center } .SOP .IN .pot { padding: 0px 0px} .SOP .IN .TXT { width: calc(100% - 0px); float: left; padding: 50px 30px; } .SOP .IN .LOG { display: none} .SOP .IN .AMAS { width: 100%; height: 30px; background: #000; display: inline-block; } } .BURS { background-size: contain; position: relative;} .BURS:before { display: block; content: ''; height: 50px; position: absolute; bottom: 0; background: url(mask2.png) center bottom no-repeat; width: 100%;} .BURS .IN { margin: 0 auto; padding: 100px 30px ; max-width: 1100px; position: relative; z-index: 1} .BURS .IN:after { width: 100%; display: inline-block; height: 40px; background: url(mask.png) center top no-repeat; position: absolute; left: 0; top: 0;} .BURS .IN h2 { color: #000; font-size: 24px; padding-bottom: 20px } .BURS .IN p { color: #696969; font-size: 14px; line-height: 26px; } .BURS .IN a { display: inline-block; background: #000; color: #fff; border-radius: 100px; padding: 8px 20px } .BURS .IN a:hover {background: #ccc } @media screen and (max-width: 1000px) { .BURS { background: none !important; text-align: center } } .BURS2 { background-size: contain; position: relative;} .BURS2:before { display: block; content: ''; height: 50px; position: absolute; bottom: 0; background: url(mask2.png) left bottom no-repeat; width: 100%;} .BURS2 .IN { margin: 0 auto; padding: 0px 0px ; max-width: 1200px; position: relative; z-index: 1} .BURS2 .IN:after { width: 100%; display: inline-block; height: 40px; background: url(mask.png) center top no-repeat; position: absolute; left: 0; top: 0;} .BURS2 .IN h2 { color: #677d8a; font-size: 24px; padding-bottom: 20px } .BURS2 .IN p { color: #696969; font-size: 14px; line-height: 26px; } .BURS2 .IN a { display: inline-block; background: #000; color: #fff; border-radius: 100px; padding: 8px 20px } .BURS2 .IN a:hover {background: #000 } .BURS2 .IN .HO-1 { background: #3163ab; width: 30%; float: left; padding: 50px 30px; color: #fff; } .BURS2 .IN .HO-1 h2 { color: #fff;} .BURS2 .IN .HO-1 ul { padding-top: 15px;} .BURS2 .IN .HO-1 ul li { font-size: 14px; padding: 6px 0px 6px 50px; background:url(../../../index.html) left center no-repeat; background-size: contain; } .BURS2 .IN .HO-2 { width: 70%; float: left; padding:50px 50px; } .INFO { overflow: hidden; position: relative; z-index: 10; max-width: 90%; margin: 0 auto; } .INFO .IN { margin: 0 auto; padding: 50px 0px ; text-align: center; position: relative; z-index: 20; color: #666; } .INFO .IN:after { content: ''; display: table; clear: both; } .INFO .IN .li { width: calc(100% / 4 - 0px); float: left; padding: 0px; color: #666; position: relative; overflow: hidden;} .INFO .IN .li .img { float: left; width: 50%; height: 100px; } .INFO .IN .li .txt { float: left; width: 50%; height: 100px; position: relative; } .INFO .IN .li .txt p { line-height: 100px; z-index: 20; font-weight: 700; position:relative; color: #000; width: 100%; } .INFO .IN .li .mask { width: 100%; height: 40px; position: absolute; bottom:-40px; background: #000 } .INFO .IN .li:hover .img { -webkit-transform: scale(1.20); -moz-transform: scale(1.20); -o-transform: scale(1.20); -ms-transform: scale(1.20); transform: scale(1.20); } @media screen and (max-width: 1000px) { .INFO .karebg { display: none; } .INFO .IN { padding: 0px 0px ; } .INFO .IN .li { width: calc(100% / 1 - 0px); float: left; padding: 30px 0px; color: #666 } .INFO .IN .li .img { float: left; width: 100%; height: 250px; } .INFO .IN .li .txt { float: left; width: 100%; height: auto ; position: relative; } .INFO .IN .li .txt p { line-height:36px; z-index: 20; font-weight: 700; position:relative; color: #000; width: 100%; background: #fff; } } .N-BORDER { border: 10px solid #000; padding: 10px; max-width: 90%; margin: 0 auto; } .NEDEN { position: relative; z-index: 60; background: #f7f7f7; overflow: hidden; } .NEDEN .IN { margin: 0 auto; padding: 60px 20px ; position: relative; z-index: 20; } .NEDEN .IN:after { content: ''; display: table; clear: both; } .NEDEN .IN .li { width: calc(100% / 3 - 60px); min-height: 30px; float: left; padding: 30px } .NEDEN .IN .li p { line-height: 30px; color: #666; font-weight: 300} .NEDEN .IN .li h1 { padding-bottom: 20px; color: #000; font-weight: 600} .NEDEN .IN .li ul { padding: 20px 0px} .NEDEN .IN .li ul li { padding: 8px 10px; border-left: 3px solid #ccc; margin-bottom: 2px} .NEDEN .IN .li h4 { padding: 20px; font-weight: 300; margin-bottom: 10px; text-align:right;} .NEDEN .IN .li h4 strong { display: inline-block; width: 100%; font-size: 26px } .NEDEN .bgvideo { position: absolute; min-width: 100%; min-height: 100%; margin-top: -10% ; opacity: 0.2; filter: alpha(opacity=20); /* For IE8 and earlier */} .NEDEN .vimeo-wrapper { position:absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; pointer-events: none; overflow: hidden; } .NEDEN .vimeo-wrapper iframe { width: 100vw; height: 56.25vw; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */ min-height: 100vh; min-width: 177.77vh; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @media screen and (max-width: 1000px) { .N-BORDER { border: 0px solid #000; padding: 0px; max-width: 100%; margin: 0 auto; background:#fff; } .NEDEN { margin: 0px 30px} .NEDEN .IN { padding: 60px 50px 350px 50px; } .NEDEN .IN .li { width: calc(100% / 1 - 0px); min-height: 30px; float: left; padding: 0px } .NEDEN .IN .li h4 { text-align: center; } .NEDEN .bgvideo { margin-top:0% ; left: -50%; display: none;} } .YORUMLAR { padding: 50px 5px } .YORUMLAR .yorum { padding: 30px 20px; margin-bottom: 5px; } .YORUMLAR .yorum .y-title { padding-bottom: 10px } .YORUMLAR .yorum .y-com { color: #666; font-size: 15px } .YORUMLAR .yorum i { padding: 0px 3px} .YORUMLAR .yorum span { display: inline-block; height: 10px; width: 15px;} .YORUMLAR .yorum:nth-of-type(odd) { background-color: #f9f9f9; } .YORUMLAR .yorum:nth-of-type(even) { } .D-ALANI { position: relative; z-index: 20} .SLIDER { position: relative; z-index: 1; background: rgb(50,36,175); background: -moz-linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); background: -webkit-linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); background: linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3224af",endColorstr="#c66cd6",GradientType=1); } .WAVE { background: url(mask.png) top center no-repeat; position: relative; background-size: cover; width: 100%; height: 320px; } .WAVE a { display: inline-block; font-size: 20px; position: absolute; top: 100px; left:60%;; background:#febd00; padding: 8px 25px; color: #fff; -webkit-border-radius: 600px; -moz-border-radius: 600px; border-radius: 600px; } .WAVE a:hover { background: #000} .WAVEC { background: #fff; } .WAVEC .IN { max-width: 1200px; margin: 0 auto; padding: 0px 20px 100px 20px; text-align: center; position: relative} .WAVEC .IN h1 { color: #000; font-size: 36px; padding-bottom: 20px; } .WAVEC .IN p { color: #666; font-size: 18px; line-height: 30px; } .WAVEC .IN a.gel { font-size: 38px; position: absolute; right:40px; top: -40px; color: #000} .WAVEC .IN a.gel p { font-weight: 600; } .WAVED { background: #f5f5fa; } .BLOG_109 { position:relative; margin:0 auto; z-index:10; max-width:1400px; overflow:hidden; padding-top: 0px } .BLOG_109 .owl-carousel { } .BLOG_109 .owl-carousel .owl-nav { text-align:center; width:100%; } .BLOG_109 .owl-carousel .owl-prev { color:#fff; font-size: 25px; display:inline-block; padding:5px 5px; position:absolute; top:50%; left:0px; margin-top:-17px; } .BLOG_109 .owl-carousel .owl-next { color:#fff; font-size: 25px; display:inline-block; padding:5px 5px; position:absolute; top:50%; right:0px; margin-top:-17px; } .BLOG_109 .owl-carousel .owl-next:hover { } .BLOG_109 .owl-carousel .owl-prev:hover { } .BLOG_109 .owl-item { margin:0px; } .BLOG_109 .BLOG_LI { position:relative; text-align:center; padding: 15px 0px } .BLOG_109 .BLOG_LI h2 { color: #fff; font-size: 50px; font-weight: 100; } .lg-blog { } .lg-blog h2 { font-size: 21px; padding: 10px 0px } .lg-blog p { font-size: 16px; padding: 8px 0px } .lg-blog p a { display: inline-block; padding: 7px 15px; color: #fff; background: #047862; border-radius: 6px; } .RFORM { background: #dcf3f7; max-width:90%; margin:50px auto } .RFORM .IN { max-width: 1200px; margin: 0 auto; padding:100px 20px 100px 20px; text-align: center; position: relative} .RFORM .IN:after { content: ''; display: table; clear: both; } .RFORM .IN .li { width: 50%; float:right; } .RFORM .IN .li h2 { padding-bottom: 10px; font-weight: 300; } .RFORM .IN .li h2 strong { color:#14a4c7;} @media screen and (max-width: 1000px) { .RFORM { margin: 30px; background: #fff !important;} .RFORM .IN { padding:30px 20px 30px 20px; } .RFORM .IN .li { width: 90%; float:none; margin: 0 auto; } } .KUTULA { background: #dcf3f7; max-width:90%; margin:50px auto } .KUTULA .B { width: 50%; float: left; padding: 50px; } .KUTULA .B .li { padding: 15px 0px; margin: 0px 5px; float:left ; width:calc(50% - 10px) ; border-bottom: 1px solid #ccc; } .KUTULA .B .li i { padding-right: 10px} .KUTULA .B .li:hover { color: #000} .KUTULA .C1 { } .KUTULA .C2 { background: #ccc; border-left: 50px solid #fff; } .KUTULA .C1 p { padding-top: 30px; float: left; width: 100%; } @media screen and (max-width: 1000px) { .KUTULA .B { width: 100%; float: left; padding: 50px; } .KUTULA .C2 { background: #ccc; border-left: 0px solid #fff; } .KUTULA .B .li { padding: 15px 0px; margin: 0px 5px; float:left ; width:calc(100% - 10px) ; border-bottom: 1px solid #ccc; } } .KLINIKLER { padding: 80px 0px; background: #f2f2f2 } .KLINIKLER .IN { max-width: 1200px; margin: 0 auto; padding:50px 20px; position: relative} .KLINIKLER .IN:after { content: ''; display: table; clear: both; } .KLINIKLER .IN .li { width: calc(100% / 4 - 60px); overflow: hidden; height: 450px; margin: 10px; background: #fff; padding: 20px 20px 50px 20px; float:left; color: #666; position: relative; text-align: center; } .KLINIKLER .IN .li h2 { padding: 20px 0px; font-weight: 800; font-size: 16px; } .KLINIKLER .IN .li i { font-size: 60px; padding-top: 20px; } .KLINIKLER .IN .li li { font-size: 16px; line-height: 32px; } .KLINIKLER .IN .li img { width: 50px; padding: 20px 0px} .KLINIKLER .IN .li p { font-size: 15px;} .KLINIKLER .IN .li:hover { } .KLINIKLER h1 { text-align: center; color: #ccc; } .KLINIKLER .MORE { position:absolute; bottom: 0; color: #fff; padding: 10px 0px; width: 100%; left: 0; font-weight: 600; } @media screen and (max-width: 1000px) { .KLINIKLER .IN .li { width: calc(100% / 1 - 60px); height: auto } } .UYGULAMALAR { padding: 50px 0px;} .UYGULAMALAR .li { width: calc(100% / 2 - 10px); padding: 0px; float: left; margin: 5px } @media screen and (max-width: 1000px) { .UYGULAMALAR .li { width: calc(100% / 1 - 10px); padding: 0px; float: left; margin: 5px } } .RANDEVU { } .RANDEVU .IN { max-width: 1300px; margin: 0 auto; padding:50px 20px; position: relative} .RANDEVU .IN:after { content: ''; display: table; clear: both; } .RANDEVU .IN .li { width: calc(60% - 40px); float: left; padding: 0px 40px 0px 0px } .RANDEVU .IN .li h1 { color: #000; padding-bottom: 10px; font-weight: 300; } .RANDEVU .IN .li p { line-height: 30px; color: #666 } .RANDEVU .IN .PFORM { width: calc(40% - 100px); float: left; padding: 50px; background: #f8f8f8; } .RANDEVU .IN .PFORM h1 { padding-bottom: 20px ; font-size: 28px; color: #888;} img.FIMG { width: 100%; } .NOBANNER { width: 100%; height: 530px; } .SORULAR { background: #fff;} .SORULAR .IN { max-width: 1200px; margin: 0 auto; padding: 100px 0px } .SORULAR .IN .PFORM { } .SORULAR .IN .PFORM h2 { color: #000; padding-bottom: 10px; font-weight: 300; } .SORULAR .IN .PFORM p { line-height: 30px; color: #666 } @media screen and (max-width: 1000px) { .SORULAR .IN { max-width: 1200px; margin: 0 auto; padding: 20px 30px } .SORULAR .IN .PFORM { padding:10px; } img.FIMG { display: none} } ul.ACILIRTAB { padding: 20px 0px } ul.ACILIRTAB li { margin-bottom: 15px; position: relative; } ul.ACILIRTAB li i { position: absolute; right: 25px; top: 25px; font-size: 28px; } ul.ACILIRTAB li h2:hover { cursor: pointer; } ul.ACILIRTAB li h2 { padding: 0px; margin: 0; color: #494949; font-size: 20px; } ul.ACILIRTAB li .li { color: #777; padding: 30px 0px; display: none; } ul.ACILIRTAB li .li p { line-height: 30px; } ul.ACILIRTAB li:first-child .li { } ul.ACILIRTAB .active .li { display: block; } @media screen and (max-width: 1000px) { ul.ACILIRTAB li h2 { padding: 0px 40px 0px 0px; margin: 0; color: #494949; font-size: 18px } } .BLOG_CONTENT { background: #f2f2f2; } .BLOG_CONTENT .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .BLOG_CONTENT .IN:after { content: ''; display: table; clear: both; } .BLOG_CONTENT li { padding: 60px; margin: 10px; float: left; width: calc(100% / 2 - 140px); position: relative; background: #fff; } .BLOG_CONTENT li .img { width: 100%; height: 250px } .BLOG_CONTENT li .li { height: 60px; overflow: hidden; margin-top: 15px } .BLOG_CONTENT li .li p { line-height: 30px; font-size: 15px } .BLOG_CONTENT li h2 { padding-bottom: 30px; font-size: 22px; color: #666; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .BLOG_CONTENT li:hover { -webkit-box-shadow: 0px 0px 32px -17px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 32px -17px rgba(0,0,0,0.75); box-shadow: 0px 0px 32px -17px rgba(0,0,0,0.75);} .BLOG_CONTENT li a { display: inline-block; padding: 8px 25px; margin-top: 15px;} .BLOG_CONTENT li a:hover { background: #000 } @media screen and (max-width: 1000px) { .BLOG_CONTENT { background: #fff; } .BLOG_CONTENT .IN { padding: 20px 30px } .BLOG_CONTENT li { padding: 15px 15px 30px 15px; margin: 0px; margin-bottom: 30px; width: calc(100% / 1 - 30px); border-bottom: 1px solid #ccc; } } .BLOG_CONTENT_DETAY { } .BLOG_CONTENT_DETAY .IN { max-width: 1200px; margin: 0 auto; padding: 80px 0px } .BLOG_CONTENT_DETAY .IN:after { content: ''; display: table; clear: both; } .BLOG_CONTENT_DETAY .SOL { width: 400px; float:right; } .BLOG_CONTENT_DETAY .SOL img { width: 100%; height: 90px; object-fit:cover; } .BLOG_CONTENT_DETAY .SOL h3 { padding-bottom: 10px; font-size: 16px; color: #666; width: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } .BLOG_CONTENT_DETAY .SOL li { padding: 15px 0px; } .BLOG_CONTENT_DETAY .SOL li:hover h2 { color: #000} .BLOG_CONTENT_DETAY .SAG { width: calc(100% - 450px); float:left; padding: 0px 0px 60px 0px } .BLOG_CONTENT_DETAY .SAG h1 { color: #000; padding-bottom: 10px; font-weight: 300; } .BLOG_CONTENT_DETAY .SAG p { line-height: 30px; color: #666; padding: 7px 0px; } .BLOG_CONTENT_DETAY .SAG h3 { line-height: 30px; color: #666; padding: 7px 0px; } .BLOG_CONTENT_DETAY .SAG img { width: 100%; padding: 30px 0px } .BLOG_CONTENT_DETAY .SAG ul li { line-height: 30px; color: #666; list-style-type: square; font-size: 15px } @media screen and (max-width: 1000px) { .BLOG_CONTENT_DETAY .IN { padding: 0px 0px } .BLOG_CONTENT_DETAY .SOL { display:none; } .BLOG_CONTENT_DETAY .SAG { width: calc(100% - 60px); float:left; padding: 30px 30px 90px 30px } } .UYELIK { padding: 0px 0px; position: relative;} .UYELIK .IN { max-width: 1200px; margin: 0 auto; padding: 100px 0px; background: #fff } .UYELIK .UYEFORM { max-width: 500px; margin: 0px auto; min-height: 500px} .li-tab { text-align: center } .li-tab .li { padding: 10px 20px; display: inline-block; color: #000; border-bottom: 5px solid #f6f6f6; } .li-tab .li i { padding-right: 8px} .li-tab .aktif { border-bottom: 5px solid #000; } .li-tab .li:hover{ cursor: pointer; border-bottom: 5px solid #ccc; } .li-tab-icerik { } @media screen and (max-width: 1000px) { .UYELIK .IN { width: 100%; padding:40px 0px; } .li-tab-icerik { padding: 50px 0px } .UYELIK .BG { display: none } .li-tab .li { padding: 10px 20px; display:inline-block; width: 100%; color: #000; border-bottom: 5px solid #f6f6f6; text-align: left; } .UYELIK .UYEFORM { max-width: 500px; margin: 0 auto; padding: 0px 30px} .li-tab { padding: 30px } .mb1 { width: 70% !important; } .mb2, .mb3 { display: none } } .li-tab-1 { } .li-tab-1 .li { padding: 20px 0px; float:left; color: #999; text-align: center; width: calc(100% / 3); } .li-tab-1 .li span { display:inline-block; width: 100%; font-size: 36px; font-weight: 800; padding-bottom: 10px; } .li-tab-1 .aktif { background:#fff; color: #000 } .li-tab-1 .li:hover{ } .li-tab-1-icerik { padding: 50px; background:#fff; } .SIPARIS { background:#f2f2f2; padding: 0px 0px } .SIPARIS .IN { max-width: 1200px; margin: 0 auto; padding: 50px 0px } .SIPARIS .UYEFORM { max-width: 500px; margin: 0 auto;} .SIPARIS h2.formbaslik { padding: 0px 0px 20px; font-size: 22px} .SIPARISLERIM { background: #fff; padding: 40px } .SIPARISLERIM .baslik { background: #f2f2f2} .SIPARISLERIM .tr { width: calc(100% / 4); padding:8px 8px; float: left } .SIPARISLERIM .list { border-bottom:1px solid #f2f2f2 } @media screen and (max-width: 1000px) { .SIPARIS .IN { padding: 0px 0px } .li-50 { width: 100% } } .BILGISEPETI { width:calc(40% - 0px); float:left; -webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.09); -moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.09); box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.09); } .BILGISEPETI h2 { padding:8px 10px; margin: 10px 0px; font-size: 22px } .BILGISEPETI .li { border-bottom: 1px solid #f2f2f2; position: relative; padding:20px; font-size:16px; color: #000; } .BILGISEPETI .li span { font-size:12px; color: #888; } .BILGISEPETI .li .sepsil { color: #000; padding: 5px; position: absolute; right: 5px; top: 5px; font-size: 16px; } .BILGISEPETI .li .sepsil:hover { color:#D9191C } .BILGISEPETI .li .st-0 { width: 70px; float: left} .BILGISEPETI .li .st-0 img { width: 90% } .BILGISEPETI .li .st-1 { width: calc(70% - 100px); float: left } .BILGISEPETI .li .st-2 { width: calc(30% - 15px); float:right; padding-right: 15px; text-align: right } .BILGISEPETI .li:hover { background:#f6f6f6 } .BILGISEPETI .total { padding:10px 0px; text-align: right; } .BILGISEPETI .td { padding:0px 10px; } .BILGISEPETI .td i { width: 30px; height: 30px; } .GONDERKISMI { width:100%; float:left; padding:15px 0px; text-align:center; } .GONDERKISMI .GN1 { background:#000; color:#fff; outline:none; border:none; padding:15px; margin:5px; } .GONDERKISMI .GN1:hover { background:#666; cursor:pointer; } .GONDERKISMI .DIVBUTON { display: inline-block; padding: 9px 15px; background: #000; color: #fff; } .GONDERKISMI .DIVBUTON:hover { cursor: pointer; background: #666 } @media screen and (max-width: 800px) { .BILGISEPETI { display: none } } .SORGUS { background: #fff;} ul.ultablist { list-style: none; padding: 60px 0px; max-width: 1200px; margin: 0 auto } ul.ultablist li { padding: 0px 0px; font-size: 16px; } .BILGISEPETI2 { padding: 50px; border:1px dashed #ccc; } .BILGISEPETI2 h2 { padding:8px 10px; margin: 10px 0px; font-size: 22px; color: #b9b9b9 } .BILGISEPETI2 .li { border-bottom: 1px solid #f2f2f2; position: relative; padding:30px 0px; font-size:16px; color: #000; } .BILGISEPETI2 .li span { font-size:12px; color: #888; } .BILGISEPETI2 .li .sepsil { color: #000; padding: 5px; position: absolute; right: 5px; top: 5px; font-size: 16px; } .BILGISEPETI2 .li .sepsil:hover { color:#D9191C } .BILGISEPETI2 .li .st-0 { width: 70px; float: left} .BILGISEPETI2 .li .st-0 img { width: 90% } .BILGISEPETI2 .li .st-1 { width: calc(70% - 100px); float: left } .BILGISEPETI2 .li .st-2 { width: calc(30% - 15px); float:right; padding-right: 15px; text-align: right } .BILGISEPETI2 .total { padding:10px 0px; text-align: right; } .BILGISEPETI2 .td { padding:0px 10px; } .BILGISEPETI2 .td i { width: 30px; height: 30px; color: #ccc } .col-bol .c1 { width:calc(100% / 1); float: left; } .col-bol .c2 { width:calc(100% / 2); float: left; } .col-bol .c3 { width:calc(100% / 3); float: left; } @media screen and (max-width: 800px) { .BILGISEPETI2 { padding: 10px; border:1px dashed #000; } .col-bol .c1 { width:calc(100% / 1); float: left; margin-bottom: 30px } .col-bol .c2 { width:calc(100% / 1); float: left; margin-bottom: 30px } .col-bol .c3 { width:calc(100% / 1); float: left; margin-bottom: 30px } } .ODEMEBILGISI { width:calc(60% - 40px); padding: 0px 0px 0px 0px; float: right; } .ODEMEBILGISI .ODEMESEC { padding:0; } .ODEMEBILGISI .ODEMESEC .li { padding:20px 10px ; color: #999; margin: 2px; text-align: center; width: calc(50% - 24px); float: left; background: #f2f2f2; } .ODEMEBILGISI .ODEMESEC .li i { font-size:36px; padding-bottom: 10px; } .ODEMEBILGISI .ODEMESEC .li:hover { color: #000; cursor: pointer} .ODEMEBILGISI .ODEMESEC .secili { color: #000; /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f2f2f2+0,ffffff+100 */ background: rgb(242,242,242); /* Old browsers */ background: -moz-linear-gradient(top, rgba(242,242,242,1) 0%, rgba(255,255,255,1) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, rgba(242,242,242,1) 0%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, rgba(242,242,242,1) 0%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2f2f2', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */ } .ODEMEBILGISI .odemeaciklama { width:calc(100% - 2px - 40px) ; height: 200px; border: 1px solid #ccc; padding: 20px; outline: none; } .ODEMEBILGISI .BANKACH { padding: 10px 0px} .ODEMEBILGISI .BANKACH .li { width: calc(50% - 59px); position: relative; float: left; padding: 15px 15px 15px 40px; margin: 2px; } .ODEMEBILGISI .BANKACH .li:hover { cursor: pointer; } .ODEMEBILGISI .BANKACH .li i { color: rgba(0,0,0,0.1); position: absolute; left: 0; top: 25px; font-size: 25px; } .ODEMEBILGISI .BANKACH .secilenbanka i { color: #0AA830 } .ODEMEBILGISI .BANKACH .li:hover i { color: #0AA830 } @media screen and (max-width: 800px) { .ODEMEBILGISI { width:calc(100% - 40px); padding: 20px; float: none; } .ODEMEBILGISI .BANKACH .li { width: calc(100% - 59px); position: relative; float: none; padding: 15px 15px 15px 40px; margin: 2px; } } .OSONUC { text-align: center; } .OSONUC .tanim1 { font-size: 18px; } .OSONUC .tanim1 i { font-size: 36px; padding-bottom: 15px; } .xs-form { max-width: 400px; } @media screen and (max-width: 1000px) { } .KLINIKDETAY { } .KLINIKDETAY .IN { max-width: 1300px; margin: 0 auto; padding:50px 20px; position: relative} .KLINIKDETAY .IN:after { content: ''; display: table; clear: both; } .KLINIKDETAY .IN .li { width: calc(60% - 40px); float: left; padding: 0px 40px 0px 0px } .KLINIKDETAY .IN .li ul { padding: 10px 0px } .KLINIKDETAY .IN .li ul li { line-height: 30px} .KLINIKDETAY .IN .PFORM { width: calc(40% - 100px); float: left; padding: 50px; background: #f8f8f8; } .KLINIKDETAY .IN .PFORM h1 { padding-bottom: 20px ; font-size: 28px; color: #888;} .KLINIKDETAY .BL1 { width: calc(50% - 20px); float: left; padding-right: 20px} .KLINIKDETAY .BL2 { width: 50%; float: left;} .KLINIKDETAY .BL3 { width: 100%; float: left; padding-top: 30px} .GALERI:after { content: ''; display: table; clear: both;} .GALERI .img { width: calc(100% / 4 - 10px); float: left; padding: 5px; } .GALERI .img img { width: 100%; } .GALERI .img:hover { -webkit-transform: scale(1.10); -moz-transform: scale(1.10); -o-transform: scale(1.10); -ms-transform: scale(1.10); transform: scale(1.10); } @media screen and (max-width: 1000px) { .KLINIKDETAY .IN .li { width: calc(100% - 0px); float: left; padding: 0px 0px 0px 0px } .KLINIKDETAY .BL1 { width: calc(100% - 20px); float: left; padding-right: 20px} .KLINIKDETAY .BL2 { width: 100%; float: left;} .KLINIKDETAY .IN .PFORM { width: calc(100% - 100px); margin: 30px 0px } } .SAYFA-C { background: #fff; position: relative; z-index: 60} .SAYFA { max-width: 1200px; margin: 0 auto; padding:40px 0px;} .SAYFA:after { content: ''; display: table; clear: both;} .SAYFA .SOL { width: 350px; float:left; } .SAYFA .SOL .MENUSOL { padding: 30px 0px 30px 30px ; background: #7d4e42; border-radius: 10px; } .SAYFA .SOL .MENUSOL .li { padding: 15px 30px; font-weight: 600; font-size: 14px; color: #fff; border-top-left-radius: 50px; border-bottom-left-radius: 50px; text-align:right; border-bottom: 1px solid rgba(255,255,255,0.2)} .SAYFA .SOL .MENUSOL .li:hover { } .SAYFA .SOL .MENUSOL .secili { background: #fff; color: #000 } .SAYFA .SOL .form-2 { width: 100%; } .SAYFA .SOL .PFORM { background: #f2f2f2; padding:30px; border-radius: 10px; margin-top: 20px } .SAYFA .SAG { width: calc(100% - 400px); float:right; padding: 0px 0px 60px 0px } .SAYFA .SAG h1 { color: #000; padding-bottom: 10px; font-weight: 300; } .SAYFA .SAG p { } .SAYFA .SAG h2 { color: #000; padding: 10px 0px; font-weight: 600; } .SAYFA .SAG h2:after { content: ''; display: table; width: 40px; height:1px; margin-top: 10px; background: #000} .SAYFA .SAG h3 { color: #000; padding: 10px 0px; font-weight: 600; } .SAYFA .SAG h3:after { content: ''; display: table; width: 40px; height:1px; margin-top: 10px; background: #000} .SAYFA .SAG ul li { margin-left: 20px; list-style:outside} .SAYFA .SAG li,p { line-height: 30px; font-size: 15px; } .bildiri { padding: 40px 30px; color: #fff; background: #000; margin-top: 10px; border-radius: 10px; } .bildiri h1 { font-size: 25px; font-weight: 800; } .bildiri a { display: inline-block; background: #fff; color: #000; padding: 8px 15px; margin-top: 15px;} .SAYFA-2 { max-width: 1200px; margin: 0 auto; padding: 40px 0px } .SAYFA-2:after { content: ''; display: table; clear: both;} .SAYFA-2 .SOL { width: 300px; float:right; overflow: hidden; } .SAYFA-2 .SOL .MENUSOL { } .SAYFA-2 .SOL .MENUSOL .li { padding: 15px 0px; font-weight: 600; font-size: 15px; color: #000; border-bottom: 1px solid #ddd} .SAYFA-2 .SOL .MENUSOL .li:hover { } .SAYFA-2 .SOL .MENUSOL .secili { /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#c4c4c4+0,000000+100&0.65+0,0+100 */ background: -moz-linear-gradient(left, rgba(196,196,196,0.65) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(left, rgba(196,196,196,0.65) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to right, rgba(196,196,196,0.65) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6c4c4c4', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */} .SAYFA-2 .SAG { width: calc(100% - 350px); float:left; padding: 0px 0px 60px 0px } .SAYFA-2 .SAG h1 { color: #000; padding-bottom: 10px; font-weight: 300; } .SAYFA-2 .SAG p { } .SAYFA-2 .SAG h2 { color: #000; padding: 10px 0px; font-weight: 600; } .SAYFA-2 .SAG h2:after { content: ''; display: table; width: 40px; height:1px; margin-top: 10px; background: #000} .SAYFA-2 .SAG h3 { color: #000; padding: 10px 0px; font-weight: 600; } .SAYFA-2 .SAG h3:after { content: ''; display: table; width: 40px; height:1px; margin-top: 10px; background: #000} .SAYFA-2 .SAG ul li { margin-left: 20px; list-style:outside} .SAYFA-2 .SAG li,p { line-height: 30px; font-size: 15px; } .MARKADETAY .IMG { position: relative; z-index: 0} .MARKADETAY .IMG img { width: 100%; height: 450px; object-fit: cover; } .MARKADETAY article { padding: 50px 40px; max-width: 1200px; margin: -100px auto 0; background: #fff; position: relative; z-index: 10} .MARKADETAY article p { font-size: 16px; line-height: 32px} .article { } .article h1 { padding: 8px 0px } .article h2 { padding: 8px 0px } .article p { padding: 8px 0px } .article-x { } .article-x h1 { padding: 8px 0px; font-size: 22px; } .article-x h2 { padding: 8px 0px; font-size: 18px; } .article-x p { padding: 8px 0px; font-size: 15px; } .article-x ul { margin: 0px; padding: 20px; } .article-x ul li { list-style: disc; padding: 6px 0px} .article-2x { } .article-2x h1 { padding: 8px 0px; font-size: 29px; } .article-2x h2 { padding: 8px 0px; font-size: 25px; } .article-2x p { padding: 8px 0px; font-size: 18px; } .article-2x ul { margin: 0px; padding: 20px; } .article-2x ul li { list-style: disc; padding: 6px 0px} .article-xs { } .article-xs h1 { padding: 8px 0px; font-size: 29px; } .article-xs h2 { padding: 8px 0px; font-size: 25px; } .article-xs p { padding: 8px 0px; font-size: 15px; letter-spacing: 1px } .article-xs ul { margin: 0px; padding: 20px; } .article-xs ul li { list-style: disc; padding: 6px 0px} .tema-text h1 { } .tema-text h2 { } .tema-text p { color: #4d4d4d; } .more-buton { display: inline-block; padding: 6px 15px; background: #EB094F; color: #fff; } .more-buton:hover { background: #000 } .ul-menu h2 { font-size: 19px; padding-bottom: 15px } .ul-menu li { line-height: 32px; letter-spacing: 1px; font-size: 14px; color: #000; } .ul-menu li a { color: #000; } .ul-menu li a:hover { color: #d13274; } .bg-line { position: relative; z-index: 0; } .bg-line .ln-1 { position: relative; z-index: 20} .bg-line .ln-2 { position: absolute; z-index: 0; width: 220px; height: 220px; border-radius: 150px; right: 10%; top: 10%; background: #f2f2f2; } @media screen and (max-width: 1000px) { .SAYFA { padding: 40px 20px } .SAYFA .SOL { width: 100%; } .SAYFA .SAG { width: calc(100% - 0px); float:left; padding: 0px 0px 60px 0px } .SAYFA .SOL .BILGIFORM { display: none; } .SAYFA .SOL .UG { display: none; } .SAYFA .SOL .MENUSOL { padding: 0px; display: none } .SAYFA .SOL .PFORM { padding: 30px} } .ALTHIZMET { } .ALTHIZMET .IN { max-width: 1200px; margin: 0 auto; padding: 60px 20px ; position: relative; z-index: 20; overflow: hidden; } .ALTHIZMET .item { width: calc(100% / 4); text-align: center; float: left; padding: 50px 0px } .ALTHIZMET .item h2 { font-size: 20px; line-height: 40px } .ALTHIZMET .item .icon { font-size: 36px; color:#000; padding-bottom: 20px} .ALTHIZMET .item .txt { font-size: 15px; line-height: 40px } .ALTHIZMET .item:hover .icon { color: #000 } @media screen and (max-width: 1000px) { .ALTHIZMET .item { width: calc(100% / 1); text-align: center; float: left; padding:30px 0px } } .VIDEOLAR { } .VIDEOLAR .IN { max-width: 1200px; margin: 0 auto; padding: 60px 20px ; position: relative; z-index: 20; overflow: hidden; } .VIDEOLAR .IN .li { width: calc(100% / 2 - 40px); float: left; padding:0px; margin: 20px; position: relative; } .VIDEOLAR .IN .li img { width: 100%; } .VIDEOLAR .IN .li .IMG { width: 100%; height: 300px; position: relative; z-index:0} .VIDEOLAR .IN .li h2 { padding: 9px 0px; width: 100%; text-align: center; color: #fff; font-size: 18px;position: absolute; left:0px; bottom: 0; z-index: 10 } .VIDEOLAR .IN .li .playb { font-size: 46px; color: #fff; left: 50%; top:50%; margin-left: -10px; margin-top: -10px; z-index: 30; position: absolute} .VIDEOLAR .IN .li .mask { width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: absolute; left: 0; bottom: 0; z-index: 1} .VIDEOLAR .IN .li:hover .playb { -webkit-transform: scale(1.20); -moz-transform: scale(1.20); -o-transform: scale(1.20); -ms-transform: scale(1.20); transform: scale(1.20); } .VIDEOLAR .IN .li:hover .mask { background: rgba(0,0,0,0.3);} .VIDEOLAR .IN .ilkvideo { padding: 20px; width: calc(100% - 40px); } .VIDEOLAR .IN .FRAMEVIDEO { background: #000; margin-bottom: 50px} @media screen and (max-width: 1000px) { .VIDEOLAR .IN .li { width: calc(100% / 1 - 40px); float: left; padding:0px; margin: 20px; position: relative; } } .ACIKLAMA { position: relative; z-index: 60; max-width: 90%; margin: 0 auto 50px; background: #f6f6f6 } .ACIKLAMA .IN { max-width: 1200px; margin: 0 auto; padding: 60px 20px ; position: relative; z-index: 20; overflow: hidden; } .ACIKLAMA .IN:after { content: ''; display: table; clear: both; } .ACIKLAMA .IN .li { width: calc(100% / 2 - 60px); min-height: 30px; float:right; padding: 30px } .ACIKLAMA .IN .li p { line-height: 30px; color: #000; font-weight: 300} .ACIKLAMA .IN .li h1 { padding-bottom: 20px; color: #000; font-weight: 600} .ACIKLAMA .IN .li ul { padding: 20px 0px} .ACIKLAMA .IN .li ul li { width: calc(100% / 2 - 0px); float: left; padding: 2px 0px; margin: 20px 0px; font-size: 20px; font-weight: 600; list-style: circle } .ACIKLAMA .IN .li ul:after { content: ''; display: table; clear: both; } .ACIKLAMA .IN .ODAK { position: relative; width: 50%; float: left; text-align: center; margin-top: 40px; } .ACIKLAMA .karebg { width: 100%; position: absolute; left: 50%; top:50%; margin-left: -50%; margin-top: -50%; z-index: 0 } .ACIKLAMA .karebg img {width: 100%; } .ACIKLAMA .scel { position: relative; z-index: 20} @media screen and (max-width: 1000px) { .ACIKLAMA .karebg { display: none; } .ACIKLAMA .IN .ODAK { position: relative; width:100%; } .ACIKLAMA .IN .li { width: calc(100% / 1 - 60px); } .ACIKLAMA .IN .li ul li { width: calc(100% / 1 - 80px); float: left; } } .BLOG_110 { position:relative; margin:0 auto; z-index:10; max-width:1000px; overflow:hidden; } .BLOG_110 .owl-carousel { } .BLOG_110 .owl-carousel .owl-nav { text-align:center; width:100%; } .BLOG_110 .owl-carousel .owl-prev { color:#000; font-size: 25px; display:inline-block; padding:5px 5px; position:absolute; top:50%; left:-50px; margin-top:-17px; } .BLOG_110 .owl-carousel .owl-next { color:#000; font-size: 25px; display:inline-block; padding:5px 5px; position:absolute; top:50%; right:-50px; margin-top:-17px; } .BLOG_110 .owl-carousel .owl-next:hover { } .BLOG_110 .owl-carousel .owl-prev:hover { } .BLOG_110 .owl-item { margin:0px; } .BLOG_110 .BLOG_LI { position:relative; text-align:center; padding: 0px 0px; } .BLOG_110 .BLOG_LI img { width: 80%; -webkit-filter: grayscale(100%); filter: grayscale(100%); opacity: 0.5; filter: alpha(opacity=50); } .BLOG_110 .BLOG_LI:hover img { -webkit-filter: grayscale(0%); filter: grayscale(0%); opacity: 0.9; filter: alpha(opacity=90);} .BLOG_110 .BLOG_LI h2 { color: #fff; font-size: 80px; font-weight: 100; } .WEBBANNER { width: 100%; position: relative; background: rgb(50,36,175); background: -moz-linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); background: -webkit-linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); background: linear-gradient(90deg, rgba(50,36,175,1) 0%, rgba(198,108,214,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3224af",endColorstr="#c66cd6",GradientType=1); } .WEBBANNER:after { content: ""; background: url(../../../../quickbooks.intuit.com/au/resources/au_qrc/uploads/2018/01/Online-Business.html) center center no-repeat; opacity: 0.2; top: 0; left: 0; bottom: 0; right: 0; position: absolute; width: 100%; background-size: cover; z-index: 0; } .WEBBANNER .WEBIMG { margin-top: -250px; } .WEBBANNER .IN { max-width: 1000px; margin: 0 auto; padding: 100px 0px; text-align: center; color: #fff; position: relative; z-index: 3} .WEBBANNER .IN h2 { font-size: 28px; padding-bottom: 10px;} .WEBBANNER .IN p { font-size: 18px; line-height: 30px} @media screen and (max-width: 1000px) { .WEBBANNER .IN { padding: 100px 20px; } .WEBBANNER .WEBIMG { width: 100%; } } .USTMENU_BAR { text-align: center; } .USTMENU_BAR .li { display: inline-block; padding: 8px 35px; background: #cecae2; color: #fff; font-size: 19px; } .USTMENU_BAR .li:hover { } .USTMENU_BAR .bulink { background: #f6f5fb; color: #000} @media screen and (max-width: 1000px) { .USTMENU_BAR { padding: 30px; } .USTMENU_BAR .li { width: 100%; margin-bottom: 10px; } } .WEBBANNER2 { width: 100%; position: relative; background: #f3f3f3 } .WEBBANNER2 .IN { max-width: 1200px; margin: 0 auto; padding: 100px 0px; text-align: center; color: #000; position: relative; z-index: 3} .WEBBANNER2 .IN h2 { font-size: 28px; padding-bottom: 10px;} .WEBBANNER2 .IN p { font-size: 18px; line-height: 30px} .BANNER { background: #000; color: #fff; } .BANNER h2 { padding: 6px 0px ; letter-spacing: -1px; font-size: 30px } .BANNER p { padding: 6px 0px; } .BANNER .content {position: relative; z-index: 0} .BANNER a { position: absolute; right: 20px; top: calc(50% - 25px); background: #047862; color: #fff; padding: 6px 15px; border-radius: 6px; box-shadow: 10px 10px 15px rgba(0,0,0,0.1) } .BANNER a:hover { background: #000; color: #fff; } @media screen and (max-width: 1000px) { .BANNER a { position:relative; margin-top: 15px; margin-left: 20px;} } .NEREDEYIM { background: #f2f2f2} .NEREDEYIM .IN { max-width: 1200px; margin: 0 auto; padding:10px 0px; text-align: center; color: #666; text-transform: uppercase; } .ICERIK { max-width: 1200px; margin: 0 auto; padding: 90px 0px } .ICERIK h1 { font-size: 32px; padding-bottom: 10px; color: #000; font-weight: 700; } .ICERIK h2 { font-size: 22px; padding-bottom: 10px; } .ICERIK p { font-size: 14px; line-height: 30px; color: #666} .ICERIK:after { content: ''; display: table; clear: both; } .ICERIK ul { padding: 20px 20px} .ICERIK ul li { list-style: disc; font-size: 14px; line-height: 30px; color: #666} .ORANLAR2 { padding: 40px 0px; } .ORANLAR2 .IN { max-width: 1300px; margin: 0 auto; text-align: center; position: relative; z-index: 60} .ORANLAR2 .IN:after { content: ''; display: table; clear: both; } .ORANLAR2 .IN h4 { width: calc(100% / 4); float: left; padding: 90px 0px; background: url(../../../index.html) center center no-repeat; background-size: contain; } .ORANLAR2 .IN h4 strong { display: inline-block; width: 100%; font-size: 36px; color: #000 } @media screen and (max-width: 1000px) { .ICERIK { padding: 90px 30px } .ICERIK #bol-2-hk { width: 100%; float: left; } .ICERIK #bol-2-hk2 { width: calc(100% - 0px); padding-left: 0px; } .ORANLAR2 { padding: 0px 30px; } .ORANLAR2 .IN h4 { width: calc(100% / 2); margin-bottom: 20px; float: left; padding: 40px 0px; background: url(../../../index.html) center center no-repeat; background-size: contain; } } .ONCESI { text-align: center; padding: 0px 0px; background: #f5f5f5; overflow: hidden; position: relative; z-index: 20; max-width: 90%; margin: 0 auto; margin-bottom: 50px} .ONCESI .IN { max-width: 1000px; margin: 0 auto; text-align: center; position: relative; z-index: 60} .ONCESI h1 { font-size: 28px; padding-bottom: 10px; color: #000} .ONCESI p { font-size: 18px; line-height: 30px} .ONCESI .CN { padding: 40px 0px; position: relative; z-index: 60} .ONCESI .karebg { width: 100%; position: absolute; left: 50%; top:50%; margin-left: -50%; margin-top: -50%; z-index: 0 } .ONCESI .karebg img {width: 100%; } .ABONEOL { color: #152d47; background: #f2f2f2 } .ABONEOL .bultenform { position: relative; } .ABONEOL .bultenform .MA { width: calc(100% - 0px); border:none; background: #fff; outline: none; padding:0px 15px; height: 50px; } .ABONEOL .bultenform .MG { text-align: center; background: #047862; color: #fff; padding: 0px 10px; line-height: 50px; height: 50px; } .ABONEOL .bultenform .MG i { font-size: 25px; line-height: 50px; } .ABONEOL .bultenform .MG:hover { cursor: pointer; background: #000 } .ABONEOL .SOSYALMEDYA i { line-height: 40px; font-size: 20px; color: #047862; } .ABONEOL .SOSYALMEDYA a { display: inline-block; padding: 0px 0px; margin: 0px 0px; width: 30px; height: 40px; } .ABONEOL .SOSYALMEDYA a:hover { opacity: 0.5 } @media screen and (max-width: 1000px) { .ABONEOL { margin: 20px; border-radius: 15px; } } .PAGEBANNER { background-position: center center; background-repeat: no-repeat; background-size: cover; height: 350px; } .PAGEBANNER .IN { max-width: 1200px; margin: 0 auto} .PAGEBANNER .IN h1 { line-height: 350px; font-size: 28px; font-weight: 300; } .ITEM-BANNER { background: #555 url(abone.png) center center no-repeat; background-size: cover } .ITEM-BANNER .IN { max-width: 1200px; margin: 0 auto; padding: 50px 0px; color: #fff; } .ITEM-BANNER .IN a { color: #fff; margin: 0px 10px; font-weight: 300; } .ITEM-URUN { } .ITEM-URUN .IN { max-width: 1200px; margin: 0 auto; padding: 50px 0px; } .ITEM-URUN .ITEM-SOL { width: 350px; float: left; } .ITEM-URUN .ITEM-SOL li { background: #f2f2f2; padding: 8px 10px; border-radius: 8px; margin-bottom: 5px; font-size: 15px } .ITEM-URUN .ITEM-SOL li:hover { background: #000; color: #fff; } .ITEM-URUN .ITEM-SOL .item-info { background: #555 url(abone.png) center center; color: #fff; padding: 35px; border-radius: 8px; font-size: 18px; text-align: center; margin-top: 15px} .ITEM-URUN .ITEM-SOL .item-info a { display: inline-block; padding: 8px 10px; background: #047862; color: #fff; font-size: 14px; margin-top: 15px; border-radius: 8px } .ITEM-URUN .ITEM-SOL .item-info a:hover { background: #fff; color: #000} .ITEM-URUN .ITEM-SOL h1 { background: #f6f6f6; font-size: 19px; border-radius: 8px; padding: 8px 10px; font-weight: 700; margin-bottom: 5px; color: #047862 } .ITEM-URUN .ITEM-SAG { } .ITEM-URUN .DCQ { padding: 30px 10px; color: #000 } .ITEM-URUN .ITEM-SAG li { width: calc(100% / 3 - 20px); float: left; margin: 10px ; position: relative; z-index: 1} .ITEM-URUN .ITEM-SAG li .img { position: relative; z-index: 1; } .ITEM-URUN .ITEM-SAG li img { object-fit:cover; width: 100%; height: 200px;} .ITEM-URUN .ITEM-SAG li h2 { font-size: 18px; position: absolute; bottom: 0; left: 0; z-index: 50; padding: 8px; color: #fff; background: #000 } .ITEM-URUN .ITEM-SAG li:hover h2 { color: #000; background: #fff; } .HOME-BX { max-width: 1200px; margin: 0 auto; text-align: center; padding: 50px 0px 0px 0px } .HOME-BX i { font-size: 50px} .HOME-BX h1 { color: #000 } .HOME-BX p { font-size: 18px} .HOME-BX a { display: inline-block; border: 1px solid #000; color: #000; font-size: 19px; padding: 8px 15px; margin-top: 15px } .HOME-BX a:hover { background: #000; color: #fff; } .HOME-BX-2 { max-width: 1200px; margin: 0 auto; text-align: center; padding: 0px 0px 50px 0px } .HOME-BX-2 i { font-size: 50px} .HOME-BX-2 h1 { color: #000 } .HOME-BX-2 p { font-size: 18px} .HOME-BX-2 a { display: inline-block; border: 1px solid #000; color: #000; font-size: 19px; padding: 8px 15px; margin-top: 15px } .HOME-BX-2 a:hover { background: #000; color: #fff; } .HOME-BX-3 {} .HOME-BX-3 .FL1 { width: 50%; float: left; padding: 40px; color: #fff; } .HOME-BX-3 { max-width: 1200px; margin: 0 auto; text-align: center; padding: 0px 0px 50px 0px } .HOME-BX-3 i { font-size: 50px} .HOME-BX-3 h1 { } .HOME-BX-3 p { font-size: 15px} .HOME-BX-3 a { display: inline-block; border: 1px solid #fff; color: #fff; font-size: 16px; padding: 8px 15px; margin-top: 15px } .HOME-BX-3 a:hover { background: #fff; color: #000; } .HOME-BX-3 .BG1 { background: #004e9c;} .HOME-BX-3 .BG2 { background: #317790;} .HOME-BX-B { background: #000; position: relative; color: #fff; } .HOME-BX-B .IN { max-width: 1200px; margin: 0 auto; text-align: center; padding:100px 0px } .HOME-BX-B .IN a { display: inline-block; border: 1px solid #fff; color: #fff; font-size: 16px; padding: 8px 15px; margin-top: 15px } .HOME-BX-B .IN a:hover { background: #fff; color: #000; } .HOME-BX-B .IN .txt { position: relative; z-index: 1} .HOME-BX-B .IN img { position: absolute; z-index: 0; left: 0; width: 100%; height: 100%; top: 0; object-fit:cover; opacity: 0.5 } .HOME-BX-A { position: relative; } .HOME-BX-A .IN { max-width: 1200px; margin: 0 auto; padding:100px 0px } .HOME-BX-A .IN a { display: inline-block; border: 1px solid #fff; color: #fff; font-size: 16px; padding: 8px 15px; margin-top: 15px } .HOME-BX-A .IN a:hover { background: #fff; color: #000; } .HOME-BX-A .IN .txt { position: relative; z-index: 1} .HOME-BX-A .IN img { position: absolute; z-index: 0; left: 0; width: 100%; height: 100%; top: 0; object-fit:cover; } @media screen and (max-width: 1000px) { .HOME-BX-A .IN { max-width: 1200px; margin: 0 auto; padding:100px 30px } } .HOME-LIST { border-bottom: 1px solid #f2f2f2} .HOME-LIST .IN { max-width: 1300px; margin: 0 auto; padding:50px 0px; } .HOME-LIST .DCQ { padding: 30px 10px; color: #000 } .HOME-LIST li { width: calc(100% / 3 - 20px); float: left; margin:10px ; position: relative; z-index: 1; text-align: center} .HOME-LIST li .img { position: relative; z-index: 1; } .HOME-LIST li img { object-fit:cover; width: 100%; height: 200px;} .HOME-LIST li h2 { font-size: 18px; color: #000; padding:8px 10px; display: inline-block; } .HOME-LIST li:hover h2 { color: #000; background: #fff; } .HOME-LIST .col-2 { width: 100%; float: left; } @media screen and (max-width: 1000px) { .ITEM-URUN .ITEM-SOL { width: 100%; float: left; } .ITEM-URUN .ITEM-SAG { width: calc(100% - 0px); float:right; } .ITEM-URUN .ITEM-SOL .item-info { display: none } .ITEM-URUN .ITEM-SAG li { width: calc(100% / 1); } .ITEM-BANNER { display: none } } .SONSUZMENU { display: none; padding: 15px 0px } .SONSUZMENU .TICKLA { position: relative; padding: 0px 15px; background: #f2f2f2; line-height: 45px; font-size: 19px; font-weight: 800; color: #000; cursor: pointer } .SONSUZMENU .TICKLA i { float: right; line-height: 45px; } .SONSUZMENU .TOME { display: none } .SONSUZMENU .TOME .li { padding: 0px 15px; background: #f2f2f2; border-bottom: 1px solid #ccc; line-height: 45px } .SONSUZMENU .TOME .li i { float: right; line-height: 45px; } @media screen and (max-width: 1000px) { .SONSUZMENU { display:block; } } .CONTAINER { max-width: 1200px; margin: 0 auto} .FILTER { padding: 10px } .FILTER .TABI { text-align: center } .FILTER .TABI .li { padding: 15px 30px; font-size: 20px; color: #000; display: inline-block; margin: 0px 2px; cursor: pointer } .FILTER .TABI .li i {font-size: 38px} .FILTER .TABI .li p { font-size: 18px; font-weight: 700; } .FILTER .TABI .active { background: #f2f2f2; } .FILTER .CONU { background: #f2f2f2; padding: 30px } .FILTER .CONU .li { display: none; } .FILTER .CONU .u3 { column-count: 3; column-gap: 40px; } .FILTER .CONU a { display: inline-block; padding: 5px 0px; font-weight: 400;} .FILTER .BUTONU { background: #2196f3; color: #fff; padding: 8px 15px; outline: none; border:none; float: right; } .TAB-A1 { margin: 50px 0px } .TAB-A1 .TABI { text-align: center } .TAB-A1 .TABI .li { padding: 15px 30px; font-size: 20px; color: #000; display: inline-block; margin: 0px 2px; cursor: pointer } .TAB-A1 .TABI .li i {font-size: 38px} .TAB-A1 .TABI .li p { font-size: 18px; font-weight: 700; } .TAB-A1 .TABI .active { background: #f2f2f2; } .TAB-A1 .CONU { background: #f2f2f2; padding: 30px } .TAB-A1 .CONU .li { display: none; } .TAB-A1 .CONU .li:first-of-type { column-count: 3; column-gap: 40px; column-rule: 1px solid #ccc; line-height: 32px } .i-filitre { width: calc(100% / 4 - 60px); float: left; padding: 10px 30px; position: relative } .i-filitre:hover { cursor: pointer } .i-filitre i { position: absolute; top: 13px; left: 5px; opacity: 0.2 } .i-filitre:hover i { opacity: 1} .i-filitre-ac i { opacity: 1} .URUN-HOME { padding:0px 0px; } .URUN-HOME .IN { margin: 0 auto; width: 90%; padding: 10px 0px 50px 0px } .URUN-HOME .owl-carousel .owl-nav { } .URUN-HOME .owl-carousel .owl-prev { position: absolute; left: -40px; top: 50%; } .URUN-HOME .owl-carousel .owl-next { position: absolute; right: -40px; top: 50%; } .URUN-HOME .owl-carousel .owl-nav i { display:inline-block; margin: 2px; color: #000; } .URUN-HOME .owl-carousel .owl-next:hover { } .URUN-HOME .owl-carousel .owl-prev:hover { } .URUN-HOME .owl-item { margin: 0; padding: 0; background: #fff; } .URUN-HOME .owl-item span { text-decoration:line-through;} .URUN-HOME .owl-item h3 { position: absolute; z-index: 50; left: 0px; bottom:10px; width: 100%; text-align: center; font-weight: 100 } .URUN-HOME .owl-item:hover h3 { background: #000; color: #fff } .URUN-HOME .owl-item img { width: 100%; } .URUN-HOME h2 { text-align: center; } @media screen and (max-width: 1000px) { .URUN-HOME .IN { margin: 0 auto; width: 100%; } } .form-bg { background: #f2f2f2;} form.form_form .form-1 { width: calc(100%); float: left; padding:0px 5px } form.form_form .form-2 { width: calc(100% / 2); float: left; padding:0px 5px } @media screen and (max-width: 1000px) { form.form_form .form-2 { width: calc(100% / 1); } } .BTN1 { background: #000; color: #fff; } .BTN1:hover { background: #000; color: #fff } .BUTONLAR { } .BUTONLAR button { border: none; background: none; outline: none; margin: 0; padding: 0; } .BUTONLAR .bt-1 { background: #000; color: #fff; padding: 8px 10px; } .BUTONLAR .bt-2 { background: #4ba440; color: #fff; padding: 8px 10px; } .BUTONLAR .bt-txt { padding: 8px 0px; } .BUTONLAR button:hover { cursor:pointer; background: #000; color: #fff; } .BUTONLARDIV { } .BUTONLARDIV .buton { padding: 8px 10px; float: left; font-size: 15px } .BUTONLARDIV .bt-1 { background: #000; color: #fff; } .BUTONLARDIV .bt-2 { background: #4ba440; color: #fff; margin-left: 5px } .BUTONLARDIV .bt-txt { display: inline-block; padding: 8px 0px; margin-top: 15px; font-size: 14px } .BUTONLARDIV .buton:hover { background: #000; cursor: pointer } @media screen and (max-width: 1000px) { .kategori-menusu { position: fixed; width: 100%; height: 100%; left:-100%; top: 0; background: #fff; z-index: 600; transition: 0.5s; display: flex; align-content: stretch; align-items: center } .kategori-menusu > div { padding: 0px 40px} } @-webkit-keyframes bardol { 0% { width: 0% } 100% { width: 85% } } @-moz-keyframes bardol { 0% { width: 0% } 100% { width: 85% } } @-o-keyframes bardol { 0% { width: 0% } 100% { width: 85% } } @keyframes bardol { 0% { width: 0% } 100% { width: 85% } } .akbar { background: #f2f2f2; margin-top: 20px; } .sozlesme { padding: 9px 0px; } .TEMA1 { max-width: 1200px; margin: 0 auto; } .TEMA1 .item { background: #ccc;} .TEMA1 .owl-dots, .TEMA1 .owl-nav {text-align:center;-webkit-tap-highlight-color:transparent} .TEMA1 .owl-nav {margin-top:10px; display: none; } .TEMA1 .owl-nav [class*=owl-]{color:#FFF;font-size:14px;margin:5px;padding:4px 7px;background:#D6D6D6;display:inline-block;cursor:pointer;border-radius:3px} .TEMA1 .owl-nav [class*=owl-]:hover{background:#869791;color:#FFF;text-decoration:none} .TEMA1 .owl-nav .disabled{opacity:.5;cursor:default} .TEMA1 .owl-nav.disabled+.owl-dots{margin-top:10px} .TEMA1 .owl-dots .owl-dot{display:inline-block;zoom:1; } .TEMA1 .owl-dots .owl-dot span{width:10px;height:10px;margin:5px 7px;background:#D6D6D6;display:block;-webkit-backface-visibility:visible;transition:opacity .2s ease;border-radius:30px} .TEMA1 .owl-dots .owl-dot.active span, .TEMA1 .owl-dots .owl-dot:hover span{background:#869791} .TEMA1 .owl-dots button { outline: none; } .TEMA1 .owl-dots { padding: 15px 0px} .TEMA1 img { height: 500px; width: 100%; object-fit: cover; } .COROSER .owl-nav .owl-prev { position: absolute; top: 50%; left: -30px; } .COROSER .owl-nav .owl-next { position: absolute; top: 50%; right: -30px; } .COROSER .owl-nav i { font-size: 20px} @keyframes data-3 { 0% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } 50% { -webkit-transform: scale(1.20); -moz-transform: scale(1.20); -o-transform: scale(1.20); -ms-transform: scale(1.20); transform: scale(1.20); } 100% { -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); -ms-transform: scale(1); transform: scale(1); } } .OLW-ANIMASYON .active { overflow: hidden; } .OLW-ANIMASYON .active img { animation: data-3 8s infinite; } .owl-carousel { display: none; width: 100%; -webkit-tap-highlight-color: transparent; /* position relative and z-index fix webkit rendering fonts issue */ position: relative; z-index: 1; } .owl-carousel .owl-stage { position: relative; -ms-touch-action: pan-Y; touch-action: manipulation; -moz-backface-visibility: hidden; /* fix firefox animation glitch */ } .owl-carousel .owl-stage:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .owl-carousel .owl-stage-outer { position: relative; overflow: hidden; /* fix for flashing background */ -webkit-transform: translate3d(0px, 0px, 0px); } .owl-carousel .owl-wrapper, .owl-carousel .owl-item { -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); } .owl-carousel .owl-item { position: relative; min-height: 1px; float: left; -webkit-backface-visibility: hidden; -webkit-tap-highlight-color: transparent; -webkit-touch-callout: none; } .owl-carousel .owl-item img { display: block; width: 100%; } .owl-carousel .owl-nav.disabled, .owl-carousel .owl-dots.disabled { display: none; } .owl-carousel .owl-nav .owl-prev, .owl-carousel .owl-nav .owl-next, .owl-carousel .owl-dot { cursor: pointer; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel .owl-nav button.owl-prev, .owl-carousel .owl-nav button.owl-next, .owl-carousel button.owl-dot { background: none; color: inherit; border: none; padding: 0 !important; font: inherit; } .owl-carousel.owl-loaded { display: block; } .owl-carousel.owl-loading { opacity: 0; display: block; } .owl-carousel.owl-hidden { opacity: 0; } .owl-carousel.owl-refresh .owl-item { visibility: hidden; } .owl-carousel.owl-drag .owl-item { -ms-touch-action: pan-y; touch-action: pan-y; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .owl-carousel.owl-grab { cursor: move; cursor: grab; } .owl-carousel.owl-rtl { direction: rtl; } .owl-carousel.owl-rtl .owl-item { float: right; } /* No Js */ .no-js .owl-carousel { display: block; } /* * Owl Carousel - Animate Plugin */ .owl-carousel .animated { animation-duration: 1000ms; animation-fill-mode: both; } .owl-carousel .owl-animated-in { z-index: 0; } .owl-carousel .owl-animated-out { z-index: 1; } .owl-carousel .fadeOut { animation-name: fadeOut; } @keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } } /* * Owl Carousel - Auto Height Plugin */ .owl-height { transition: height 500ms ease-in-out; } /* * Owl Carousel - Lazy Load Plugin */ .owl-carousel .owl-item { /** This is introduced due to a bug in IE11 where lazy loading combined with autoheight plugin causes a wrong calculation of the height of the owl-item that breaks page layouts */ } .owl-carousel .owl-item .owl-lazy { opacity: 0; transition: opacity 400ms ease; } .owl-carousel .owl-item .owl-lazy[src^=""], .owl-carousel .owl-item .owl-lazy:not([src]) { max-height: 0; } .owl-carousel .owl-item img.owl-lazy { transform-style: preserve-3d; } /* * Owl Carousel - Video Plugin */ .owl-carousel .owl-video-wrapper { position: relative; height: 100%; background: #000; } .owl-carousel .owl-video-play-icon { position: absolute; height: 80px; width: 80px; left: 50%; top: 50%; margin-left: -40px; margin-top: -40px; background: url("../../../index.html") no-repeat; cursor: pointer; z-index: 1; -webkit-backface-visibility: hidden; transition: transform 100ms ease; } .owl-carousel .owl-video-play-icon:hover { -ms-transform: scale(1.3, 1.3); transform: scale(1.3, 1.3); } .owl-carousel .owl-video-playing .owl-video-tn, .owl-carousel .owl-video-playing .owl-video-play-icon { display: none; } .owl-carousel .owl-video-tn { opacity: 0; height: 100%; background-position: center center; background-repeat: no-repeat; background-size: contain; transition: opacity 400ms ease; } .owl-carousel .owl-video-frame { position: relative; z-index: 1; height: 100%; width: 100%; } /* CSS3 Transitions */ .owl-origin { -webkit-perspective: 1200px; -webkit-perspective-origin-x : 50%; -webkit-perspective-origin-y : 50%; -moz-perspective : 1200px; -moz-perspective-origin-x : 50%; -moz-perspective-origin-y : 50%; perspective : 1200px; } /* fade */ .owl-fade-out { z-index: 10; -webkit-animation: fadeOut .7s both ease; -moz-animation: fadeOut .7s both ease; animation: fadeOut .7s both ease; } .owl-fade-in { -webkit-animation: empty 1ms both ease; -moz-animation: empty 1ms both ease; animation: empty 1ms both ease; } /* backSlide */ .owl-backSlide-out { -webkit-animation: backSlideOut 1s both ease; -moz-animation: backSlideOut 1s both ease; animation: backSlideOut 1s both ease; } .owl-backSlide-in { -webkit-animation: backSlideIn 1s both ease; -moz-animation: backSlideIn 1s both ease; animation: backSlideIn 1s both ease; } /* goDown */ .owl-goDown-out { -webkit-animation: scaleToFade .7s ease both; -moz-animation: scaleToFade .7s ease both; animation: scaleToFade .7s ease both; } .owl-goDown-in { -webkit-animation: goDown .6s ease both; -moz-animation: goDown .6s ease both; animation: goDown .6s ease both; } /* scaleUp */ .owl-fadeUp-in { -webkit-animation: scaleUpFrom .5s ease both; -moz-animation: scaleUpFrom .5s ease both; animation: scaleUpFrom .5s ease both; } .owl-fadeUp-out { -webkit-animation: scaleUpTo .5s ease both; -moz-animation: scaleUpTo .5s ease both; animation: scaleUpTo .5s ease both; } /* Keyframes */ /*empty*/ @-webkit-keyframes empty { 0% {opacity: 1} } @-moz-keyframes empty { 0% {opacity: 1} } @keyframes empty { 0% {opacity: 1} } @-webkit-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-moz-keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @keyframes fadeOut { 0% { opacity:1; } 100% { opacity:0; } } @-webkit-keyframes backSlideOut { 25% { opacity: .5; -webkit-transform: translateZ(-500px); } 75% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(-200%); } } @-moz-keyframes backSlideOut { 25% { opacity: .5; -moz-transform: translateZ(-500px); } 75% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; -moz-transform: translateZ(-500px) translateX(-200%); } } @keyframes backSlideOut { 25% { opacity: .5; transform: translateZ(-500px); } 75% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } 100% { opacity: .5; transform: translateZ(-500px) translateX(-200%); } } @-webkit-keyframes backSlideIn { 0%, 25% { opacity: .5; -webkit-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -webkit-transform: translateZ(-500px); } 100% { opacity: 1; -webkit-transform: translateZ(0) translateX(0); } } @-moz-keyframes backSlideIn { 0%, 25% { opacity: .5; -moz-transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; -moz-transform: translateZ(-500px); } 100% { opacity: 1; -moz-transform: translateZ(0) translateX(0); } } @keyframes backSlideIn { 0%, 25% { opacity: .5; transform: translateZ(-500px) translateX(200%); } 75% { opacity: .5; transform: translateZ(-500px); } 100% { opacity: 1; transform: translateZ(0) translateX(0); } } @-webkit-keyframes scaleToFade { to { opacity: 0; -webkit-transform: scale(.8); } } @-moz-keyframes scaleToFade { to { opacity: 0; -moz-transform: scale(.8); } } @keyframes scaleToFade { to { opacity: 0; transform: scale(.8); } } @-webkit-keyframes goDown { from { -webkit-transform: translateY(-100%); } } @-moz-keyframes goDown { from { -moz-transform: translateY(-100%); } } @keyframes goDown { from { transform: translateY(-100%); } } @-webkit-keyframes scaleUpFrom { from { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpFrom { from { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpFrom { from { opacity: 0; transform: scale(1.5); } } @-webkit-keyframes scaleUpTo { to { opacity: 0; -webkit-transform: scale(1.5); } } @-moz-keyframes scaleUpTo { to { opacity: 0; -moz-transform: scale(1.5); } } @keyframes scaleUpTo { to { opacity: 0; transform: scale(1.5); } } table { width: 100%; border-collapse: collapse; } /* Zebra striping */ tr:nth-of-type(odd) { background: #eee; } th { background: #333; color: white; font-weight: bold; } td, th { padding: 6px; border: 1px solid #ccc; text-align: left; } @media only screen and (max-width: 760px), (min-device-width: 768px) and (max-device-width: 1024px) { /* Force table to not be like tables anymore */ table, thead, tbody, th, td, tr { display: block; } thead tr { position: absolute; top: -9999px; left: -9999px; } tr { border: 1px solid #ccc; } td { /* Behave like a "row" */ border: none; border-bottom: 1px solid #eee; position: relative; } td:before { position: absolute; width: 100%; padding-right: 10px; white-space: nowrap; }