@import url('https://fonts.googleapis.com/css?family=Open+Sans&subset=latin,latin-ext:200,200i,300,300i,400,400i,600,600i,700,800');
@import url('https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');

.gradient {
    background: -webkit-linear-gradient(left, rgb(191, 191, 191) 0%, rgb(250, 250, 250) 40%, rgb(214, 214, 214) 83%);
    background: -o-linear-gradient(left, rgb(191, 191, 191) 0%, rgb(250, 250, 250) 40%, rgb(214, 214, 214) 83%);
    background: -ms-linear-gradient(left, rgb(191, 191, 191) 0%, rgb(250, 250, 250) 40%, rgb(214, 214, 214) 83%);
    background: -moz-linear-gradient(left, rgb(191, 191, 191) 0%, rgb(250, 250, 250) 40%, rgb(214, 214, 214) 83%);
    background: linear-gradient(to right, rgb(191, 191, 191) 0%, rgb(250, 250, 250) 40%, rgb(214, 214, 214) 83%);
    padding: 125px;
    height:100%;

}

.center {
    text-align: center;
}
.left{
    text-align:left;
}

.margin-bottom {
    margin-bottom: 135px;
}

.choise h1 {
    font-size: 22px;
    color: black;
    font-weight: 500;
}

.choise span {
    color: black;
    font-size: 12px;
}

.choise h1 span {
    font-weight: 700;
    font-size: 22px;
}
.choise a{
    width:100%;
}
.choise a:hover,
.choise a:focus {
    text-decoration:none;
    outline:none;
}
.choise a:hover >h1,
.choise a:hover >h1 span{
    color:#00648f;
}
.choise .wrap{
    height:178px;
}
.header h1{
    font-size:46px;
    margin-bottom:30px;
}
.header p{
    font-size:25px;
    line-height:1.2;
}
.header {
    margin-bottom: 80px;
}
.sedye .hizala span{
    font-size:18px;
    margin-left:15px;
}
.sedye .hizala{
    margin-bottom:20px;
}
.sedye{
    margin-top:30px;
}
.ilk-rsm{
    margin-bottom:50px;
    margin-top:100px;
}
body {
    font-family: 'Open Sans', sans-serif;
}


/*Genel olanlar*/
.menu {
    max-width: 980px;
    position: relative;
}

.ortala {
    text-align: center;
}

.navbar-default .dropdown-menu > li > a,
.navbar-default .dropdown-menu > li > a:hover {
    display: flex;
    align-items: center;
    background-color: transparent;
}

.navbar-default .dropdown-menu .ortala {
    margin-bottom: 20px;
    margin-top: 20px;
}

.icons {
    margin-bottom: 40px;
}

    .icons img:first-child {
        margin-right: 20px;
    }


.navbar-default .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: #c8c8c7;
    text-align: center;
}

.navbar-nav .hizala a,
.navbar-nav .hizala a:hover,
.navbar-nav .hizala a:focus {
    color: #c8c8c7;
    padding-left: 8px;
    text-decoration: none;
    padding-right: 10px;
}

.icon-wrapper {
    display: inline-block;
    height: 28px;
    width: 28px;
    position: relative;
}

    .icon-wrapper p {
        position: absolute;
        bottom: 5%;
        left: 49%;
        color: white;
        font-size: small;
    }

    .icon-wrapper img {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        padding-right: 10px;
    }

.navbar-default .dropdown .icon-wrapper img {
    width: 118%;
}

.navbar-default .dropdown-menu .icon-wrapper img {
    width: auto;
}

.resim-wrapper {
    display: inline-block;
    height: 80px;
    width: 80px;
    position: relative;
}

    .resim-wrapper img {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%,-50%);
        padding-right: 10px;
        width: 100%;
    }

.aralikli {
    position: absolute;
    left: 35%;
}

.navbar-collapse .aralikli a {
    width: 150px;
    padding-top: 20px;
}

.navbar-default .dropdown ul.dropdown-menu {
    border-radius: 4px;
    box-shadow: none;
    margin-top: 12px;
    width: 300px;
    padding-bottom: 40px;
    padding-top: 20px;
}

    .navbar-default .dropdown ul.dropdown-menu:before {
        content: "";
        border-bottom: 10px solid #fff;
        border-right: 10px solid transparent;
        border-left: 10px solid transparent;
        position: absolute;
        top: -10px;
        right: 40px;
        z-index: 10;
    }

    .navbar-default .dropdown ul.dropdown-menu:after {
        content: "";
        border-bottom: 12px solid #ccc;
        border-right: 12px solid transparent;
        border-left: 12px solid transparent;
        position: absolute;
        top: -12px;
        right: 38px;
        z-index: 9;
    }

.navbar-default .dropdown-menu > li:first-child,
.navbar-default .dropdown-menu > li:first-child a,
.navbar-default.dropdown-menu > li:first-child a:hover {
    padding-left: 20px;
}

.ortala p {
    position: absolute;
    color: white;
    left: calc(50% - 45px);
    top: 40%;
}

.alt-cizgi {
    margin: 5px 20px 0px 20px;
    border-bottom: 1px solid #e2e2e2;
}

.navbar-default .dropdown-menu .hizala a,
.navbar-default .dropdown-menu .hizala a:hover {
    color: black;
    background-color: white;
}


.navbar-default {
    background-color: #32302d;
    border-color: #32302d;
    color: #c8c8c7;
    height: 58px;
}

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:focus,
    .navbar-default .navbar-nav > .open > a:hover {
        background-color: transparent;
        color: #c8c8c7;
    }

.navbar-toggle {
    float: left;
}

.nav > li > a {
    display: flex;
}

.navbar-brand {
    padding: 15px 15px;
}

.hizala {
    display: inline-flex;
    align-items: center;
}

.orta-cizgi {
    color: white;
    height: 15px;
    border-right: 2px solid white;
    margin-top: 22px;
}

.satin-al-button {
    text-align: right;
    padding-left: 0px;
    padding-top: 7px;
}

    .satin-al-button a {
        position: relative;
        display: block;
    }

        .satin-al-button span,
        .satin-al-button a:hover span,
        .satin-al-button a:focus span {
            position: absolute;
            color: white;
            left: 0%;
            top: 15%;
            font-size: small;
            width: 100%;
        }

.ilt-gnder-btn p {
    left: calc(45% + 25px);
    position: absolute;
    color: white;
    top: 26%;
}

.ilt-gnder-btn {
    padding: 0px;
    background-color: transparent;
    border-color: transparent;
}

.bayi .satin-al-button p {
    position: absolute;
    color: white;
    font-weight: bold;
    left: 52px;
    top: 65%;
    width: auto;
}

.teknik-ozellik-button,
.teknik-ozellik-button a,
.teknik-ozellik-button a:hover,
.teknik-ozellik-button a:focus {
    text-decoration: none;
    color: black;
    font-size: medium;
    text-align: right;
    padding-top: 10px;
    white-space: nowrap;
}

.cont-yapi {
    margin-top: 30px;
}

.menu-alt-beyaz {
    padding-right: 30px;
    margin-top: -10px;
}

hr {
    margin-right: -20px;
    margin-left: -20px;
    margin-top: 10px;
    margin-bottom: 0px;
}

.xs-resim {
    width: auto;
}

.sm-resim {
    width: auto;
}

.lg-resim {
    width: 100%;
}

.md-resim {
    width: auto;
}

.cont-bosluklar {
    margin-top: 70px;
    margin-bottom: 70px;
}

.jumbotron-anaSayfa-1 {
    position: relative;
    text-align: center;
    background-color: #202020;
}

    .jumbotron-anaSayfa-1 img {
        padding-top: 100px;
        margin-bottom: -48px;
    }

    .jumbotron-anaSayfa-1 .container {
        position: absolute;
        left: 50%;
        margin-left: -585px;
        top: 3%;
    }

    .jumbotron-anaSayfa-1 p {
        color: #ffffff;
        font-size: 15px;
    }

    .jumbotron-anaSayfa-1 h1 {
        color: #feff00;
        font-weight: bold;
        font-size: 30px;
    }

