@font-face {
    font-display: swap
}

.sosyalico, .sosyalico a i, .sosyalico i {
    color: #8a8a8a;
    font-size: 15px
}

.hbrsrg, body {
    overflow-x: hidden
}

.icsayfabanner, .productalan {
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover
}

#check:checked ~ label #btn, label #cancel {
    opacity: 0;
    visibility: hidden
}

.slider, .slider-wrapper {
    overflow: hidden;
    position: relative
}

.aboutbg .btn-detail a, .arrow, .boxpro p, .cont-ul .cont-li a, .cont-ul .cont-li a:hover, .destekbox .destekbg .dskadress a, .footerbg .footadres p a, .footerbg .footadres p a:hover, .icmenu a, .menubar .nav-link, .navigasyonbar a, a, a:active, a:focus, a:hover {
    text-decoration: none
}

::-webkit-scrollbar {
    width: 8px;
    background-color: #f2f2f2
}

.banneralan, .menubar {
    position: relative;
    width: 100%
}

:root {
    --gold: #ffb338;
    --light-shadow: #77571d;
    --dark-shadow: #3e2904
}

::-webkit-scrollbar-thumb {
    background-color: #d6d6d6
}

    ::-webkit-scrollbar-thumb:hover {
        background-color: #a5a5a5
    }

    ::-webkit-scrollbar-thumb:active {
        background-color: #a5a5a5
    }

body {
    color: #000;
    margin: 0;
    font-size: 16px;
    background-color: #edefef;
    overflow-x: hidden;
    background-size: cover;
    font-family: 'Open Sans',sans-serif
}

h1 {
    font-size: 24px
}

p {
    font-size: 16px
}

.no-gutters, ul {
    padding: 0
}

.fancy img, .game-section .item.active {
    width: 500px
}

.topbar {
    background-color: #fff;
    padding: 1px 0;
    margin: 0;
    position: relative
}

.sosyalico {
    margin: auto 10px;
    padding: 0
}

.iconfax, .iconmail, .iconmaps, .iconphone {
    color: #1d4161d1;
    margin-right: 5px
}

.sosyalico i {
    margin: 0 5px
}

.sosyalico a:hover i {
    color: #ec670d;
    font-size: 15px
}

.iconfax, .iconmail, .iconphone {
    border: 1px solid #1d4161d1;
    padding: 10px;
    border-radius: 100%;
    margin-left: 10px
}

.banneralan {
    height: 100%;
    margin: 0;
    padding: 0;
    background-color: #ccc
}

.sld-carousel {
    position: absolute;
    width: 23%;
    right: 1%;
    top: 1%;
    text-align: center;
    padding: 1%;
    color: #fff;
    background-color: #22356178
}

.aboutbg, .faaliyetalan, .productalan {
    padding: 3% 0;
    margin: 0;
    position: relative
}

.aboutbg, .faaliyetalan {
    background-color: #f7f7f7
}

.sld-carousel h5 {
    color: #ffa52f;
    font-size: 40px;
    font-weight: 700
}

.sld-carousel p {
    color: #fff;
    font-size: 20px;
    font-weight: 400
}

.aboutbg h3, .aboutbg h3 span {
    font-size: 36px;
    font-weight: 400
}

.aboutbg h3 {
    color: #393186
}

    .aboutbg h3 span {
        color: #ff9c1a
    }

.aboutbg .btn-detail {
    display: inline-block;
    padding: 10px 15px;
    border-radius: 10px;
    border: 1px solid #393186;
    text-align: center;
    transition: .5s
}

    .aboutbg .btn-detail:hover {
        background-color: #393186;
        transition: .5s
    }

    .aboutbg .btn-detail a, .urunicerik .uruntxt {
        color: #000;
        font-size: 16px
    }

    .aboutbg .btn-detail:hover a {
        color: #fff;
        transition: .5s
    }

    .aboutbg .btn-detail a i {
        transform: translate(0,0);
        transition: .5s;
        opacity: .7
    }

    .aboutbg .btn-detail:hover a i {
        transform: translate(5px,0);
        transition: .5s;
        opacity: 1;
        color: #fff
    }

.faaliyetalan h3 {
    font-size: 30px;
    font-weight: 400;
    color: #393186;
    text-align: start
}

.faaliyetalan .faaliyetbox {
    background-color: #fff;
    padding: 15px 0;
    position: relative;
    text-align: center;
    border: 1px solid #ededed
}

    .faaliyetalan .faaliyetbox img {
        width: 100%;
        max-width: 400px;
        margin-bottom: 15px
    }

    .faaliyetalan .faaliyetbox p {
        margin-bottom: 0;
        font-size: 24px;
        font-weight: 400
    }

        .faaliyetalan .faaliyetbox p i {
            color: silver;
            font-size: 20px;
            margin-top: 10px
        }

    .faaliyetalan .faaliyetbox span a {
        margin-bottom: 0;
        font-size: 17px;
        font-weight: 700;
        color: #000;
        text-decoration: none
    }

.productalan {
    width: 100%;
    height: auto
}

    .productalan h3 {
        font-size: 30px;
        font-weight: 500;
        color: #000;
        margin-bottom: 20px;
        text-align: center
    }

.urunsld, .urunsld .prdctpad {
    padding: 0 5%
}

    .urunsld .swiper {
        width: 100%;
        height: 100%;
        padding: 5% 2%
    }

    .urunsld .swiper-slide {
        text-align: justify;
        display: block;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center
    }

        .newsld .swiper-slide img, .srgsld .swiper-slide img, .urunsld .swiper-slide img, .urunslider .swiper-slide img {
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover
        }

    .urunsld .product-text {
        font-size: 24px;
        font-weight: 400;
        color: #000;
        margin-bottom: 20px
    }

    .urunsld .prdtxt {
        font-size: 16px;
        font-weight: 300;
        color: #000;
        margin-bottom: 25px
    }

    .urunsld .prodetailbtn {
        border-radius: 40px;
        text-align: center;
        background-color: #6861b8d6;
        color: #fff;
        padding: 10px 20px;
        display: inline-block;
        font-size: 15px
    }

        .newsld .newsbtn:hover, .srgsld .srgbtn:hover, .urunsld .prodetailbtn:hover {
            background-color: #393186d6
        }

.hbrsrg .tumhaberbtn::after, .hbrsrg .tumsergibtn::after {
    position: absolute;
    width: 100px;
    height: 3px;
    background-color: #393186
}

#timsan-company-tel a, .kate-background:hover, .navbar-light .navbar-nav .nav-link:focus, .navbar-light .navbar-nav .nav-link:hover, .newsld .newsbtn a, .srgsld .srgbtn a, .urun-title a, .urunsld .prodetailbtn a {
    color: #fff
}

.urunsld .swiper-button-next:after, .urunsld .swiper-button-prev:after {
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    text-transform: none;
    font-variant: initial;
    line-height: 1
}

.hbrsrg .tumhaberbtn::before, .hbrsrg .tumsergibtn::before {
    font-weight: 900;
    position: absolute
}

.urunsld .swiper-button-next:after, .urunsld .swiper-button-prev:after, .urunsld .swiper-rtl .swiper-button-next:after, .urunsld .swiper-rtl .swiper-button-prev:after {
    content: ''
}

.newsld .swiper-pagination-bullet, .srgsld .swiper-pagination-bullet, .urunsld .swiper-pagination-bullet {
    width: 12px;
    height: 8px;
    display: inline-block;
    border-radius: 35%;
    background: #ccc;
    opacity: 1
}

.urunsld .swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity,1);
    background: #000 !important
}

.hbrsrg {
    position: relative;
    padding: 0 5% 5%;
    margin: 0
}

    .hbrsrg .tumhaberbtn {
        font-size: 16px;
        font-weight: 300;
        color: #393186;
        margin-bottom: 10px;
        position: relative
    }

        .hbrsrg .tumhaberbtn::before {
            content: "\f111";
            left: -15px;
            font-size: 10px;
            top: 4px
        }

        .hbrsrg .tumhaberbtn::after {
            content: "";
            left: -13%;
            top: 10px
        }

    .hbrsrg .hbrtt {
        font-weight: 600;
        font-size: 22px;
        color: #393186;
        margin-bottom: 20px
    }

