* {
    padding: 0;
    margin: 0;
    outline: none;
    box-sizing: border-box;
}

body {
    font-family: MasionNeue;
    height: 100vh !important;
    color: black !important;
}
.row{
    margin-right: 0px !important; 
    margin-left: 0px !important;
}

    a:focus{
        outline: 0 !important;
        box-shadow: none !important;
}
/*----------- İNDEX.HTML START ------------- */
.banner{
    background-color: #F3F6F7;
    
}

.banner-text{
    display: flex;
    justify-content: center;
    font-size: large;
}
@media screen and (min-width:992px) {
    .logo{
        display: flex;
    justify-content: center;
    width: 100% !important;
    }
    .logos{
        display: none;
    }
}
@media screen and (max-width:991px) {
    .logo{
        display: none;
    }

}


.container-main {
    width: 100%;
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
    margin-right: auto;
    margin-left: auto;
    max-width: 1650px;
}

@media screen and (max-width:576px) {
    .flex-main{
        display: flex;
        flex-direction: column;
    }
     .row-cols-2>* {
        flex: 0 0 auto;
        width: 100%;
    } 
}
.text-banner-1{
    position: absolute;
    color: white;
    font-size: 25px;
    font-weight: 300;
   top: 0;
   margin-top: 5%;
   margin-left: 5%;
   font-family: Perfectlynineties;
}
.text-banner-2{
    position: absolute;
    color: white;
    font-size: 25px;
    font-weight: 300;
   bottom: 0px;
margin-left: 5%;
}
.text-banner-3{
    position: absolute;
    color: #ffffff;
    font-size: 25px;
    font-weight: 300;
    text-align: center;
    left: 42%;
    bottom: 20px;
    font-family: Perfectlynineties;
}
@media screen and (max-width:768px) {
    .text-banner-1,
    .text-banner-2,
    .text-banner-3{
        font-size: 15px;
    }
}
.text-box{
    text-align: center;
    background-color: #F5F3EE;
    padding: 20px;
    font-size: 22px;
}
@media screen and (max-width:768px) {
    .text-box{
        font-size: 16px;
    }
    .learn-button{
        font-size: 16px !important;
    }
}
.box-align{
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
    margin-right: auto;
    margin-left: auto;
}
@media screen and (min-width:768px)
{
.text-end-main{
    text-align: end;
}
}
.text-main-link{
    color: black;
    font-size: 15px;
}
.form-control-main{
    background-color: transparent;
    border: transparent;
    
}
.form-control-main:focus{
    color: #212529 !important;
    background-color: transparent !important;
    border-color: transparent !important;
    outline: 0 !important;
    box-shadow:none !important;
}
.input-button:focus,
.input-button{
    background-color: transparent;
    border: transparent;
    outline: 0 !important;
    box-shadow:none !important;
}
.learn-button:hover,
.learn-button{
    color: black;
    text-decoration: none;
    border-bottom: 1px solid #000;
    font-size: 18px;
}
.text-start-main{
    text-align: left;
    display: flex;
    flex-direction: column;
    
}
@media screen and (max-width:768px) {
    .text-start-main{
        text-align: center !important;
        align-items: center;
    }
}
.footer-text-main{
    display: flex;
    justify-content: space-between;
}
.main-width{
    width: 40%;
}
@media screen and (max-width:650px) {
    .footer-text-main{
        display: flex;
        flex-direction: column;
    }
    .main-width{
        width: 100%;
    }
}
@media screen and (min-width:992px) {

    .main-width-menu{
        width: 40%;
        display: flex !important;
        align-items: start;
    }
    .like-text{
        display: none;
    }
}
@media screen and (max-width:992px) {
    .like-button{
        display: none;
    }
}

.navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
   box-shadow: none;
}
.slider-text{
    display: flex !important;
    flex-direction: column;
    align-items: start;
    right: 0px;
    left: 5%;
    margin-bottom: 30px;
  
}
.slider-text h3{
    font-family: Perfectlynineties;
    font-weight: 300;
}
.slider-text p{
    font-size: 20.5px;
}
.indicators-main{
    right: auto;
    margin-left: 5.5%;
}

.circle-dashed.active{
    width: 10px !important;
 height: 10px !important;
 border-radius: 50% !important;
 transition: var(--transition) !important;
 overflow: hidden !important;
 position: relative !important;
 padding: 7px !important;
 background-color: transparent !important;
 border: 2px solid white !important;
 outline-offset: -13px !important;
}
.circle-dashed{
    width: 10px !important;
 height: 10px !important;
 border-radius: 50% !important;
 transition: var(--transition) !important;
 overflow: hidden !important;
 position: relative !important;
 padding: 7px !important;
 background-color: transparent !important;
 border:transparent !important;
 outline-offset: -13px !important;
}
.circle{
   width: 100%;
   height: 100%;
   background-color: white;
   border-radius: inherit;
   
}
@media screen and (max-width:768px) {
    .slider-text{
        display: none !important;
    }
    .circle-dashed.active{
        width: 3px !important;
     height: 3px !important;
     border-radius: 50% !important;
     transition: var(--transition) !important;
     overflow: hidden !important;
     position: relative !important;
     padding: 4px !important;
     background-color: transparent !important;
     border: 2px solid white !important;
     outline-offset: -13px !important;
    }
    .circle-dashed{
        width: 5px !important;
     height: 5px !important;
     border-radius: 50% !important;
     transition: var(--transition) !important;
     overflow: hidden !important;
     position: relative !important;
     padding: 7px !important;
     background-color: transparent !important;
     border:transparent !important;
     outline-offset: -13px !important;
    }
    .circle{
       width: 100%;
       height: 100%;
       background-color: white;
       border-radius: inherit;
       
    }
    
}
@media screen and (max-width:906px) {
    .br{
        display: none;
    }
}
.border-bottom-main{
    border-bottom: 1px solid #000;
}
.form-control-main::placeholder{
    color: #00000041;
}
.nav-link:hover{
    color: #000;
}
.header-text{
    font-size: 20px;
}
@media screen and (max-width:768px) {
    
.header-text{
    font-size: 16px;
}
}