.jumbotron-anaSayfa-2 {
    position: relative;
    text-align: center;
    background-color: #0d0d0d;
    margin-top: 5%;
    padding: 0px;
}

    .jumbotron-anaSayfa-2 img {
        margin-top: -48px;
        margin-bottom: -48px;
    }

    .jumbotron-anaSayfa-2 .container {
        position: absolute;
        left: 50%;
        margin-left: -585px;
        top: 10%;
    }

        .jumbotron-anaSayfa-2 .container img {
            margin-bottom: 0px;
            margin-top: 0px;
        }

    .jumbotron-anaSayfa-2 h4,
    .jumbotron-anaSayfa-2 p {
        color: white;
    }

.jumbotron-kurumsal {
    position: relative;
    background-color: #202020;
}

    .jumbotron-kurumsal .container {
        position: absolute;
        left: 50%;
        margin-left: -585px;
        top: 20%;
        text-align: center;
    }

    .jumbotron-kurumsal h1 {
        font-size: 50px;
        color: white;
        font-weight: bold;
    }

    .jumbotron-kurumsal h4 {
        color: white;
        font-size: 30px;
    }

    .jumbotron-kurumsal p {
        padding-top: 20px;
        color: white;
        font-size: 15px;
    }

    .jumbotron-kurumsal img {
        margin-top: -48px;
        margin-bottom: -48px;
    }

.jumbotron-kurumsal-alt {
    background-color: white;
    position: relative;
    text-align: center;
}

    .jumbotron-kurumsal-alt .container {
        position: absolute;
        left: 50%;
        margin-left: -585px;
        top: 2%;
    }

    .jumbotron-kurumsal-alt h3 {
        font-size: 35px;
        font-weight: bold;
    }

    .jumbotron-kurumsal-alt p {
        font-size: 17px;
    }

    .jumbotron-kurumsal-alt img {
        margin-top: 10%;
    }

    .jumbotron-kurumsal-alt a,
    .jumbotron-kurumsal-alt a:hover,
    .jumbotron-kurumsal-alt a:focus {
        font-size: 17px;
        color: #3366cb;
        text-decoration: none;
    }

.jumbo-sorular {
    position: relative;
    text-align: center;
    background-color: #202020;
}

    .jumbo-sorular .container {
        position: absolute;
        left: 50%;
        margin-left: -585px;
        top: 2%;
    }

    .jumbo-sorular h1 {
        color: white;
        font-size: 45px;
    }

    .jumbo-sorular p {
        color: white;
        font-size: 17px;
    }

    .jumbo-sorular img {
        margin-top: 100px;
    }

.bayi-baslik {
    text-align: center;
}

    .bayi-baslik p {
        margin-top: 25px;
        font-size: 13px;
        margin-bottom: 50px;
        color: black;
    }

    .bayi-baslik span {
        font-size: 13px;
        color: #767676;
    }

.bayilik-hizala {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .bayilik-hizala .form-horizontal {
        margin-top: 40px;
    }

    .bayilik-hizala .form-control {
        border-radius: 0px;
        font-size: 12px;
        height: 40px;
    }

    .bayilik-hizala #mesaj {
        height: 100px;
        padding: 14px 12px;
    }

.checkbox label {
    font-size: 12px;
}

.checkbox a,
.checkbox a:focus,
.checkbox a:hover,
.checkbox span {
    padding: 0px;
    border-bottom: 1px solid #c8c8c7;
    font-size: 12px;
    font-weight: bold;
    color: black;
    text-decoration: none;
}

.checkbox input[type=checkbox] {
    height: 14px;
    width: 15px;
    margin: 2px -20px 0;
}

.checkbox {
    padding-left: -15px;
}

.bayi .satin-al-button {
    text-align: center;
}

.bayi {
    margin-bottom: 40px;
    margin-top: -20px;
}

.iletisim {
    text-align: center;
}

    .iletisim h1 {
        font-size: 45px;
        margin-bottom: 40px;
    }

    .iletisim p {
        text-align: left;
    }

.ic {
    margin-left: 30%;
    margin-bottom: 5%;
}

.iletisim b {
    font-size: 14px;
    font-weight: bolder;
    color: #767676;
}

.ilt .form-control {
    border-radius: 0px;
    font-size: 12px;
}

.ilt {
    text-align: center;
    margin-bottom: 40px;
}

    .ilt .iletisim {
        margin-bottom: 50px;
    }

    .ilt .satin-al-button {
        text-align: center;
    }

.giris {
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    background-color: white;
    border-radius: 5px;
    padding-left: 0px;
    padding-right: 0px;
    margin-top: 100px;
    margin-bottom: 100px;
}

    .giris .panel-baslik {
        padding: 10px;
        border-bottom: 1px solid #ddd;
        margin-bottom: 10px;
    }

        .giris .panel-baslik h5 {
            font-size: 25px;
            text-align: center;
        }

    .giris .btn-oturum,
    .giris .btn-oturum:focus .giris .btn-oturum:hover {
        background-color: #427ad7;
        color: white;
    }

    .giris .panel-icerik {
        padding: 40px 20px;
    }

    .giris .form-group {
        margin-bottom: 20px;
    }

.custom-cb input[type='checkbox'] {
    display: none;
}

    .custom-cb input[type='checkbox'] ~ .cb-text {
        font-size: 13px;
        font-weight: 500;
        color: #666;
    }

        .custom-cb input[type='checkbox'] ~ .cb-text:before {
            content: "\f096";
            font-family: "FontAwesome";
            speak: none;
            font-style: normal;
            font-weight: normal;
            font-variant: normal;
            text-transform: none;
            font-size: 15px;
            -webkit-font-smoothing: antialiased;
            display: inline-block;
            line-height: 1;
            width: 1em;
            margin-right: 2px;
            color: #666;
        }

    .custom-cb input[type='checkbox']:checked ~ .cb-text:before {
        content: "\f14a";
        color: #427ad7;
        animation: cbAnimation .2s ease;
    }










.isitma-sogutma h3 {
    color: #171717;
    font-size: 28px;
    font-weight: bolder;
}

.isitma-sogutma p {
    font-size: 17px;
    padding-right: 12px;
    font-weight: bolder;
}

.isitma-sogutma span {
    padding-right: 4px;
    font-weight: normal;
}

.isitma-sogutma img {
    padding-right: 6px;
}

.isitma-sogutma {
    display: flex;
    justify-content: center;
    align-items: center;
}

.navbar-default .dropdown > .open {
    height: 56px;
}

.sticky {
    position: fixed;
    top: 0;
    background-color: white;
    z-index: 5;
    padding-top: 20px;
}


/*Footer*/
.footer {
    background-color: #f2f2f2;
    position: absolute;
    width: 100%;
}

    .footer ul {
        list-style-type: none;
        padding-left: 0px;
    }

    .footer a,
    .footer a:hover,
    .footer a:focus {
        text-decoration: none;
        color: #767676;
        font-size: 12px;
        line-height: 1.8;
    }

    .footer h5 {
        color: #202020;
        font-weight: bolder;
        font-size: 13px;
    }

    .footer hr {
        padding-top: 20px;
        padding-bottom: 20px;
        border-top: 1px solid #ccc;
    }

    .footer .iconlar a {
        font-size: medium;
        font-weight: bolder;
    }

    .footer .iconlar {
        margin-top: 40px;
        text-align: right;
    }

        .footer .iconlar .tel {
            border-right: 1px solid #767676;
            padding-right: 5px;
            margin-right: 8px;
        }

    .footer .copy p {
        font-size: 12px;
        color: #767676;
        font-weight: bolder;
        padding-left: 0px;
        padding-bottom: 20px;
    }

    .footer .container {
        padding-top: 20px;
    }