.newsld .swiper, .srgsld .swiper {
    width: 100%;
    height: 100%
}

.newsld .swiper-slide, .srgsld .swiper-slide {
    text-align: justify;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center
}

.newsld .swiper-button-prev:after, .newsld .swiper-rtl .swiper-button-next:after, .srgsld .swiper-button-prev:after, .srgsld .swiper-rtl .swiper-button-next:after {
    content: 'prev';
    color: #000;
    font-size: 30px
}

.newsld .swiper-button-next:after, .newsld .swiper-rtl .swiper-button-prev:after, .srgsld .swiper-button-next:after, .srgsld .swiper-rtl .swiper-button-prev:after {
    content: 'next';
    color: #000;
    font-size: 30px
}

.newsld .swiper-pagination-bullet-active, .srgsld .swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity,1);
    background: #393186 !important
}

.newsld .newsbtn, .srgsld .srgbtn {
    background-color: #6861b8d6;
    margin-top: 10px;
    border-radius: 0;
    display: inline-block;
    position: relative
}

.newsld .newpad {
    padding: 5%
}

.newsld .news-title, .srgsld .sergi-title {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    margin-bottom: 15px
}

.newsld .news-date, .srgsld .sergi-date {
    font-size: 17px;
    font-weight: 600;
    color: #393186;
    margin-bottom: 10px
}

.newsld .newsbtn {
    text-align: center;
    padding: 5px 15px;
    color: #fff;
    font-size: 15px;
    transition: .2s
}

.hbrsrg .tumsergibtn {
    font-size: 16px;
    font-weight: 300;
    color: #393186;
    margin-bottom: 10px;
    position: relative;
    text-align: end
}

    .hbrsrg .tumsergibtn::before {
        content: "\f111";
        right: -15px;
        font-size: 10px;
        top: 4px
    }

    .hbrsrg .tumsergibtn::after {
        content: "";
        right: -13%;
        top: 10px
    }

.hbrsrg .srgtt {
    font-weight: 600;
    font-size: 22px;
    color: #393186;
    margin-bottom: 20px;
    text-align: end
}

.srgsld .sergipad {
    padding: 5%;
    min-height: 305px
}

.srgsld .srgbtn {
    text-align: center;
    padding: 5px 15px;
    color: #fff;
    font-size: 15px
}

.cozumortak {
    position: relative;
    padding: 5% 0;
    margin: 0
}

    .cozumortak .cozumbslk {
        color: #393186;
        font-size: 35px;
        font-weight: 300;
        text-align: center
    }

        .cozumortak .cozumbslk span {
            color: #000;
            font-size: 30px;
            font-weight: 300;
            text-align: center
        }

    .cozumortak .cozumtxt {
        font-weight: 300;
        font-size: 16px;
        margin-top: 30px;
        text-align: center
    }

    .cozumortak .logos {
        background-color: #fff;
        border-radius: 45px
    }

.destekbox .destekbg .dskadress i, .destekbox::after, .destekbox::before, .footerbg, .sidebar header {
    background-color: #003562;
}

.footerbg {
    padding: 15px 0;
    position: relative;
    margin: 0
}

    .footerbg .btn-katalog {
        border: 1px solid #5d94c0;
        color: #fff;
        font-size: 16px;
        font-weight: 300;
        display: inline-block;
        padding: 7px 25px;
        border-radius: 0
    }

    .footerbg .footlogo {
        text-align: center;
        margin-bottom: 25px
    }

    .footerbg .footsosyal {
        color: #fff;
        font-size: 16px;
        margin: 15px 0;
        text-align: center
    }

        .footerbg .footsosyal i {
            color: #fff;
            font-size: 16px;
            margin: 0 7px
        }

    .footerbg .foot-tt {
        color: #fff;
        font-size: 20px;
        margin-bottom: 20px
    }

    .footerbg .footadres, .footerbg .footadres p {
        font-size: 15px;
        color: #fff
    }

        .footerbg .footadres p {
            margin-bottom: 5px
        }

            .footerbg .footadres p a {
                color: #fff;
                transition: .5s;
                margin-left: 0
            }

                .footerbg .footadres p a:hover {
                    color: #fff;
                    margin-left: 5px;
                    transition: .5s
                }

    .footerbg .foottxt {
        color: #fff;
        font-size: 13px
    }

.cont-ul, .form-title, .icmenu, .icmenu ul li, .icmenu ul ul li, .icsayfabanner, .iletisim-title, .iletisimbg, .imgboxs img, .sidebar, .slider-wrapper div, .urunicerik, .urunslider, a[data-toggle=collapse] {
    position: relative
}

.destekbox .destekbg .dstktt {
    font-size: 35px;
    font-weight: 700;
    margin-bottom: 10px;
    text-align: start;
    color: #393186
}

.destekbox .destekbg .dsktxt {
    font-size: 16px;
    color: #000;
    font-weight: 400;
    margin-bottom: 20px
}

.destekbox .destekbg .dskadress, .destekbox .destekbg .dskadress a {
    color: #393186;
    font-size: 15px;
    font-weight: 700
}

.breadcrumb-item + .breadcrumb-item::before, .navigasyonbar a {
    color: #fff !important
}

.icmenu, .icsayfabanner, .sidebar, .urunicerik, .urunslider {
    position: relative
}

.destekbox .destekbg .dskadress i {
    padding: 10px;
    border-radius: 50%;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    margin-right: 5px;
    margin-top: 10px
}

.icsayfabanner {
    width: 100%;
    height: 239px;
    background-color: #ccc
}

.katalogbg, button.mt-2.kariyer:hover {
    background: #fff
}

.navigasyonbar {
    background-color: #003562;
    padding: 2px 0;
    position: absolute;
    top: 334px;
    right: 0
}

    .navigasyonbar a {
        font-size: 11px
    }

.icsayfa .urun-title {
    font-weight: 400;
    color: #393186;
    margin-bottom: 20px;
    text-align: center
}

.urunicerik .urunbaslik, .urunicerik .uruntxt {
    font-weight: 500;
    margin-bottom: 15px;
    text-align: center
}

.icsayfa .urun-title h1 {
    font-size: 24px;
    color: #fff
}

.urunslider {
    padding: 0;
    margin: 0;
    width: 100%
}

    .urunslider .swiper {
        width: 100%;
        height: 100%;
        margin-left: auto;
        margin-right: auto
    }

    .urunslider .swiper-slide {
        font-size: 18px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center
    }

.urunicerik {
    text-align: center;
    margin: 50px auto 0;
    max-width: 800px;
    width: 100%
}

    .urunicerik .urunbaslik {
        color: #393186;
        font-size: 20px
    }

.katalogbg {
    background: linear-gradient(0deg,#fff 0,#f5f4f4 15%,#ccc 100%);
    margin: -20px 15px 0;
    padding: 15px 0 0;
    text-align: center
}

    .katalogbg .katalogtxt {
        background-color: #fff;
        color: #393186;
        padding: 10px 30px;
        position: relative;
        font-weight: 700;
        text-align: left
    }

#sidebar ul li a, .boxpro p, .pro-img, .title, label #btn, label #cancel {
    text-align: center
}

.sidebar {
    padding: 0px;
    background-color: #f7f7f7;
    width: 100%;
    height: 100%;
    transition: .5s;
}

@media(max-width :860px) {
    .sidebar {
        height: auto;
        left: 0;
    }
}

.sidebar header {
    font-size: 22px;
    font-weight: 700;
    color: #fff;
    padding: 10px 15px
}

#caption, .icmenu a, .mydp li a {
    padding: 10px 0
}

.boxpro p, .form-control, .icmenu a, .menubar .nav-link, button#sidebarCollapse .fa {
    font-size: 20px
}

