::-webkit-scrollbar {
    height     : 12px;
    width      : 9px;
    background : #e3e3e3;
}
::-webkit-scrollbar-thumb {
    background            : #004bae;
    -webkit-border-radius : 1ex;
    /* -webkit-box-shadow: 0px 1px 2px rgb(0 0 0 / 28%); */
}
::-webkit-scrollbar-corner {
    background : #e91d1d;
}
.scrollable {
    max-width  : 200px;
    max-height : 100%;
    height     : 450px;
    /* change ` overflow: scroll ` to ` overflow: auto ` if you only want vertical scroll */
    overflow   : scroll;
}
.page-template-kendin-tasarla .main-page-wrapper > .container {
    width     : 100% !important;
    max-width : inherit;
}
.kendin_tasarla_page {
    float : left;
    width : 100%;
}
/* KENDIN TASARLA HEADER */
.kendin_tasarla_page .kendin_tasarla_header {
    float : left;
    width : 100%;
    /* margin-bottom : 30px; */
}
.kendin_tasarla_page .kendin_tasarla_header .container {
    /*border-bottom  : 2px solid #70707033;*/
    padding-bottom : 20px;
}
.kendin_tasarla_page .kendin_tasarla_header .page_title {
    float       : left;
    width       : 100%;
    font-size   : 36px;
    font-weight : 700
}
.kendin_tasarla_page .kendin_tasarla_header .page_content {
    float     : left;
    width     : 100%;
    font-size : 16px
}
.kendin_tasarla_page .kendin_tasarla_header .page_content strong {
    color : #000
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps {
    float           : left;
    width           : 100%;
    display         : flex;
    justify-content : center;
    align-items     : center;
    flex-wrap       : nowrap;
    margin-top      : 70px
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step {
    float    : left;
    width    : 100%;
    position : relative
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step:after {
    content     : "\f061";
    font-family : "font awesome 5 free";
    font-weight : 900;
    position    : absolute;
    right       : -5px
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step:last-child:after {
    content : none
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .step_all {
    float          : left;
    width          : 85px;
    color          : #000;
    margin-right   : 6px;
    margin-top     : 27px;
    font-size      : 16px;
    letter-spacing : 0
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .step_all strong {
    font-weight : 700
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step .kendin_tasarla_step_text {
    float      : left;
    width      : 100%;
    text-align : center;
    color      : #ebebeb
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step.active .kendin_tasarla_step_text {
    color : #006fbb
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step .kendin_tasarla_step_border {
    float  : left;
    width  : 100%;
    border : 2px solid #ebebeb
}
.kendin_tasarla_page .kendin_tasarla_header .kendin_tasarla_steps .kendin_tasarla_step.active .kendin_tasarla_step_border {
    border-color : #006fbb
}
/* KENDIN TASARLA HEADER */
/* KENDIN TASARLA GALLERY */
.kendin_tasarla_gallery {
    float : left;
    width : 100%
}
.kendin_tasarla_gallery .kendin_tasarla_gallery_title {
    float       : left;
    width       : 100%;
    font-size   : 22px;
    font-weight : bolder;
    text-align  : center;
    color       : #006fbb
}
.kendin_tasarla_gallery_images {
    float         : left;
    width         : 100%;
    margin-top    : 20px;
    margin-bottom : 20px;
}
.kendin_tasarla_gallery_images .kendin_tasarla_gallery_image {
    float : left;
    width : 100%
}
.kendin_tasarla_gallery_images .kendin_tasarla_gallery_image {
    float : left;
    width : 100%
}
.kendin_tasarla_gallery_images .kendin_tasarla_gallery_image img {
    float         : left;
    width         : 100%;
    height        : 250px;
    object-fit    : cover;
    border-radius : 15px
}
/* KENDIN TASARLA GALLERY */
/* KENDIN TASARLA COLOURS */
.kendin_tasarla_colours {
    float          : left;
    width          : 100%;
    /* height         : 200px; */
    /* background     : #f9fafb; */
    padding-top    : 20px;
    padding-bottom : 20px;
    overflow-y     : hidden;
}
.kendin_tasarla_colours .kendin_tasarla_content {
    float           : left;
    width           : 100%;
    /* display         : flex; */
    flex-wrap       : wrap;
    justify-content : space-between;
    align-items     : flex-end;
}
.kendin_tasarla_colours .kendin_tasarla_colour_search {
    float     : left;
    min-width : 200px;
    width     : 200px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_filter {
    float : left;
}
.kendin_tasarla_colours .kendin_tasarla_colour_filter .colour_filter_content {
    float        : left;
    margin-right : 30px;
    height       : 38px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_filter .colour_filter_content label {
    float       : left;
    line-height : 37px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_filter .colour_filter_content label input {
    float : left;
}
.kendin_tasarla_colours .kendin_tasarla_colour_search label {
    position : relative;
    float    : left;
    color    : #006fbb;
    width    : 100%;
}
.kendin_tasarla_colours .kendin_tasarla_colour_search label strong {
    font-weight : 700
}
.kendin_tasarla_colours .kendin_tasarla_colour_search .kendin_tasarla_colour_search_input {
    width  : 100%;
    border : 1px solid #006fbb;
    color  : #006fbb;
    height : 36px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_search .kendin_tasarla_colour_search_input_content {
    width    : 100%;
    color    : #006fbb;
    position : relative;
    /* display  : table-cell; */
}
.kendin_tasarla_colours .kendin_tasarla_colour_search .kendin_tasarla_colour_search_input_content:after {
    content     : "\f002";
    font-family : "font awesome 5 free", serif;
    font-weight : 900;
    position    : absolute;
    right       : 9px;
    top         : 37px;
    color       : #006fbb
}
.kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content {
    float           : right;
    text-align      : right;
    display         : flex;
    align-items     : center;
    flex-direction  : row;
    margin-top      : 20px;
    justify-content : flex-end;
}
.kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content .kendin_tasarla_selected_colour_list_text {
    float        : left;
    text-align   : right;
    margin-right : 10px;
    color        : #006fbb
}
.kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content .kendin_tasarla_selected_colour_list_text strong {
    font-weight : bolder
}
.kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content .kendin_tasarla_selected_colour_list {
    float           : right;
    width           : auto;
    display         : flex;
    flex-direction  : row;
    flex-wrap       : nowrap;
    justify-content : space-around;
}
.kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content .kendin_tasarla_selected_colour_list .colour {
    float         : left;
    width         : 36px;
    height        : 36px;
    border-radius : 5px;
    margin        : 0 5px
}
.kendin_tasarla_colours .kendin_tasarla_colour_list {
    float          : left;
    width          : 100%;
    border-top     : 1px solid #70707033;
    margin-top     : 20px;
    padding-top    : 20px;
    position       : relative;
    padding-bottom : 60px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content {
    float                 : left;
    width                 : 100%;
    max-height            : 321px;
    overflow-y            : scroll;
    -webkit-transition    : all 2s;
    -moz-transition       : all 2s;
    -ms-transition        : all 2s;
    -o-transition         : all 2s;
    transition            : all 2s;
    /* overflow           : hidden; */
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(min(180px, 100%), 1fr));
    grid-gap              : 10px;
    flex-wrap             : wrap;
    justify-content       : center;
    /* column-gap         : 2%; */
    /* row-gap            : 24px; */
    padding-top           : 10px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content.open {
    height          : auto !important;
    /* -webkit-transition : all 2s; */
    -moz-transition : all 2s;
    -ms-transition  : all 2s;
    -o-transition   : all 2s;
    /* transition         : all 2s; */
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content {
    float           : left;
    width           : 100%;
    /* margin: 10px 10px; */
    border-style    : solid;
    border-width    : 1px;
    padding         : 10px;
    border-radius   : 8px;
    display         : flex;
    cursor          : pointer;
    user-select     : none;
    /* box-shadow      : inset 0px 0px 20px 4px #ebebeb; */
    text-shadow     : 0px 0px 0px #999;
    justify-content : flex-start;
    align-items     : center;
    border-color    : #999 !important;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content:nth-child(5n+1) {
    /*     margin-left : 0 !important */
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content:nth-child(5n+5) {
    /* margin-right : 0 !important; */
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content.selected {
    box-shadow : 0px 0px 9px -2px #858585;
    /* border-width: 2px !important; */
    background : #f3f3f3;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content.selected .colour_select_chk:after {
    content     : "\f00c";
    font-family : "font awesome 5 free", serif;
    font-weight : 900;
    position    : absolute;
    right       : 9px;
    top         : 6px;
    color       : #fff;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content .colour_select_chk {
    float         : left;
    width         : 36px;
    height        : 36px;
    border-radius : 5px;
    position      : relative
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_list_content .colour_content .colour_name {
    float       : left;
    margin-left : 10px;
    font-weight : bolder;
    font-size   : 13px;
    color       : #999;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_show_more_btn_content {
    float      : left;
    width      : 100%;
    text-align : center;
    position   : absolute;
    bottom     : -21px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_show_more_btn_content:before {
    content    : "";
    width      : 107%;
    height     : 74px;
    background : inherit;
    position   : absolute;
    left       : -11px;
    bottom     : 0;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_show_more_btn_content .kendin_tasarla_colour_show_more_btn {
    padding       : 10px 20px;
    background    : #fff;
    box-shadow    : 0 5px 10px 0 #00000014;
    border-radius : 10px;
    border        : 1px solid #7070705c;
    font-weight   : bolder !important;
    font-size     : 14px;
    margin-bottom : 20px;
    text-indent   : 10px;
}
.kendin_tasarla_colours .kendin_tasarla_colour_list .kendin_tasarla_colour_show_more_btn_content .kendin_tasarla_colour_show_more_btn i {
    margin-left : -15px;
}
/* KENDIN TASARLA COLOURS */
/* KENDIN TASARLA SELECTED COLOURS BALLOONS */
.kendin_tasarla_selected_colour_show_balloons {
    float          : left;
    width          : 100%;
    background     : #f9fafb;
    padding-bottom : 20px;
    padding-top    : 20px;
    position       : relative;
}
.kendin_tasarla_selected_colour_show_balloons .please_waiting {
    position        : absolute;
    top             : 0;
    bottom          : 0;
    left            : 0;
    right           : 0;
    background      : #ffffffb3;
    text-align      : center;
    height          : auto;
    z-index         : 9;
    vertical-align  : middle;
    display         : none;
    align-items     : center;
    justify-content : center;
    font-weight     : bold;
    color           : #000;
}
.kendin_tasarla_selected_colour_show_balloons .container {
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_selected_colour_show_balloons_title {
    float       : left;
    width       : 100%;
    font-size   : 20px;
    color       : #000;
    font-weight : 900;
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list {
    float                 : left;
    width                 : 100%;
    display               : grid;
    grid-template-columns : repeat(auto-fit, minmax(min(150px, 100%), 1fr));
    grid-gap              : 10px;
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list .kendin_tasarla_balloon {
    float          : left;
    width          : calc(calc(100% / 4) - 30px);
    margin         : 15px;
    background     : #fff;
    border-radius  : 10px;
    box-shadow     : 0px 0px 8px 3px #eee;
    padding-bottom : 20px;
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list .kendin_tasarla_balloon .kendin_tasarla_balloon_img {
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list .kendin_tasarla_balloon .kendin_tasarla_balloon_img img {
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list .kendin_tasarla_balloon .kendin_tasarla_balloon_name {
    float       : left;
    width       : 100%;
    text-align  : center;
    font-size   : 12px;
    font-weight : 900;
    color       : #000;
}
.kendin_tasarla_selected_colour_show_balloons .container .kendin_tasarla_balloons_list .kendin_tasarla_balloon .kendin_tasarla_balloon_product_link {
    float       : left;
    width       : 100%;
    text-align  : center;
    font-size   : 12px;
    font-weight : 900;
    color       : #000;
}
/* KENDIN TASARLA SELECTED COLOURS BALLOONS */
/* KENDIN TASARLA SELECTED COLOURS BALLOONS */
.kendin_tasarla_selected_colour_show_presentations {
    float          : left;
    width          : 100%;
    /* background     : #f9fafb; */
    padding-bottom : 20px;
    padding-top    : 20px;
    position       : relative;
}
.kendin_tasarla_selected_colour_show_presentations .please_waiting {
    position        : absolute;
    top             : 0;
    bottom          : 0;
    left            : 0;
    right           : 0;
    background      : #ffffffb3;
    text-align      : center;
    height          : auto;
    z-index         : 9;
    vertical-align  : middle;
    display         : none;
    align-items     : center;
    justify-content : center;
    font-weight     : bold;
    color           : #000;
}
.kendin_tasarla_selected_colour_show_presentations .container {
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_selected_colour_show_presentations_title {
    float       : left;
    width       : 100%;
    font-size   : 20px;
    color       : #000;
    font-weight : 900;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list {
    float                 : left;
    width                 : 100%;
    display               : grid;
    grid-template-columns: repeat(auto-fit, minmax(min(140px, 100%), 1fr));
    grid-gap              : 10px;
    margin-bottom         : 30px;
    margin-top            : 20px;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon {
    float         : left;
    width         : 100%;
    border-radius : 10px;
    box-shadow    : 0 0 8px 3px #eee;
    overflow      : hidden;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon .kendin_tasarla_balloon_img {
    float         : left;
    border-radius : 10px;
    overflow      : hidden;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon .kendin_tasarla_balloon_img img {
    object-fit    : cover;
    width         : 100%;
    border-radius : 10px;
    aspect-ratio: 1/1;
    min-height: auto;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon .kendin_tasarla_balloon_name {
    float         : left;
    width         : 100%;
    text-align    : center;
    font-size     : 13px;
    font-weight   : 900;
    color         : #000;
    margin-top    : 10px;
    margin-bottom : 10px;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon .kendin_tasarla_balloon_product_link {
    float       : left;
    width       : 100%;
    text-align  : center;
    font-size   : 13px;
    font-weight : 900;
    color       : #000;
    /* margin-top    : 10px; */
    /* margin-bottom : 10px; */
    background  : #f7fbff;
    padding     : 7px;
}
.kendin_tasarla_selected_colour_show_presentations .container .kendin_tasarla_presentations_list .kendin_tasarla_balloon .kendin_tasarla_balloon_product_link:hover {
    background : #e8f0f7;
}
.kendin_tasarla_selected_colour_show_presentations .container .secimi_sifirla_btn {
    width         : fit-content;
    margin        : 0 auto 20px;
    text-align    : center;
    border-radius : 10px;
    padding       : 10px 20px;
    background    : #fff;
    box-shadow    : 0 5px 10px 0 #00000014;
    border        : 1px solid #7070705c;
    font-weight   : bolder !important;
    font-size     : 14px;
    display       : flex;
    cursor        : pointer;
    color         : #000;
}
.kendin_tasarla_selected_colour_show_presentations .container .secimi_sifirla_btn:hover {
    background : #eee;
}
/* KENDIN TASARLA SELECTED COLOURS BALLOONS */
@media (max-width : 550px) {
    .kendin_tasarla_colours .kendin_tasarla_colour_search {
        width : 100%;
    }
    .kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content {
    }
    .kendin_tasarla_colours .kendin_tasarla_selected_colour_list_content .kendin_tasarla_selected_colour_list_text {
        font-size : 14px;
    }
}
.control {
    font-family   : arial;
    display       : block;
    position      : relative;
    padding-left  : 25px;
    margin-bottom : 5px;
    padding-top   : 2px;
    cursor        : pointer;
    font-size     : 14px;
    text-indent   : 10px;
}
.control input {
    position : absolute;
    z-index  : -1;
    opacity  : 0;
}
.control_indicator {
    position      : absolute;
    top           : 2px;
    left          : -5px;
    height        : 36px;
    width         : 36px;
    background    : #ffffff;
    border        : 1px solid #007fff;
    border-radius : 5px;
}
.control:hover input ~ .control_indicator,
.control input:focus ~ .control_indicator {
    /* background : #007fff; */
}
.control input:checked ~ .control_indicator {
    background : #007fff;
}
.control:hover input:not([disabled]):checked ~ .control_indicator,
.control input:checked:focus ~ .control_indicator {
    background : #007fff;
}
.control input:disabled ~ .control_indicator {
    background     : #e6e6e6;
    opacity        : 8;
    pointer-events : none;
}
.control_indicator:after {
    box-sizing : unset;
    content    : "";
    position   : absolute;
    display    : none;
}
.control input:checked ~ .control_indicator:after {
    display : block;
}
.control-checkbox .control_indicator:after {
    left         : 12px;
    top          : 6px;
    width        : 7px;
    height       : 13px;
    border       : solid #ffffff;
    border-width : 0 3px 3px 0;
    transform    : rotate(45deg);
}
.control-checkbox input:disabled ~ .control_indicator:after {
    border-color : #7b7b7b;
}