/*Select button*/
.btn-select {
    position: relative;
    padding: 0;
    min-width: 225px;
    width: 100%;
    border-radius: 0;
    height: 40px;
}

    .btn-select .btn-select-value {
        padding: 10px 12px;
        display: block;
        position: absolute;
        left: 0;
        right: 34px;
        text-align: left;
        text-overflow: ellipsis;
        overflow: hidden;
        border-top: none !important;
        border-bottom: none !important;
        border-left: none !important;
        font-size: 13px;
        color: #999;
    }

        .btn-select .btn-select-value :after {
            content: "|";
            color: red;
        }

    .btn-select .btn-select-arrow,
    .btn-select .btn-select-arrow:hover {
        float: right;
        line-height: 26px;
        padding: 6px 12px;
        top: 0;
        background-color: white;
    }

    .btn-select ul {
        display: none;
        background-color: white;
        color: black;
        clear: both;
        list-style: none;
        padding: 0;
        margin: 0;
        border-top: none !important;
        position: absolute;
        left: -1px;
        right: -1px;
        top: 40px;
        z-index: 999;
    }

        .btn-select ul li {
            padding: 3px 6px;
            text-align: left;
            color: #555;
            font-size: 13px;
        }

            .btn-select ul li:hover {
                background-color: #f4f4f4;
            }

            .btn-select ul li.selected {
                color: white;
            }

    .btn-select.btn-default:hover, .btn-select.btn-default:active, .btn-select.btn-default.active {
        border-color: #ccc;
    }

    .btn-select .btn-default ul li.selected {
        background-color: #ccc;
    }

    .btn-select.btn-default ul,
    .btn-select.btn-default .btn-select-value,
    .btn-select.btn-default .btn-select-value:hover {
        background-color: white;
        border: #ccc 1px solid;
    }

    .btn-select.btn-default:hover, .btn-select.btn-default.active {
        background-color: #e6e6e6;
    }
/*S.S.S CSS*/

.resimli {
    background-image: url(/Images/Sorular/zemin-siyah.jpg);
    width: 100%;
    text-align: center;
}

    .resimli h1 {
        margin-top: 60px;
        text-align: center;
        color: white;
        font-size: 45px;
    }

    .resimli p {
        text-align: center;
        color: white;
        font-size: 15px;
    }

    .resimli .test,
    .resimli .kurulum,
    .resimli .ozelRenk,
    .resimli .garanti {
        position: relative;
    }



        .resimli .test p {
            position: absolute;
            width: 330px;
            font-size: 15px;
            color: white;
            top: 70px;
            left: 325px;
        }

        .resimli .test h2 {
            position: absolute;
            color: #009ac5;
            top: 50px;
            right: 343px;
            font-size: 27px;
        }

        .resimli .kurulum .yazi {
            position: absolute;
            width: 330px;
            font-size: 15px;
            color: white;
            top: 40px;
            right: 355px;
        }

        .resimli .kurulum h2 {
            position: absolute;
            color: #009ac5;
            top: 23%;
            left: calc(25% + 44px);
            font-size: 27px;
        }



        .resimli .kurulum img {
            margin-left: -50px;
        }

        .resimli .kurulum .yazi ul,
        .resimli .kurulum .yazi p {
            text-align: left;
            margin-bottom: 0px;
        }



        .resimli .garanti p {
            position: absolute;
            width: 330px;
            font-size: 15px;
            color: white;
            top: 70px;
            left: 330px;
        }

        .resimli .garanti h2 {
            position: absolute;
            color: #009ac5;
            top: 24%;
            right: calc(30% + 15px);
            font-size: 27px;
        }


        .resimli .ozelRenk p {
            position: absolute;
            width: 330px;
            font-size: 15px;
            color: white;
            top: 65px;
            right: 350px;
        }

        .resimli .ozelRenk h2 {
            position: absolute;
            color: #009ac5;
            top: 25%;
            left: 29%;
            font-size: 27px;
        }


        .resimli .ozelRenk img {
            margin-left: -50px;
        }

.siparis, .adres, .hesap, .sepetim, .oneriler, .odemeBilgileri {
    background-color: white;
    margin-top: 60px;
}

.baslik .sol h4 {
    padding-left: 15px;
}

.baslik .sol p {
    margin-bottom: 0px;
    padding-left: 7px;
    font-size: 12px;
    white-space: nowrap;
}

.siparis .baslik, .adres .baslik, .hesap .baslik {
    padding: 5px 10px 0px 0px;
    border-bottom: 1px solid #c8c8c7;
    height: 75px;
}

.baslik .sag {
    text-align: right;
    padding-right: 0px;
}

    .baslik .sag p {
        padding-left: 5px;
        margin-bottom: 0px;
        color: black;
        white-space: nowrap;
    }

    .baslik .sag a,
    .baslik .sag a:hover,
    .baslik .sag a:focus {
        text-decoration: none;
    }

    .baslik .sag .cerceve {
        height: 30px;
        width: 30px;
    }

        .baslik .sag .cerceve img {
            width: 100%;
        }

    .baslik .sag .hizala {
        justify-content: center;
        width: 143px;
        height: 70px;
    }

    .baslik .sag .ilk {
        border-bottom: 2px solid #4566ff;
    }

.urunler .cerceve {
    height: 100px;
    width: 100px;
}

.urunler {
    border-bottom: 1px solid #c8c8c7;
    margin-bottom: 20px;
    margin-top: 30px;
}

    .urunler .cerceve img {
        width: 100%;
    }

    .urunler .hizala {
        align-items: flex-start;
    }

    .urunler .icerik .tablo-baslik {
        background-color: #f2f2f2;
        margin-left: 20px;
    }

.tablo-baslik ul {
    list-style-type: none;
    list-style: none outside none;
    padding-left: 5px;
    display: flex;
    justify-content: space-around;
}

.tablo-baslik li {
    position: relative;
    display: table-cell;
    padding: 7px;
    text-align: center;
}

.tablo-baslik .pasif {
    width: 30px;
}

.tablo-baslik > ul li:first-child,
.tablo-icerik > ul li:first-child {
    text-align: left;
}

.tablo-baslik > ul > li:last-child,
.tablo-icerik > ul > li:last-child {
    width: 65px;
    text-align: right;
}

.tablo-icerik ul {
    list-style: none;
    padding-left: 30px;
}

    .tablo-icerik ul li {
        position: relative;
        display: table-cell;
        width: 230px;
        text-align: center;
    }

.tablo-icerik .detay {
    position: absolute;
    font-size: 11px;
    right: 12%;
    color: white;
    top: 75%;
}

.tablo-icerik .iade {
    position: absolute;
    font-size: 12px;
    right: 30%;
    top: 25%;
    color: white;
}

.tablo-icerik label {
    font-weight: normal;
}

.tablo-icerik .durum span {
    color: red;
}

.tablo-icerik .siparis-no,
.tablo-icerik .siparis-tarih {
    color: #4566ff;
}

.adres .adres-ekle-buton {
    position: relative;
    text-align: right;
    margin-top: 20px;
}

.adres-ekle-buton span {
    position: absolute;
    color: white;
    right: 22px;
    top: 7px;
    font-size: 11px;
}

.adres .tablo-baslik,
.hesap .tablo-baslik {
    background-color: #f2f2f2;
    margin-top: 15px;
    margin-left: -15px;
    margin-right: -15px;
}

    .adres .tablo-baslik p,
    .hesap .tablo-baslik p {
        padding: 7px;
        padding-left: 20px;
    }

.adres .tablo-icerik .adi {
    width: 160px;
    font-size: 15px;
}

.adres .tablo-icerik .bolme,
.siparis .tablo-icerik .bolme {
    width: 100px;
}

.adres .tablo-icerik ul {
    padding-left: 10px;
}

.adres .tablo-icerik .adresi {
    width: 570px;
    text-align: left;
    font-size: 15px;
}

.adres .tablo-icerik .islemler {
    width: 150px;
    text-align: right;
    font-size: 15px;
}

.adres .tablo-icerik {
    border-bottom: 1px solid #c8c8c7;
    margin-top: 20px;
    padding-bottom: 20px;
}

.hesap .form-control {
    border-radius: 0px;
}

.hesap .label {
    font-weight: normal;
    color: black;
    font-size: 12px;
    padding-left: 0px;
    line-height: 2;
}

.hesap .form-check-label {
    font-weight: normal;
    padding-left: 8px;
}

.hesap .form-group .hizala {
    align-items: flex-start;
}

.hesap .guvenlik-kod .label {
    font-size: 14px;
    line-height: 1.6;
}

.hesap .guvenlik-kod span {
    font-size: 13px;
    color: #c8c8c7;
}