.sidebar a {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border-left: 5px solid transparent;
    transition: .5s;
    font-size: 17px;
}

}

#check, .active-pro:after, .kategs, .yesimg {
    display: none
}

label #btn, label #cancel {
    position: absolute;
    left: 5px;
    cursor: pointer;
    color: #393186;
    border-radius: 5px;
    margin: 15px 30px;
    font-size: 29px;
    height: 45px;
    width: 45px;
    text-shadow: 2px 2px 3px rgba(255,255,255,.5);
    line-height: 45px;
    transition: .5s
}

#check:checked ~ .sidebar {
    left: -35px
}

#check:checked ~ label #btn {
    margin-left: 345px
}

#check:checked ~ label #cancel {
    margin-left: 345px;
    opacity: 1;
    visibility: visible
}

@media(max-width :860px) {
    .sidebar {
        height: auto;
        left: 0;
        margin: 30px 0
    }

    #btn, #cancel, header {
        display: none
    }

    span {
        position: absolute;
        margin-left: 23px;
        opacity: 0;
        visibility: hidden
    }

    .sidebar a {
        height: 60px
    }

        .sidebar a i {
            margin-left: -10px
        }

    a:hover {
        width: 100%;
    }

    .sidebar a:hover span {
        opacity: 1;
        visibility: visible;
    }
}

.sidebar a.active, .sidebar > a.active, .sidebar > a:hover:nth-child(2n), .sidebar > a:hover:nth-child(odd) {
    border-bottom: 1px solid #ccc;
    font-weight: 700
}

.icmenu {
    padding: 0 2%;
    margin: 0;
    list-style: none;
    background-color: #fff;
    width: 100%;
    height: 300px
}

    .icmenu li {
        display: block
    }

    .icmenu a {
        display: inline-block;
        color: #000;
        width: auto
    }

    .icmenu ul, .icmenu ul ul {
        display: none;
        position: absolute
    }

    .icmenu ul {
        top: 0;
        left: 23%
    }

        .icmenu ul ul {
            top: 18px;
            left: 50%;
            width: 100%
        }

    .icmenu li:hover > ul {
        display: inherit
    }

    .icmenu ul li {
        width: 100%;
        float: none;
        display: list-item
    }

    .icmenu ul ul li {
        top: -120px;
        left: 170px
    }

.menubar .nav-link {
    display: block;
    padding: 5px 40px !important;
    color: #fff !important;
    transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out
}

.iletisimbg {
    padding: 50px 0 100px
}

    .iletisimbg strong {
        color: #ec670d;
        font-size: 19px
    }

.iletisim-title {
    font-size: 24px;
    font-weight: 600;
    color: #393186;
    margin-top: 12px
}

.cont-ul {
    margin: 0;
    padding: 0
}

    .cont-ul .cont-li {
        padding: 7px 0;
        font-size: 18px;
        color: #7c7979;
        border-bottom: 1px solid #f7f7f7
    }

        .cont-ul .cont-li strong {
            padding: 10px 0;
            font-size: 20px;
            color: #960808;
            font-weight: 700
        }

        .cont-ul .cont-li i {
            font-size: 18px;
            color: #ec670d;
            margin-right: 15px
        }

        .cont-ul .cont-li a {
            font-size: 18px;
            color: #7c7979
        }

            .cont-ul .cont-li a:hover {
                font-size: 18px;
                color: #46697d
            }

.form-title {
    font-size: 25px;
    font-weight: 300;
    color: #393186;
    padding-bottom: 15px;
    border-bottom: 2px solid #ec670d;
    width: fit-content
}

.about .heading h2 span, .send-btn {
    color: #ec670d
}

    .send-btn, .send-btn:hover {
        border: 1px solid #ec670d;
        font-size: 18px;
        font-weight: 400;
        padding: 10px 25px;
        margin-top: 20px;
        text-align: center;
        transition: .5s
    }

        .send-btn:hover {
            color: #fff;
            background-color: #ec670d
        }

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active {
    color: #495057;
    background-color: #fff;
    border-color: #393186 #393186 #fff
}

.nav-tabs {
    border-bottom: 1px solid #39318645
}

.wrapper {
    display: flex;
    width: 100%;
    align-items: stretch
}

#sidebar {
    min-width: 100%;
    max-width: 100%;
    background: #f7f7f7;
    color: #6b6b6b;
    transition: .3s
}

    #sidebar.active {
        margin-left: -285px
    }

    #sidebar ul.components {
        padding: 20px 0
    }

    #sidebar ul p {
        color: #6b6b6b;
        padding: 10px
    }

    #sidebar ul li a {
        padding: 15px;
        display: block;
        border-bottom: 1px solid rgba(128,128,128,.1)
    }

        #nav_accordion > li > ul > li > a:hover, #sidebar ul li a:hover, #sidebar ul li.active {
            background: #cbcbcb42;
            color: #000
        }

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 5px;
    transform: translateY(-50%)
}

#sidebar ul ul a {
    font-size: .9em !important
}

#content {
    width: 100%;
    min-height: 100vh;
    transition: .3s
}

@media (max-width:768px) {
    #sidebar {
        margin-left: 0px;
        position: relative;
        width: 100%;
    }

        #sidebar.active {
            margin-left: 0
        }

    #sidebarCollapse span {
        display: none
    }
}

.details a, .icerik P, .sub-kat, ul#sidebarmenu a {
    color: #000
}

.title {
    font-weight: 600;
    color: #393186;
    font-size: 30px;
    margin-bottom: 3%
}

li.kariyer.nav-item {
    margin-left: 6%
}

.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #393186
}

.cards:hover .info, .cards:hover .info p {
    color: #fff !important
}

.nav-pills .nav-link {
    background: 0 0;
    border: 0;
    border-radius: .25rem;
    min-width: 330px;
    max-width: 330px
}

button.mt-2.kariyer {
    padding: 13px;
    border-radius: 27px;
    background: 0 0;
    border: 2px solid #ef8136;
    color: #393186
}

.kariyer.container {
    padding: 4%;
    border: 1px solid #959393;
    margin: 4% 6%
}

.kariyer-baslik {
    font-weight: initial;
    color: #ef8136;
    font-size: 26px;
    margin-bottom: 4%
}

header.sol-menu {
    background: #003562;
    color: #fff;
    padding: 4%
}

button#sidebarCollapse {
    background: #fff;
    border: 1px solid #9faebd
}

@media (max-width:1300px) {
    .sld-carousel {
        position: absolute;
        width: 40%;
        right: 15%;
        top: 25%;
        left: 10%;
        padding: 4%;
        color: #fff;
        background-color: #393186a8
    }
}

.imgboxs img:hover {
    top: -20px;
    transition: .2s
}

.boxpro p {
    color: #000
}

boxpro p:hover {
    color: #55504f
}

.about {
    padding: 130px 0
}

    .about .heading h2 {
        font-size: 30px;
        font-weight: 700;
        margin: 0;
        padding: 0;
        color: #383085
    }

    .about .heading p {
        font-size: 15px;
        font-weight: 400;
        line-height: 1.7;
        color: #383085;
        margin: 20px 0 60px;
        padding: 0
    }

    .about h3 {
        font-size: 25px;
        font-weight: 700;
        margin: 0;
        padding: 0
    }

    .about p, .slide-date, .slide-more, .slide-title {
        font-weight: 400
    }

    .about p {
        font-size: 15px;
        line-height: 1.7;
        color: #292828;
        margin: 20px 0 15px;
        padding: 0
    }

    .about h4 {
        font-size: 15px;
        font-weight: 500;
        margin: 8px 0
    }

        .about h4 i {
            color: #f24259;
            margin-right: 10px
        }

.urun-title {
    background-color: #003562;
    padding-top: 2px;
    width: 80%;
    margin: 0 auto;
    padding-bottom: 2px
}

.pro-img {
    max-width: 800px;
    margin-top: 50px
}