/*----------- İNDEX.HTML END ------------- */


/*----------- PRODUCT-PAGE.HTML START ------------- */
.product-link{
    background-color: transparent;
    border: transparent;
    padding: 0.5rem;
}
.check-main{
    background-color: #F2F3F4;
    width: 100%;
    padding: 20px 30px 20px 40px;
}
.form-check-input[type=checkbox] {
    border-radius: 0px;
    border: 1px solid black;
    width: 20px;
    height: 20px;

}
.btn-black:hover,
.btn-black{
    background-color: #231F20;
    color: #fff;
    width: 100%;
    border-radius: 0px;
}
.product-info{
    width: 70px;
}
@media screen and (max-width:960px) {
    .product-info{
        width: 41px;
        height: 41px;
    }
    
}
.product-info-text{
    font-size: 17px;
}
@media screen and (max-width:1100px){
    .product-info-text{
        font-size: 14px !important;
    }
}
.accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-plus' viewBox='0 0 16 16'%3E%3Cpath d='M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z'/%3E%3C/svg%3E");
    opacity: 0.5;
    transition: all 0.5s;
}
.accordion-button:not(.collapsed)::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' class='bi bi-dash' viewBox='0 0 16 16'%3E%3Cpath d='M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8z'/%3E%3C/svg%3E");
}
.control-main,
.select-main{
border: 1px solid black;
border-radius: 0px;
}
.accordion-button:not(.collapsed) {
    color: #000000;
    background-color: #ffffff;
    box-shadow: none !important;
}
.accordion-button:focus {
    box-shadow: none !important;

}
.form-check-input:checked {
    background-color: #2e2e2e;
}
.accordion-button-collapse:after{
    display: none !important ;
 }

.banner-title-blue{
color:  #3C52A3;
font-family: GT Pressura Mono;
font-weight: 700;
}
.banner-title-red{
    color:  #AC1F2E;
    font-family: GT Pressura Mono;
    font-weight: 700;
}
.banner-title-green{
    color:  #0D9344;
    font-family: GT Pressura Mono;
    font-weight: 700;
}
.banner-title-purple{
    color:  #902691;
    font-family: GT Pressura Mono;
    font-weight: 700;
}
.banner-big-title{
    font-family: Muller;
    font-weight: 800;
    font-size: 40px;
    line-height: 45px;
}
@media screen and (max-width:768px) {
    .banner-big-title{
        font-family: Muller;
        font-weight: 800;
        font-size: 25px;
        line-height: 30px;
    }
}
.img-banner{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

@media screen and (max-width:1000px) {
    .banner-big-title {
        font-size: 22px;
        line-height: 30px;
    }
}
/* @media screen and (max-width:1200px){
    .img-banner{
        width: 100%;
        height: 75%;
    }  
} */
/*----------- PRODUCT-PAGE.HTML END ------------- */




/* MİNUS PLUS */

.quantity {
    display: inline-block;
margin-right: 20px;
}
   
   .quantity .input-text.qty {
    width: 35px;
    height: 44px;
    padding: 0 5px;
    text-align: center;
    background-color: transparent;
    border: 1px solid #4a4a4a;
   }
   
   .quantity.buttons_added {
    text-align: left;
    position: relative;
    white-space: nowrap;
    vertical-align: top; }
   
   .quantity.buttons_added input {
    display: inline-block;
    margin: 0;
    vertical-align: top;
    box-shadow: none;
   }
   
   .quantity.buttons_added .minus,
   .quantity.buttons_added .plus {
    padding: 0px 10px 8px;
    height: 22px;
    background-color: #ffffff;
    border: 1px solid #4a4a4a;
    cursor:pointer;}
   
   .quantity.buttons_added .minus {
    border-left: 0; 
    border-top: 0;
    }
   
   .quantity.buttons_added .plus {
    border-left: 0; }
   
   .quantity.buttons_added .minus:hover,
   .quantity.buttons_added .plus:hover {
    background: #eeeeee; }
   
   .quantity input::-webkit-outer-spin-button,
   .quantity input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    margin: 0; }
    
    .quantity.buttons_added .minus:focus,
   .quantity.buttons_added .plus:focus {
    outline: none; }