.hesap .guvenlik-kod .kaydet-btn p {
    position: absolute;
    left: 25%;
    top: 15%;
    color: white;
}



.hesap .guvenlik-kod .yenile-btn:hover,
.hesap .guvenlik-kod .yenile-btn:focus,
.hesap .guvenlik-kod .kaydet-btn:hover,
.hesap .guvenlik-kod .kaydet-btn:focus,
.hesap .guvenlik-kod .kaydet-btn {
    position: relative;
    text-decoration: none;
}

.hesap .sifre-yenile-btn,
.hesap .sifre-yenile-btn:hover,
.hesap .sifre-yenile-bt:focus {
    position: relative;
    text-decoration: none;
}

    .hesap .sifre-yenile-btn p {
        position: absolute;
        color: white;
        top: 0%;
        left: 25%;
    }

.hesap .anahtar-yazi {
    text-align: center;
    font-size: 13px;
    padding-top: 70px;
}

    .hesap .anahtar-yazi img {
        padding-bottom: 5px;
    }

.menu-alt-devam {
    text-align: right;
    padding-right: 22px;
    margin-top: -10px;
    padding-bottom: 10px;
}

    .menu-alt-devam .devam-buton {
        position: relative;
    }

.devam-buton p {
    position: absolute;
    color: white;
    right: 10%;
    top: 20%;
    font-size: 12px;
}

.bottom-border {
    border-bottom: 1px solid #f2f2f2;
    margin-bottom: 5px;
}

.renk-secenek {
    text-align: center;
    margin-top: 20px;
}

    .renk-secenek a,
    .renk-secenek a:hover,
    .renk-secenek a:focus {
        text-decoration: none;
        color: initial;
    }


    .renk-secenek ul {
        list-style: none;
        padding-left: 0px;
    }

        .renk-secenek ul > li {
            display: inline-block;
            width: 50px;
            margin-right: 60px;
            font-size: 14px;
            padding: 4px;
        }

            .renk-secenek ul > li:last-child {
                width: 120px;
                margin-right: 0px;
            }



    .renk-secenek .aktif {
        border-bottom: 1px solid black;
    }

        .renk-secenek .aktif a {
            color: #0023ff;
        }

    .renk-secenek .renk-kartela li {
        width: 35px;
        margin-right: 10px;
    }

.renk-kartela ul {
    padding-left: 0px;
    margin-top: 20px;
}

.renk-kartela .cerceve {
    width: 38px;
    height: 38px;
    border: 1px solid #c8c8c7;
}

.renk-kartela .active {
    width: 38px;
    height: 38px;
    border: 1px solid #a52b2b;
}

.renk-kartela .cerceve img {
    padding: 2px;
    width: 100%;
}

.renk-secenek .koltuklar {
    margin-top: 25px;
    margin-bottom: 100px;
}

.renk-secenek .koltuk-ad {
    margin-top: 25px;
    font-size: 16px;
    color: #337dd7;
}

.sorular > .panel-heading,
.sorular-ic > .panel-heading {
    color: #333;
    background-color: #fff;
    border-color: #e4e5e7;
    padding: 0;
}

.sorular h2 {
    font-size: 30px;
}

.sorular h5 {
    font-size: 15px;
    font-weight: bold;
}

.sorular > .panel-heading a,
.sorular > .panel-heading a:hover,
.sorular > .panel-heading a:focus {
    display: block;
    padding: 10px 0px;
    text-decoration: none;
}

.sorular-ic > .panel-heading a,
.sorular-ic > .panel-heading a:focus {
    display: block;
    padding: 20px 0px;
    text-decoration: none;
}

    .sorular-ic > .panel-heading a:hover {
        display: block;
        padding: 20px 0px;
        text-decoration: none;
        color: #4182dd;
    }

.sorular .sorular-ic .panel-body p,
.sorular .sorular-ic .panel-body ul {
    font-size: 13px;
}

.sorular .panel-body {
    padding: 0px;
}

.sorular-ic .panel-heading + .panel-collapse > .panel-body {
    border-top: 1px solid transparent;
}


.sorular > .panel-heading a:after,
.sorular-ic > .panel-heading a:after {
    content: "";
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-size: 17px;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    float: right;
    transition: transform .50s linear;
    -webkit-transition: -webkit-transform .50s linear;
}

.sorular-ic > .panel-heading a:after {
    font-size: 12px;
}


.sorular > .panel-heading a[aria-expanded="true"]:after,
.sorular-ic > .panel-heading a[aria-expanded="true"]:after {
    content: "\e014";
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    transition: transform .50s linear;
}

.sorular > .panel-heading a[aria-expanded="false"]:after {
    content: "\002b ";
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
}

.ozellik {
    text-align: center;
}

    .ozellik p {
        font-size: 15px;
    }

.urun-secenek .cerceve {
    width: 400px;
    height: 400px;
}

    .urun-secenek .cerceve img {
        width: 100%;
    }

.paket-secenek ul {
    list-style: none;
}

    .paket-secenek ul > li {
        display: inline-block;
        position: relative;
    }

.paket-secenek .standart-paket .paket-adi {
    color: #fa3f05;
    font-size: 23px;
}

.paket-adi strong {
    font-size: 70px;
    font-weight: lighter;
}

.urun-secenek .hizala {
    display: flex;
    align-items: center;
}

.urun-secenek .paket-adi,
.urun-secenek .paket-icerik {
    width: 180px;
    height: 125px;
}

.standart-paket,
.extra-paket,
.premium-paket {
    padding-left: 0px;
    padding: 30px 5px 0px 5px;
    margin-bottom: 20px;
    margin-top: 10px;
    position: relative;
    border: 1px solid transparent;
    height: 175px;
    color: black;
}

.urun-secenek a:hover {
    text-decoration: none;
}


.paket-secenek .extra-paket .paket-adi {
    font-size: 23px;
    color: #42cdd2;
}

.paket-secenek .premium-paket .paket-adi {
    font-size: 23px;
    color: #e4107e;
}

.paket-fiyat b {
    font-size: 15px;
    font-weight: bold;
    text-decoration: line-through;
    color: black;
}

.standart-paket .paket-fiyat p {
    font-size: 20px;
    color: #fa3f05;
}

.extra-paket .paket-fiyat p {
    font-size: 20px;
    color: #42cdd2;
}

.premium-paket .paket-fiyat p {
    font-size: 20px;
    color: #e4107e;
}

.standart-paket-aktif {
    border: 1px solid #fa3f05;
    text-decoration: none;
}

.extra-paket-aktif {
    border: 1px solid #42cdd2;
    text-decoration: none;
}

.premium-paket-aktif {
    border: 1px solid #e4107e;
    text-decoration: none;
}

.standart-paket:hover:after {
    background: url(/Images/Odeme/kirmizi-devam.png) 0 0 no-repeat;
    height: 100px;
    position: absolute;
    content: "DEVAM ET";
    width: 134px;
    left: calc(50% - 67px);
    bottom: -80px;
    color: #fa3f05;
    padding: 7px 10px 5px 30px;
    font-weight: bolder;
}

.extra-paket:hover:after {
    background: url(/Images/Odeme/mavi-devam.png) 0 0 no-repeat;
    height: 100px;
    position: absolute;
    content: "DEVAM ET";
    width: 134px;
    left: calc(50% - 67px);
    bottom: -80px;
    color: #42cdd2;
    padding: 7px 10px 5px 30px;
    font-weight: bolder;
}

.premium-paket:hover:after {
    background: url(/Images/Odeme/pembe-devam.png) 0 0 no-repeat;
    height: 100px;
    position: absolute;
    content: "DEVAM ET";
    width: 134px;
    left: calc(50% - 67px);
    bottom: -80px;
    color: #e4107e;
    padding: 7px 10px 5px 30px;
    font-weight: bolder;
}

.teslimat {
    margin-bottom: 50px;
}