.shared-img {
    max-width: 500px;
    max-height: 500px
}

.flexs {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    flex-direction: row;
    -webkit-justify-content: flex-start;
    justify-content: flex-start
}

.slider-wrapper {
    padding: 5% 0
}

.slide-image {
    height: 24vw
}

    .slide-image img {
        width: 24vw;
        cursor: pointer
    }

.slide-content {
    width: 25vw;
    color: #fff;
    padding: 0 30px
}

.slide-date {
    font-size: 18px;
    color: #393186;
    letter-spacing: .1vw;
    padding-bottom: 1.4vw
}

.slide-title {
    font-size: 30px;
    padding-bottom: 15px;
    color: #383085
}

.slide-text {
    font-size: 20px;
    opacity: .8;
    color: #000
}

.slide-bullet {
    width: .5vw;
    height: .5vw;
    background-color: #0b8bcc;
    border-radius: 200%;
    position: relative;
    margin-left: 1.2vw
}

.arrow, .arrows, div.overlay-blue {
    position: absolute
}

.slide-nav {
    margin-left: 64vw;
    margin-top: -5.5vw
}

div.overlay-blue {
    width: 100%;
    height: 100%;
    top: 0;
    transition: .5s
}

.arrows {
    width: 9%;
    top: 1%;
    z-index: 9999;
    right: 20px
}

.arrow {
    display: inline-block;
    width: 30px;
    height: 30px;
    background: 0 0;
    text-indent: -9999px;
    border-top: 3px solid #ec670d;
    border-left: 3px solid #ec670d;
    transition: .1s ease-in-out;
    color: #000
}

    .arrow:hover {
        border-color: #383085
    }

    .arrow:before {
        display: block;
        height: 200%;
        width: 200%;
        margin-left: -50%;
        margin-top: -50%;
        content: "";
        transform: rotate(45deg)
    }

.cards, .preloader .preloader-img {
    display: inline-block;
    text-align: center
}

.arrow.prev {
    transform: rotate(-45deg);
    left: 0
}

.arrow.next {
    transform: rotate(135deg);
    right: 0
}

.slide-more {
    letter-spacing: .1vw;
    font-size: .9vw;
    float: right;
    visibility: inherit;
    transform: matrix(1,0,0,1,0,0);
    color: #383085;
    margin: 10px 0;
    border: 1px solid #383085;
    padding: 10px;
    text-align: center;
    transition: .2s
}

.kateg-baslik p, .kategs {
    border-top: 2px solid #1492d1
}

.slide-more:hover {
    color: #fff;
    background-color: #383085
}

.support-bg {
    background-color: #f0f8ff;
    padding: 25px
}

@media(max-width:991px) {
    .navbar.fixed-top .navbar-collapse, .navbar.sticky-top .navbar-collapse {
        overflow-y: auto;
        max-height: 90vh;
        margin-top: 10px
    }
}

.kategs {
    background-color: #002e54;
    box-shadow: #fff 0 5px -25px
}

#main_nav > ul > li.nav-item.dropdown.has-megamenu > div {
    padding: 15px 339px
}

.kateg-img {
    position: relative;
    overflow: hidden
}

    .kateg-img img {
        transform: scale(1);
        transition: .5s
    }

.zooms:hover .kateg-img img {
    transition: .5s;
    transform: scale(1.2)
}

.zooms:hover .kateg-baslik p {
    background-color: #0c518db3;
    transition: .5s
}

.kateg-baslik p {
    padding: 10px;
    color: #fff;
    font-size: 26px;
    background-color: #003562b3;
    height: 100px
}

.sidebar li .submenu {
    list-style: none;
    margin: 0;
    padding: 0 1rem
}

.proc {
    background: #fff;
    margin-top: 50px
}

.proc-name {
    color: #000;
    text-align: center;
    padding: 5px;
    font-size: 20px
}

.has-submenu a {
    text-align: center;
    border-bottom: 1px solid #fff
}

nav-link sub-kat:hover {
    background-color: #003562b3;
    color: #fff
}

.has-submenu a:hover {
    transition: .5s
}

.kate-background {
    color: #fff;
    background-color: #003562
}

sub-kat:hover {
    background-color: #0c518db3
}

.kateg {
    width: 67%;
    text-align: center
}

.gse {
    padding-left: 50px
}

.details {
    margin: 20px 0 100px;
    padding: 5px;
    font-size: 18px;
    border: 1px solid #ddd
}

body > div.container-fluid.icsayfa > div > div > nav {
    border: 0;
    background: #fff
}

.sup {
    background: #003562;
    background: radial-gradient(circle,#003562 0,rgba(0,53,98,.6783088235294117) 100%);
    padding: 20px 0 0;
    color: #fff
}

    .sup p {
        font-size: 21px
    }

.sup-information {
    padding: 10px
}

    .sup-information p i {
        font-size: 17px;
        margin-right: 5px
    }

.sup-title {
    font-size: 28px;
    font-weight: 700
}

.catalog-btn p {
    color: #fff;
    padding: 15px;
    font-size: 19px;
    font-weight: 700;
    background-color: #003562;
    text-decoration: none;
    z-index: -1;
    margin-top: 20px
}

.cat-img {
    transition: transform .5s;
    transform: scale(1.1);
    margin-top: 30px
}

.catalog-btn:hover .cat-img, .categorie-hover:hover .categorie-image img {
    transform: scale(1.2)
}

.catalog-btn p:hover .catalog-btn p {
    color: #003562;
    background-color: #fff;
    transition: .5s
}

.preloader, .preloader .preloader-circle {
    -webkit-transition: .6s;
    -o-transition: .6s
}

.preloader {
    background-color: #f7f7f7;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 999999;
    transition: .6s;
    margin: 0 auto
}

    .preloader .preloader-circle {
        width: 100px;
        height: 100px;
        position: relative;
        border-style: solid;
        border-width: 1px;
        border-color: #0026ff transparent transparent;
        z-index: 10;
        border-radius: 50%;
        -webkit-box-shadow: 0 1px 5px 0 rgba(30,218,224,.15);
        box-shadow: 0 1px 5px 0 rgba(3,247,255,.15);
        background-color: #fff;
        -webkit-animation: 2s infinite zoom;
        animation: 2s infinite zoom;
        transition: .6s
    }

.cards .side, .cards:after {
    width: 100%;
    border-radius: 5px
}

.preloader .preloader-img {
    position: absolute;
    top: 50%;
    z-index: 200;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    padding-top: 6px;
    -webkit-transition: .6s;
    -o-transition: .6s;
    transition: .6s
}

.cardContainer, .cards, .cards:after, .categorie-image, .kurumsalbanner, .post-slide .post-img {
    position: relative
}

.preloader .preloader-img img {
    max-width: 55px
}

.preloader .pere-text strong {
    font-weight: 800;
    color: #dca73a;
    text-transform: uppercase
}

@keyframes zoom {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
        -webkit-transition: .1s ease-out;
        -moz-transition: .1s ease-out;
        -ms-transition: .1s ease-out;
        -o-transition: .1s ease-out;
        transition: .1s ease-out
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        -webkit-transition: .1s ease-out;
        -moz-transition: .1s ease-out;
        -ms-transition: .1s ease-out;
        -o-transition: .1s ease-out;
        transition: .1s ease-out
    }
}

@-webkit-keyframes heartbeat {
    to {
        -webkit-transform: scale(1.03);
        transform: scale(1.03)
    }
}

@keyframes rotateme {
    from {
        -webkit-transform: rotate(0);
        transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg)
    }
}

@-webkit-keyframes rotateme {
    from {
        -webkit-transform: rotate(0)
    }

    to {
        -webkit-transform: rotate(360deg)
    }
}

.back .btn:hover h4, .back .btn:hover svg {
    transform: translateX(0)
}

.slick-initialized .slick-slide {
    outline: 0
}

.running {
    animation: 10s linear infinite alternate nudge
}