.teslimat-bilgi {
    background-color: #f2f2f2;
    margin-bottom: 60px;
}

    .teslimat-bilgi .bottom-border {
        border-bottom: 1px solid #c8c8c7;
        padding: 20px 0px 30px 0px;
    }

    .teslimat-bilgi h3 {
        color: #0023ff;
        font-size: 20px;
    }

    .teslimat-bilgi .hizala {
        display: flex;
        align-items: center;
    }

    .teslimat-bilgi .siparis_ozet {
        font-weight: normal;
        font-size: 14px;
    }

    .teslimat-bilgi .fiyat {
        font-size: 17px;
        font-weight: normal;
        margin-right: -7px;
    }

    .teslimat-bilgi a,
    .teslimat-bilgi a:hover,
    .teslimat-bilgi a:focus {
        color: #0023ff;
        text-decoration: none;
        font-size: 12px;
    }

    .teslimat-bilgi .odeme-buton {
        position: absolute;
        color: white;
        left: 50%;
        top: 23%;
        font-size: 14px;
    }

.xxs-resim {
    width: auto;
}

.sepetim .bilgi .urun_adi {
    font-weight: normal;
    font-size: 15px;
}

.sepetim .bilgi .urun_adet {
    position: absolute;
    width: 30px;
    height: 23px;
    text-align: center;
    right: 16px;
    font-weight: bolder;
}

.bilgi .sag,
.bilgi .fiyat_tekrar {
    text-align: right;
    font-size: 15px;
}

.sepet-icerik .bottom-border {
    padding-bottom: 10px;
}

.sepet-icerik .detay .cerceve {
    width: 20px;
    height: 20px;
}

    .sepet-icerik .detay .cerceve img {
        width: 100%;
    }

.sepet-icerik .detay label {
    font-weight: normal;
}

.sepet-icerik .detay p,
.sepet-icerik .detay .cikar {
    font-size: 12px;
}

    .sepet-icerik .detay .cikar a,
    .sepet-icerik .detay .cikar a:hover,
    .sepet-icerik .detay .cikar a:focus {
        color: #0023ff;
        padding-left: 5px;
        text-decoration: none;
    }

.sepet-icerik .cikar {
    text-align: right;
}

.sepet-icerik .detay .teslimat-tipi {
    padding-left: 10px;
    padding-top: 5px;
}

.sepetim .urun {
    padding-bottom: 20px;
}

.sepetim .sag {
    text-align: right;
}

    .sepetim .sag p {
        width: 340px;
    }

.sepetim .odeme-buton p {
    color: white;
    position: absolute;
    top: 25%;
    right: 13%;
}

.sepetim .odeme-buton {
    margin-top: 20px;
}

.sepetim {
    padding: 20px 15px 20px 15px;
}

    .sepetim .visible-xs span {
        font-size: 12px;
    }

    .sepetim .visible-xs label {
        font-size: 13px;
    }

    .sepetim .gri {
        font-weight: normal;
    }

    .sepetim .siyah {
        font-weight: bold;
    }

.oneriler .cerceve {
    width: 125px;
    height: 125px;
    margin-right: 20px;
}

.spin {
    width: 35px;
    text-align: center;
}


.oneriler .cerceve img {
    width: 100%;
}

.oneriler label {
    font-weight: normal;
}

.oneriler .sepete-ekle p {
    position: absolute;
    color: white;
    left: 31%;
    bottom: 5%;
    font-size: 11px;
}

.oneriler {
    padding: 20px 15px 20px 15px;
}

.odemeBilgileri {
    padding: 40px 0px 15px 0px;
}

    .odemeBilgileri .panel-heading .numara {
        padding: 5px 9px;
        border-radius: 50%;
        border: 1px solid #989898;
        color: #989898;
    }

    .odemeBilgileri .panel-heading a,
    .odemeBilgileri .panel-heading a:hover {
        text-decoration: none;
        color: #989898;
    }

        .odemeBilgileri .panel-heading a:focus {
            text-decoration: none;
            color: #32302d;
        }

            .odemeBilgileri .panel-heading a:focus .numara {
                border: 1px solid #32302d;
                color: #32302d;
            }

    .odemeBilgileri .panel-default {
        border-color: transparent;
    }

.panel-default .panel-heading {
    background-color: transparent;
    padding: 20px 15px 20px 15px;
}

#kartOdeme .panel-body .kart-ile {
    position: absolute;
    color: white;
    top: 25%;
    left: 25%;
}

#kartOdeme .panel-body .havale-ile {
    position: absolute;
    color: black;
    left: 30%;
    top: 25%;
}

#havaleOdeme .panel-body .kart-ile {
    position: absolute;
    color: black;
    left: 25%;
    top: 25%;
}

#havaleOdeme .panel-body .havale-ile {
    position: absolute;
    color: white;
    top: 25%;
    left: 30%;
}

#havaleOdeme .blg {
    margin-top: 40px;
    font-size: 15px;
}

    #havaleOdeme .blg span {
        color: #0023ff;
        font-weight: bold;
    }

#havaleOdeme .hesap {
    width: 48%;
    float: left;
    min-height: 145px;
    padding-bottom: 20px;
    border-bottom: 1px solid #d2d0d0;
    padding-top: 20px;
    margin-top: 0px;
}

#havaleOdeme .hesapresim {
    width: 160px;
    float: left;
    border: 1px solid #000;
    margin: -1px;
    height: 118px;
}

#havaleOdeme .teb {
    padding: 15px 2px;
}

#havaleOdeme .enpara,
#havaleOdeme .qnb,
#havaleOdeme .ziraat {
    padding: 15px 5px;
}

#havaleOdeme .hesap:last-child {
    border-bottom: 0px;
}

#havaleOdeme .hesapnumaralari {
    width: 65%;
    float: left;
}

    #havaleOdeme .hesapnumaralari div {
        padding-left: 10px;
        padding-bottom: 8px;
    }

#havaleOdeme .bord {
    border-bottom: 1px solid #ddd;
    margin-left: -15px;
    margin-right: -15px;
}

#havaleOdeme .hesapadi {
    font-weight: 700;
}

#havaleOdeme .hesap span {
    width: 95px;
    font-weight: 700;
    display: inline-block;
    float: left;
}

    #havaleOdeme .hesap span::after {
        content: ':';
        float: right;
        padding-right: 5px;
    }

#havaleOdeme .Bsag {
    border-left: 1px solid #d2d0d0;
    padding-left: 30px;
    width: 50%;
}

#havaleOdeme .son {
    padding-left: 0px;
}


.panel-default .controls {
    padding: 0px;
}

.panel-default .no-pad {
    padding-left: 0px;
}

.panel-default .form-group p {
    text-align: right;
}

.panel-default .form-control {
    border-radius: 0px;
}

.panel-default .devam-buton {
    color: white;
    position: absolute;
    left: 28%;
    top: 20%;
    cursor: pointer;
}

.panel-default .panel-footer {
    padding: 5px;
    margin-bottom: 40px;
    text-align: right;
}

    .panel-default .panel-footer label {
        margin-right: 10px;
        color: red;
        font-weight: normal;
    }

#collapseThree .container a {
    position: relative;
}

    #collapseThree .container a > p {
        position: absolute;
        color: white;
        left: 23%;
        top: 0%;
    }

#collapseThree .container {
    text-align: center;
}

.odemeBilgileri .urun_adet {
    position: absolute;
    right: 38%;
    top: 5%;
}

.odemeBilgileri .panel-body .hizala-ozet {
    display: flex;
    align-items: center;
}

.odemeBilgileri .urun_adi,
.odemeBilgileri .fiyat {
    font-weight: normal;
}

.panel-body .bottom-border {
    border-bottom: 1px solid #dddddd;
}

.panel-body .baslik h3 {
    color: #0023ff;
    margin-top: 0px;
}

.panel-body .baslik p {
    font-size: 12px;
}

.panel-body .siparis_ozet {
    font-weight: normal;
}

.panel-body .no-pad a {
    color: #0023ff;
    font-size: 12px;
}

button:focus {
    outline: none;
}

button {
    background-color: transparent;
    border-color: transparent;
    padding: 0px;
}

.toplami-hizala {
    display: flex;
}







@media(min-width:1200px) {
    .hizala-yazilar {
        display: inline-flex;
        align-items: center;
    }
}

@media(min-width:992px) and (max-width:1199px) {
    .jumbotron-kurumsal .container,
    .jumbotron-anaSayfa-1 .container,
    .jumbotron-kurumsal-alt .container,
    .jumbotron-anaSayfa-2 .container,
    .jumbo-sorular .container {
        margin-left: -495px;
    }

    .satin-al-button span, .satin-al-button a:hover span, .satin-al-button a:focus span {
        left: calc(50% - 20px);
    }

    .jumbotron-kurumsal-alt img {
        margin-top: 15%;
    }

    .aralikli {
        left: 15%;
    }

    .md-resim {
        width: 100%;
    }

    .xxs-resim {
        width: auto;
    }

    .resimli .test h2 {
        right: 243px;
    }

    .resimli .test p {
        left: 220px;
    }

    .resimli .kurulum h2 {
        left: calc(24% + 5px);
    }

    .resimli .kurulum .yazi {
        right: 245px;
    }

    .resimli .garanti h2 {
        right: calc(25% + 20px);
    }

    .resimli .garanti p {
        left: 225px;
    }

    .resimli .ozelRenk h2 {
        left: calc(24% + 8px);
    }

    .resimli .ozelRenk p {
        right: 247px;
    }

    .adres .tablo-icerik .islemler {
        text-align: center;
    }

    .hizala-yazilar {
        display: inline-flex;
        align-items: center;
    }

    .urun-secenek .paket-adi, .urun-secenek .paket-icerik {
        width: 148px;
    }

    .sepetim .bilgi .urun_adet {
        top: 1px;
        right: 23px;
    }

    .sepetim .odeme-buton p {
        right: 16%;
    }

    .oneriler .sepete-ekle p {
        left: 38%;
    }

    .tablo-icerik .iade {
        top: 25%;
    }

    .tablo-icerik .detay {
        top: 77%;
    }

    #havaleOdeme .hesap {
        width: 100%;
        float: left;
        padding-bottom: 5px;
    }

    #havaleOdeme .hesapnumaralari div {
        padding-left: 10px;
        font-size: 12px;
    }

    #havaleOdeme .Bsag {
        padding-left: 0;
        border-left: none;
    }
}





@media(min-width:768px) and (max-width:991px) {
    .navbar-collapse .aralikli a {
        width: 100px;
    }

    .satin-al-button span, .satin-al-button a:hover span, .satin-al-button a:focus span {
        left: calc(50% - 80px);
    }

    .bayi {
        margin-top: 0px;
    }

    .aralikli {
        left: 20%;
    }

    .satin-al-button {
        text-align: right;
        padding-right: 0px;
    }

    .md-resim {
        width: 100%;
    }

    .sm-resim {
        width: 100%;
    }

    .xxs-resim {
        width: auto;
    }

    .teknik-ozellik-button {
        padding-right: 0px;
    }

    .jumbotron-kurumsal .container,
    .jumbotron-anaSayfa-1 .container,
    .jumbotron-kurumsal-alt .container,
    .jumbotron-anaSayfa-2 .container,
    .jumbo-sorular .container {
        margin-left: -375px;
    }

    .jumbotron-kurumsal-alt img {
        margin-top: 18%;
    }

    .bayilik-hizala .form-group,
    .ilt .form-group {
        margin-bottom: 0px;
    }

    .bayilik-hizala .form-control,
    .btn-select,
    .ilt .form-control {
        margin-top: 15px;
    }

    .ic {
        margin-left: 20%;
    }

    .resimli .test h2 {
        right: 132px;
    }

    .resimli .test p {
        left: 115px;
    }

    .resimli .kurulum h2 {
        left: calc(15% + 14px);
    }

    .resimli .kurulum .yazi {
        right: 128px;
    }

    .resimli .garanti h2 {
        right: calc(20% + 5px);
    }

    .resimli .garanti p {
        left: 115px;
    }

    .resimli .ozelRenk h2 {
        left: calc(15% + 17px);
    }

    .resimli .ozelRenk p {
        right: 140px;
    }

    .adres .tablo-icerik .islemler {
        text-align: left;
    }

    .hesap .anahtar-yazi {
        text-align: center;
        font-size: 13px;
        padding-top: 10px;
    }

    .hizala-yazilar {
        display: inline-flex;
        align-items: center;
    }

    .s-s-s {
        text-align: center;
    }

    .urun-secenek .cerceve {
        width: 245px;
        height: 245px;
    }

    .urun-secenek .paket-adi, .urun-secenek .paket-icerik {
        width: 148px;
    }

    .teslimat-bilgi .odeme-buton {
        left: 35%;
    }

    .sepetim .bilgi .urun_adet {
        right: 7px;
        top: 0px;
    }

    .sepetim .odeme-buton p {
        right: 7%;
    }

    .oneriler .sepete-ekle p {
        left: 25%;
    }

    .odemeBilgileri .urun_adet {
        right: 20%;
    }

    .tablo-icerik .iade {
        top: 25%;
    }

    .tablo-icerik .detay {
        top: 77%;
    }

    .ilt-gnder-btn p {
        left: calc(45% + 5px);
    }

    .tablo-baslik li {
        font-size: 10px;
    }

    .satin-al-button p, .satin-al-button a:hover p, .satin-al-button a:focus p {
        left: calc(5% - 27px);
    }

    .bayi .satin-al-button p {
        left: calc(10%);
    }

    #havaleOdeme .hesap {
        width: 100%;
        float: left;
        padding-bottom: 5px;
    }

    #havaleOdeme .hesapnumaralari div {
        padding-left: 10px;
        font-size: 12px;
    }

    #havaleOdeme .Bsag {
        padding-left: 0;
        border-left: none;
    }
}