@keyframes nudge {
    0%,100% {
        transform: translate(0,0)
    }

    50% {
        transform: translate(-100px,0)
    }
}

80% {
    transform: translate(100px,0)
}

svg {
    margin: 0;
    min-width: 24px;
    min-height: 24px;
    color: rgba(255,8,0,.815) !important;
    font-weight: 700
}

.cardContainer {
    width: 100%;
    height: auto;
    perspective: 1000px
}

.active-pro {
    transform: translateZ(0) rotateY(180deg) !important
}

.cards {
    width: 100%;
    cursor: pointer;
    -moz-backface-visibility: hidden;
    transform-style: preserve-3d;
    transform: translateZ(-100px);
    transition: .4s cubic-bezier(.165, .84, .44, 1)
}

    .cards:hover .info, .cards:hover .info p, .img img, .info {
        transition: .2s ease-in-out
    }

    .cards:after {
        content: "";
        z-index: -1;
        height: 100%;
        box-shadow: 0 14px 50px -4px rgba(0,0,0,.15);
        opacity: 0;
        transition: .6s cubic-bezier(.165, .84, .44, 1.4)
    }

.img img {
    transform: scale(1)
}

.front .img {
    background-color: #dadce2;
    background-position: center;
    background-size: cover;
    width: 100%;
    overflow: hidden;
}

.cards .side, .info {
    background-color: #fff
}

.info {
    border-top: 4px solid #1492d1;
    font-weight: 700
}

.cards:hover img {
    transform: scale(1.1);
    transform-origin: center
}

.cards:hover .info {
    background-color: #1492d1
}

.cards .side {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    height: 100%
}

.cards .front {
    z-index: 2
}

.cards .info {
    padding: 16px
}

.back h2 {
    margin-top: 6px;
    margin-bottom: 18px
}

.back .btn:hover svg {
    opacity: 1
}

.back .btn h4 {
    transform: translateX(12px);
    transition: transform .3s ease-out
}

.back .btn svg {
    margin: 1px 0 0 4px;
    transform: translateX(-8px);
    opacity: 0;
    transition: .3s ease-out
}

.h2s {
    font-size: 24px;
    font-weight: 500;
    color: #2c2b2b;
    letter-spacing: -.2px;
    margin-bottom: 10px
}

.carousel-control-prev-icon {
    background-image: url('https://cdn.onlinewebfonts.com/svg/download_546888.png') !important;
    width: 50px !important;
    height: 50px !important
}

.carousel-control-next-icon {
    background-image: url('https://cdn.onlinewebfonts.com/svg/img_546889.png') !important;
    width: 50px !important;
    height: 50px !important;
    color: #000
}

#carouselExampleDark > button.carousel-control-next > span.carousel-control-next-icon, #carouselExampleDark > button.carousel-control-prev > span.carousel-control-prev-icon {
    filter: brightness(0) saturate(0%) invert(100%) !important
}

#news-slider {
    margin-top: 80px
}

.post-slide {
    background: #fff;
    margin: 20px 15px;
    border-radius: 15px;
    padding-top: 1px;
    box-shadow: 0 14px 22px -9px #bbcbd8
}

.categorie-image, .categorie-title {
    overflow: hidden;
    margin: 0 auto;
    width: 100%
}

.post-slide .post-img {
    overflow: hidden;
    border-radius: 10px;
    margin: -12px 15px 8px -10px
}

    .post-slide .post-img img {
        width: 100%;
        height: 290px;
        transform: scale(1,1);
        transition: transform .2s linear
    }

.post-slide:hover .post-img img {
    transform: scale(1.1,1.1)
}

.post-slide .over-layer {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    background: linear-gradient(-45deg,rgba(6,190,244,.75) 0,rgba(45,112,253,.6) 100%);
    transition: .5s linear
}

.post-slide:hover .over-layer {
    opacity: 1;
    text-decoration: none
}

.post-slide .over-layer i {
    position: relative;
    top: 45%;
    text-align: center;
    display: block;
    color: #fff;
    font-size: 25px
}

.post-slide .post-content {
    background: #fff;
    padding: 2px 20px 40px;
    border-radius: 15px;
    height: 272px
}

.post-slide .post-title a {
    font-size: 15px;
    font-weight: 700;
    color: #333;
    display: inline-block;
    text-transform: uppercase;
    transition: .3s
}

    .post-slide .post-title a:hover {
        text-decoration: none;
        color: #3498db
    }

.post-slide .post-description {
    line-height: 24px;
    color: grey;
    margin-bottom: 25px
}

.post-slide .post-date {
    color: #a9a9a9;
    font-size: 14px
}

    .post-slide .post-date i {
        font-size: 20px;
        margin-right: 8px;
        color: #cfdace
    }

.post-slide .read-more {
    padding: 7px 20px;
    float: right;
    font-size: 12px;
    background: #2196f3;
    color: #fff;
    box-shadow: 0 10px 20px -10px #1376c5;
    border-radius: 25px;
    text-transform: uppercase
}

    .post-slide .read-more:hover {
        background: #3498db;
        text-decoration: none;
        color: #fff
    }

.owl-controls .owl-buttons .owl-next, .owl-controls .owl-buttons .owl-prev {
    background: #fff;
    position: absolute;
    top: -13%;
    border-radius: 50px;
    transition: background .5s
}

.owl-controls .owl-buttons {
    text-align: center;
    margin-top: 20px
}

    .owl-controls .owl-buttons .owl-prev {
        left: 15px;
        padding: 0 18px 0 15px;
        box-shadow: 3px 14px 25px -10px #92b4d0
    }

    .owl-controls .owl-buttons .owl-next {
        right: 15px;
        padding: 0 15px 0 18px;
        box-shadow: -3px 14px 25px -10px #92b4d0
    }

        .owl-controls .owl-buttons .owl-next:after, .owl-controls .owl-buttons .owl-prev:after {
            content: "\f104";
            font-family: "Font Awesome 6 Free";
            font-weight: 900;
            color: #333;
            font-size: 30px
        }

        .owl-controls .owl-buttons .owl-next:after {
            content: "\f105"
        }

@media only screen and (max-width:1280px) {
    .post-slide .post-content {
        padding: 0 15px 25px
    }
}

.owl-carousel {
    display: block !important
}

.categorie-image img {
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: .2s
}

.categorie-title p {
    padding: 10px;
    border-top: 2px solid #1492d1;
    color: #fff;
    transition: .2s;
    font-size: 26px;
    background-color: #003562b3
}

.categorie-hover:hover .categorie-title p {
    background-color: #0c518db3;
    transition: .2s
}

.xz {
    transition: .2s
}

    .xz:hover {
        background-color: #1492d1;
        transition: .2s
    }

#nav_accordion > li > ul > li > a {
    padding: 15px;
    font-size: 18px
}

.kurumsalbanner {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    width: 100%;
    height: 420px;
    margin-bottom: 30px
}

    .kurumsalbanner::before {
        content: "";
        position: absolute;
        background-color: #00000052;
        width: 100%;
        height: 420px
    }

.page-banner-txt {
    position: absolute;
    width: 100%;
    bottom: 32%;
    text-align: center
}

    .page-banner-txt .txt {
        font-size: 40px;
        color: #fff;
        font-weight: 600
    }

#banner > div > div.bread.d-flex.justify-content-center > nav > ol > li.breadcrumb-item.active, .breadcrumb-item a {
    color: #f7f7f7;
    font-size: 20px;
    font-weight: 700
}

#brforimg {
    border-radius: 2%
}

@media all and (min-width:992px) {
    .navbar .has-megamenu {
        position: static !important
    }

    .navbar .megamenu {
        left: 0;
        right: 0;
        width: 100%;
        margin-top: 0
    }

    #main_nav > ul > li:nth-child(2) > ul {
        display: none
    }

    #main_nav > ul > li:nth-child(2):hover > ul {
        display: block
    }

    .navbar .nav-item .dropdown-menu {
        margin-top: 0
    }
}