@media(min-width:425px) and (max-width:767px) {
    .navbar-default .navbar-collapse {
        background-color: #32302d;
        border-color: #32302d;
        z-index: 1000;
        position: relative;
    }

    .satin-al-button p, .satin-al-button a:hover p, .satin-al-button a:focus p {
        left: calc(5% - 27px);
    }


    .navbar-collapse .aralikli {
        position: initial;
    }

        .navbar-collapse .aralikli a {
            width: auto;
        }

    .satin-al-button span, .satin-al-button a:hover span, .satin-al-button a:focus span {
        left: calc(50% - 75px);
        width: auto;
    }

    .navbar-default .navbar-toggle,
    .navbar-default .navbar-toggle:focus,
    .navbar-default .navbar-toggle:hover {
        background-color: #32302d;
        border-color: #32302d;
    }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #fff;
        }

    .satin-al-button span {
        top: 17%;
    }

    .satin-al-button {
        padding-left: 20px;
        text-align: initial;
    }

    .ilt-gnder-btn p {
        left: calc(50% - 30px);
    }

    .menu-alt-beyaz {
        padding-right: 10px;
    }

    .xs-resim {
        width: 100%;
    }

    .sm-resim {
        width: 100%;
    }

    .md-resim {
        width: 100%;
    }

    .xxs-resim {
        width: auto;
    }

    .jumbotron-anaSayfa-1 img {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .jumbotron-anaSayfa-2 img {
        margin-top: 0px;
        margin-bottom: 0px;
    }


    .jumbotron-anaSayfa-1 .container,
    .jumbotron-anaSayfa-2 .container,
    .jumbotron-kurumsal-alt .container,
    .jumbo-sorular .container {
        left: 10%;
        margin-left: 0%;
    }

    .ic {
        margin-left: 75px;
    }





    .menu-alt-beyaz .logo-bosluk {
        text-align: center;
        padding-top: 7px;
    }

    .isitma-sogutma {
        display: inherit;
    }

    .jumbotron-kurumsal .container {
        left: 0%;
        margin-left: 0px;
        top: 0%;
        width:100%;
    }

    .jumbotron-kurumsal img {
        margin-top: 0px;
        margin-bottom: 0px;
    }



    .jumbotron-kurumsal-alt img {
        margin-top: 45%;
        margin-bottom: 0px;
    }

    .jumbotron-kurumsal p {
        font-size: 12px;
    }

    .jumbotron-kurumsal-alt p,
    .jumbotron-kurumsal-alt a,
    .jumbotron-kurumsal-alt a:hover,
    .jumbotron-kurumsal-alt a:focus {
        font-size: 12px;
        outline: 0;
    }

    .footer .iconlar {
        text-align: center;
    }

    .navbar-default {
        height: 50px;
        position: relative;
    }

    .navbar-brand {
        padding: 8px 15px;
        float: right;
    }

    .dropdown {
        display: block;
    }

    hr {
        margin-right: 0px;
        margin-left: 0px;
    }

    .bayilik-hizala {
        display: block;
    }

        .bayilik-hizala p {
            margin-bottom: 20px;
        }

        .bayilik-hizala .form-group,
        .ilt .form-group {
            margin-bottom: 0px;
        }

        .bayilik-hizala .form-control,
        .btn-select,
        .ilt .form-control {
            margin-top: 15px;
        }

    .resimli .test h2 {
        right: 52px;
        top: 46px;
    }

    .resimli .test p {
        left: 28px;
        top: 62px;
    }

    .resimli .kurulum h2 {
        left: 35px;
        top: 48px;
    }

    .resimli .kurulum .yazi {
        right: 50px;
        top: 43px;
    }

    .resimli .garanti h2 {
        right: 68px;
        top: 43px;
    }

    .resimli .garanti p {
        top: 60px;
        left: 22px;
    }

    .resimli .ozelRenk h2 {
        left: 43px;
        top: 50px;
    }

    .resimli .ozelRenk p {
        right: 50px;
        top: 60px;
    }

    .hesap .anahtar-yazi {
        text-align: center;
        font-size: 13px;
        padding-top: 10px;
    }

    .baslik .sag p {
        font-size: 12px;
    }

    .hizala-yazilar {
        display: contents;
    }

    .renk-secenek ul > li {
        margin-right: 20px;
    }

    .s-s-s h3 {
        font-size: 20px;
    }

    .s-s-s {
        text-align: center;
    }

    .urun-secenek .hizala {
        display: block;
    }

    .teslimat-bilgi .odeme-buton {
        left: 34%;
        top: 30%;
        font-size: 13px;
    }

    .sepetim .hizala {
        display: block;
    }

    .sepetim .detay .hizala {
        display: inline-flex;
    }

    .sepetim .cerceve {
        text-align: center;
    }

    .sepetim .sepet-icerik,
    .sepetim .bilgi,
    .sepetim .detay {
        padding-left: 0px;
        padding-right: 0px;
    }

    .sepetim .odeme-buton p {
        right: 7%;
    }

    .oneriler .sepete-ekle p {
        left: 38%;
    }

    .panel-default .form-group p {
        text-align: left;
    }

    .panel-default .no-pad {
        padding-left: 5px;
    }

    .odemeBilgileri .panel-body .hizala-ozet {
        display: block;
    }

    .odemeBilgileri .urun_adet {
        right: 15%;
    }

    .resimli h1 {
        font-weight: bold;
        margin-top: 40px;
        text-align: center;
        color: white;
        font-size: 26px;
    }

    .resimli p {
        font-size: 13px;
    }

    .resimli .test h3 {
        color: #2add5a;
    }

    .resimli .test p {
        color: white;
        position: relative;
        font-size: 12px;
        top: 0px;
        left: 0px;
        text-align: left;
        width: auto;
    }

    .resimli .kurulum h3 {
        color: #05819a;
    }

    .resimli .kurulum .yazi {
        color: white;
        position: relative;
        right: 0px;
        top: 0px;
        width: auto;
        font-size: 12px;
        text-align: left;
    }

    #havaleOdeme .hesap {
        width: 100%;
        float: left;
        padding-bottom: 5px;
    }

    #havaleOdeme .hesapresim {
        width: 30%;
        height: auto;
    }

    #havaleOdeme .hesapnumaralari div {
        padding-left: 10px;
        font-size: 12px;
    }

    #havaleOdeme .Bsag {
        padding-left: 0;
        border-left: none;
    }

    .resimli .garanti h3 {
        color: #fb9c26;
    }

    .resimli .garanti p {
        top: 0px;
        left: 0px;
        width: auto;
        position: relative;
        font-size: 12px;
        text-align: left;
    }

    .resimli .ozelRenk h3 {
        color: #c8342d;
    }

    .resimli .ozelRenk p {
        right: 0px;
        top: 0px;
        position: relative;
        width: auto;
        text-align: left;
        font-size: 12px;
    }

    .sorular h2 {
        font-size: 18px;
    }

    .sorular > .panel-heading a:after {
        font-size: 13px;
    }

    .adres .tablo-icerik .islemler {
        text-align: center;
    }

    .navbar-brand {
        padding: 8px 15px;
        position: absolute;
        left: calc(40% + 7px);
    }

    .yeniler {
        float: right;
        margin-top: 10px;
    }

        .yeniler .icon-wrapper {
            width: 30px;
            height: 30px;
        }

            .yeniler .icon-wrapper img {
                width: 100%;
            }

    .resim-orta {
        text-align: center;
    }

    .dropdown-menu {
        left: auto;
        right: 0px;
    }

    .bayi .satin-al-button p {
        position: absolute;
        color: white;
        font-weight: bold;
        left: calc(10% + 5px);
        top: calc(50% + 13px);
        width: auto;
    }

    .teknik-ozellik-button a,
    .teknik-ozellik-button a:hover,
    .teknik-ozellik-button a:focus {
        font-size: 12px;
        padding-top: 7px;
    }
}

@media(max-width:650px) {
    .satin-al-button span, .satin-al-button a:hover span, .satin-al-button a:focus span {
        left: calc(50% - 27px);
    }
}



@media(max-width:424px) {
     .rulo {
        left: 0px!important;
        top: 0px!important;
    }

    .volt {
       left: 0px!important;
        top: 0px!important;
    }

    .ortu {
     left: 0px!important;
        top: 0px!important;
    }

    .baski {
       left: 0px!important;
        top: 0px!important;
    }

    .buton {
      left: 0px!important;
        top: 0px!important;
    }

    .balon-rulo {
    left: 0px!important;
        top: 0px!important;
    }

    .balon-baski {
       left: 0px!important;
        top: 0px!important;
    }

    .balon-buton {
    left: 0px!important;
        top: 0px!important;
    }

    .balon-ortu {
      left: 0px!important;
        top: 0px!important;
    }

    .balon-volt {
     left: 0px!important;
        top: 0px!important;
    }



    .navbar-default .navbar-collapse {
        background-color: #32302d;
        border-color: #32302d;
        z-index: 1000;
        position: relative;
    }

    .adres .tablo-icerik .islemler {
        text-align: center;
    }


    .navbar-collapse .aralikli {
        position: initial;
    }

        .navbar-collapse .aralikli a {
            width: auto;
        }

    .navbar-default .navbar-toggle,
    .navbar-default .navbar-toggle:focus,
    .navbar-default .navbar-toggle:hover {
        background-color: #32302d;
        border-color: #32302d;
    }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #fff;
        }

    #havaleOdeme .hesap {
        width: 100%;
        float: left;
        padding-bottom: 5px;
    }

    #havaleOdeme .hesapnumaralari div {
        padding-left: 10px;
        font-size: 12px;
    }

    #havaleOdeme .Bsag {
        padding-left: 0;
        border-left: none;
    }

    #havaleOdeme .hesapresim {
        width: 30%;
        height: 85px;
    }

    .dropdown-menu {
        left: auto;
        right: 0px;
    }

    .jumbotron-kurumsal .container {
        left: 0%;
        margin-left: 0px;
        top: 0%;
        width:100%;
    }

    .jumbotron-kurumsal img {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .jumbotron-kurumsal p {
        font-size: 12px;
        padding-top: 0px;
        text-align: justify;
    }
    .jumbotron-kurumsal .center{
        text-align:center;
        padding-top:20px;
    }

    .jumbotron-kurumsal-alt p,
    .jumbotron-kurumsal-alt a,
    .jumbotron-kurumsal-alt a:hover,
    .jumbotron-kurumsal-alt a:focus {
        font-size: 12px;
        outline: 0;
    }

    .bayi .pd-no {
        padding: 0px;
    }

    .bayi .satin-al-button p {
        position: absolute;
        color: white;
        font-weight: bold;
        left: calc(10% + 3px);
        top: calc(50% + 13px);
        width: auto;
    }

    .jumbotron-kurumsal h4 {
        font-size: 23px;
        margin-top: 0px;
        margin-bottom: 1px;
    }

    .jumbotron-kurumsal h1 {
        font-size: 35px;
        margin-top: 5px;
        margin-bottom: 0px;
    }

    .jumbo-sorular h1 {
        font-size: 25px;
    }

    .jumbo-sorular p {
        font-size: 14px;
    }

    .jumbotron-kurumsal-alt .container {
        left: 0%;
        margin-left: 0px;
        top: 0%;
    }

    .jumbotron-kurumsal-alt img {
        margin-top: 75%;
    }


    .jumbotron-anaSayfa-1 .container,
    .jumbotron-anaSayfa-2 .container,
    .jumbo-sorular .container {
        left: 0%;
        margin-left: 0%;
    }

    .jumbotron-anaSayfa-1 img {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .jumbotron-anaSayfa-2 img {
        margin-top: 0px;
        margin-bottom: 0px;
    }

    .xs-resim {
        width: 100%;
    }

    .sm-resim {
        width: 100%;
    }

    .md-resim {
        width: 100%;
    }

    .xxs-resim {
        width: 100%;
    }


    .isitma-sogutma {
        display: inherit;
    }

    .satin-al-button {
        padding-right: 0px;
    }

    .teknik-ozellik-button a,
    .teknik-ozellik-button a:hover,
    .teknik-ozellik-button a:focus {
        font-size: 12px;
        padding-top: 7px;
    }

    .teknik-ozellik-button {
        padding-left: 0px;
    }

    .menu-alt-beyaz .logo-bosluk {
        text-align: center;
        padding-top: 7px;
        padding-left: 0px;
    }

    .menu-alt-beyaz .container {
        padding: 0px;
    }

    .footer .iconlar {
        text-align: center;
    }

    .navbar-default {
        height: 50px;
        position: relative;
    }

    .navbar-brand {
        padding: 8px 15px;
        position: absolute;
        left: calc(40% + 7px);
    }

    .yeniler {
        float: right;
        margin-top: 10px;
    }

        .yeniler .icon-wrapper {
            width: 30px;
            height: 30px;
        }

            .yeniler .icon-wrapper img {
                width: 100%;
            }

    .dropdown {
        display: block;
    }

    hr {
        margin-right: 0px;
        margin-left: 0px;
    }

    .bayilik-hizala {
        display: block;
    }

        .bayilik-hizala p {
            margin-bottom: 20px;
        }

        .bayilik-hizala .form-group,
        .ilt .form-group {
            margin-bottom: 0px;
        }

        .bayilik-hizala .form-control,
        .btn-select,
        .ilt .form-control {
            margin-top: 15px;
        }

    .ic {
        margin-left: 0%;
    }

    .hesap .anahtar-yazi {
        text-align: center;
        font-size: 13px;
        padding-top: 10px;
    }

    .renk-secenek ul > li {
        margin-right: 15px;
    }


    .renk-kartela {
        padding-left: 0px;
        padding-right: 0px;
    }

    .s-s-s h3 {
        font-size: 18px;
    }

    .s-s-s {
        text-align: center;
    }

    .resimli h1 {
        font-weight: bold;
        margin-top: 40px;
        text-align: center;
        color: white;
        font-size: 26px;
    }

    .resimli p {
        font-size: 13px;
    }

    .resimli .test h3 {
        color: #2add5a;
    }

    .resimli .test p {
        color: white;
        position: relative;
        font-size: 12px;
        top: 0px;
        left: 0px;
        text-align: left;
        width: auto;
    }

    .resimli .kurulum h3 {
        color: #05819a;
    }

    .resimli .kurulum .yazi {
        color: white;
        position: relative;
        right: 0px;
        top: 0px;
        width: auto;
        font-size: 12px;
        text-align: left;
    }

    .resimli .garanti h3 {
        color: #fb9c26;
    }

    .resimli .garanti p {
        top: 0px;
        left: 0px;
        width: auto;
        position: relative;
        font-size: 12px;
        text-align: left;
    }

    .resimli .ozelRenk h3 {
        color: #c8342d;
    }

    .resimli .ozelRenk p {
        right: 0px;
        top: 0px;
        position: relative;
        width: auto;
        text-align: left;
        font-size: 12px;
    }

    .urun-secenek .hizala {
        display: block;
    }

    .paket-adi strong {
        font-size: 45px;
    }

    .paket-secenek .standart-paket .paket-adi,
    .paket-secenek .extra-paket .paket-adi,
    .paket-secenek .premium-paket .paket-adi {
        font-size: 16px;
    }

    .urun-secenek .standart-paket .paket-adi {
        height: 60px;
        width: 85px;
    }

    .urun-secenek .extra-paket .paket-adi,
    .urun-secenek .premium-paket .paket-adi {
        width: 63px;
        height: 60px;
    }

    .urun-secenek .standart-paket .paket-icerik {
        width: 105px;
        height: 60px;
    }

    .urun-secenek .premium-paket .paket-icerik,
    .urun-secenek .extra-paket .paket-icerik {
        height: 60px;
        width: 130px;
    }

    .paket-icerik {
        font-size: 11px;
    }

    .paket-secenek {
        padding: 0px;
        margin-top: 50px;
    }

    .standart-paket .paket-fiyat p,
    .extra-paket .paket-fiyat p,
    .premium-paket .paket-fiyat p {
        font-size: 11px;
    }

    .paket-fiyat b {
        font-size: 11px;
    }

    .urun-secenek .cerceve {
        width: 250px;
        height: 250px;
        margin-left: 40px;
    }

    .bayi-baslik {
        padding: 0px;
    }

        .bayi-baslik p {
            text-align: justify;
        }

    .menu-alt-devam {
        padding-right: 0px;
    }

    .teslimat-bilgi .odeme-buton {
        left: 27%;
        font-size: 11px;
    }

    .teslimat-bilgi h3 {
        font-size: 17px;
    }

    .teslimat-bilgi .siparis_ozet {
        font-size: 13px;
    }

    .teslimat-bilgi a, .teslimat-bilgi a:hover, .teslimat-bilgi a:focus {
        font-size: 11px;
    }

    .sepetim .hizala {
        display: block;
    }

    .sepetim .detay .hizala {
        display: inline-flex;
    }

    .sepetim .cerceve {
        text-align: center;
    }

    .sepetim .sepet-icerik,
    .sepetim .bilgi,
    .sepetim .detay {
        padding-left: 0px;
        padding-right: 0px;
    }

    .sepetim .odeme-buton p {
        right: 16%;
    }

    .oneriler .sepete-ekle p {
        left: 45%;
        bottom: -2%;
    }

    .panel-default .form-control {
        padding: 4px 8px;
    }

    .panel-default .form-group p {
        text-align: left;
    }

    #kartOdeme .panel-body .kart-ile {
        top: calc(15% + 4px);
        left: calc(50% - 39px);
        font-size: 12px;
    }

    #kartOdeme .panel-body .havale-ile {
        left: calc(50% - 32px);
        top: calc(15% + 4px);
        font-size: 12px;
    }

    #havaleOdeme .panel-body .kart-ile {
        top: calc(15% + 4px);
        left: calc(50% - 39px);
        font-size: 12px;
    }

    #havaleOdeme .panel-body .havale-ile {
        left: calc(50% - 32px);
        top: calc(15% + 4px);
        font-size: 12px;
    }



    .panel-default .no-pad {
        padding-left: 5px;
    }

    .odemeBilgileri .panel-body .hizala-ozet {
        display: block;
    }

    .sorular h2 {
        font-size: 18px;
    }

    .sorular > .panel-heading a:after {
        font-size: 13px;
    }

    .ilt-gnder-btn p {
        left: calc(50% - 30px);
    }

    .toplami-hizala {
        display: flex;
        align-items: flex-end;
    }

    .resim-orta {
        text-align: center;
    }

    .satin-al-button span, .satin-al-button a:hover span, .satin-al-button a:focus span {
        left: calc(50% - 75px);
    }
}