.mydp {
    width: 100%;
    background-color: #003562
}

    .mydp li {
        padding: 10px 3px
    }

        .mydp li a {
            width: 100%;
            text-align: center;
            font-size: 19px;
            color: #fff;
            border-radius: 3px;
            border-bottom: 3px solid #003562;
            white-space: normal
        }

            .mydp li a:hover {
                background-color: #1492d1;
                color: #fff;
                border-bottom: 3px solid #1492d1
            }

.hakkimizda-kirmizi {
    margin-top: 50px;
    background: #fbf3ee;
    padding: 30px 60px;
    color: #464646;
    font-size: 18px;
    font-weight: 500
}

.close, .h, .pdf-icon:after, .x0348d, .x3dl4 i, .xcx {
    font-weight: 700
}

.new-link {
    color: #3e3837 !important;
    font-size: 20px !important
}

.mail-name, .xcx {
    color: orange
}

.new-link:hover {
    color: #22201f !important;
    text-decoration: underline
}

.box-1, .box-2, .box-3 {
    margin: 10px;
    padding: 20px;
    cursor: pointer;
    background-color: #f2f1f159;
    box-shadow: rgba(100,100,111,.2) 0 7px 29px 0;
    transition: 120ms
}

#myImg, .close {
    transition: .3s
}

.lk .box {
    border: 1px solid #82acfa;
    width: 100%;
    padding: 10px;
    margin-top: 100px
}

.sertifika {
    padding: 2px 0 14px 10px;
    text-decoration: none
}

    .sertifika i {
        text-align: center;
        margin-top: 3px;
        font-size: 25px;
        margin-right: 10px;
        color: #82acfa
    }

    .sertifika h2 {
        font-size: 22px;
        text-align: center
    }

.xcx {
    font-size: 21px
}

.x0348z {
    font-size: 19px
}

.pdf-icon {
    font-size: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    position: relative;
    width: 6em;
    height: 8.5em;
    background-color: #eee;
    background-image: url('../images/img/lZ5SgDE.png');
    background-repeat: no-repeat;
    -webkit-background-size: 85% auto;
    -moz-background-size: 85% auto;
    background-size: 85% auto;
    background-position: center 2em;
    border-radius: 1px 2em 1px 1px;
    border: 1px solid #ddd
}

    .pdf-icon:after {
        content: 'PDF';
        font-family: Arial;
        font-size: 1.2em;
        text-align: center;
        padding: .2em 0 .1em;
        color: #fff;
        display: block;
        position: absolute;
        top: .7em;
        left: -1.5em;
        width: 3.4em;
        height: auto;
        background: #da2525;
        border-radius: 2px
    }

#myImg {
    border-radius: 5px;
    cursor: pointer
}

    #myImg:hover {
        opacity: .7
    }

.modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 100px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,.9)
}

#caption, .modal-content {
    margin: auto;
    width: 80%;
    max-width: 700px;
    display: block
}

#caption {
    text-align: center;
    color: #ccc;
    height: 150px
}

#caption, .modal-content {
    animation-name: zoom;
    animation-duration: .6s
}

@keyframes zoom {
    from {
        transform: scale(0)
    }

    to {
        transform: scale(1)
    }
}

.close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px
}

.x3dl4, .x3dl4 i {
    color: gray
}

.y, .y:hover {
    transition: .2s
}

.close:focus, .close:hover {
    color: #bbb;
    text-decoration: none;
    cursor: pointer
}

@media only screen and (max-width:700px) {
    .modal-content {
        width: 100%
    }
}

#rot {
    -moz-transform: skew(32deg,-3deg);
    -webkit-transform: skew(32deg,-3deg);
    -o-transform: skew(32deg,-3deg);
    -ms-transform: skew(32deg,-3deg);
    transform: skew(32deg,-3deg)
}

.img-div, .pdf-div {
    background-color: #f2f2f2;
    padding: 20px;
    border: 1px solid #ccc;
    border-radius: 5px;
    display: inline-block
}

.img-link, .pdf-link {
    text-decoration: none;
    color: #333;
    font-weight: 700
}

    .pdf-link:hover {
        color: red
    }

    .img-link:hover {
        color: #14b9ff
    }

.h {
    font-size: 21px;
    color: #393186
}

.bss {
    background-color: #fff
}

.rl {
    margin-top: 100px !important;
    border: none
}

.icon-div {
    margin: 0 auto
}

.y {
    background-color: hwb(0 79% 21% / .644);
    border-radius: 5%
}

    .y:hover {
        background-color: rgba(124,124,124,.308)
    }

.brdr {
    margin-top: 25px;
    border: 1px solid #000;
    overflow: hidden;
    padding-bottom: 40px
}

.cerez {
    position: absolute !important;
    bottom: 50px;
    right: 30px;
    z-index: 999;
    width: 40%
}

    .cerez p {
        font-size: 15px
    }

        .cerez p a {
            color: #fff;
            text-decoration: underline
        }

.bg-custom {
    background-color: #130f40
}

.pdf-name {
    margin-top: 20px
}

.navbar {
    background: #003562;
    padding-top: 0;
    padding-bottom: 0;
    box-shadow: 1px 3px 4px 0 #adadad33
}

.navbar-light .navbar-brand {
    color: #2196f3
}

.navbar-light .navbar-nav .nav-link {
    color: #fff;
    transition: .3s;
    padding: 22px 24px;
    font-size: 19px;
    position: relative
}

.navbar-light .navbar-brand:focus, .navbar-light .navbar-brand:hover, .navbar-tog {
    color: #1ebdc2
}

.navbar-light .navbar-nav .nav-link:hover {
    background: #1ebdc2;
    transition: .3s
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #fff;
    text-decoration: none;
    background-color: #1ebdc2 !important
}

.sm-menu {
    border-radius: 0;
    border: 0;
    top: 97%;
    box-shadow: rgba(173,173,173,.2) 1px 3px 4px 0
}

.dropdown-item {
    color: #FFFFFF;
    font-size: 16px
}

    .dropdown-item.active, .dropdown-item:active {
        color: #003562;
        text-decoration: none;
        background-color: #2196f3
    }

.navbar-toggler {
    outline: 0 !important
}

.megamenu-li {
    position: static
}

.megamenu {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    padding: 15px
}

    .megamenu h6 {
        margin-left: 21px
    }

    .megamenu i {
        width: 20px
    }

.tvt:hover {
    background-color: #1492d1;
    transition: .3s;
    color: #fff
}

.xvx:hover {
    background-color: #1492d1 !important;
    transition: .3s;
    color: #fff
}

@media only screen and (max-width:767px) {
    .fordesk, .noimg, .nomobile {
        display: none
    }

    .respofooter {
        justify-content: center;
        align-items: center;
        text-align: center
    }

    .yesimg {
        display: block;
        text-align: center;
        margin: 0 auto;
        justify-content: center
    }

    .productformobile {
        display: block !important;
        background-color: none !important
    }

    .list-group-item-text-name {
        text-decoration: none;
        color: #00008b
    }
}







/*menu css*/

.menubg {
    position: relative;
    margin: 0px;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 69px;
    z-index: 999;
    font-weight: 400;
    background-color: #003562;
}





.nasx {
    background-color: #003562;
}

.form-search {
    position: relative;
    width: 100%;
}

@media (min-width: 768px) {
    .form-search {
        max-width: 720px;
    }
}

.input-search {
    padding: 26px 16px 25px;
    width: 100%;
    font-size: 18px;
    font-weight: 600;
    color: #4c4c4c;
    background-color: #fff;
    box-shadow: 0 0px 0px rgba(160, 160, 160, 0.6), 0 3px 3px rgba(125, 125, 125, 0.4), 0 4px 9px rgba(142, 142, 142, 0.3);
}

@media (min-width: 768px) {
    .input-search {
        padding: 29px 80px 29px 48px;
        font-size: 32px;
    }
}

.input-search::placeholder {
    color: #BFBFBF;
}

.overlay {
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: flex-end;
    align-content: flex-end;
    position: fixed;
    z-index: 3;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgb(255,255,255);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(242,242,242,0.8155637254901961) 100%);
    z-index: 99;
}

.overlay {
    align-items: center;
    align-content: center;
}

    .overlay button:focus {
        outline: 0px dotted;
        outline: 0px auto -webkit-focus-ring-color;
    }

.hiding {
    max-height: 0;
    opacity: 0;
    bottom: 0;
    transition: max-height 0.3s 0.2s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.6s ease-out;
}

input[type="search"]::-webkit-search-cancel-button {
    display: none;
}

.hiding .buttonn-search,
.hiding .input-search {
    opacity: 0;
}

.hiding .button-search {
    transform: translate3d(0, 33%, 0);
}

.hiding .input-search {
    transform: translate3d(0, 50%, 0);
}

.showing {
    max-height: 100vh;
    top: 0;
    transition: max-height 0.4s 0.2s cubic-bezier(0.215, 0.61, 0.355, 1), opacity 0.8s ease-out;
}

.buttonn-search {
    transition: .4s .6s ease-out;
}

.input-search {
    transition: .8s .3s ease-out;
}

.perde {
    background: transparent;
    width: 100%;
    height: 100%;
    position: fixed;
    display: none;
}

/*arama btn*/

/*/-/-/-/-/-//Mobil-Menu/-/-/-/-/-//*/

.sidenav {
    height: 100%;
    width: 0;
    position: fixed;
    z-index: 999;
    top: 0;
    left: 0;
    background-color: #003562;
    overflow-x: hidden;
    transition: 0.5s;
    padding-top: 30px;
}

.sidebar_active {
    width: 450px;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(1) {
    animation-delay: .5s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(2) {
    animation-delay: .7s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(3) {
    animation-delay: .9s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(4) {
    animation-delay: 1.1s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(5) {
    animation-delay: 1.2s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(6) {
    animation-delay: 1.3s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(7) {
    animation-delay: 1.4s;
}

.mobil_dropdown_content .accordion-menu .nav_mobil:nth-child(8) {
    animation-delay: 1.5s;
}

#dismiss_mobil {
    position: absolute;
    top: 20px;
    right: 5%;
    font-size: 25px;
    color: #ffffff;
    cursor: pointer;
}

.accordion-menu {
    width: 100%;
    border-radius: 4px;
}

.mobil_dropdown_content .dropdown-item:focus, .dropdown-item:hover {
    color: #16181b;
    text-decoration: none;
    background-color: transparent;
}

.dropdownlink {
    cursor: pointer;
    display: block;
    font-size: 18px;
    color: #ffffff;
    font-weight: 700;
    position: relative;
    -webkit-transition: all 0.4s ease-out;
    transition: all 0.4s ease-out;
    padding: 5px;
}

    .dropdownlink i {
        position: absolute;
        top: 6px;
        left: 16px;
    }

    .dropdownlink .fa-chevron-down {
        right: 10px;
        left: auto;
    }

.submenuItems {
    display: none;
}

    .submenuItems a {
        display: block;
        color: #727272;
        padding: 12px 12px 12px 45px;
        -webkit-transition: all 0.4s ease-out;
        transition: all 0.4s ease-out;
    }

.mobil_dropdown_content {
    padding-top: 20px;
}

.submenuItems a:hover {
    color: black;
}

.sidenav_ul ul {
    margin-bottom: 0px;
}

    .sidenav_ul ul li {
        padding: 5px 5px;
    }

        .sidenav_ul ul li a {
            font-size: 18px;
            font-weight: 700;
            color: #ffff;
            padding: 5px;
            white-space: nowrap
        }

#nav_mobil_ul > ul > li > ul {
    position: absolute;
    inset: 6px auto auto 0px;
    margin: 0px;
    background-color: #052b4b;
    transform: translate3d(0px, 109px, 0px);
    line-height: 42px;
}

.sidenav_ul dropdown-menu li a {
    color: red !important;
}

ul.submenuItems {
    margin-top: 15px;
}

.nav_mobil_bg .accordion-menu {
    background: transparent;
}

.sidenav_ul ul li .mobil_link {
    white-space: nowrap
}

.sidenav_ul ul li a::after {
    display: none;
}

.sidenav_ul .dropdown-menu {
    width: 100%;
    box-shadow: none;
    border: none;
}

.accordion-menu ul li {
    padding: 5px;
}

.mobil_social li {
    display: inline-block;
    padding: 5px !important;
    border-bottom: none !important;
}

.sidenav_ul ul li .mobil_link span {
    font-size: 18px;
    font-weight: 500;
    padding-left: 5px;
}

.overlay_mobil_bg {
    position: fixed;
    width: 100%;
    height: 100vh;
    background: rgba(0, 0, 0, 0.4);
    z-index: 999;
    display: none;
    transition: all 0.5s ease-in-out;
    top: 0;
}

.overlay_mobil_bg_active {
    display: block;
    opacity: 1;
}

.wrapper-menu {
    width: 30px;
    height: 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    cursor: pointer;
    transition: transform 330ms ease-out;
    position: absolute;
    right: 15px;
}

    .wrapper-menu.open {
        transform: rotate(-45deg);
    }

.line-menu {
    background-color: #ffffff;
    border-radius: 5px;
    width: 100%;
    height: 4px;
}

    .line-menu.half {
        width: 50%;
    }

    .line-menu.start {
        transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
        transform-origin: right;
    }

.open .line-menu.start {
    transform: rotate(-90deg) translateX(3px);
}

.line-menu.end {
    align-self: flex-end;
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: left;
}

.menubg .navbar.header .line-menu {
    background-color: #ef3528;
    border-radius: 5px;
    width: 100%;
    height: 4px;
}

    .menubg .navbar.header .line-menu.half {
        width: 50%;
    }

    .menubg .navbar.header .line-menu.start {
        transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
        transform-origin: right;
    }

.menubg .navbar.header .open .line-menu.start {
    transform: rotate(-90deg) translateX(3px);
}

.menubg .navbar.header .line-menu.end {
    align-self: flex-end;
    transition: transform 330ms cubic-bezier(0.54, -0.81, 0.57, 0.57);
    transform-origin: left;
}

.mobil_menu .menu_lang {
    animation-delay: .5s;
    display: inline-block;
    margin-bottom: 0;
}

.mobil_social {
    animation-delay: 1.5s;
}

    .mobil_social li,
    .mobil_menu .menu_lang li {
        display: inline-block;
        padding: 5px;
    }

.navbar_mobil_bg {
    display: none;
}

#mobil_btn {
    display: none
}

@media(max-width:991px) {
    #mobil_btn {
        display: block;
        padding-top: 15px;
        margin-bottom: 13px;
        position: absolute;
        top: 5px;
    }

    .deskop_menu .navbar .navbar-brand img {
        max-height: 60px;
    }
}

@media(max-width:565px) {
    .sidebar_active {
        width: 70%;
    }

    .deskop_menu .navbar .navbar-brand img {
        max-height: 60px;
        position: absolute;
        left: 10px;
        top: 10px;
    }
}







/*MBL*/

@media only screen and (min-width:768px) and (max-width:991px) {
    .noimg, .nomobile {
        display: none
    }

    .respofooter {
        justify-content: center;
        align-items: center;
        text-align: center
    }

    .yesimg {
        display: block;
        text-align: center;
        margin: 0 auto;
        justify-content: center
    }

    .productformobile {
        display: block !important;
        background-color: none !important
    }

    .fordesk {
        display: block
    }

    .list-group-item-text-name {
        text-decoration: none;
        color: #00008b
    }

    .icsayfa {
        width: 100%;
    }
}

.game-section {
    padding: 60px 50px;
    display: none
}

    .game-section .owl-stage {
        margin: 15px 0;
        display: flex;
        display: -webkit-flex
    }

    .game-section .item {
        margin: 0 15px 60px;
        width: 320px;
        height: 400px;
        display: flex;
        display: -webkit-flex;
        align-items: flex-end;
        -webkit-align-items: flex-end;
        background: center center/cover no-repeat #343434;
        border-radius: 16px;
        overflow: hidden;
        position: relative;
        transition: .4s ease-in-out;
        -webkit-transition: .4s ease-in-out;
        cursor: pointer
    }

        .game-section .item:after {
            content: "";
            display: block;
            position: absolute;
            height: 100%;
            width: 100%;
            left: 0;
            top: 0
        }

    .game-section .item-desc {
        padding: 0 24px 12px;
        color: #fff;
        position: relative;
        z-index: 1;
        overflow: hidden;
        transform: translateY(calc(100% - 54px));
        -webkit-transform: translateY(calc(100% - 54px));
        transition: .4s ease-in-out;
        -webkit-transition: .4s ease-in-out
    }

    .game-section .item.active .item-desc {
        transform: none;
        -webkit-transform: none
    }

    .game-section .item-desc p {
        opacity: 0;
        -webkit-transform: translateY(32px);
        transform: translateY(32px);
        transition: .4s ease-in-out .2s;
        -webkit-transition: .4s ease-in-out .2s
    }

    .game-section .owl-theme.custom-carousel .owl-dots {
        margin-top: -20px;
        position: relative;
        z-index: 5
    }

@media (min-width:992px) and (max-width:1199px) {
    #prdct {
        margin: 0 0 8px;
        font-size: 24px;
        line-height: 32px
    }
    .desktoprespo {
        display: none;
    }

    .mobilerespo {
        display: block !important;
    }
    .game-section {
        padding: 50px 30px
    }

    .icsayfa {
        width: 100%;
        padding: 0 !important;
    }

    .game-section .item {
        margin: 0 12px 60px;
        width: 260px;
        height: 360px
    }

        .game-section .item.active {
            width: 400px
        }

    .game-section .item-desc {
        transform: translateY(calc(100% - 46px));
        -webkit-transform: translateY(calc(100% - 46px))
    }
}

@media (min-width:768px) and (max-width:991px) {
    #prdct {
        margin: 0 0 8px;
        font-size: 24px;
        line-height: 32px
    }
    .desktoprespo {
        display: none;
    }

    .mobilerespo {
        display: block !important;
    }
    .line-title {
        width: 330px
    }

    .game-section {
        padding: 50px 30px 40px
    }

        .game-section .item {
            margin: 0 12px 60px;
            width: 240px;
            height: 330px
        }

            .game-section .item.active {
                width: 360px
            }

        .game-section .item-desc {
            transform: translateY(calc(100% - 42px));
            -webkit-transform: translateY(calc(100% - 42px))
        }

    @media (min-width :992px) {
        .offcanvas {
            visibility: visible;
            position: relative;
            background: 0 0;
            border: none;
            justify-content: end;
            color: red
        }
    }

    @media (max-width :992px) {
        .offcanvas {
            width: 250px !important
        }
        .desktoprespo {
            display: none;
        }

        .mobilerespo {
            display: block !important;
        }
        .sld-carousel {
            display: none;
        }

        .offcanvas-start-lg {
            top: 0;
            left: 0;
            border-right: 1px solid rgba(0,0,0,.2);
            transform: translateX(-100%)
        }
    }

    .navbar-nav li a {
        color: #fff !important
    }

    .post-slide .post-title a {
        font-size: 15px;
        font-weight: 700;
        color: #333;
        display: inline-block;
        text-align: center;
        text-transform: uppercase;
        transition: .3s;
    }



    .mob-menu {
        display: block !important;
    }

    .menubg {
        display: block !important;
    }

    .medyacontent {
        display: block;
    }
}

@media (max-width:767px) {
    .desktoprespo {
        display:none;
    }
    .mobilerespo {
        display:block !important;
    }
    .lead {
        font-size: 14px;
        font-weight: 300;
    }

    .medyacontent {
        display: block;
    }

    .page-banner-txt .txt {
        font-size: 25px;
        color: #fff;
        font-weight: 600;
    }

    #banner > div > div.bread.d-flex.justify-content-center > nav > ol > li.breadcrumb-item.active, .breadcrumb-item a {
        color: #f7f7f7;
        font-size: 15px;
        font-weight: 700;
    }

    .kurumsalbanner {
        background-repeat: no-repeat;
        background-size: cover;
        background-position: top;
        width: 100%;
        height: 150px;
        margin-bottom: 30px;
    }

        .kurumsalbanner::before {
            content: "";
            position: absolute;
            background-color: #00000052;
            width: 100%;
            height: 150px;
        }

    #nav_accordion > li > ul > li > a {
        padding: 7px 6px;
        font-size: 15px;
    }

    .sup p {
        font-size: 15px;
        margin-bottom: 5px !important;
    }


    #prdct {
        margin: 0 20px 8px;
        font-size: 19px;
        line-height: 24px
    }

    .refren {
        font-size: 14px;
    }

    .sld-carousel {
        display: none;
    }

    .icsayfa {
        width: 100%;
        padding: 0 !important;
    }

    .menubg {
        display: block !important;
    }

    .mob-menu {
        display: block;
    }

    .post-slide .post-title a {
        font-size: 15px;
        font-weight: 700;
        color: #333;
        display: inline-block;
        text-align: center;
        text-transform: uppercase;
        transition: .3s;
    }

    .line-title {
        width: 250px
    }

    .game-section {
        padding: 30px 15px 20px
    }

        .game-section .item {
            margin: 0 10px 40px;
            width: 200px;
            height: 280px
        }

            .game-section .item.active {
                width: 270px
            }

        .game-section .item-desc {
            padding: 0 14px 5px;
            -webkit-transform: translateY(calc(100% - 67px))
        }

    .owl-item {
        margin: 0 auto !important;
        padding: 11px
    }

    .respoustmenu {
        display: block !important;
        background-color: #003562
    }


    .post-slide .post-img {
        position: relative;
        overflow: hidden;
        border-radius: 10px;
        margin: -12px -4px 8px 15px;
        margin-left: -1px;
    }

    .navbar-nav li a {
        color: #fff !important
    }

    .topbar, .tptptp {
        display: none !important
    }

    .post-slide .read-more {
        padding: 7px 20px;
        float: right;
        font-size: 12px;
        background: #2196f3;
        color: #fff;
        box-shadow: 0 10px 20px -10px #1376c5;
        border-radius: 25px;
        text-transform: uppercase;
        text-align: center;
        width: 100%;
    }

    .h2s {
        font-size: 14px;
    }

    .mob-menu {
        display: block !important;
    }

    .footerbg .foot-tt {
        color: #fff;
        font-size: 17px;
        margin-bottom: 10px;
    }

    .conesxx .logo-one img {
        max-width: 110px !important;
        margin-top: 15px;
    }

    .title {
        font-weight: 600;
        color: #393186;
        font-size: 25px;
        margin-bottom: 0%;
        padding: 10px 0px !important;
    }

    .close, .h, .pdf-icon:after, .x0348d, .x3dl4 i, .xcx {
        font-weight: 700;
        font-size: 16px;
    }

    .x0348z {
        font-size: 14px;
    }
}

#timsan-company-logo {
    position: absolute;
    left: 7%;
    top: 22%;
}

#timsan-company-tel {
    position: absolute;
    right: 7%;
    top: 32%;
}

    #timsan-company-tel a:hover, #timsan-company-tel a:hover i {
        color: #edebeb
    }

    #timsan-company-tel i {
        margin-right: 5px
    }


.document {
    background-color: #ffffff;
    width: 100%;
    padding: 10px;
}

    .document:hover {
        background-color: #003562;
    }
p.doc-i {
    text-align: center;
    font-size: 25px;
    color:black;
}

p.doc-ad {
    color:black;
}
.document .doc-ad {
    text-align: center;
    font-size: 14px;
}
        .document:hover p.doc-i {
            color:white;
        }
.document:hover .doc-ad {
    color: white;
}