@charset "UTF-8";

.cf,
.clearfix {
    zoom: 1
}

.cf:after,
.cf:before,
.clearfix:after,
.clearfix:before {
    content: "";
    display: table
}

.cf:after,
.clearfix:after {
    clear: both
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
    display: block
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],
template {
    display: none
}

a {
    background: 0 0
}

a:active,
a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b,
strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em
}

button,
input,
optgroup,
select,
textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,
select {
    text-transform: none
}

button,
html input[type=button] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],
html input[disabled] {
    cursor: default
}

button input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=reset],
input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

input[type=checkbox],
input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,
input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,
th {
    padding: 0
}

textarea {
    resize: vertical
}

span.amp {
    font-family: Baskerville, 'Goudy Old Style', Palatino, 'Book Antiqua', serif;
    font-style: italic
}

body,
html {
    margin: 0;
    padding: 0
}

img {
    max-width: 100%;
    height: auto
}

.screenblock {
    display: block !important
}

.hide {
    display: none
}

.text-left {
    text-align: left
}

.text-center {
    text-align: center
}

.text-right {
    text-align: right
}

.alignnone {
    margin: 5px 20px 20px 0
}

.aligncenter {
    display: block;
    margin: 5px auto 5px auto
}

.alignright {
    float: right;
    margin: 5px 0 20px 20px;
    max-width: 50%
}

.alignleft {
    float: left;
    margin: 5px 20px 20px 0;
    max-width: 50%
}

.clear {
    clear: both
}

@media screen and (max-width:1280px) {
    .pagearea {
        width: 100%;
        margin: 0 auto
    }
}

@media screen and (min-width:768px) {
    .mobileonly {
        display: none !important
    }
}


}

.testblock {
    width: 100%;
    padding: 20px 0;
    margin: 0;
    background: red;
    color: #fff;
    text-align: center
}

.container_12 {
    width: 100%;
    margin: 0 auto;
    zoom: 0
}

.container_12:after,
.container_12:before {
    content: "";
    display: table
}

.container_12:after {
    clear: both
}

.grid_1,
.grid_10,
.grid_11,
.grid_12,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9 {
    display: inline;
    float: left;
    position: relative;
    margin-left: 0;
    margin-right: 0
}

.alpha {
    margin-left: 0
}

.omega {
    margin-right: 0
}

.container_12 .grid_1 {
    width: 8.333%
}

.container_12 .grid_2 {
    width: 16.667%
}

.container_12 .grid_3 {
    width: 24.999%
}

.container_12 .grid_4 {
    width: 33.332%
}

.container_12 .grid_5 {
    width: 41.665%
}

.container_12 .grid_6 {
    width: 49.998%
}

.container_12 .grid_7 {
    width: 58.331%
}

.container_12 .grid_8 {
    width: 66.664%
}

.container_12 .grid_9 {
    width: 74.997%
}

.container_12 .grid_10 {
    width: 83.33%
}

.container_12 .grid_11 {
    width: 91.663%
}

.container_12 .grid_12 {
    width: 99.96%
}

.container_12 .prefix_1 {
    padding-left: 8.333%
}

.container_12 .prefix_2 {
    padding-left: 16.667%
}

.container_12 .prefix_3 {
    padding-left: 25%
}

.container_12 .prefix_4 {
    padding-left: 33.333%
}

.container_12 .prefix_5 {
    padding-left: 41.667%
}

.container_12 .prefix_6 {
    padding-left: 50%
}

.container_12 .prefix_7 {
    padding-left: 58.333%
}

.container_12 .prefix_8 {
    padding-left: 66.667%
}

.container_12 . prefix_9 {
    padding-left: 75%
}

.container_12 .prefix_10 {
    padding-left: 83.333%
}

.container_12 .prefix_11 {
    padding-left: 91.667%
}

.container_12 .suffix_1 {
    padding-right: 8.333%
}

.container_12 .suffix_2 {
    padding-right: 16.667%
}

.container_12 .suffix_3 {
    padding-right: 25%
}

.container_12 .suffix_4 {
    padding-right: 33.333%
}

.container_12 .suffix_5 {
    padding-right: 41.667%
}

.container_12 .suffix_6 {
    padding-right: 50%
}

.container_12 .suffix_7 {
    padding-right: 58.333%
}

.container_12 .suffix_8 {
    padding-right: 66.667%
}

.container_12 .suffix_9 {
    padding-right: 75%
}

.container_12 .suffix_10 {
    padding-right: 83.333%
}

.container_12 .suffix_11 {
    padding-right: 91.667%
}

.container_12 .push_1 {
    left: 8.333%
}

.container_12 .push_2 {
    left: 16.667%
}

.container_12 .push_3 {
    left: 25%
}

.container_12 .push_4 {
    left: 33.333%
}

.container_12 .push_5 {
    left: 41.667%
}

.container_12 .push_6 {
    left: 50%
}

.container_12 .push_7 {
    left: 58.333%
}

.container_12 .push_8 {
    left: 66.667%
}

.container_12 .push_9 {
    left: 75%
}

.container_12 .push_10 {
    left: 83.333%
}

.container_12 .push_11 {
    left: 91.667%
}

.container_12 .pull_1 {
    left: -8.333%
}

.container_12 .pull_2 {
    left: -16.667%
}

.container_12 .pull_3 {
    left: -25%
}

.container_12 .pull_4 {
    left: -33.333%
}

.container_12 .pull_5 {
    left: -41.667%
}

.container_12 .pull_6 {
    left: -50%
}

.container_12 .pull_7 {
    left: -58.333%
}

.container_12 .pull_8 {
    left: -66.667%
}

.container_12 .pull_9 {
    left: -75%
}

.container_12 .pull_10 {
    left: -83.333%
}

.container_12 .pull_11 {
    left: -91.667%
}

@media screen and (max-width:1280px) {
    .container_12 {
        width: 100%;
        margin: 0 0
    }
}

@media screen and (max-width:768px) {

    .container_12 .grid_1,
    .container_12 .grid_10,
    .container_12 .grid_11,
    .container_12 .grid_12,
    .container_12 .grid_2,
    .container_12 .grid_3,
    .container_12 .grid_4,
    .container_12 .grid_5,
    .container_12 .grid_6,
    .container_12 .grid_7,
    .container_12 .grid_8,
    .container_12 .grid_9 {
        display: block;
        clear: both;
        position: relative;
        width: 100%;
    }

    .container_12 .pull_1,
    .container_12 .pull_10,
    .container_12 .pull_11,
    .container_12 .pull_12,
    .container_12 .pull_2,
    .container_12 .pull_3,
    .container_12 .pull_4,
    .container_12 .pull_5,
    .container_12 .pull_6,
    .container_12 .pull_7,
    .container_12 .pull_8,
    .container_12 .pull_9,
    .container_12 .push_1,
    .container_12 .push_10,
    .container_12 .push_11,
    .container_12 .push_12,
    .container_12 .push_2,
    .container_12 .push_3,
    .container_12 .push_4,
    .container_12 .push_5,
    .container_12 .push_6,
    .container_12 .push_7,
    .container_12 .push_8,
    .container_12 .push_9 {
        left: 0
    }

    .container_12 .prefix_1,
    .container_12 .prefix_10,
    .container_12 .prefix_11,
    .container_12 .prefix_2,
    .container_12 .prefix_3,
    .container_12 .prefix_4,
    .container_12 .prefix_5,
    .container_12 .prefix_6,
    .container_12 .prefix_7,
    .container_12 .prefix_8,
    .container_12 .prefix_9,
    .container_12 .suffix_1,
    .container_12 .suffix_10,
    .container_12 .suffix_11,
    .container_12 .suffix_2,
    .container_12 .suffix_3,
    .container_12 .suffix_4,
    .container_12 .suffix_5,
    .container_12 .suffix_6,
    .container_12 .suffix_7,
    .container_12 .suffix_8,
    .container_12 .suffix_9 {
        padding: 0
    }
}

.bg_blue {
    background-color: #19253b
}

.bg_blue .pin {
    border-bottom-color: #19253b
}

.bg_blue .pin:before {
    border-top-color: #19253b
}

.bg_blue_001 {
    background-color: #19253b
}

.bg_blue_001 .pin {
    border-bottom-color: #19253b
}

.bg_blue_001 .pin:before {
    border-top-color: #19253b
}

.bg_blue_002 {
    background-color: #1f3050
}

.bg_blue_002 .pin {
    border-bottom-color: #1f3050
}

.bg_blue_002 .pin:before {
    border-top-color: #1f3050
}

.bg_blue_003 {
    background-color: #212b31
}

.bg_blue_003 .pin {
    border-bottom-color: #212b31
}

.bg_blue_003 .pin:before {
    border-top-color: #212b31
}

.bg_blue_004 {
    background-color: #465460
}

.bg_blue_004 .pin {
    border-bottom-color: #465460
}

.bg_blue_004 .pin:before {
    border-top-color: #465460
}

.bg_mono_0 {
    background-color: #19253b
}

.bg_mono_0 .pin {
    border-bottom-color: #19253b
}

.bg_mono_0 .pin:before {
    border-top-color: #19253b
}

.bg_mono_12 {
    background-color: #19253b
}

.bg_mono_12 .pin {
    border-bottom-color: #19253b
}

.bg_mono_12 .pin:before {
    border-top-color: #19253b
}

.bg_mono_20 {
    background-color: #343434
}

.bg_mono_20 .pin {
    border-bottom-color: #343434
}

.bg_mono_20 .pin:before {
    border-top-color: #343434
}

.bg_mono_90 {
    background-color: #ededed
}

.bg_mono_90 .pin {
    border-bottom-color: #ededed
}

.bg_mono_90 .pin:before {
    border-top-color: #ededed
}

.bg_mono_90 .pin:after {
    background: url("../img/pin-arrow-VLXf4fY.svg") no-repeat center center
}

.bg_mono_98 {
    background-color: #fafafa
}

.bg_mono_98 .pin {
    border-bottom-color: #fafafa
}

.bg_mono_98 .pin:before {
    border-top-color: #fafafa
}

.bg_mono_98 .pin:after {
    background: url("../img/pin-arrow-VLXf4fY.svg") no-repeat center center
}

.bg_mono_100 {
    background-color: #fff
}

.bg_mono_100 .pin {
    border-bottom-color: #fff
}

.bg_mono_100 .pin:before {
    border-top-color: #fff
}

.bg_mono_100 .pin:after {
    background: url("../img/pin-arrow-VLXf4fY.svg") no-repeat center center
}

.bg_grad_001 {
    background-image: linear-gradient(120deg, #3c597a, #1f1f1f 60%)
}

.bg_grad_001 .pin {
    border-bottom-color: #41586f
}

.bg_grad_001 .pin:before {
    border-top-color: #41586f
}

.bg_grad_002 {
    background-image: linear-gradient(to left, #3c597a, #1f1f1f)
}

.bg_grad_002 .pin {
    border-bottom-color: #667e97
}

.bg_grad_002 .pin:before {
    border-top-color: #667e97
}

.bg_grad_003 {
    background-image: linear-gradient(to left, #324b6544, #1f1f1f3f)
}

.bg_grad_003 .pin {
    border-bottom-color: #3f4c5741
}

.bg_grad_003 .pin:before {
    border-top-color: #3f4c573d
}

.bg_grad_004 {
    background-image: linear-gradient(to right, #000, #36536f, #000)
}

.bg_grad_004 .pin {
    border-bottom-color: #36536f
}

.bg_grad_004 .pin:before {
    border-top-color: #36536f
}

.multiply {
    background-blend-mode: multiply
}

.button {
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.button.bg_blue:hover {
    background-color: #2a619f
}

.button.bg_blue_001:hover {
    background-color: #0a0f17
}

.button.bg_blue_002:hover {
    background-color: #111a2b
}

.button.bg_blue_003:hover {
    background-color: #0c1013
}

.button.bg_blue_004:hover {
    background-color: #303a43
}

.button.bg_mono_0:hover {
    background-color: #000
}

.button.bg_mono_100:hover {
    background-color: #e6e6e6
}

.button.bg_mono_12:hover {
    background-color: #050505
}

.button.bg_mono_20:hover {
    background-color: #1a1a1a
}

.button.bg_mono_90:hover {
    background-color: #d4d4d4
}

.button.bg_mono_98:hover {
    background-color: #e1e1e1
}

.button.bg_grad_001 {
    background-image: linear-gradient(#213b55, #61768a)
}

.button.bg_grad_001:hover {
    background-image: linear-gradient(#61768a, #213b55)
}

.button.bg_grad_002 {
    background-image: linear-gradient(#2d4765, #3c597a)
}

.button.bg_grad_002:hover {
    background-image: linear-gradient(#3c597a, #2d4765)
}

.button.bg_grad_003 {
    background-image: linear-gradient(#26313736, #324b6555)
}

.button.bg_grad_003:hover {
    background-image: linear-gradient(#324b654c, #26313748)
}

.button.bg_grad_004 {
    background-image: linear-gradient(#36536f, #000)
}

.button.bg_grad_004:hover {
    background-image: linear-gradient(#000, #36536f)
}

.article {
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.article .bg_blue:hover {
    background-color: #2a619f
}

.article .bg_blue_001:hover {
    background-color: #0a0f17
}

.article .bg_blue_002:hover {
    background-color: #111a2b
}

.article .bg_blue_003:hover {
    background-color: #0c1013
}

.article .bg_blue_004:hover {
    background-color: #303a43
}

.article .bg_mono_0:hover {
    background-color: #000
}

.article .bg_mono_100:hover {
    background-color: #e6e6e6
}

.article .bg_mono_12:hover {
    background-color: #050505
}

.article .bg_mono_20:hover {
    background-color: #1a1a1a
}

.article .bg_mono_90:hover {
    background-color: #d4d4d4
}

.article .bg_mono_98:hover {
    background-color: #e1e1e1
}

.article .bg_grad_001 {
    background-image: linear-gradient(#213b55, #61768a)
}

.article .bg_grad_001:hover {
    background-image: linear-gradient(#61768a, #213b55)
}

.article .bg_grad_002 {
    background-image: linear-gradient(#2d4765, #3c597a)
}

.article .bg_grad_002:hover {
    background-image: linear-gradient(#3c597a, #2d4765)
}

.article .bg_grad_003 {
    background-image: linear-gradient(#2631373a, #324b655b)
}

.article .bg_grad_003:hover {
    background-image: linear-gradient(#324b655a, #26313739)
}

.article .bg_grad_004 {
    background-image: linear-gradient(#36536f, #000)
}

.article .bg_grad_004:hover {
    background-image: linear-gradient(#000, #36536f)
}

.col_blue {
    color: #3579c7
}

.col_blue_003 {
    color: #212b31
}

.col_blue_002 {
    color: #1f3050
}

.col_blue_001 {
    color: #19253b
}

.col_mono_100 {
    color: #fff
}

.col_mono_98 {
    color: #fafafa
}

.col_mono_90 {
    color: #ededed
}

.col_mono_20 {
    color: #343434
}

.col_mono_12 {
    color: #1f1f1f
}

.bg_mono_100,
.bg_mono_90,
.bg_mono_98 {
    color: #555c65
}

.bg_mono_100 a,
.bg_mono_90 a,
.bg_mono_98 a {
    color: #3579c7
}

.bg_mono_100 a:hover,
.bg_mono_90 a: hover,
.bg_mono_98 a:hover {
    color: #5c93d3
}

.bg_blue,
.bg_blue_001,
.bg_blue_002,
.bg_blue_003,
.bg_blue_004,
.bg_grad_001,
.bg_grad_002,

.bg_grad_004,
.bg_mono_0,
.bg_mono_12,
.bg_mono_20 {
    color: #fff
}

.bg_blue a,
.bg_blue_001 a,
.bg_blue_002 a,
.bg_blue_003 a,
.bg_blue_004 a,
.bg_grad_001 a,
.bg_grad_002 a,
.bg_grad_003 a,
.bg_grad_004 a,
.bg_mono_0 a,
.bg_mono_12 a,
.bg_mono_20 a {
    color: #3579c7;
    text-decoration-line: none;
    text-decoration:none;
}

.bg_blue a:hover,
.bg_blue_001 a:hover,
.bg_blue_002 a:hover,
.bg_blue_003 a:hover,
.bg_blue_004 a:hover,
.bg_grad_001 a:hover,
.bg_grad_002 a:hover,
.bg_grad_003 a:hover,
.bg_grad_004 a:hover,
.bg_mono_0 a:hover,
.bg_mono_12 a:hover,
.bg_mono_20 a:hover {
    color: #3579c7
}

.bg_blue .swiper-button-next,
.bg_blue_001 .swiper-button-next,
.bg_blue_002 .swiper-button-next,
.bg_blue_003 .swiper-button-next,
.bg_blue_004 .swiper-button-next,
.bg_grad_001 .swiper-button-next,
.bg_grad_002 .swiper-button-next,
.bg_grad_003 .swiper-button-next,
.bg_grad_004 .swiper-button-next,
.bg_mono_0 .swiper-button-next,
.bg_mono_12 .swiper-button-next,
.bg_mono_20 .swiper-button-next {
    
}

.bg_blue .swiper-button-prev,
.bg_blue_001 .swiper-button-prev,
.bg_blue_002 .swiper-button-prev,
.bg_blue_003 .swiper-button-prev,
.bg_blue_004 .swiper-button-prev,
.bg_grad_001 .swiper-button-prev,
.bg_grad_002 .swiper-button-prev,
.bg_grad_003 .swiper-button-prev,
.bg_grad_004 .swiper-button-prev,
.bg_mono_0 .swiper-button-prev,
.bg_mono_12 .swiper-button-prev,
.bg_mono_20 .swiper-button-prev {
   
}

.bg_blue .swiper-pagination-bullet,
.bg_blue_001 .swiper-pagination-bullet,
.bg_blue_002 .swiper-pagination-bullet,
.bg_blue_003 .swiper-pagination-bullet,
.bg_blue_004 .swiper-pagination-bullet,
.bg_grad_001 .swiper-pagination-bullet,
.bg_grad_002 .swiper-pagination-bullet,
.bg_grad_003 .swiper-pagination-bullet,
.bg_grad_004 .swiper-pagination-bullet,
.bg_mono_0 .swiper-pagination-bullet,
.bg_mono_12 .swiper-pagination-bullet,
.bg_mono_20 .swiper-pagination-bullet {
    background-color: rgba(255, 255, 255, .9)
}

.bg_blue .swiper-pagination-bullet-active,
.bg_blue_001 .swiper-pagination-bullet-active,
.bg_blue_002 .swiper-pagination-bullet-active,
.bg_blue_003 .swiper-pagination-bullet-active,
.bg_blue_004 .swiper-pagination-bullet-active,
.bg_grad_001 .swiper-pagination-bullet-active,
.bg_grad_002 .swiper-pagination-bullet-active,
.bg_grad_003 .swiper-pagination-bullet-active,
.bg_grad_004 .swiper-pagination-bullet-active,
.bg_mono_0 .swiper-pagination-bullet-active,
.bg_mono_12 .swiper-pagination-bullet-active,
.bg_mono_20 .swiper-pagination-bullet-active {
    background-color: #fff
}

.button.bg_mono_100,
.button.bg_mono_90,
.button.bg_mono_98 {
    color: #555c65 !important
}

.button.bg_mono_100:hover,
.button.bg_mono_90:hover,
.button.bg_mono_98:hover {
    color: #555c65 !important;
    text-decoration: none
}

.button.bg_blue,
.button.bg_blue_001,
.button.bg_blue_002,
.button.bg_blue_003,
.button.bg_blue_004,
.button.bg_grad_001,
.button.bg_grad_002,
.button.bg_grad_003,
.button.bg_grad_004,
.button.bg_mono_0,
.button.bg_mono_12,
.button.bg_mono_20 {
    color: #fff
}

.button.bg_blue:hover,
.button.bg_blue_001:hover,
.button.bg_blue_002:hover,
.button.bg_blue_003:hover,
.button.bg_blue_004:hover,
.button.bg_grad_001:hover,
.button.bg_grad_002:hover,
.button.bg_grad_003:hover,
.button.bg_grad_004:hover,
.button.bg_mono_0:hover,
.button.bg_mono_12:hover,
.button.bg_mono_20:hover {
    color: #fff
}

@font-face {
    font-family: ubuntu !important;
    font-style: normal;
    font-display: swap;
    font-weight: 500;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

[class*=" icon-"],
[class^=icon-] {
    font-family: linearicons !important;
    speak: none;
    font-style: normal;
    font-weight: 400;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-printer:before {
    content: "\e6b1"
}

.icon-lock:before {
    content: "\e66b"
}

.icon-unlock:before {
    content: "\e66d"
}

.icon-cog:before {
    content: "\e672"
}

.icon-telephone:before {
    content: "\e76a"
}

.icon-phone-wave:before {
    content: "\e76c"
}

.icon-dial:before {
    content: "\e776"
}

.icon-telephone2:before {
    content: "\e777"
}

.icon-map-marker:before {
    content: "\e77a"
}

.icon-calendar-full:before {
    content: "\e789"
}

.icon-magnifier:before {
    content: "\e922"
}

.icon-envelope:before {
    content: "\e696"
}

.icon-profile:before {
    content: "\e71b"
}

.icon-enter-down2:before {
    content: "\e900"
}

.icon-archive2:before {
    content: "\e6a1"
}

.icon-chevron-up:before {
    content: "\e939"
}

.icon-chevron-down:before {
    content: "\e93a"
}

.icon-chevron-left:before {
    content: "\e93b"
}

.icon-chevron-right:before {
    content: "\e93c"
}

.icon-square:before {
    content: "\e98d"
}

.icon-check-square:before {
    content: "\e999"
}

.icon-cross-square:before {
    content: "\e99a"
}

.icon-star:before {
    content: "\e68d"
}

.icon-star-full:before {
    content: "\e68e"
}

.icon-star-empty:before {
    content: "\e68f"
}

.icon-toggle-off:before {
    content: "\e670"
}

.icon-toggle-on2:before {
    content: "\e673"
}

.icon-home2:before {
    content: "\e601"
}

.icon-menu:before {
    content: "\e92b"
}

.icon-ellipsis:before {
    content: "\e9e9"
}

.icon-toggle-on:before {
    content: "\e671"
}

.icon-home:before {
    content: "\e600"
}

@font-face {
    font-family: ubuntu !important;
    font-style: normal;
    font-display: swap;
    font-weight: 400;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
    font-family: ubuntu !important;
    font-style: italic;
    font-display: swap;
    font-weight: 400;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
    font-family: ubuntu !important;
    font-style: normal;
    font-display: swap;
    font-weight: 500;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
    font-family: ubuntu !important;
    font-style: italic;
    font-display: swap;
    font-weight: 400;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
    font-family: ubuntu !important;
    font-style: normal;
    font-display: swap;
    font-weight: 600;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

@font-face {
    font-family: ubuntu !important;
    font-style: italic;
    font-display: swap;
    font-weight: 600;
    src: local("Ubuntu Medium"), local("Ubuntu-Medium"), url(https://cdn.jsdelivr.net/npm/@fontsource/ubuntu@5.0.8/files/ubuntu-latin-500-normal.woff2) format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD
}

.fa-sort-asc,
.fa-sort-desc {
    margin-top: -10px;
    vertical-align: middle
}

body,
html {
    line-height: 150%;
    font-size: 14px;
    font-weight: 400;
    font-family: GillSansMTPro, Helvetica, Arial, sans-serif;
    color: #555c65
}

.page-content {
    font-size: 16px;
    line-height: 19.2px;
    line-height: 1.3571428571428572rem
}

.page-content p,
.page-content table {
    margin-bottom: 15px;
    margin-bottom: 1.0714285714285714rem;
    margin-top: 0
}

.small,
small {
    font-size: 14px;
    font-size: 1rem;
    line-height: 14px;
    line-height: 1rem
}

p.quote {
    font-size: 18px;
    font-size: 1.2857142857142858rem
}

p.quote caption {
    color: #979797
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    margin-top: 0;
    margin-top: 0
}

.leadin {
    font-size: 72.8px;
    font-size: 5. 142857142857143rem;
    line-height: 78px;
    margin-bottom: 18.72px;
    margin-bottom: 1.2857142857142858rem;
    font-weight: 300
}

.h1,
h1 {
    font-size: 52px;
    font-size: 3.7142857142857144rem;
    line-height: 57.2px;
    margin-bottom: 18.72px;
    margin-bottom: 1.2857142857142858rem;
    font-weight: 300
}

.h2,
h2 {
    font-size: 32px;
    font-size: 2.2857142857142856rem;
    line-height: 35.2px;
    margin-bottom: 11.52px;
    margin-bottom: .7857142857142857rem;
    font-weight: 300
}

.h3,
h3 {
    font-size: 24px;
    font-size: 1.7142857142857142rem;
    line-height: 26.4px;
    margin-bottom: 8.64px;
    margin-bottom: .5714285714285714rem;
    font-weight: 300
}

.h4,
h4 {
    font-size: 22px;
    font-size: 1.5714285714285714rem;
    line-height: 24.2px;
    margin-bottom: 14.52px;
    margin-bottom: 1rem;
    font-weight: 400
}

.h5,
h5 {
    font-size: 18px;
    font-size: 1.2857142857142858rem;
    line-height: 19.8px;
    margin-bottom: 11.88px;
    margin-bottom: .7857142857142857rem;
    font-weight: 400
}

.h6,
h6 {
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    line-height: 17.6px;
    margin-bottom: 10.56px;
    margin-bottom: .7142857142857143rem;
    font-weight: 400
}

a,
a:hover {
    text-decoration: none
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
a,
span,
strong,
em {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    /* Uzun kelimeleri böler, dışarı taşırmaz */
    word-wrap: break-word !important;
    word-break: break-word !important;
    /* Eski tarayıcılar için garanti */
    hyphens: auto !important;
    box-sizing: border-box !important;
}

table {
    margin: 0 0 20px 0;
    border-bottom: 1px solid rgba(125, 125, 125, .5)
}

table tr td,
table tr th {
    text-align: left;
    border-top: 1px solid rgba(125, 125, 125, .5);
    border-right: 1px solid rgba(125, 125, 125, .5);
    padding: 10px 50px 10px 10px
}

table tr td:last-child,
table tr th:last-child {
    border-right: none
}

table tr td:first-child,
table tr th:first-child {
    padding-left: 0
}

ol,
ul {
    margin-top: 0
}

ol.boxed,
ul.boxed {
    list-style: none;
    padding: 0 !important;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    float: left;
    width: 100%
}

ol.boxed li,
ul.boxed li {
    padding: 0 5px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 25%;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 10px
}

ol.boxed li:before,
ul.boxed li:before {
    content: '' !important
}

ol.boxed li a,
ul.boxed li a {
    background-color: #fff;
    box-shadow: 0 0 30px rgba(0, 0, 0, .07);
    padding: 20px;
    padding: 1.4285714285714286rem;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

ol.boxed.dark li a,
ul.boxed.dark li a {
    background: #465460;
    color: #fff;
    -webkit-transition: background .2s;
    -moz-transition: background .2s;
    -o-transition: background .2s;
    transition: background .2s
}

ol.boxed.dark li a[href]:hover,
ul.boxed.dark li a[href]:hover {
    background: rgba(70, 84, 96, .55)
}

ol.boxed.thirds li,
ul.boxed.thirds li {
    width: 33.3%
}

ol.fat li a,
ul.fat li a {
    padding: 60px 30px
}

@media screen and (max-width:960px) {

    ol.boxed.thirds li,
    ul.boxed.thirds li {
        width: 50%
    }
}

@media screen and (max-width:768px) {

    ol.boxed.thirds li,
    ul.boxed.thirds li {
        width: 100%
    }
}

ul.bordered {
    list-style-type: none;
    list-style-image: none;
    margin: 20px !important;
    padding: 10px !important
}

ul.bordered li {
    display: block;
    padding: 6px 0;
    border-bottom: 1px solid #bababa
}

ul.bordered li a {
    padding: 10px !important;

}

ul.bordered li:before {
    display: none
}

ul.bordered li:last-child {
    border-bottom: none
}

dl {
    display: flex;
    flex-flow: row;
    flex-wrap: wrap;
    overflow: visible
}

dl dt {
    flex: 0 0 20%;
    overflow: hidden
}

dl dd {
    flex: 0 0 80%;
    margin-left: auto;
    text-align: left;
    overflow: hidden
}

blockquote {
    margin: 0;
    padding: 0;
    font-size: 22px;
    font-size: 1.5714285714285714rem;
    line-height: 26.4px;
    line-height: 1.8571428571428572rem;
    border-left: 2px solid rgba(125, 125, 125, .5);
    padding: 10px 0 1px 30px;
    margin-bottom: 15px;
    margin-bottom: 1.0714285714285714rem
}

blockquote.medium {
    font-size: 18px;
    font-size: 1.2857142857142858rem;
    opacity: .7;
    line-height: 21.6px;
    line-height: 1.5rem;
    padding: 10px 0 1px 0;
    border: none;
    font-style: italic
}

blockquote.medium small {
    font-style: normal
}

blockquote .small {
    font-size: 14px;
    font-size: 1rem;
    opacity: .7;
    line-height: 16.8px;
    line-height: 1.1428571428571428rem
}

pre {
    background: #fff;
    padding: 20px;
    padding: 1.4285714285714286rem;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, .3) inset;
    -moz-box-shadow: 0 0 2px 0 rgba(0, 0, 0, .3) inset;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, .3) inset
}

pre code {
    margin: 0
}

.panel_body {
    font-size: 16px;
    font-size: 1. 1428571428571428rem
}

ul.fourcol,
ul.threecol,
ul.twocol {
    list-style-type: none;
    margin-bottom: 50px;
    margin-bottom: 3.5714285714285716rem
}

ul.fourcol li:before,
ul.threecol li:before,
ul.twocol li:before {
    content: '';
    font-family: fontawesome;
    color: #3579c7
}

ul.fourcol li a,
ul.threecol li a,
ul.twocol li a {
    color: #3579c7
}

ul.twocol {
    -moz-column-width: 50%;
    -moz-column-count: 2;
    -moz-column-gap: 1px;
    -moz-column-rule-color: transparent;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 0;
    -webkit-column-width: 50%;
    -webkit-column-count: 2;
    -webkit-column-gap: 1px;
    -webkit-column-rule-color: transparent;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 0;
    column-width: 50%;
    column-count: 2;
    column-gap: 1px;
    column-rule-color: transparent;
    column-rule-style: solid;
    column-rule-width: 0;
    -webkit-columns: 50% 2 1px;
    -moz-columns: 50% 2 1px;
    columns: 50% 2 1px
}

ul.threecol {
    -moz-column-width: 33%;
    -moz-column-count: 3;
    -moz-column-gap: 1px;
    -moz-column-rule-color: transparent;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 0;
    -webkit-column-width: 33%;
    -webkit-column-count: 3;
    -webkit-column-gap: 1px;
    -webkit-column-rule-color: transparent;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 0;
    column-width: 33%;
    column-count: 3;
    column-gap: 1px;
    column-rule-color: transparent;
    column-rule-style: solid;
    column-rule-width: 0;
    -webkit-columns: 33% 3 1px;
    -moz-columns: 33% 3 1px;
    columns: 33% 3 1px
}

ul.fourcol {
    -moz-column-width: 24.5%;
    -moz-column-count: 4;
    -moz-column-gap: 1px;
    -moz-column-rule-color: transparent;
    -moz-column-rule-style: solid;
    -moz-column-rule-width: 0;
    -webkit-column-width: 24.5%;
    -webkit-column-count: 4;
    -webkit-column-gap: 1px;
    -webkit-column-rule-color: transparent;
    -webkit-column-rule-style: solid;
    -webkit-column-rule-width: 0;
    column-width: 24.5%;
    column-count: 4;
    column-gap: 1px;
    column-rule-color: transparent;
    column-rule-style: solid;
    column-rule-width: 0;
    -webkit-columns: 24.5% 4 1px;
    -moz-columns: 24.5% 4 1px;
    columns: 24.5% 4 1px
}

.section .panel ul.filter,
.section .panel ul.filter-lists {
    list-style-type: none
}

.section .panel ul {
    padding-left: 20px;
    padding-left: 1.4285714285714286rem;
    padding-right: 20px;
    padding-right: 1.4285714285714286rem
}

.fa.large {
    vertical-align: middle;
    font-size: 26px;
    font-size: 1.8571428571428572rem
}

hr {
    border: 0;
    display: block;
    height: 0;
    border-top: 1px solid rgba(85, 92, 101, .3);
    margin-bottom: 15px;
    margin-bottom: 1.0714285714285714rem;
    clear: both;
    color: transparent;
    width: 30%;
    margin: 20px 0
}

hr.full {
    width: 100%
}

@media screen and (max-width:1280px) {
    .pagearea {
        width: 100%;
        margin: 0 auto
    }
}

@media screen and (max-width:960px) {
    .leadin {
        font-size: 42.9px;
        font-size: 3rem;
        line-height: 50.7px;
        margin-bottom: 14.04px;
        margin-bottom: 1rem;
        font-weight: 200
    }

    .h1,
    h1 {
        font-size: 39px;
        font-size: 2.7857142857142856rem;
        line-height: 42.9px;
        margin-bottom: 25.74px;
        margin-bottom: 1.7857142857142858rem;
        font-weight: 200
    }

    .h2,
    h2 {
        font-size: 24px;
        font-size: 1.7142857142857142rem;
        line-height: 26.4px;
        margin-bottom: 15.84px;
        margin-bottom: 1.0714285714285714rem;
        font-weight: 200
    }

    .h3,
    h3 {
        font-size: 20.4px;
        font-size: 1.4285714285714286rem;
        line-height: 22.44px;
        margin-bottom: 13.464px;
        margin-bottom: .9285714285714286rem;
        font-weight: 300
    }

    .h4,
    h4 {
        font-size: 20.9px;
        font-size: 1.4285714285714286rem;
        line-height: 22.99px;
        margin-bottom: 13.794px;
        margin-bottom: .9285714285714286rem;
        font-weight: 300
    }

    .h5,
    h5 {
        font-size: 17.1px;
        font-size: 1.2142857142857142rem;
        line-height: 18.81px;
        margin-bottom: 11.286px;
        margin-bottom: .7857142857142857rem;
        font-weight: 300
    }

    .h6,
    h6 {
        font-size: 15.2px;
        font-size: 1.0714285714285714rem;
        line-height: 16.72px;
        margin-bottom: 10.032px;
        margin-bottom: .7142857142857143rem;
        font-weight: 300
    }

    ul.fourcol {
        margin: 0;
        padding: 0;
        -moz-column-width: 33%;
        -moz-column-count: 3;
        -moz-column-gap: 1px;
        -moz-column-rule-color: transparent;
        -moz-column-rule-style: solid;
        -moz-column-rule-width: 0;
        -webkit-column-width: 33%;
        -webkit-column-count: 3;
        -webkit-column-gap: 1px;
        -webkit-column-rule-color: transparent;
        -webkit-column-rule-style: solid;
        -webkit-column-rule-width: 0;
        column-width: 33%;
        column-count: 3;
        column-gap: 1px;
        column-rule-color: transparent;
        column-rule-style: solid;
        column-rule-width: 0;
        -webkit-columns: 33% 3 1px;
        -moz-columns: 33% 3 1px;
        columns: 33% 3 1px
    }

    ol.boxed li,
    ul.boxed li {
        width: 33.33333%
    }
}

@media screen and (max-width:768px) {
    . leadin {
        font-size: 31.2px;
        font-size: 2.2142857142857144rem;
        line-height: 37.44px;
        margin-bottom: 11.232px;
        margin-bottom: .7857142857142857rem;
        font-weight: 200
    }

    .h1,
    h1 {
        font-size: 31.2px;
        font-size: 2.2142857142857144rem;
        line-height: 34.32px;
        margin-bottom: 20.592px;
        margin-bottom: 1.4285714285714286rem;
        font-weight: 200
    }

    .h2,
    h2 {
        font-size: 24px;
        font-size: 1.7142857142857142rem;
        line-height: 26.4px;
        margin-bottom: 15.84px;
        margin-bottom: 1.0714285714285714rem;
        font-weight: 200
    }

    .h3,
    h3 {
        font-size: 20.4px;
        font-size: 1.4285714285714286rem;
        line-height: 22.44px;
        margin-bottom: 13.464px;
        margin-bottom: .9285714285714286rem;
        font-weight: 300
    }

    .h4,
    h4 {
        font-size: 20.9px;
        font-size: 1.4285714285714286rem;
        line-height: 22.99px;
        margin-bottom: 13.794px;
        margin-bottom: .9285714285714286rem;
        font-weight: 300
    }

    .h5,
    h5 {
        font-size: 17.1px;
        font-size: 1.2142857142857142rem;
        line-height: 18.81px;
        margin-bottom: 11.286px;
        margin-bottom: .7857142857142857rem;
        font-weight: 300
    }

    .h6,
    h6 {
        font-size: 15.2px;
        font-size: 1.0714285714285714rem;
        line-height: 16.72px;
        margin-bottom: 10.032px;
        margin-bottom: .7142857142857143rem;
        font-weight: 300
    }

    ul.fourcol,
    ul.threecol {
        margin: 0;
        padding: 0;
        -moz-column-width: 50%;
        -moz-column-count: 2;
        -moz-column-gap: 1px;
        -moz-column-rule-color: transparent;
        -moz-column-rule-style: solid;
        -moz-column-rule-width: 0;
        -webkit-column-width: 50%;
        -webkit-column-count: 2;
        -webkit-column-gap: 1px;
        -webkit-column-rule-color: transparent;
        -webkit-column-rule-style: solid;
        -webkit-column-rule-width: 0;
        column-width: 50%;
        column-count: 2;
        column-gap: 1px;
        column-rule-color: transparent;
        column-rule-style: solid;
        column-rule-width: 0;
        -webkit-columns: 50% 2 1px;
        -moz-columns: 50% 2 1px;
        columns: 50% 2 1px
    }

    dl {
        display: flex;
        flex-flow: row;
        flex-wrap: wrap;
        overflow: visible
    }

    dl dt {
        flex: 0 0 50%;
        overflow: hidden
    }

    dl dd {
        flex: 0 0 50%;
        margin-left: auto;
        text-align: left;
        overflow: hidden
    }

    ol.boxed li,
    ul.boxed li {
        width: 50%
    }
}

@media screen and (max-width:550px) {

    ul.fourcol,
    ul.threecol,
    ul.twocol {
        margin: 0;
        padding: 0;
        -moz-column-width: 100%;
        -moz-column-count: 1;
        -moz-column-gap: 1px;
        -moz-column-rule-color: transparent;
        -moz-column-rule-style: solid;
        -moz-column-rule-width: 0;
        -webkit-column-width: 100%;
        -webkit-column-count: 1;
        -webkit-column-gap: 1px;
        -webkit-column-rule-color: transparent;
        -webkit-column-rule-style: solid;
        -webkit-column-rule-width: 0;
        column-width: 100%;
        column-count: 1;
        column-gap: 1px;
        column-rule-color: transparent;
        column-rule-style: solid;
        column-rule-width: 0;
        -webkit-columns: 100% 1 1px;
        -moz-columns: 100% 1 1px;
        columns: 100% 1 1px
    }
}

@media screen and (max-width:480px) {

    ol.boxed li,
    ul.boxed li {
        width: 100%
    }
}

.accessibility {
    position: absolute;
    left: -10px;
    width: 5px;
    overflow: hidden
}



/* Okuma Listesi Dropdown Estetiği */
#read-list-items-container {
    border-radius: 0px !important;
    /* Keskin geometrik hatlar */
    border-top: 3px solid #C9A961 !important;
    /* Üstte asil Metallic Gold şerit */
}

#read-list-inner-wrapper li a:hover {
    color: #C9A961 !important;
    /* Hover anında altın vurgu */
}

/* Sayfadaki aktif butonun stili */
.add-to-read-list-btn.in-list {
    color: #C9A961 !important;
    font-weight: bold;
}

.text-gold {
    color: #C9A961 !important;
}



.inline-search {
    height: auto;
    width: auto;
    padding: 6px 8px;
    background: #19253b;
}

.inline-search.barrister-search {
    padding: 0 28px
}

.inline-search .searchwrap {
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    background: #ffffff3d;
    padding: 5px 0
}

.inline-search .searchwrap input {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    padding: 12px 30px;
    width: calc(100% - 95px);
    border: none;
    line-height: 1em;
    vertical-align: middle;
    color: #343434
}

.inline-search .searchwrap a,
.inline-search .searchwrap button {
    vertical-align: middle;
    padding: 12px 18px;
    margin: 0
}

/* ==========================================================================
   THE BELLISAN PROTOCOL™ TRANSPARENT SEARCH COMPONENT
   ========================================================================== */
.inline-search .searchwrap {
    background: transparent !important; /* Dış kutunun arkasını boşaltıyoruz */
    border: 1px solid rgba(201, 169, 97, 0.4) !important; /* Metalik altın renginde %40 şeffaf ince asil bir çizgi */
    display: flex;
    align-items: center;
    border-radius: 0 !important; /* Keskin aristokratik köşeler */
    padding: 2px;
}

/* Kullanıcının metin yazdığı girdi alanı */
.inline-search .ui-autocomplete-input {
    background: transparent !important; /* Yazı alanının arkasını tamamen şeffaf yapıyoruz */
    color: #ffffff !important; /* Yazılan arama metni beyaz olsun */
    border: none !important; /* Varsayılan beyaz çirkin kenarlıkları uçuruyoruz */
    outline: none !important; /* Tıklandığında etrafında çıkan mavi çizgiyi engelliyoruz */
    padding: 10px 15px;
    width: 100%;
}

/* "Search cases..." placeholder (ipucu) yazısının rengini netleştirmek için */
.inline-search .ui-autocomplete-input::placeholder {
    color: rgba(255, 255, 255, 0.6) !important; /* Silik asil bir beyaz tonu */
}

/* Arama butonunun (üç nokta ikonlu alanın) şeffaflaştırılması */
.inline-search .button.bg_mono_100 {
    background: transparent !important; /* Buton arkasını sıfırlıyoruz */
    border: none !important;
    outline: none !important;
    padding: 0 15px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Butonun içindeki üç nokta svg ikonunun rengi veya opaklığı için */
.inline-search .button.bg_mono_100 img {
    opacity: 0.8;
    transition: opacity 0.2s ease;
}

.inline-search .button.bg_mono_100:hover img {
    opacity: 1; /* Üzerine gelindiğinde parlasın */
}

.offices {
    width: 20%;
    background-color: rgba(0, 0, 0, .5);
    bottom: 0;
    overflow-y: auto;
    position: fixed;
    right: -20%;
    top: 0;
    z-index: 4000;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.offices.active {
    width: 100%;
    right: 0
}

.offices .wrap {
    position: absolute;
    top: 0;
    right: 0;
    min-height: 100%;
    padding: 20px;
    padding: 1.4285714285714286rem;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 310px;
    width: 22.142857142857142rem
}

.offices .wrap .close {
    position: absolute;
    top: 18px;
    left: -35px;
    font-size: 30px;
    font-size: 2.142857142857143rem
}

.offices .wrap ul {
    margin: 0;
    padding: 0
}

.offices .wrap ul li {
    list-style-type: none;
    border-bottom: 1px dotted #fff
}

.offices .wrap ul li:last-child {
    border-bottom: none
}

.offices .wrap ul li a {
    display: block;
    padding: 10px 0;
    color: #fff;
    text-decoration: none
}

.offices .wrap ul li a:hover {
    text-decoration: underline
}

.drawer {
    max-height: 0;
    max-height: 0;
    width: 100%;
    background: rgba(0, 0, 0, .95);
    left: 50%;
    top: auto;
    overflow: hidden;
    position: absolute;
    color: #fff;
    -webkit-transition: all .5s;
    -moz-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -webkit-transform: translatex(-50%);
    -moz-transform: translatex(-50%);
    -o-transform: translatex(-50%);
    -ms- transform: translatex(-50%);
    transform: translatex(-50%);
    -webkit-border-radius: 0 0 4px 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 4px 4px;
    -moz-background-clip: padding;
    border-radius: 0 0 4px 4px;
    background-clip: padding-box
}

.drawer.active {
    max-height: 300px;
    max-height: 21.428571428571427rem
}

.drawer .panel {
    padding: 25px 35px
}

.drawer a {
    color: #fff;
    -webkit-transition: color .3s;
    -moz-transition: color .3s;
    -o-transition: color .3s;
    transition: color .3s
}

.drawer a:hover {
    color: #3579c7
}

.menupanel {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow-y: scroll;
    z-index: 4000;
    background: #19253b;
    padding: 30px;
    padding: 2.142857142857143rem
}

.menupanel.active {
    display: block
}

.menupanel hr {
    border: 0;
    display: block;
    height: 0;
    border-top: 1px solid #fff;
    margin-bottom: 15px;
    margin-bottom: 1.0714285714285714rem;
    clear: both;
    color: transparent
}

.menupanel .close {
    position: fixed;
    top: 30px;
    right: 40px;
    display: block;
    color: #fff;
    text-align: center;
    font-size: 30px;
    font-size: 2.142857142857143rem
}

.menupanel ul {
    list-style-type: none;
    margin: 20px 20px 20px 0;
    padding: 0;
    border-top: 1px dotted #fff
}

.menupanel ul li {
    border-bottom: 1px dotted #fff;
    color: #fff;
    padding: 2px 0
}

.menupanel ul li a {
    display: block;
    font-size: 13px;
    font-size: .9285714285714286rem;
    color: #fff
}

.menupanel h2 {
    color: rgba(255, 255, 255, .8)
}

.menupanel h2 a {
    color: rgba(255, 255, 255, .8)
}

.menupanel .inline-search {
    padding: 26px 0
}

.breadcrumb {
    margin: 0;
    color: rgba(255, 255, 255, .6)
}

.breadcrumb a {
    color: rgba(255, 255, 255, .6)
}

.breadcrumb a:hover {
    color: #fff
}



.page-content {
    margin: 0 auto
}

.section {
    zoom: 1;
    display: block;
    position: relative;
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding: 0
}

.section:after,
.section:before {
    content: "";
    display: table
}

.section:after {
    clear: both
}

.section.nopad {
    padding: 0
}

.section.extrapad {
    padding: 30px;
    padding: 2.142857142857143rem
}

.section.first-section {
    padding: 150px 0 0 0
}

.section.first-section .panel {
    padding-bottom: 60px;
    padding-bottom: 4.285714285714286rem
}

.panel {
    zoom: 1;
    padding: 30px 30px 18px 30px;
    position: relative
}

.panel:after,
.panel:before {
    content: "";
    display: table
}

.panel:after {
    clear: both
}

.panel.medium {
    padding: 60px 60px 48px 60px
}

.panel.extra {
    padding: 120px 120px 108px 120px
}

.panel .panel {
    margin: 0 0 15px 0
}

.panel.newsheader {
    padding-bottom: 0 !important
}

.pin {
    width: 0;
    height: 0;
    border: 25px solid transparent;
    position: absolute;
    top: -50px;
    left: 50%;
    z-index: 2000;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
}

.pin:before {
    content: '';
    position: absolute;
    left: -25px;
    top: 25px;
    width: 0;
    height: 0;
    border: 25px solid transparent
}

.pin:after {
    content: '';
    width: 50px;
    width: 3.5714285714285716rem;
    height: 50px;
    height: 3.5714285714285716rem;
    background: url("../img/pin-arrow-VLXf4fY.svg") no-repeat center center;
    position: absolute;
    left: -25px;
    top: 0
}

.swiper-container {
    max-width: 100%;
    overflow: hidden !important;
    margin: 0 0 40px 0
}

.swiper-container .swiper-slide {
    padding: 0 20px 30px 20px
}

.swiper-container .swiper-pagination-bullet {
    width: 40px;
    width: 2.857142857142857rem;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box
}

@media screen and (max-width:768px) {
    .section {
        padding: 0;
        background-attachment: scroll !important;
        background-position: top center !important;
        background-size: 160% auto !important
    }

    .section.first-section {
        padding: 30px 0 30px 0;
        text-align: center
    }

    .section.first-section .panel {
        padding-bottom: 0;
        padding-bottom: 0
    }

    .section.no_padding {
        padding: 0
    }

    .section.extrapad {
        padding: 0;
        padding: 0
    }

    .panel {
        padding: 30px 30px 15px 30px
    }

    .panel.medium {
        padding: 30px 30px 15px 30px
    }

    .panel.extra {
        padding: 30px 30px 15px 30px
    }

    .panel.nomobpad {
        padding: 0
    }
}

.banner {
    position: relative;
    background: url("../img/banner-bg-bg-35vB5OH.png") no-repeat top center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    padding-top: 230px
}

.banner .banner_wrap {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden
}

.banner .banner_aes {
    width: 400px;
    width: 28.571428571428573rem;
    height: 400px;
    height: 28.571428571428573rem;
    position: absolute;
    bottom: 20%;
    left: 65%;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s;
    -webkit-border-radius: 100%;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 100%;
    -moz-background-clip: padding;
    border-radius: 100%;
    background-clip: padding-box;
    background: url("../img/banner-bg-fg-ezojS3l.png") no-repeat top center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover
}

.banner .contentarea {
    position: relative;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    zoom: 1;
    padding: 20px 20px 20px 135px;
    max-width: 645px;
    max-width: 46.07142857142857rem;
    width: 100%
}

.banner .contentarea:after,
.banner .contentarea:before {
    content: "";
    display: table
}

.banner .contentarea:after {
    clear: both
}

.banner .contentarea blockquote {
    border: none;
    padding: 0
}

.banner .swiper-pagination {
    margin: 0 auto
}

.banner .swiper-pagination .swiper-pagination-bullet {
    margin: 20px 30px 0 0;
    width: 24px;
    width: 1.7142857142857142rem;
    height: 24px;
    height: 1.7142857142857142rem;
    border: 1px solid #fff;
    background: 0 0;
    opacity: 1
}

.banner .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #fff
}

.livesearch {
    zoom: 1;
    position: relative;
    height: auto;
    width: auto;
    padding: 50px 15%;
    margin: 80px 0 0 0;
    background: rgba(0, 39, 43, .8)
}

.livesearch:after,
.livesearch:before {
    content: "";
    display: table
}

.livesearch:after {
    clear: both
}

.livesearch . searchwrap {
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    background: #fff;
    padding: 5px 0
}

.livesearch .searchwrap input {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    padding: 12px 30px;
    width: calc(100% - 90px);
    border: none;
    line-height: 1em;
    vertical-align: middle;
    color: #343434;
    display: inline-block
}

.livesearch .searchwrap button {
    display: inline-block;
    vertical-align: middle;
    padding: 12px 18px;
    margin: 0
}

.tabs_area {
    background: url("../img/banner-bg-fg-ezojS3l.png") no-repeat top center fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    zoom: 1;
    padding: 0
}

.tabs_area:after,
.tabs_area:before {
    content: "";
    display: table
}

.tabs_area:after {
    clear: both
}

.tabs_area h2 {
    margin: 0;
    padding: 30px;
    padding: 2.142857142857143rem;
    color: #fff;
    text-align: center
}

.tabs_area .tabs_wrap {
    background: rgba(53, 121, 199, .9)
}

.tabs_area .tabs_wrap .tabs {
    margin: 0;
    padding: 0;
    width: 100%;
    zoom: 1
}

.tabs_area .tabs_wrap .tabs:after,
.tabs_area .tabs_wrap .tabs:before {
    content: "";
    display: table
}

.tabs_area .tabs_wrap .tabs:after {
    clear: both
}

.tabs_area .tabs_wrap .tabs li {
    float: left;
    width: 25%;
    display: block;
    text-align: center;
    max-height: 225px;
    max-height: 16.071428571428573rem
}

.tabs_area .tabs_wrap .tabs li .tab_wrap {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    border-right: 1px solid #3579c7
}

.tabs_area .tabs_wrap .tabs li .tab_wrap a {
    -webkit-transition: padding .2s;
    -moz-transition: padding .2s;
    -o-transition: padding .2s;
    transition: padding .2s;
    padding: 180px 0 20px 0;
    color: #fff;
    display: block;
    background: #000;
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    margin-top: 0;
    margin-top: 0;
    font-size: 24px;
    font-size: 1.7142857142857142rem;
    line-height: 26.4px;
    margin-bottom: 8.64px;
    margin-bottom: .5714285714285714rem;
    font-weight: 300;
    margin: 0
}

.tabs_area .tabs_wrap .tabs li .tab_wrap a.active {
    padding: 20px 0 180px 0;
    background: #3579c7 url("../img/pin-arrow-VLXf4fY.svg") no-repeat center center
}

.tabs_area .tabs_wrap .tabs li .tab_wrap:hover a {
    padding: 20px 0 180px 0
}

.tabs_area .tabs_wrap .tabs li:last-child .tab_wrap {
    border-right: none
}

.toggle_tab {
    display: none;
    clear: both;
    border-top: 1px solid #3579c7;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 10px 30px;
    background: #000;
    color: #fff
}

.toggle_tab:after {
    content: '';
    font-family: fontawesome;
    float: right
}

.tab_area {
    display: none
}

.tab_area.active {
    display: block
}

@media screen and (max-width:1080px) {
    .banner {
        background: url("../img/banner-bg-bg-1080-8hEVPz4.png") no-repeat top center fixed
    }

    .banner .banner_aes {
        background: url("../img/banner-bg-fg-1080-ezojS3l.png") no-repeat top center fixed
    }
}

@media screen and (max-width:860px) {
    .banner {
        background: url("../img/banner-bg-bg-860-8hEVPz4.png") no-repeat top center fixed;
        padding-top: 150px
    }

    .banner .banner_aes {
        width: 200px;
        width: 14.285714285714286rem;
        height: 200px;
        height: 14.285714285714286rem;
        left: 80%;
        bottom: 30%;
        background: url("../img/banner-bg-fg-860-ezojS3l.png") no-repeat top center fixed
    }
}

@media screen and (max-width:768px) {
    .banner {
        padding-top: 50px;
        background: url("../img/banner-bg-bg-860-8hEVPz4.png") no-repeat top center fixed
    }

    .banner .banner_aes {
        width: 200px;
        width: 14.285714285714286rem;
        height: 200px;
        height: 14.285714285714286rem;
        left: 85%;
        background: url("../img/banner-bg-fg-860-ezojS3l.png") no-repeat top center fixed
    }

    .banner .brand_image {
        width: 40%
    }

    .banner .swiper-pagination {
        display: none
    }

    .banner .contentarea {
        padding: 20px 12.5% 20px 12.5%;
        width: calc(100% - 20px)
    }

    .banner .livesearch {
        margin-top: 0;
        margin-top: 0;
        padding: 30px;
        padding: 2.142857142857143rem
    }

    .tabs_area .tabs_wrap .tabs {
        display: none
    }

    .toggle_tab {
        display: block
    }
}

.footer {
    padding: 0 30px
}

.footer ul {
    margin: 0;
    padding: 0;
    margin-top: 25px;
    margin-top: 1.7857142857142858rem;
    list-style-type: none
}

.footer ul li a {
    color: rgb(255, 255, 255) !important;
    display: inline-block;
    font-size: 13px;
    font-size: . 9285714285714286rem;
    padding: 5px 0
}

.footer ul li a .fa {
    font-size: 36px;
    font-size: 2.5714285714285716rem;
    margin-right: 10px;
    margin-right: .7142857142857143rem;
    color: #fff !important;
}

.footer p {
    font-size: 13px;
    font-size: .9285714285714286rem
    color: #fff !important;
}

#cookie-wrapper {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    -webkit-box-shadow: 0 0 4px #999;
    -moz-box-shadow: 0 0 4px #999;
    box-shadow: 0 0 4px #999
}

#cookie-wrapper .wrap {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative;
    padding: 20px 30px;
    width: 100%;
    max-width: 1280px;
    max-width: 91.42857142857143rem;
    margin: 0 auto;
    font-size: 12px;
    font-size: .8571428571428571rem
}

#cookie-wrapper .wrap a {
    color: #3579c7
}

#cookie-wrapper .wrap .closecookie {
    position: absolute;
    right: 30px;
    color: #555c65
}

.cli-switch input:checked+.cli-slider {
    background-color: #3579c7
}

#cookie-law-info-again {
    box-shadow: none !important;
    background-color: #3579c7 !important;
    color: #fff !important
}

@media screen and (max-width:768px) {
    #cookie-law-info-again {
        bottom: 54px !important
    }
}

.button,
input[type=submit] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    padding: 12px 30px;
    margin-bottom: 5px;
    margin-bottom: .35714285714285715rem;
    border: none;
    display: inline-block
}

.button.sm,
.button.small,
input[type=submit].sm,
input[type=submit].small {
    padding: 6px 15px;
    font-size: 14px;
    font-size: 1rem;
    margin-bottom: 5px;
    margin-bottom: .35714285714285715rem
}

.button.wide,
input[type=submit].wide {
    width: 100%;
    display: block;
    text-align: center
}

.button.rounded,
input[type=submit].rounded {
    -webkit-border-radius: 50px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 50px;
    -moz-background-clip: padding;
    border-radius: 50px;
    background-clip: padding-box
}

.button:hover,
input[type=submit]:hover {
    text-decoration: none !important
}

.button.thin,
input[type=submit].thin {
    padding: 7px 30px 8px;
    float: left
}

.accordion {
    margin: 15px 0 15px 0;
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .1);
    position: relative
}

.accordion .toggle_accordion {
    -webkit-border-radius: 1px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 1px;
    -moz-background-clip: padding;
    border-radius: 1px;
    background-clip: padding-box;
    font-size: 17px;
    font-size: 1.2142857142857142rem;
    margin: 0;
    padding: 28px 20px;
    background: #343434;
    color: #fff !important;
    display: block;
    line-height: .5em;
    position: relative;
    text-align: left;
    text-decoration: none !important
}

.accordion .toggle_accordion.expertise-short {
    padding-right: 60px
}

.accordion .toggle_accordion:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    height: 20px;
    height: 1.4285714285714286rem;
    padding: 6px 0 0 5px;
    width: 20px;
    width: 1.4285714285714286rem;
    color: #fff;
    content: '';
    font-family: linearicons;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translatey(-50%)
}

.accordion .toggle_accordion.active {
    background: #343434
}

.accordion .toggle_accordion.active:after {
    content: '';
    padding: 5px 0 0 4px
}

.accordion .toggle_accordion h3 {
    margin-bottom: 0
}

.accordion .accordion_content {
    zoom: 1;
    display: none;
    padding: 20px;
    padding: 1.4285714285714286rem;
    background: rgba(52, 52, 52, .9);
    color: #fff
}

.accordion .accordion_content:after,
.accordion .accordion_content:before {
    content: "";
    display: table
}

.accordion .accordion_content:after {
    clear: both
}

.accordion .accordion_content.active {
    display: block
}

.accordion.light .toggle_accordion {
    background: #fff;
    color: #555c65 !important
}

.accordion.light .toggle_accordion:after {
    color: #3579c7 !important
}

.accordion.light .toggle_accordion.active:after {
    color: #3579c7
}

.accordion.light .accordion_content {
    background: rgba(255, 255, 255, .55);
    color: #555c65
}

.accordion.medium .toggle_accordion {
    background: #465460
}

.accordion.medium .accordion_content {
    background: rgba(70, 84, 96, .55)
}

.inlinetabs {
    padding: 3px 2px !important;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    - webkit-box-shadow: inset 0 0 5px rgba(0, 0, 0, .2);
    -moz-box-shadow: inset 0 0 5px rgba(0, 0, 0, .2);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, .2);
    background: #ededed;
    display: inline-block;
    font-size: 14px;
    list-style-type: none;
    max-width: 85%;
    overflow: hidden
}

.inlinetabs li {
    margin: 0 !important;
    padding: 0 1.5px !important;
    display: block;
    float: left
}

.inlinetabs li:first-child {
    padding: 0 1.5px 0 0
}

.inlinetabs li:last-child {
    padding: 0 0 0 1.5px
}

.inlinetabs li:after,
.inlinetabs li:before {
    content: '';
    display: none
}

.inlinetabs a {
    padding: 6px 14px;
    line-height: 14px;
    line-height: 1rem;
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box;
    display: block;
    float: left;
    border: 3px solid transparent;
    color: #000;
    text-decoration: none !important
}

.inlinetabs a.active,
.inlinetabs a:hover {
    background-color: #343434;
    border: 3px solid #343434;
    color: #fff
}

.tabbedarea {
    display: none
}

.tabbedarea.active {
    display: block
}

.inline-slide {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 50px
}

.custom-pagination {
    display: table;
    padding: 0;
    margin: 20px auto !important;
    background: #fff;
    border: 1px solid #ccc;
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box
}

.custom-pagination .page-numbers {
    display: block;
    float: left;
    padding: 14px 12px 14px 12px;
    margin: 0;
    line-height: 0;
    font-size: 14px;
    color: #3579c7;
    border-right: 1px solid #ccc
}

.custom-pagination .page-numbers.current {
    font-weight: 400
}

.custom-pagination .page-numbers:last-child {
    border-right: none
}

body .swiper-button-next {
    
}

body .swiper-button-prev {
    
}

body .swiper-pagination-bullet {
    background-color: rgba(0, 0, 0, .9)
}

body .swiper-pagination-bullet-active {
    background-color: #000
}

.nice-select {
    color: #555c65;
    float: right
}

.nice-select .list {
    padding: 0 !important
}

.nice-select .list li:before {
    display: none
}

.nice-select.wide {
    width: 100%;
    margin: 0
}

.nice-select.linkurl li {
    line-height: 30px;
    line-height: 2.142857142857143rem;
    min-height: 30px;
    min-height: 2.142857142857143rem
}

.readmore>a {
    text-transform: uppercase;
    font-size: 12px;
    font-size: .8571428571428571rem;
    color: #74879c
}

.more {
    display: none
}

.more.active {
    display: block
}

.more.news {
    display: inline-block;
    margin-left: 10px;
    margin-left: .7142857142857143rem
}

.textwidget {
    zoom: 1
}

.textwidget:after,
.textwidget:before {
    content: "";
    display: table
}

.textwidget:after {
    clear: both
}

.article {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px 20px 10px;
    display: block
}

.article a {
    display: block;
    overflow: hidden;
    position: relative
}

.article a img {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -moz-transform: translate(-50%, 0);
    -o-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    min-height: 100%;
    min-width: 100%
}

.article a .details {
    padding: 30px;
    padding: 2.142857142857143rem;
    position: relative;
    display: inline-block;
    text-transform: uppercase;
    opacity: .5;
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    color: #fff;
    font-size: 12px;
    font-size: .8571428571428571rem
}

.article a .details.boxed {
    background: rgba(0, 0, 0, .5);
    padding: 20px 30px
}

.article a .content {
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 30px;
    padding: 2.142857142857143rem;
    color: #fff !important
}

.article a .content h2 {
    color: #fff !important
}

.article a .content .more {
    color: #3579c7
}

.article a .content h2:last-child,
.article a .content p:last-child {
    margin: 0
}

.article a.bg_mono_100 .details {
    color: #555c65
}

.article a.bg_mono_100 .content {
    color: #555c65 !important
}

.article a.bg_mono_100 .content h2 {
    color: #555c65 !important
}

.article.small {
    width: 25%;
    float: left
}


.article.inline {
    width: 33.3%;
    padding: 0 20px 20px 0;
    float: left
}

.article.inline a {
    min-height: 200px;
    min-height: 14.285714285714286rem
}

/* ==========================================================================
   THE BELLISAN - ANASAYFA KUTU MODELİ DÜZELTME PROTOKOLÜ
   ========================================================================== */

/* 1. Medium ve Small Kartların İçindeki A Etiketini Esnetiyoruz */
.article.medium a,
.article.small a {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-sizing: border-box !important;
}

/* 2. En Üstteki Detay Alanının Altındaki absolute Baskısını Kaldırıyoruz */
.article.medium a .details,
.article.small a .details {
    display: block !important;
    position: relative !important;
    padding: 25px 25px 0 25px !important;
    /* Sol ve üst boşluk orijinal kalibrede */
    margin-bottom: auto !important;
}

/* 3. KRİTİK HAMLE: .content Alanının Absolute Kilidini Medium ve Small İçin Kırıyoruz! */
.article.medium a .content,
.article.small a .content {
    position: relative !important;
    /* Kartın tabanına çakılma kilidini açtık */
    display: block !important;
    width: 100% !important;
    padding: 15px 25px 25px 25px !important;
    /* Yazıların kenarlara dayanmasını engelleyen zırh */
    box-sizing: border-box !important;
}

/* 4. Yazıların Boyutlarını ve Satır Aralıklarını Bu Kutular İçin Törpülüyoruz */
.article.medium a .content h2 {
    font-family: 'Garamond', Georgia, serif !important;
    font-size: 20px !important;
    /* 230px'lik kutu için ideal asalet */
    line-height: 1.3 !important;
    margin-bottom: 8px !important;
}

.article.medium a .content p {
    font-size: 13px !important;
    line-height: 1.5 !important;
    opacity: 0.9;
}

/* Small (Cases) Kartı Zaten Çok Dar (165px), O Yüzden Sadece Başlık Sığmalı */
.article.small a .content h2 {
    font-family: 'Garamond', Georgia, serif !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
}

/* ==========================================================================
   THE BELLISAN - ZIGZAG ENGELLEME VE KUSURSUZ HİZALAMA PROTOKOLÜ
   ========================================================================== */

/* 1. Tüm kartların içinde barındığı ana paneli Flexbox yapıyoruz */
.panel.featured_news {
    display: flex !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
}

/* 2. Ortak Makale Kurallarını Düzenleme (Float Temizliği) */
.article {
    float: none !important;
    /* O zigzagı yaratan katili tamamen öldürüyoruz */
    display: flex !important;
    /* Kartın kendisini de esnek yapıyoruz */
    flex-direction: column !important;
    box-sizing: border-box !important;
    padding: 10px !important;
    /* Kartlar arasında temiz kurumsal mesafe */
}

/* 3. Genişlikleri ve Esneklikleri Sabitleme */
.article.large {
    width: 100% !important;
    flex: 0 0 100% !important;
}

.article.medium {
    width: 50% !important;
    flex: 0 0 50% !important;
    /* Ekran ne olursa olsun tam %50 kaplasın */
}

.article.small {
    width: 25% !important;
    flex: 0 0 25% !important;
    /* Büyük ekranda tam %25 kaplasın */
}

/* 4. İçerideki Linklerin (A) Boylarını ve İçini Milimetrik Eşitleme */
.article a {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    width: 100% !important;
    height: 100% !important;
    /* Bulunduğu kutunun boyunu %100 doldurur */
    box-sizing: border-box !important;
}

/* 5. MOBİL VE TABLET UYUMLULUĞU (Ekran küçülürken zigzag olmaması için kırılmalar) */

/* Ekran 1024px'in altına indiğinde (Tablet): 4'lü olan küçük kartları 2'li (%50) düzene çekiyoruz */
@media screen and (max-width: 1024px) {
    .article.small {
        width: 50% !important;
        flex: 0 0 50% !important;
    }
}

/* Ekran 768px'in altına indiğinde (Mobil): Tüm kartlar tam ekran tek sütun akar */
@media screen and (max-width: 768px) {

    .article.medium,
    .article.small {
        width: 100% !important;
        flex: 0 0 100% !important;
    }

    .article.medium a,
    .article.small a {
        min-height: 200px !important;
        /* Mobilde çok boğulmasınlar */
    }
}


.article.medium {
    width: 50%;
    float: left
}


.article.large {
    width: 100%
}

.article.large a {
    min-height: 350px;
    min-height: 25rem
}

.article.large a .content {
    max-width: calc(50% - 10px)
}

.archive-listing {
    padding-top: 30px;
    padding-top: 2.142857142857143rem
}

.article-listing {
    float: left;
    overflow: hidden;
    margin: 10px;
    margin: .7142857142857143rem;
    width: 100%;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .5);
    padding: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.article-listing .news-content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px;
    padding: 1.4285714285714286rem
}

.article-listing .news-meta .news-cat,
.article-listing .news-meta .news-pa {
    color: #555c65;
    font-size: 12px;
    font-size: .8571428571428571rem;
    padding: 2px 0;
    display: inline-block
}

.bg_blue_001.article-listing .news-meta .news-cat,
.bg_blue_001.article-listing .news-meta .news-pa {
    color: #fff
}

.article-listing .news-content {
    position: relative
}

.article-listing .news-content .news-copy .article-share {
    float: right;
    font-size: 0;
    font-size: 0;
    color: transparent
}

.article-listing .news-content .news-copy .article-share .fa {
    font-size: 12px;
    font-size: .8571428571428571rem;
    color: #919191;
    margin-left: 12px;
    margin-left: .8571428571428571rem
}

.article-listing .news-content h2 {
    font-weight: 700;
    font-size: 20px;
    font-size: 1.4285714285714286rem;
    line-height: 1.25
}

.article-listing .news-content h2 a {
    color: #555c65
}

.bg_blue_001.article-listing .news-content h2 a {
    color: #fff
}

.bg_blue_001.article-listing .news-content h2 {
    color: #fff
}

.article-listing .news-content p {
    color: #838a8e;
    line-height: 1.25;
    padding-bottom: 8px;
    padding-bottom: .5714285714285714rem;
    border-bottom: 1px solid #dcdcdc;
    font-weight: 300
}

.article-listing .news-content .more-button {
    color: #555c65;
    font-size: 14px;
    font-size: 1rem
}

.bg_blue_001.article-listing .news-content .more-button {
    color: #fff
}

.panel .news_tab {
    display: inline-block;
    position: relative;
    margin: 0 10px;
    color: #fff;
    text-transform: uppercase
}

.panel .news_tab.active:after {
    color: #fff;
    content: '';
    font-family: linearicons;
    position: absolute;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%);
    left: 50%;
    bottom: -20px;
    font-size: 14px;
    opacity: .5
}

.bg_grad {
    padding-top: 140px;
    padding-top: 10rem
}

.subscribe {
    display: none;
    -webkit-border-radius: 5px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 5px;
    -moz-background-clip: padding;
    border-radius: 5px;
    background-clip: padding-box;
    background: #ededed;
    padding: 15px;
    padding: 1.0714285714285714rem;
    margin: 0 0 20px 0;
    position: relative
}

.subscribe.active {
    display: block
}

.subscribe .close {
    position: absolute;
    top: 10px;
    right: 10px;
    color: #555c65
}

.subscribewrap {
    background: #fff;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    margin: 0 0 10px 0;
    overflow: hidden;
    zoom: 1
}

.subscribewrap:after,
.subscribewrap:before {
    content: "";
    display: table
}

.subscribewrap:after {
    clear: both
}

.subscribewrap button,
.subscribewrap input,
.subscribewrap label {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    font-size: 14px;
    font-size: 1rem;
    padding: 12px 10px 10px 10px;
    margin: 0;
    border: none;
    background: 0 0;
    display: block;
    float: left
}

.subscribewrap label {
    background: #555c65;
    color: #fff;
    width: 100px;
    width: 7.142857142857143rem;
    background: #000
}

.subscribewrap input {
    width: calc(100% - 138px);
    color: #555c65 !important
}

.subscribewrap button {
    padding: 10px 10px 5px 10px;
    width: 30px;
    width: 2.142857142857143rem;
    font-size: 18px;
    font-size: 1.2857142857142858rem;
    color: #3579c7
}

.share {
    background: rgba(0, 0, 0, .5);
    border-radius: 2px;
    margin: 0 0 10px 0;
    overflow: hidden;

    /* İki ana elementi (Label ve Links) yan yana diziyoruz */
    display: flex;
    align-items: center;
    /* Dikeyde tam ortalansınlar */
}

.share .label {
    padding: 10px 15px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    /* float ve sabit genişlikleri kaldırdık, flexbox hallediyor */
}

.share .links {
    padding: 5px;
    /* İkon kutularını yan yana dizen sihirli dokunuş: */
    display: flex;
    flex-wrap: wrap;
    /* Sığmazsa alt satıra geçebilsinler */
    gap: 5px;
    /* İkonların arasındaki boşluğu temizce ayarlar */
}

.share .links a {
    color: #fff !important;
    border-radius: 50%;

    /* İkon dairesinin boyutları */
    width: 18px;
    /* 22px ikonlar için biraz küçüktü, tam yuvarlak görünmesi için 32px yaptık */
    height: 18px;

    /* İkonu dairenin tam ortasına oturtmak için en temiz yöntem: */
    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 14px;
    /* İkonların boyutu */
    transition: background 0.2s ease;
    /* Hover geçişi yumuşak olsun */
    text-decoration: none !important;
}

.share .links a:hover {
    color: #fff;
    /* Hover olduğunda ikon beyaz olsun */
}

.share:after,
.share:before {
    content: "";
    display: table
}

.share:after {
    clear: both
}



.widget_accordion_archive ul {
    padding: 0;
    margin: 0;
    list-style: none
}

.widget_accordion_archive ul li {
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    position: relative
}

.widget_accordion_archive ul li a {
    display: block;
    padding: 5px 0
}

.widget_accordion_archive ul li.archive-accordion-year:hover {
    cursor: pointer
}

.widget_accordion_archive ul li.archive-accordion-year ul {
    display: none
}

.widget_accordion_archive ul li ul {
    border: none
}

.widget_accordion_archive ul li ul li a {
    padding-left: 20px;
    padding-left: 1.4285714285714286rem
}

.widget_accordion_archive ul li ul li a:before {
    content: '- '
}

.post_details span {
    display: inline-block;
    padding: 0 5px 15px 5px;
    border-right: 1px solid rgba(255, 255, 255, .5);
    text-transform: uppercase;
    font-size: 14px;
    font-size: 1rem
}

.post_details span:first-child {
    padding-left: 0
}

.post_details span:last-child {
    padding-right: 0;
    border: none
}

.widget {
    margin: 0 0 20px 0
}

.widget .barrister {
    position: relative;
    background: #fff;
    border: 1px solid rgba(0, 0, 0, .2);
    margin: 10px;
    padding: 10px;
}

.widget .barrister img {
    display: block;
    max-height: 101px;
    max-height: 7.214285714285714rem;
    width: auto !important
}

.widget .barrister a {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 12px;
    font-size: 1rem
}

.widget .barrister h4 {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 16px;
    font-size: 1.1428571428571428rem
}

.widget ul.menu,
.widget>.wrap>ul {
    list-style-type: none;
    list-style-image: none;
    margin: 0 0 20px 0 !important;
    padding: 0 !important
}

.widget ul.menu li,
.widget>.wrap>ul li {
    display: block;
    padding: 6px 0;
    border-bottom: 1px solid #bababa
}

.widget ul.menu li:before,
.widget>.wrap>ul li:before {
    display: none
}

.widget ul.menu li:last-child,
.widget>.wrap>ul li:last-child {
    border-bottom: none
}

/* ==========================================================================
   THE BELLISAN - KANUN LİSTESİ SOLA HİZALAMA PROTOKOLÜ
   ========================================================================== */

/* .barrister içindeki bordered listesinin linklerine absolute baskısını kaldırıyoruz */
.widget .barrister ul.bordered li a {
    position: relative !important;
    /* Absolute kilidini kırıp akışa geri sokuyoruz */
    top: auto !important;
    right: auto !important;
    /* Sağa yaslanma zorlamasını iptal ediyoruz */
    display: inline-block !important;
    /* Rahatça sol marjda hizalansın */
    text-align: left !important;
    width: 100% !important;
    padding: 8px 0 !important;
    /* Kutunun içindeki sıkışıklığı gideren şık nefes boşluğu */
}

/* Listenin tarayıcı varsayılanından kalan sola dayalı padding dengesini kurumsal standarta çekiyoruz */
.widget .barrister ul.bordered {
    margin: 10px 0 !important;
    padding: 0 10px !important;
    text-align: left !important;
    /* Üst katmandan gelebilecek ortalama/sağa yaslama miraslarını eziyoruz */
}


@media screen and (max-width:960px) {
    .article.small {
        width: 50%;
        float: left
    }



    .article.medium {
        width: 50%;
        float: left
    }



    .article.large {
        width: 100%
    }

    .article.large a {
        min-height: 350px;
        min-height: 25rem
    }

    .article.large a .content {
        max-width: 100%
    }

    .article.inline {
        width: 50%;
        padding: 0 20px 20px 0;
        float: left
    }

    .article.inline a {
        min-height: 165px;
        min-height: 11.785714285714286rem
    }
}

@media screen and (max-width:768px) {
    .article.small {
        width: 100%;
        float: left
    }



    .article.medium {
        width: 100%;
        float: left
    }



    .article.large {
        width: 100%
    }

    .article.large a {
        min-height: 350px;
        min-height: 25rem
    }

    .article.large a .content {
        max-width: 100%
    }

    .article.inline {
        width: 100%;
        padding: 0 20px 20px 0;
        float: left
    }

    .article.inline a {
        min-height: 165px;
        min-height: 11.785714285714286rem
    }
}

@media screen and (max-width:480px) {
    .subscribe .fieldwrap label {
        display: none
    }

    .subscribe .fieldwrap input {
        width: calc(100% - 38px)
    }
}

.barristerpreviews {
    width: 24%;
    float: left
}

.mix {
    display: none
}

.barristerpreview {
    display: none;
    margin: 0 0 10px 10px;
    background-color: #19253b;
    color: #fff;
    -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .4);
    -moz-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .4);
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .4)
}

.barristerpreview .pin {
    border-bottom-color: #19253b
}

.barristerpreview .pin:before {
    border-top-color: # 19253b
}

.barristerpreview a {
    color: #3579c7
}

.barristerpreview a:hover {
    color: #3579c7
}

.barristerpreview .swiper-button-next {
    background-image: url("../img/background-6-JMS5R.jpg")
}

.barristerpreview .swiper-button-prev {
    background-image: url("../img/background-6-JMS5R.jpg")
}

.barristerpreview .swiper-pagination-bullet {
    background-color: rgba(255, 255, 255, .9)
}

.barristerpreview .swiper-pagination-bullet-active {
    background-color: #fff
}

.barristerpreview.active {
    display: block
}

.barristerpreview .img {
    background-image: linear-gradient(120deg, #3c597a, #2d4765 60%);
    color: #fff;
    text-align: center
}

.barristerpreview .img .pin {
    border-bottom-color: #41586f
}

.barristerpreview .img .pin:before {
    border-top-color: #41586f
}

.barristerpreview .img a {
    color: #3579c7
}

.barristerpreview .img a:hover {
    color: #3579c7
}

.barristerpreview .img .swiper-button-next {
    background-image: url("../img/background-6-JMS5R.jpg")
}

.barristerpreview .img .swiper-button-prev {
    background-image: url("../img/background-6-JMS5R.jpg")
}

.barristerpreview .img .swiper-pagination-bullet {
    background-color: rgba(255, 255, 255, .9)
}

.barristerpreview .img .swiper-pagination-bullet-active {
    background-color: #fff
}

.barristerpreview img {
    display: block;
    padding-top: 10px;
    padding-top: .7142857142857143rem
}

.barristerpreview .desc {
    padding: 27px 20px 15px
}

.barristerlist {
    width: 76%;
    float: left
}

.barristerlist .barrister {
    float: left;
    width: 31.333333%;
    margin: 0 2% 15px 0;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    overflow: hidden;
    box-shadow: 0 0 2px 0 rgba(0, 0, 0, .33);
    position: relative;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.barristerlist .barrister a {
    display: block;
    border: none;
    color: #15304e;
    background: #f7f7f7;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.barristerlist .barrister a span {
    display: inline-block
}

.barristerlist .barrister a .barristerdetails {
    vertical-align: top;
    display: inline-block;
    padding: 5px 6px;
    line-height: 16px;
    line-height: 1.1428571428571428rem
}

.barristerlist .barrister a .barristerdetails .name {
    font-size: 14px;
    font-size: 1rem;
    font-weight: 700
}

.barristerlist .barrister a .barristerdetails .role {
    font-size: 12px;
    font-size: .8571428571428571rem
}

.barristerlist .barrister a.addtoport-icon {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    padding: 13px 12px
}

.barristerlist .barrister a.addtoport-icon:before {
    content: '\e68d';
    font-family: linearicons;
    color: #555c65
}

.barristerlist .barrister a.addtoport-icon.active:before {
    content: '\e68e'
}

.barristerlist .barrister.added {
    box-shadow: 0 0 0 0 transparent
}

.barristerlist .barrister.added a {
    background: #3579c7;
    color: #fff
}

.barristerlist .barrister.added a.addtoport-icon {
    background: #5c93d3;
    color: #fff
}

.barristerlist .barrister.added a.addtoport-icon:before {
    content: '\e68f';
    font-family: linearicons;
    color: #fff
}

.barristerlist .barrister:hover {
    box-shadow: 0 0 0 0 transparent
}

.barristerlist .barrister:hover a {
    background: #3579c7;
    color: #fff
}

.barristerlist .barrister:hover a.addtoport-icon {
    background: #5c93d3;
    color: #fff
}

.barristerlist .barrister:hover a.addtoport-icon:before {
    color: #fff
}

.barristerlist.full .barrister {
    width: 32%;
    margin: 0 .5% 15px .5%
}

. addtoport-icon:before {
    content: '\e68d';
    font-family: linearicons
}

.addtoport-icon.archive-star {
    position: absolute;
    bottom: 52px;
    right: 20px
}

.addtoport-icon.active:before {
    content: '\e68e';
    color: #3579c7
}

.addtoport-icon.single-add {
    position: absolute;
    top: 17px;
    right: 30px;
    z-index: 3;
    padding: 10px
}

.addtoport-icon.icon-enter-down2:before {
    content: '\e900'
}

.stickem-container {
    position: relative;
    zoom: 1
}

.stickem-container:after,
.stickem-container:before {
    content: "";
    display: table
}

.stickem-container:after {
    clear: both
}

.stickem-container .stickit {
    position: absolute;
    max-width: 350px;
    top: 120px;
    right: 0;
    width: 24.5%
}

.stickem-container .stickit-end {
    bottom: 40px;
    position: absolute
}

.stickem-container .stickem {
    margin-top: 0;
    margin-top: 0
}

.toggleview {
    -webkit-border-radius: 10px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 10px;
    -moz-background-clip: padding;
    border-radius: 10px;
    background-clip: padding-box;
    padding: 10px;
    padding: .7142857142857143rem;
    border: 1px solid #fff;
    display: table;
    text-align: center;
    text-transform: uppercase
}

.toggleview span {
    display: table-cell;
    vertical-align: middle;
    padding: 0 5px
}

.toggleview span.icon {
    display: none;
    font-size: 30px;
    font-size: 2.142857142857143rem
}

.toggleview span.icon.active {
    display: table-cell
}

.toggleview a:hover,
.toggleview:hover {
    text-decoration: none !important
}

.toggleview:active {
    opacity: .8
}

.filter {
    padding-left: 0 !important;
    padding-bottom: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 20px !important;
    margin-bottom: 1.4285714285714286rem !important;
    border-bottom: 1px solid #ededed
}

.filter li:before {
    display: none;
    margin: 0
}

.filter>li>a {
    font-size: 20px;
    font-size: 1.4285714285714286rem;
    color: #555c65;
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    font-size: 18px;
    font-size: 1.2857142857142858rem;
    display: block;
    padding: 10px 0 15px 0
}

.filter>li>a:after {
    content: '';
    float: right;
    font-family: linearicons
}

.filter-reset.filter>li>a:after {
    content: 'x';
    float: right;
    font-family: GillSansMTPro, Helvetica, Arial, sans-serif
}

.filter>li ul {
    display: none;
    padding-left: 0 !important
}

.filter>li ul.active {
    display: block
}

.filter>li ul li a {
    font-size: 14px;
    font-size: 1rem;
    line-height: 18px;
    line-height: 1.2857142857142858rem;
    color: #555c65;
    position: relative;
    display: block;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 5px 20px;
    border-top: 1px solid #ededed
}

.filter>li ul li a:before {
    content: '';
    font-family: linearicons;
    position: absolute;
    left: 0;
    color: #d4d4d4;
    font-size: 13px;
    font-size: .9285714285714286rem
}

.filter>li ul li a.active {
    font-weight: 700
}

.filter>li ul li a.active:before {
    content: ''
}

.staff.barristers.grid h2,
.staff.barristers.list h2 {
    width: 100%;
    float: left;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 10px
}

.barristers.grid .barrister,
.barristers.list .barrister {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 25%;
    padding: 0 10px 20px 10px;
    position: relative;
    float: left
}

.barristers.grid .barrister .wrap,
.barristers.list .barrister .wrap {
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .2);
    display: block;
    background-color: #fff;
    padding: 10px;
    padding: .7142857142857143rem
}

.barristers.grid .barrister .wrap .img,
.barristers.list .barrister .wrap .img {
    display: block;
    background-image: linear-gradient(to bottom, #61768a, #213b55);
    max-height: 1000px;
    max-height: 71.42857142857143rem
}

.barristers.grid .barrister .wrap .img img,
.barristers.list .barrister .wrap .img img {
    display: block
}

.barristers.grid .barrister .wrap h2,
.barristers.grid .barrister .wrap h3,
.barristers.list .barrister .wrap h2,
.barristers.list .barrister .wrap h3 {
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    line-height: 16px;
    line-height: 1.1428571428571428rem;
    color: #1a1a1a;
    margin: 5px 0 5px 0;
    font-family: GillSansMTPro, Helvetica, Arial, sans-serif;
    font-weight: 400
}

.barristers.grid .barrister .wrap p,
.barristers.list .barrister .wrap p {
    font-size: 13px;
    font-size: .9285714285714286rem;
    line-height: 13px;
    line-height: .9285714285714286rem;
    color: #b3b3b3;
    margin: 5px 0 5px 0
}

.barristers.grid .barrister .wrap p.job-title,
.barristers.list .barrister .wrap p.job-title {
    font-size:
        14px;
    font-size: 1rem;
    line-height: 14px;
    line-height: 1rem;
    color: #666
}

.barristers.grid .barrister a.wrap:hover,
.barristers.list .barrister a.wrap:hover {
    -webkit-transform: all .2s;
    -moz-transform: all .2s;
    -o-transform: all .2s;
    -ms-transform: all .2s;
    transform: all .2s;
    text-decoration: none;
    -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, .2);
    box-shadow: 0 0 0 0 rgba(0, 0, 0, .2)
}

.barristers.grid .barrister a.wrap:hover .img,
.barristers.list .barrister a.wrap:hover .img {
    -webkit-transform: all 3s;
    -moz-transform: all 3s;
    -o-transform: all 3s;
    -ms-transform: all 3s;
    transform: all 3s;
    background-image: linear-gradient(to bottom, #7b8fa3, #24405c)
}

.barristers.grid .barrister a.addtoportfolio,
.barristers.list .barrister a.addtoportfolio {
    position: absolute;
    bottom: 52px;
    right: 20px;
    color: #555c65
}

.barristers.grid .barrister a.addtoportfolio:hover,
.barristers.list .barrister a.addtoportfolio:hover {
    color: #3579c7;
    text-decoration: none
}

.barristers.list .barrister .wrap .img {
    overflow: hidden;
    max-height: 1px;
    max-height: .07142857142857142rem;
    background-image: none
}

.barristers.list .barrister .wrap .img img {
    margin-top: 1px;
    margin-top: .07142857142857142rem
}

.barristers.list .barrister a.wrap:hover .img {
    background-image: none
}

.barristers.grid .cta {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    width: calc(25% - 20px);
    margin: 0 10px 10px 10px;
    max-height: 248px;
    max-height: 17.714285714285715rem;
    padding-bottom: 20px;
    padding-bottom: 1.4285714285714286rem
}

.barristers.grid .cta h2 {
    color: #fff
}

.barristers.grid .cta .cta-inner {
    padding: 20px 20px 10px 20px
}

.barristers.list .cta {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: none;
    clear: both;
    width: calc(100% - 20px);
    margin: 0 10px 10px 10px;
    padding-bottom: 20px;
    padding-bottom: 1.4285714285714286rem;
    max-height: 248px;
    max-height: 17.714285714285715rem
}

.barristers.list .cta h2 {
    color: #fff
}

.barristers.list .cta .cta-inner {
    padding: 20px 20px 10px 20px
}

.bt_tools {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: no-wrap;
    -ms-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-justify-content: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-align-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-align-items: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center
}

.bt_tools .col {
    padding: 20px 20px 30px 20px;
    -ms-align-items: stretch;
    -webkit-box-align: stretch;
    -moz-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.bt_tools .col a {
    color: #fff
}

.bt_tools .bt_search {
    -ms-flex-grow: 2;
    -webkit-flex-grow: 2;
    flex-grow: 2;
    -ms-align-self: stretch;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch
}

.br_heading {
    display: -webkit-flex;
    display: -ms-flexbox;
    display: -ms-flex;
    display: flex;
    -webkit-flex-wrap: no-wrap;
    -ms-flex-wrap: no-wrap;
    flex-wrap: no-wrap;
    -webkit-box-direction: normal;
    -moz-box-direction: normal;
    -webkit-box-orient: horizontal;
    -moz-box-orient: horizontal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -ms-align-items: center;
    -webkit-box-align: center;
    -moz-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-justify-content: center;
    -webkit-box-pack: center;
    -moz-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -ms-align-content: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    -ms-align-items: flex-end;
    -webkit-box-align: end;
    -moz-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end
}

.br_heading .br_details,
.br_heading .br_img,
.br_heading .br_quotes {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.br_heading .br_img {
    width: 30%;
    -ms-align-self: flex- end;
    -webkit-align-self: flex-end;
    -ms-flex-item-align: end;
    align-self: flex-end
}

.br_heading .br_img img {
    display: block
}

.br_heading .br_details {
    width: 47%;
    -ms-align-self: stretch;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    padding: 40px 30px 30px 30px
}

.br_heading .br_details.full-size {
    width: 70%
}

.br_heading .br_details h1 {
    font-size: 40px;
    font-size: 2.857142857142857rem;
    margin: 0 0 5px 0
}

.br_heading .br_details blockquote {
    border: none;
    padding: 5px 0 5px 0;
    color: rgba(255, 255, 255, .6)
}

.br_heading .br_details blockquote p {
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    font-style: italic
}

.br_heading .br_details hr {
    border: 0;
    display: block;
    height: 0;
    border-top: 1px solid rgba(255, 255, 255, .2);
    margin-bottom: 15px;
    margin-bottom: 1.0714285714285714rem;
    clear: both;
    color: transparent;
    width: 60%;
    margin: 0
}

.br_heading .br_details dl {
    font-size: 15px;
    font-size: 1.0714285714285714rem
}

.br_heading .br_details dl dt {
    color: rgba(255, 255, 255, .6);
    width: 100px;
    width: 7.142857142857143rem
}

.br_heading .br_details dl dd a {
    color: rgba(255, 255, 255, .7)
}

.br_heading .br_quotes {
    width: 23%;
    -ms-align-self: stretch;
    -webkit-align-self: stretch;
    -ms-flex-item-align: stretch;
    align-self: stretch;
    padding: 40px 0 0 0;
    border-left: 1px solid rgba(255, 255, 255, .2)
}

.br_heading .br_quotes img {
    max-width: 75%
}

.br_heading .br_quotes .swiper-container {
    margin: 0
}

.br_heading .br_quotes .swiper-button-next,
.br_heading .br_quotes .swiper-button-prev {
    background-size: auto 20px
}

.br_tools {
    list-style-type: none;
    float: right;
    margin: 0;
    padding: 0;
    display: table
}

.br_tools li {
    display: table-cell;
    vertical-align: middle;
    border-left: 1px solid rgba(255, 255, 255, .2);
    padding: 8px 10px
}

.br_tools li a {
    display: inline-block;
    padding: 0 5px;
    color: #fff
}

.br_tools li a span {
    margin-right: 5px;
    margin-right: .35714285714285715rem
}

.br_tools li:hover {
    background-color: #000
}

.icon-star-empty {
    color: rgba(255, 255, 255, .5) !important
}

.icon-star {
    color: #3579c7 !important
}

.readmore {
    text-align: center
}

.readmore hr {
    margin: 0 auto !important
}

.readmore>a {
    margin: 10px 0;
    display: block
}

.readmore .more {
    text-align: left
}

.expertise-listings .accordion_content h3.representative-cases,
.expertise-listings .accordion_content h4.representative-cases {
    display: inline-block;
    float: left;
    margin-top: 20px;
    margin-top: 1.4285714285714286rem;
    margin-bottom: 20px;
    margin-bottom: 1.4285714285714286rem
}

.expertise-listings .accordion_content .toggleview {
    display: inline-block;
    float: left;
    font-size: 12px;
    font-size: .8571428571428571rem;
    padding: 3px;
    padding: .21428571428571427rem;
    -webkit-border-radius: 9px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 9px;
    -moz-background-clip: padding;
    border-radius: 9px;
    background-clip: padding-box;
    border-color: #dadcdf;
    margin-left: 20px;
    margin-left: 1.4285714285714286rem;
    color: #555c65;
    margin-top: 17px
}

.expertise-listings .accordion_content .toggleview .icon {
    font-size: 24px;
    font-size: 1.7142857142857142rem
}

.expertise-listings .accordion_content .cases-grid {
    list-style: none;
    padding-left: 0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    float: left;
    width: 100%
}

.expertise-listings .accordion_content .cases-grid li {
    padding: 0 5px;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    width: 33.33333%;
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0 1 auto;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin: 0 0 10px
}

.expertise-listings .accordion_content .cases-grid li.hidden {
    display: none
}

.expertise-listings .accordion_content .cases-grid li:before {
    content: ''
}

.expertise-listings .accordion_content .cases-grid li .case-content {
    background-color: #fff;
    box-shadow: 0 0 30px rgba(0, 0, 0, .07);
    padding: 20px 20px 12px;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.expertise-listings .accordion_content .cases-grid li .case-content h4,
.expertise-listings .accordion_content .cases-grid li .case-content h5 {
    font-family: GillSansMTPro, Helvetica, Arial, sans-serif;
    font-size: 16px;
    font-size: 1.1428571428571428rem;
    font-weight: 700;
    font-style: italic
}

.expertise-listings .accordion_content .cases-grid li .case-content . case-text {
    font-size: 14px;
    font-size: 1rem;
    font-weight: 300
}

.expertise-listings .accordion_content .cases-grid li .case-content .case-text ul {
    list-style-type: disc
}

.expertise-listings .accordion_content .cases-grid li .case-content .case-text ul li {
    display: list-item;
    width: 100%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.expertise-listings .accordion_content .cases-grid.list li {
    width: 100%
}

.quote-box.hidden {
    display: none
}

@media screen and (max-width:1280px) {
    .br_heading .br_img {
        -ms-align-self: stretch;
        -webkit-align-self: stretch;
        -ms-flex-item-align: stretch;
        align-self: stretch
    }

    .br_heading .br_img img {
        margin: 40px 30px 30px 30px;
        width: calc(100% - 60px);
        border: 1px solid rgba(255, 255, 255, .5)
    }
}

@media screen and (max-width:1150px) {

    .barristers.grid .barrister,
    .barristers.list .barrister {
        width: 33.3%
    }
}

@media screen and (max-width:1080px) {
    .barristerlist {
        width: 65%
    }

    .barristerlist .barrister {
        float: left;
        width: 48%
    }

    .barristerpreviews {
        width: 35%
    }

    .stickit {
        width: 35%
    }

    .expertise-listings .accordion_content .cases-grid li {
        width: 50%
    }
}

@media screen and (max-width:960px) {

    .barristers.grid .barrister,
    .barristers.list .barrister {
        width: 50%
    }

    .br_heading {
        display: -webkit-flex;
        display: -ms-flexbox;
        display: -ms-flex;
        display: flex;
        -webkit-flex-wrap: stretch;
        -ms-flex-wrap: stretch;
        flex-wrap: stretch
    }

    .br_heading .br_img {
        width: 50%
    }

    .br_heading .br_details {
        width: 50%;
        border-right: none
    }

    .br_heading .br_details.full-size {
        width: 50%
    }

    .br_heading .br_quotes {
        display: none
    }
}

@media screen and (max-width:860px) {
    .barristerlist {
        width: 100%
    }

    .barristerlist .barrister {
        float: left;
        width: 48%
    }

    .barristerpreviews {
        display: none
    }

    .stickit {
        display: none
    }
}

@media screen and (max-width:768px) {
    .barristers-panel.panel {
        padding: 30px 20px 15px 20px
    }

    .bt_tools {
        display: block
    }

    .bt_tools .bt_title,
    .bt_tools .col,
    .bt_tools .col.bt_search .bt_togglegrid {
        display: block;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding: 10px 20px;
        text-align: center
    }

    .toggleview {
        margin: 0 auto
    }

    .barristers.list .barrister {
        width: 100%
    }

    .br_heading {
        display: block;
        text-align: center;
        margin-bottom: 0
    }

    .br_heading .br_img {
        display: inline-block;
        width: 40%;
        background-color: rgba(25, 37, 59, .5);
        margin: 0 0 10px 0
    }

    .br_heading .br_img img {
        margin: 0;
        border: none;
        width: auto
    }

    .br_heading .br_details {
        padding: 0;
        display: block;
        width: 100%
    }

    .br_heading .br_details .breadcrumb {
        display: none
    }

    .br_heading .br_details h1 {
        font-size: 30px;
        font-size: 2.142857142857143rem
    }

    .br_heading .br_details hr {
        margin: 0 auto
    }

    .br_heading .br_details.full-size {
        width: 100%
    }

    .br_heading .br_details dl {
        margin: 10px auto;
        margin: .7142857142857143rem auto;
        width: 50%
    }

    .br_heading .br_details dl dd,
    .br_heading .br_details dl dt {
        text-align: center
    }

    .br_heading .br_quotes {
        display: none
    }

    .br_tools {
        list-style-type: none;
        float: none;
        margin: 0;
        padding: 0;
        display: block
    }

    .br_tools li {
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        float: left;
        display: inline-block;
        border-bottom: 1px solid rgba(255, 255, 255, .2);
        padding: 8px 10px
    }

    .br_tools li a {
        display: inline-block;
        padding: 0 5px
    }

    .br_tools li a img.icon {
        max-height: 18px;
        max-height: 1.2857142857142858rem;
        display: block
    }

    .br_tools li a .icon-star-empty {
        color: rgba(255, 255, 255, .5) !important
    }

    .br_tools li a .icon-star {
        color: #3579c7 !important
    }

    .br_tools li.social {
        line-height: .8em
    }

    .br_tools li:hover {
        background-color: #000
    }

    .barristerlist {
        width: 100%
    }

    .barristerlist .barrister {
        float: left;
        width: 100%
    }
}

@media screen and (max-width:550px) {
    .expertise-listings .accordion_content .toggleview {
        display: none
    }

    .expertise-listings .accordion_content .cases-grid li {
        width: 100%
    }
}

.ui-autocomplete {
    margin: 0;
    padding: 0;
    background: #fff;
    -webkit-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .16);
    -moz-box-shadow: 0 0 5px 0 rgba(0, 0, 0, .16);
    box-shadow: 0 0 5px 0 rgba(0, 0, 0, .16);
    list-style: none;
    position: absolute;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
    border-radius: 4px;
    background-clip: padding-box;
    overflow: hidden;
    border-bottom: 7px solid #3579c7
}

.ui-autocomplete li {
    padding: 10px;
    padding: .7142857142857143rem;
    border-bottom: 1px solid rgba(72, 23, 63, .1);
    position: relative;
    cursor: pointer;
    min-height: 0;
    background: #fff;
    -webkit-transition: .3s;
    -moz-transition: .3s;
    -o-transition: .3s;
    transition: .3s
}

.ui-autocomplete li:hover {
    background: #3579c7;
    color: #fff
}

.ui-autocomplete li.bounce {
    background: #212b31;
    font-weight: 700
}

.ui-autocomplete li.bounce a {
    text-decoration: none;
    color: #fff
}

.ui-autocomplete li.bounce:hover {
    background: #3579c7
}

.ui-autocomplete li.bounce:hover a {
    color: #fff
}

.ui-helper-hidden-accessible {
    display: none
}

ul.dropdown {
    z-index: 902;
    display: inline-block;
    list-style-type: none;
    text-align: left;
    margin: 0;
    padding: 0;
    width: 40%;
    margin: 10px 20px 10px 0
}

ul.dropdown.fullwidth {
    width: 100%
}

ul.dropdown>li {
    width: 100%;
    position: relative
}

ul.dropdown>li>a {
    display: block;
    background: #555c65;
    font-weight: 700;
    padding: 14px;
    padding: 1rem;
    color: #ef2d8a !important;
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    font-size: 19px;
    font-size: 1.3571428571428572rem
}

ul.dropdown>li>a i.arrow {
    display: inline-block;
    float: right;
    background-img: url("../img/pin-arrow-VLXf4fY.svg");
    background: url("../img/pin-arrow-VLXf4fY.svg") no-repeat top right;
    width: 40px;
    width: 2.857142857142857rem;
    height: 16px;
    height: 1.1428571428571428rem;
    margin: 5px 0 0 0;
    vertical-align: middle
}

ul.dropdown ul.children {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    list-style-type: none;
    margin: 0;
    padding: 0
}

ul.dropdown ul.children.active {
    display: block;
    width: auto;
    min-width: 250px
}

ul.dropdown ul.children li a {
    padding: 10px;
    padding: .7142857142857143rem;
    display: block;
    text-align: left;
    background: #555c65;
    color: #fff !important;
    border-top: 1px solid #6c7581
}

ul.dropdown ul.children li a:hover {
    background: #3e4349
}

.article-isotope {
    width: 300px;
    height: 300px;
    float: left;
    overflow: hidden;
    margin: 10px;
    margin: .7142857142857143rem;
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .5);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.article-isotope.article-image {
    height: 620px
}

.article-isotope.article-image.horizontal {
    width: 620px;
    height: 300px
}

.article-isotope.article-image.horizontal .news-content,
.article-isotope.article-image.horizontal .news-image {
    float: left
}

.article-isotope.article-image.horizontal .news-content {
    width: 310px
}

.article-isotope .news-content {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 20px;
    padding: 1.4285714285714286rem
}

.article-isotope .news-meta .news-cat,
.article-isotope .news-meta .news-pa {
    color: #555c65;
    font-size: 12px;
    font-size: .8571428571428571rem;
    padding: 2px 0;
    display: inline-block;
    float: left
}

.bg_blue_001.article-isotope .news-meta .news-cat,
.bg_blue_001.article-isotope .news-meta .news-pa {
    color: #fff
}

.article-isotope .news-content {
    position: relative;
    height: 300px
}

.article-image.article-isotope .news-content {
    height: 320px
}

.horizontal.article-image.article-isotope .news-content {
    height: 300px
}

.article-isotope .news-content .news-copy {
    position: absolute;
    bottom: 20px;
    bottom: 1.4285714285714286rem;
    width: 260px
}

.article-isotope .news-content .news-copy .article-share {
    float: right;
    font-size: 0;
    font-size: 0;
    color: transparent
}

.article-isotope .news-content .news-copy .article-share .fa {
    font-size: 12px;
    font-size: .8571428571428571rem;
    color: #919191;
    margin-left: 12px;
    margin-left: .8571428571428571rem
}

.article-isotope .news-content h2 {
    font-weight: 700;
    font-size: 20px;
    font-size: 1.4285714285714286rem;
    line-height: 1.25
}

.article-isotope .news-content h2 a {
    color: #555c65
}

.bg_blue_001.article-isotope .news-content h2 a {
    color: #fff
}

.bg_blue_001.article-isotope .news-content h2 {
    color: #fff
}

.article-isotope .news-content p {
    color: #838a8e;
    line-height: 1.25;
    padding-bottom: 8px;
    padding-bottom: .5714285714285714rem;
    border-bottom: 1px solid #dcdcdc;
    font-weight: 300
}

.article-isotope .news-content .more-button {
    color: #555c65;
    font-size: 14px;
    font-size: 1rem
}

.bg_blue_001.article-isotope .news-content .more-button {
    color: #fff
}

.tabs.news-tabs {
    font-size: 14px;
    display: inline-block;
    list-style-image: none;
    list-style-type: none;
    padding: 0;
    background: #19253b;
    border-radius: 3px
}

.tabs.news-tabs li {
    margin: 0 !important;
    padding: 3px !important;
    padding: .21428571428571427rem !important;
    display: block;
    float: left
}

.tabs.news-tabs a {
    border-radius: 2px;
    display: block;
    color: #fff;
    font-weight: 500;
    text-decoration: none !important;
    padding: 6px 10px;
    line-height: 14px;
    line-height: 1rem
}

.tabs.news-tabs a.active,
.tabs.news-tabs a:hover {
    background: #fff;
    color: #19253b
}

.tabs.news-tabs.news-tabs {
    margin: 0;
    padding: 0 !important
}

.tabs.news-tabs.news-tabs li:before {
    content: '' !important
}

.tabarea {
    display: none
}

.tabarea.active {
    display: block
}

.news-follow {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0 30px 1em;
    border-radius: 2px;
    overflow: hidden;
    zoom: 1;
    display: table;
    float: left
}

.news-follow:after,
.news-follow:before {
    content: "";
    display: table
}

.news-follow:after {
    clear: both
}

.news-follow .news-follow-text {
    background: #000;
    display: table-cell;
    color: #fff;
    font-size: 14px;
    font-size: .8571428571428571rem;
    padding: 9px 12px;
    line-height: 18px;
    line-height: 1.2857142857142858rem;
    height: 16px;
    height: 1rem
}

.news-follow .news-follow-icons {
    background: #1f3050;
    display: table-cell;
    padding: 0 5px
}

.news-follow .news-follow-icons ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.news-follow .news-follow-icons ul li {
    display: inline-block;
    line-height: 14px;
    padding: 3px 5px 4px
}

.news-follow .news-follow-icons ul li a {
    font-size: 1px;
    font-size: .07142857142857142rem;
    color: transparent;
    width: 25px;
    width: 1.7857142857142858rem;
    height: 25px;
    height: 1.7857142857142858rem;
    display: inline-block;
    background: #212b31;
    border-radius: 50%;
    text-align: center;
    padding-left: 4px;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.news-follow .news-follow-icons ul li a:before {
    color: #fff;
    font-family: "Font Awesome 6 Brands";
    font-size: 16px;
    line-height: 26px
}

/* İkonların Başlangıç ve Hover Efektleri */
.text-hover-gold {
    color: #ffffff !important;
    /* Başlangıçta şık, mat bir koyu gri */
    transition: color 0.2s ease-in-out !important;
}

.text-hover-gold:hover {
    color: #C9A961 !important;
    /* Fareyle üzerine gelince asilce Gold rengine döner! */
}


.sidebar .news-follow {
    width: 100%;
    display: table;
    margin: 0 0 1em 0;
    padding: 0
}

.sidebar .news-follow .news-follow-text {
    display: table-cell;
    width: 1%
}

.sidebar .news-follow .news-follow-icons {
    display: table-cell;
    padding: 5px 5px
}

@media screen and (max-width:960px) {
    .newsarticle {
        padding: 30px 20px 20px 20px
    }

    .newsarticle .title {
        font-size: 22px;
        font-size: 1.5714285714285714rem;
        line-height: 29px;
        line-height: 2.0714285714285716rem
    }

    .newsarticle .title.twitter {
        font-size: 20px;
        font-size: 1.4285714285714286rem
    }

    .newsarticle .title.researchgate {
        font-size: 20px;
        font-size: 1.4285714285714286rem
    }

    .newsarticle .title.orcid {
        font-size: 20px;
        font-size: 1.4285714285714286rem
    }

    .newsarticle.home {
        margin: 0 10px 30px 10px
    }

    .featured_news .grid_3,
    .featured_news .grid_9 {
        width: 100%
    }

    .featured_news .grid_3 .filter-news,
    .featured_news .grid_3 .search-news {
        width: 50%;
        float: left
    }
}

@media screen and (max-width:720px) {

    .featured_news .grid_3,
    .featured_news .grid_9 {
        margin: 0
    }

    .featured_news .grid_9 {
        padding: 25px 25px 35px
    }

    .featured_news .grid_9 h2 {
        margin-top: 40px;
        margin-top: 2.857142857142857rem
    }

    .featured_news .grid_3 {
        display: none
    }

    .article-isotope {
        width: 100%;
        height: auto;
        margin: 10px 0
    }

    .article-isotope.article-image {
        height: auto
    }

    .article-isotope.article-image.horizontal {
        width: 100%;
        height: auto
    }

    .article-isotope.article-image.horizontal .news-content {
        width: 100%
    }

    .article-isotope .news-image {
        display: none
    }

    .article-isotope .news-content {
        height: auto
    }

    .article-image.article-isotope .news-content {
        height: auto
    }

    .horizontal.article-image.article-isotope .news-content {
        height: auto
    }

    .article-isotope .news-content .news-copy {
        position: relative;
        bottom: auto;
        width: 100%
    }
}




.builder-overlay {
    background-color: rgba(0, 0, 0, .6);
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 5000;
    display: none;
    zoom: 1;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.builder-overlay .builder-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    max-width: 500px;
    width: 100%;
    background: #fff
}

.builder-overlay .builder-wrapper .builder-meta,
.builder-overlay .builder-wrapper .builder-title-bar {
    padding: 20px 40px
}

.builder-overlay .builder-wrapper .builder-title-bar {
    background-color: #ededed;
    zoom: 1
}

.builder-overlay .builder-wrapper . builder-title-bar:after,
.builder-overlay .builder-wrapper .builder-title-bar:before {
    content: "";
    display: table
}

.builder-overlay .builder-wrapper .builder-title-bar:after {
    clear: both
}

.builder-overlay .builder-wrapper .builder-title-bar .builder-title {
    float: left;
    line-height: 28px;
    line-height: 2rem;
    margin: 0
}

.builder-overlay .builder-wrapper .builder-title-bar .builder-close {
    font-size: 0;
    font-size: 0;
    line-height: 1;
    color: transparent;
    float: right
}

.builder-overlay .builder-wrapper .builder-title-bar .builder-close:after {
    content: '\f057';
    -webkit-transition: color .3s;
    -moz-transition: color .3s;
    -o-transition: color .3s;
    transition: color .3s;
    color: #3579c7;
    font-family: fontawesome;
    font-size: 27px;
    font-size: 1.9285714285714286rem;
    font-weight: 400;
    line-height: 34px;
    line-height: 2.4285714285714284rem
}

.builder-overlay .builder-wrapper .builder-title-bar .builder-close:hover:after {
    color: #25548b
}

.builder-overlay .builder-wrapper .builder-meta {
    zoom: 1
}

.builder-overlay .builder-wrapper .builder-meta:after,
.builder-overlay .builder-wrapper .builder-meta:before {
    content: "";
    display: table
}

.builder-overlay .builder-wrapper .builder-meta:after {
    clear: both
}

.builder-overlay .builder-wrapper .builder-meta p {
    margin-top: 0
}

.builder-overlay .builder-wrapper .builder-meta ul {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-bottom: 20px;
    margin-bottom: 1.4285714285714286rem
}

.builder-overlay .builder-wrapper .builder-meta .builder-confirmed {
    position: absolute;
    background: #fff;
    border-radius: 5px;
    box-shadow: 0 0 12px 4px rgba(0, 0, 0, .3);
    padding: 20px;
    top: 50%;
    left: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%)
}

.builder-overlay .builder-wrapper .button {
    width: 49%;
    background: #465460;
    color: #fff !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.builder-overlay .builder-wrapper .button.add:after,
.builder-overlay .builder-wrapper .button.download:after {
    content: ' ';
    background-repeat: no-repeat;
    float: right
}

.builder-overlay .builder-wrapper .button.download {
    float: left
}

.builder-overlay .builder-wrapper .button.download:after {
    background-image: url("../img/builder-download-GVzMc3m.jpg");
    background-image: url("../img/builder-download-GVzMc3m.jpg");
    width: 26px;
    height: 24px
}

.builder-overlay .builder-wrapper .button.add {
    float: right
}

.builder-overlay .builder-wrapper .button.add:after {
    background-image: url("../img/builder-add-JWdWbrb.jpg");
    background-image: url("../img/builder-add-JWdWbrb.jpg");
    width: 25px;
    height: 22px
}

.barristerportfolio {
    position: fixed;
    z-index: 5000;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    zoom: 1;
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0;
    overflow: scroll;
    background: rgba(0, 0, 0, .7)
}

.barristerportfolio a {
    color: #3579c7;
    font-weight: 700
}

.barristerportfolio hr {
    width: 100%
}

.barristerportfolio .portfoliowrap {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
    -moz-transform: translateY(-50%) translateX(-50%);
    -o-transform: translateY(-50%) translateX(-50%);
    -ms-transform: translateY(-50%) translateX(-50%);
    transform: translateY(-50%) translateX(-50%);
    max-width: 600px;
    width: 100%
}

.barristerportfolio .portfoliowrap.small-screen {
    top: 0;
    -webkit-transform: translateY(0) translateX(-50%);
    -moz-transform: translateY(0) translateX(-50%);
    -o-transform: translateY(0) translateX(-50%);
    -ms-transform: translateY(0) translateX(-50%);
    transform: translateY(0) translateX(-50%)
}

.barristerportfolio .portfoliowrap .portfolio {
    background: #fff
}

.barristerportfolio .portfoliowrap .portfolio .portfolio-header {
    background: #ededed;
    font-family: GillSansMTPro, helvetica, arial, sans-serif;
    margin-top: 0;
    margin-top: 0;
    font-size: 24px;
    font-size: 1.7142857142857142rem;
    line-height: 26.4px;
    margin-bottom: 8.64px;
    margin-bottom: .5714285714285714rem;
    font-weight: 300;
    padding: 20px;
    padding: 1.4285714285714286rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent {
    padding: 20px;
    padding: 1.4285714285714286rem;
    overflow: hidden;
    background: #fff;
    font-size: 12px;
    font-size: .8571428571428571rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent . sl-centre {
    text-align: center
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table {
    margin: 0;
    padding: 0;
    width: 100%
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table thead tr th {
    text-align: left;
    vertical-align: bottom;
    color: #555c65;
    border: none;
    border-bottom: 1px solid #ddd;
    padding-right: 19px;
    padding-right: 1.3571428571428572rem;
    padding: 4px;
    padding: .2857142857142857rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table thead tr th.large {
    font-size: 18px;
    font-size: 1.2857142857142858rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td {
    font-weight: 400;
    text-align: left;
    border: none;
    border-bottom: 1px solid #ddd;
    vertical-align: top;
    font-size: 12px;
    font-size: .8571428571428571rem;
    padding: 4px 3px
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a {
    font-weight: 700
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td p {
    margin-top: 0;
    margin-bottom: 6px;
    margin-bottom: .42857142857142855rem;
    line-height: 16px;
    line-height: 1.1428571428571428rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons {
    display: block;
    font-size: 0;
    font-size: 0;
    line-height: 1;
    color: transparent;
    background-repeat: no-repeat;
    background-position: left middle;
    width: 19px;
    width: 1.3571428571428572rem;
    height: 17px;
    height: 1.2142857142857142rem;
    margin: 0 auto;
    padding: 0 10px
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-close:after,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-email:after,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-pdf:after {
    -webkit-transition: color .3s;
    -moz-transition: color .3s;
    -o-transition: color .3s;
    transition: color .3s;
    color: #3579c7;
    font-family: fontawesome;
    font-size: 20px;
    font-size: 1.4285714285714286rem;
    font-weight: 400;
    line-height: 24px;
    line-height: 1.7142857142857142rem
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-close:hover:after,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-email:hover:after,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-pdf:hover:after {
    color: #25548b
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-pdf:after {
    content: '\f1c1'
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-email:after {
    content: '\f003'
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td a.port-icons.butt-close:after {
    content: '\f057'
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td.drag-handle {
    vertical-align: middle;
    color: #bec2c8;
    width: 18px
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td.email-remove,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td.sl-cv,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td.sl-email {
    width: 45px
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody tr td.sl-desc {
    width: 100%
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody .ui-state-highlight,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody .ui-widget-content .ui-state-highlight,
.barristerportfolio .portfoliowrap .portfolio .portfoliocontent table tbody .ui-widget-header .ui-state-highlight {
    background: #ededed
}

.barristerportfolio .portfoliowrap .portfolio .portfoliocontent .remove {
    text-align: right;
    color: red
}

.barristerportfolio .portfoliowrap .portfolio .button {
    padding-right: 60px;
    padding-right: 4.285714285714286rem;
    position: relative;
    min-width: 30%;
    text-align: left;
    border: none;
    background: #465460;
    color: #fff !important;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box
}

.barristerportfolio .portfoliowrap .portfolio .button.download:after {
    content: ' ';
    background-repeat:
        no-repeat;
    position: absolute;
    right: 20px;
    background-image: url("../img/builder-download-GVzMc3m.jpg");
    background-image: url("../img/builder-download-GVzMc3m.jpg");
    width: 26px;
    height: 24px
}

.barristerportfolio .portfoliowrap .portfolio .sl-close {
    font-size: 0;
    font-size: 0;
    line-height: 1;
    color: transparent;
    float: right
}

.barristerportfolio .portfoliowrap .portfolio .sl-close:after {
    content: '\f057';
    -webkit-transition: color .3s;
    -moz-transition: color .3s;
    -o-transition: color .3s;
    transition: color .3s;
    color: #3579c7;
    font-family: fontawesome;
    font-size: 27px;
    font-size: 1.9285714285714286rem;
    font-weight: 400;
    line-height: 34px;
    line-height: 2.4285714285714284rem
}

.barristerportfolio .portfoliowrap .portfolio .sl-close:hover:after {
    color: #25548b
}

.barristerportfolio .portfoliowrap .portfolio .email {
    padding: 20px;
    padding: 1.4285714285714286rem;
    display: none;
    background: #ededed
}

.barristerportfolio .portfoliowrap .portfolio .email.active {
    display: block
}

.barristerportfolio .portfoliowrap .portfolio .email label {
    display: inline
}

.barristerportfolio .portfoliowrap .portfolio .email input,
.barristerportfolio .portfoliowrap .portfolio .email textarea {
    width: 98%
}

.barristerportfolio .togglewrap .portfolio {
    display: block
}

@media screen and (max-width:550px) {
    .builder-overlay .builder-wrapper {
        width: 96%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box
    }

    .builder-overlay .builder-wrapper .button {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        margin-bottom: 10px;
        margin-bottom: .7142857142857143rem
    }
}

.judgment-table {
    margin-bottom: 8px !important;
    margin-bottom: .5714285714285714rem !important
}

/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.5.2
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2017 Daniel Eden
 */
.animated {
    animation-duration: 1s;
    animation-fill-mode: both
}

.animated.infinite {
    animation-iteration-count: infinite
}

.animated.hinge {
    animation-duration: 2s
}

.animated.bounceIn,
.animated.bounceOut,
.animated.flipOutX,
.animated.flipOutY {
    animation-duration: .75s
}


/* ==========================================================================
   HENDERSON/BLACKSTONE ORIGINAL CARD STRUCTURE (BOOTSTRAP ADAPTED)
   ========================================================================== */

/* 1. Kartın Ana Gövdesi (Beyaz Kutu ve Derinlik) */
.custom-bellisan-card {
    position: relative !important;
    background-color: #ffffff !important;
    border: none !important;
    /* Standart Bootstrap çerçevesini kaldırıyoruz */
    border-radius: 0px !important;
    /* Tavizsiz keskin köşeler */
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;

    /* Orijinal Henderson kutu gölgesi (Kusursuz, hafif derinlik) */
    -webkit-box-shadow: 0 0 30px rgba(0, 0, 0, 0.07) !important;
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.07) !important;

    /* Yumuşak geçiş efekti */
    -webkit-transition: all 350ms cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    transition: all 350ms cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* 2. Kartın Hover Anındaki Gizli Derinlik Katmanı (Orijinal Efekt) */
.custom-bellisan-card::before {
    content: "";
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 0px;

    /* Fareyle üzerine gelince belirecek olan daha yoğun kurumsal gölge */
    -webkit-box-shadow: 0 10px 40px rgba(27, 42, 107, 0.12) !important;
    box-shadow: 0 10px 40px rgba(27, 42, 107, 0.12) !important;

    -webkit-transition: opacity 350ms linear 0s;
    transition: opacity 350ms linear 0s;
    opacity: 0;
    will-change: opacity;
}

/* Hover Tetikleyicileri */
.custom-bellisan-card:hover {
    transform: translateY(-5px) !important;
}

.custom-bellisan-card:hover::before {
    opacity: 1;
    /* Gölge yumuşakça devreye girer */
}

/* 3. İçerik Paketleme Alanı (Link ve İç Boşluk Standartları) */
.custom-bellisan-card .card-body {
    padding: 30px !important;
    /* Orijinal şablondaki o nefes alan geniş iç boşluk */
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    width: 100% !important;
    height: 100% !important;
}

/* 4. Alt Kısımdan Asilce Çıkan Orijinal Animasyon Çizgisi */
.custom-bellisan-card::after {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 6px;
    /* Orijinal şablon kalınlığı */
    background: #C9A961;
    /* Senin asil Metallic Gold rengin */

    -webkit-transition: -webkit-transform 250ms ease 0s;
    transition: -webkit-transform 250ms ease 0s;
    transition: transform 250ms ease 0s;

    /* Başlangıçta kartın altında (gizli) konumlandır */
    -webkit-transform: translate3d(0, 6px, 0);
    transform: translate3d(0, 6px, 0);
}

/* Kart Hover Olunca Gold Çizgi Alttan Yukarı Doğru Kayar */
.custom-bellisan-card:hover::after {
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

/* ==========================================================================
   TİPOGRAFİ VE METİN ELEMENTLERİ
   ========================================================================== */

/* Kategori Etiketi */
.small-gold-label {
    text-transform: uppercase !important;
    font-size: 12px !important;
    letter-spacing: 1px !important;
    color: #C9A961 !important;
    /* Metallic Gold */
    font-weight: 700 !important;
    margin-bottom: 12px !important;
}

/* Başlık alanı (Garamond & Royal Blue) */
.custom-bellisan-card h3.card-title {
    font-family: 'Garamond', Georgia, serif !important;
    color: #1B2A6B !important;
    /* Royal Blue */
    font-size: 22px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    margin: 0 0 10px 0 !important;
    -webkit-transition: color .2s linear 0s;
    transition: color .2s linear 0s;
}

/* Kart hover olduğunda başlığın asilce renk değiştirmesi */
.custom-bellisan-card:hover h3.card-title {
    color: #d11776 !important;
    /* Gold vurgusu */
}

/* İçerik Yazısı */
.custom-bellisan-card .card-text {
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #444444 !important;
    margin: 10px 0 20px 0 !important;
}

/* Tarih ve Alt Bilgi Alanı */
.custom-bellisan-card .card-footer,
.custom-bellisan-card .text-secondary {
    font-size: 12px !important;
    color: #666666 !important;
    margin-top: auto !important;
    /* Ne olursa olsun kartın en altına kilitler */
}

/* ==========================================================================
   THE BELLISAN - KART İÇİ METİN HİZALAMA VE SABİTLEME PROTOKOLÜ
   ========================================================================== */

/* Kartın içindeki tüm metinleri ve elemanları inatla sola hizala, savrulmayı önle */
.custom-bellisan-card .card-body {
    text-align: left !important;
    align-items: flex-start !important;
}

/* Başlık alanının sola yaslanmasını ve genişliğini garanti altına alıyoruz */
.custom-bellisan-card h3.card-title {
    text-align: left !important;
    width: 100% !important;
    display: block !important;
}

/* Paragraf metninin savrulmasını engelle, düzgünce blok halinde aksın */
.custom-bellisan-card .card-text {
    text-align: left !important;
    width: 100% !important;
    display: block !important;
}

/* Alt bilgi alanının (Tarih, bölge, okunma sayısı) sola kilitlenmesi */
.custom-bellisan-card .text-secondary {
    text-align: left !important;
    width: 100% !important;
    display: block !important;
}

/* FUCHSIA KALINTISI TEMİZLENDİ: Hover durumunda başlık asilce senin Gold rengine dönsün */
.custom-bellisan-card:hover h3.card-title {
    color: #C9A961 !important;
}




/* ==========================================================================
   THE BELLISAN LEGAL BRIEFCASE DESIGN
   ========================================================================== */

.legal-case-file {
    background: #ffffff;
    border: 1px solid rgba(27, 42, 107, 0.15);
    border-radius: 0px !important;
    /* Aristokrat keskin geometri */
}

/* Üst Başlık Bloğu */
.case-header.bg_blue_001 {
    background-color: #19253b !important;
    /* Royal Blue */
    border-bottom: 4px solid #C9A961;
    /* Metallic Gold Alt Şerit */
}

.court-badge {
    color: #C9A961;
    letter-spacing: 1px;
    font-size: 12px;
}

.case-main-title {
    font-weight: 700;
    font-size: 28px;
    letter-spacing: -0.5px;
}

/* Küçük Gold Etiketler */
.small-gold-label {
    color: #C9A961 !important;
    font-size: 11px;
    letter-spacing: 1px;
    margin-bottom: 4px;
}

/* Adli Bölümler */
.legal-section {
    margin-bottom: 25px;
}

.legal-section .section-title {
    font-family: 'Garamond', serif;
    font-size: 18px;
    font-weight: bold;
    color: #19253b;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    padding-bottom: 6px;
    margin-bottom: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.legal-section .section-text {
    font-size: 15px;
    line-height: 1.6;
    color: #333333;
}

/* Karar ve Ceza Kutuları */
.verdict-box {
    border-left: 3px solid #d50015;
    /* Hüküm için kırmızı adli şerit */
    padding-left: 15px;
}

.penalty-box {
    border-left: 3px solid #19253b;
    /* Ceza için kurumsal lacivert şerit */
    padding-left: 15px;
}

/* BELLISAN ÖZEL ELEŞTİRİ PANELİ */
.bellisan-critique-panel {
    background-color: #f4f6fa;
    /* Çok hafif grimsi asil mavi tonu */
    border: 1px solid rgba(27, 42, 107, 0.1);
    border-left: 4px solid #19253b;
    /* Sol tarafa kalın kurumsal blok */
}

.critique-title {
    color: #19253b;
    font-size: 20px;
    font-weight: bold;
    border-bottom: 2px solid #C9A961;
    padding-bottom: 8px;
}

.text-royal-blue {
    color: #19253b !important;
}

.text-gold {
    color: #C9A961 !important;
}

.bg-gold {
    background-color: #C9A961 !important;
}


body.no-scroll {
    overflow: hidden
}
/* Sadece podcast kartlarına özel kurumsal kontrast zırhı */
.podcast-card-custom {
    background-color: #19253b !important;
    border: 1px solid rgba(201, 169, 97, 0.3) !important;
    /* Metallic Gold border esintisi */
}

.podcast-card-custom .podcast-title-link {
    color: #ffffff !important;
    /* Başlık kurumsal lacivert yerine beyaz */
}

.podcast-card-custom .podcast-title-link:hover {
    color: #C9A961 !important;
    /* Hover'da altın sarısı */
}

.podcast-card-custom .card-text-podcast {
    color: #e0e0e0 !important;
    /* Özet metin okunabilir açık gri */
}

.podcast-card-custom .text-secondary-podcast {
    color: #b0b8c9 !important;
    /* Tarih alanı hafif mat beyaz/gri */
}



/* Swiper'ın pseudo-element ok fontunu imha ediyoruz */
.bellisan-media-swiper .swiper-button-next::after,
.bellisan-media-swiper .swiper-button-prev::after {
    display: none !important;
}

/* Bizim UX Icon SVG'lerimizi kutunun merkezine asilce çiviliyoruz */
.bellisan-media-swiper .swiper-button-next,
.bellisan-media-swiper .swiper-button-prev {
    color: #C9A961 !important; /* Metallic Gold */
    
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    
}

.bellisan-media-swiper .swiper-button-next:hover,
.bellisan-media-swiper .swiper-button-prev:hover {
    
    color: #ffffff !important;
}

/* ==========================================================================
   THE BELLISAN SHARP PAGINATION DESIGN
   ========================================================================== */

.custom-bellisan-pagination .page-item .page-link {
    background-color: #ffffff !important;
    border: 1px solid rgba(27, 42, 107, 0.15) !important;
    color: #1B2A6B !important; /* Royal Blue */
    border-radius: 0px !important; /* Sharp corners are mandatory! */
    padding: 8px 16px;
    transition: all 0.2s ease-in-out;
}

/* Aktif Sayfa Butonu Stili */
.custom-bellisan-pagination .page-item.active .page-link {
    background-color: #19253b !important; /* Derin Lacivert */
    border-color: #C9A961 !important;     /* Metallic Gold Şerit */
    color: #C9A961 !important;            /* Yazı Altın Sarısı */
    font-weight: bold;
}

/* Hover (Üzerine Gelindiğinde) Durumu */
.custom-bellisan-pagination .page-item .page-link:hover {
    background-color: #f4f6fa !important;
    color: #C9A961 !important;
    border-color: #C9A961 !important;
}

/* Devre Dışı (Disabled) Oklar */
.custom-bellisan-pagination .page-item.disabled .page-link {
    background-color: #fafafa !important;
    color: #cccccc !important;
    border-color: #eeeeee !important;
    opacity: 0.6;
}

/* Girdilerin ve Select kutularının keskin, nizamlı geometrisi */
.form-control, .form-select {
    border-radius: 0px !important; /* Keskin köşeler sabittir */
    border: 1px solid rgba(27, 42, 107, 0.15) !important;
    color: #333333;
}

.form-control:focus, .form-select:focus {
    border-color: #C9A961 !important; /* Odaklanıldığında Gold şerit */
    box-shadow: none !important; /* Bootstrap'in o parlayan mavi halkasını siliyoruz */
}

/* Nice-select kütüphanesinin bu yatay hizada genişliği ezmesini engelleme sigortası */
.search-form .nice-select {
    width: 100% !important;
    float: none !important;
    border-radius: 0px !important;
    height: 38px !important;
    line-height: 36px !important;
}


/* ==========================================================================
   THE BELLISAN PRACTICE LAB ACCORDION PROTCOLS
   ========================================================================== */

.accordion-item {
    border-radius: 0px !important; /* Sharp corners mandatory */
    background-color: #ffffff;
}

.accordion-button:not(.collapsed) {
    background-color: #f4f6fa !important;
    color: #1B2A6B !important;
    box-shadow: none !important;
    border-bottom: 2px solid #C9A961 !important; /* Açıldığında altına altın sarısı şerit çeker */
}

.accordion-button:focus {
    box-shadow: none !important; /* Mavi halkayı imha et */
    border-color: rgba(27, 42, 107, 0.15) !important;
}

.accordion-button::after {
    /* Bootstrap okunu kibarlaştırıp kurumsal renge yaklaştırıyoruz */
    filter: sepia(100%) hue-rotate(10deg) saturate(200%); 
}

/* ==========================================================================
   THE BELLISAN ACADEMIC MILESTONE TIMELINE
   ========================================================================== */

.bellisan-timeline-wrapper {
    margin-left: 10px;
}

/* Her bir milestone bloğunun hover durumunda asilce öne çıkması */
.milestone-block {
    transition: all 0.5s ease-in-out;
}

.milestone-block:hover {
    transform: translateX(5px);
}

/* Milestone içindeki küçük detay kartı */
.bg-light-subtle {
    background-color: #fcfdfd !important;
    border: 1px solid rgba(27, 42, 107, 0.08) !important;
}

/* Keskin köşeler ve yazı tipi bütünlüğü */
.milestone-dot {
    border-radius: 0px !important; /* Sharp corners are mandatory */
    box-shadow: 0 0 0 4px #ffffff; /* Arkadaki çizgiyi temiz kesmesi için beyaz gölge */
}

.rich-text p.lede {
    font-family: 'Garamond', Georgia, serif !important;
    font-weight: 500;
}


/* ==========================================================================
   THE BELLISAN PROTOCOL™ ACADEMIC ENGINE CSS OVERRIDES
   ========================================================================== */

/* PDF'ten gelen absürt mutlak konumlandırmaları ve font kısıtlamalarını eziyoruz */
.academic-article-body, 
.academic-article-body div, 
.academic-article-body p, 
.academic-article-body span {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: auto !important;
    height: auto !important;
    line-height: 1.3 !important;
font-size: 12px !important;
}

/* Paragraf ve metin nizamı */
.academic-article-body p {
    margin-bottom: 1.25rem !important;
    color: #2b2b2b !important;
    text-align: justify;
}

/* 🚨 EN KRİTİK YER: PDF'ten Çıkan Tabloları Mühürleme Stilleri */
.academic-article-body table {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 1.5rem !important;
    margin-bottom: 1.5rem !important;
    border-collapse: collapse !important;
    background-color: #ffffff !important;
    box-shadow: 0 2px 5px rgba(0,0,0,0.03) !important;
}

/* Tablo Başlık Alanları */
.academic-article-body table th {
    background-color: #1a1a1a !important; /* Kurumsal adli bilişim koyu teması */
    color: #ffffff !important;
    padding: 12px 16px !important;
    font-weight: 700 !important;
    font-size: 0.95rem !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    border: 1px solid #333333 !important;
}

/* Tablo Hücreleri */
.academic-article-body table td {
    padding: 12px 16px !important;
    border: 1px solid #e5e7eb !important;
    color: #374151 !important;
    font-size: 0.95rem !important;
    vertical-align: middle !important;
}

/* Tablo Satır Renk Değişimi (Okunabilirliği artırmak için) */
.academic-article-body table tr:nth-child(even) {
    background-color: #f9fafb !important;
}

/* Tablo Satır Üzerine Gelince Vurgu */
.academic-article-body table tr:hover {
    background-color: #f3f4f6 !important;
}

/* PDF'ten gelebilecek gereksiz boş imaj veya çizgileri gizle */
.academic-article-body img {
    max-width: 100% !important;
    height: auto !important;
    display: block;
    margin: 1rem auto;
}

.academic-article-body hr {
    border: 0;
    border-top: 1px solid #e5e7eb;
    margin: 2rem 0;
}




    .form-input-bellisan {
        border-radius: 0px !important;
        border: 1px solid #e2e8f0 !important;
        padding: 10px 15px !important;
        font-family: var(--bs-font-sans-serif);
        font-size: 13px;
        transition: all 0.2s ease;
    }
    .form-input-bellisan:focus {
        border-color: #1B2A6B !important;
        box-shadow: none !important;
        background-color: #f8fafc;
    }
    /* Asil Buton Stili */
    .btn-bellisan-submit {
        background-color: #1B2A6B !important;
        color: #C9A961 !important;
        border: 1px solid #1B2A6B !important;
        border-radius: 0px !important;
        font-size: 12px;
        letter-spacing: 1px;
        text-transform: uppercase;
        transition: all 0.3s ease;
    }
    .btn-bellisan-submit:hover {
        background-color: #C9A961 !important;
        color: #1B2A6B !important;
        border-color: #C9A961 !important;
    }
    

/*HEADER */
    /* ====================================================================
           MASAÜSTÜ & GENEL TASARIM (DESKTOP & GLOBAL)
        ==================================================================== */







        :root {
            --primary-bg: #000000;
            --text-color: #ffffff;
            --hover-color: #ffffff;
            --navbar-height: 100px;
            --border-color: #eaeaea;
        }
        
        body {
           
            margin: 0;
            min-height: 100vh;
    min-height: 100dvh;
        }

        .header {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            background: #19253b;
            box-shadow: 0 2px 10px rgba(0,0,0,0.08);
            z-index: 9999;
            height: var(--navbar-height);
            display: flex;
            align-items: center;
        }

        .header .wrap {
            width: 100%;
            max-width: 1200px;
            margin: 0 auto;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 1rem;
        }

        .brand img {
            height: 70px;
            object-fit: contain;
			padding: 0 10px;
        }

        /* Masaüstü Menü Düzeni */
        .menu ul { list-style: none; margin: 0; padding: 0; }
        .nav_header_main { display: flex; gap: 1.5rem; align-items: center; }
        .nav_header_main li { position: relative; }
        .nav_header_main a {
            text-decoration: none;
            color: var(--text-color);
            font-weight: 500;
            font-size: 1.15rem;
            transition: color 0.2s ease;
            padding: 0.5rem 0;
            display: block;
        }
        .nav_header_main a:hover { color: var(--hover-color); }

        /* Masaüstü Alt Menüler (Dropdown) */
        .sub-menu {
            position: absolute;
            top: 100%;
            left: 0;
            min-width: 220px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            border-radius: 0 0 8px 8px;
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            transition: all 0.3s ease;
            z-index: 1000;
            background: #19253b;
        }
        .menu-item-has-children:hover .sub-menu {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }
        .sub-menu li { border-bottom: 1px solid var(--border-color); }
        .sub-menu li:last-child { border-bottom: none; }
        .sub-menu a { padding: 0.8rem 1.2rem !important; font-size: 0.9rem; }

        /* Araçlar (Tools) Menüsü */
        .tools ul {
            list-style: none; margin: 0; padding: 0;
            display: flex; align-items: center; gap: 1.5rem;
        }
        .tools a { color: var(--text-color); font-size: 1.2rem; }
        .bg-gold { background-color: #FFD700; color: #000; }
        
        /* Arama Kutusu Masaüstü */
        .search {
            position: absolute;
            top: 100%;
            right: 15px;
            background: #fff;
            padding: 15px;
            box-shadow: 0 4px 15px rgba(0,0,0,0.1);
            border-radius: 0 0 8px 8px;
            display: none;
        }
        .search.active { display: block; }
        .searchwrap { display: flex; gap: 10px; }
        .searchwrap input {
            padding: 8px 12px; border: 1px solid #1a1a1a; border-radius: 4px; outline: none; width: 200px; background: #00000045;
        }
        .searchwrap button {
            background: #00000045; color: #fff; border: none; padding: 8px 15px; border-radius: 4px; cursor: pointer;
        }

        /* --- YENİ EKLENEN: OKUMA LİSTESİ ÖZEL MENÜSÜ --- */
       .custom-readlist-menu {
            position: absolute;
            top: 100%; /* Yıldızın hemen altında başlar */
            right: 0;  /* Yıldızın sağına yaslanır, ekran dışına taşmaz */
            background: #ffffff;
            width: 320px; /* Sabit genişlik - Uzayıp gitmesini engeller */
            max-height: 400px;
            overflow-y: auto;
            overflow-x: hidden; /* Yatay taşmayı KESİNLİKLE engeller */
            border-radius: 0 0 8px 8px;
            box-shadow: 0 5px 25px rgba(0,0,0,0.15);
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            transition: all 0.3s ease;
            z-index: 1055;
            border: 1px solid #eaeaea;
            margin-top: 15px; /* Navbar ile arasına ufak boşluk */
        }
        
        /* Aktif olduğunda görünür yap (Mobil animasyonuyla çakışmaması için burada sadece opacity/transform kullanıyoruz) */
        .custom-readlist-menu.active {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .custom-readlist-menu {
    width: 320px; /* Sabit genişlik verilerek sınırsız uzaması engellendi */
    overflow-x: hidden; /* Dışa taşmalar gizlendi */
    /* ...diğer ayarlar */
}

/* Flex yapısını ezip alt alta (block) dizilmesini sağlayan kod */
.custom-readlist-menu ul {
    display: block !important; 
    width: 100%;
    padding: 0;
    margin: 0;
}

.custom-readlist-menu li {
    width: 100%;
}

        /* Masaüstünde mobil tetikleyicileri gizle */
        @media (min-width: 992px) {
            .mobile-only { display: none !important; }
        }


        /* ====================================================================
           MOBİL UYGULAMA GÖRÜNÜMÜ (MOBILE APP BOTTOM BAR)
        ==================================================================== */
        @media (max-width: 991px) {
            body {
                padding-top: 0;
                padding-bottom: var(--navbar-height); /* Mobilde alta boşluk */
            }

            .header {
                top: auto;
                bottom: 0; /* Alta sabitle */
                box-shadow: 0 -2px 15px rgba(0,0,0,0.1); /* Gölgelendirmeyi üste ver */
            }

            .header .wrap {
                justify-content: space-around; /* Butonları eşit dağıt */
            }

            /* Logoyu mobilde sakla veya küçült, yer kazanmak için */
            .brand { display: flex; align-items: center; }
            .brand img { height: 70px; }

            /* ANA MENÜ MOBİL (DROP-UP) */
            .menu {
                position: absolute;
                bottom: var(--navbar-height); /* Bottom bar'ın hemen üstünde başlar */
                left: 0;
                width: 100%;
                background: #19253b;
                box-shadow: 0 -5px 20px rgba(0,0,0,0.05);
                border-radius: 20px 20px 0 0; /* Üst köşeleri yuvarlat */
                
                /* Başlangıçta kapalı */
                max-height: 0;
                overflow-y: auto;
                visibility: hidden;
                transition: max-height 0.4s ease, visibility 0.4s ease;
                border-top: 1px solid transparent;
            }

            .menu.mobile-active {
                max-height: 70vh; /* Ekranın %70'ine kadar çıkabilir */
                visibility: visible;
                border-top: 1px solid var(--border-color);
            }

            .nav_header_main {
                flex-direction: column;
                gap: 0;
                padding: 1rem 0;
            }

            .nav_header_main > li { border-bottom: 1px solid var(--border-color); }
            .nav_header_main > li:last-child { border-bottom: none; }
            .nav_header_main a { padding: 1rem 1.5rem; display: block; font-size: 1.05rem; }

            /* Mobil Sub-Menü (Akordeon gibi açılır) */
            .sub-menu {
                position: static;
                box-shadow: none;
                opacity: 1;
                visibility: visible;
                transform: none;
                display: none; /* Başlangıçta kapalı */
                background: #19253b;
                border-radius: 0;
            }
            .sub-menu a { padding-left: 2.5rem !important; font-size: 0.95rem; color: #fff;}
            
            /* Mobilde menü içi açılır-kapanır logic class'ı */
            .menu-item-has-children.open .sub-menu {
                display: block;
            }

            /* --- YENİ EKLENEN: MOBİLDE OKUMA LİSTESİ DROP-UP (Tam Genişlikte Düzgün Açılır) --- */
            #menu-item-218 {
    position: static !important; /* Menünün hapsolmasını engeller */
}

.custom-readlist-menu {
    position: fixed !important; /* Absolute yerine Fixed yapıp ekrana sabitledik */
    top: auto !important;
    bottom: var(--navbar-height) !important;
    right: 0 !important;
    left: 0 !important;
    width: 100vw !important; /* Tam ekran genişliğini garanti ettik (100 Viewport Width) */
    /* ...diğer animasyon ayarları */
}
            .custom-readlist-menu.active {
                max-height: 70vh; /* Açıldığında çıkabileceği maksimum limit */
                opacity: 1;
                visibility: visible;
                overflow-y: auto; /* Açıldığında kaydırma serbest kalır */
                border-top: 1px solid var(--border-color);
                transform: none;
            }

            /* Arama Kutusu (MOBİL İÇİN DROP-UP) */
            .search {
                top: auto;
                bottom: var(--navbar-height);
                right: 0;
                width: 100%;
                border-radius: 15px 15px 0 0;
                box-shadow: 0 -5px 15px rgba(0,0,0,0.05);
            }
            .searchwrap { width: 100%; }
            .searchwrap input { flex-grow: 1; width: auto; background: #00000045; }

            /* Araç Menüsü Konumlandırması (Mobilde Alt Barda Görünecekler) */
            .tools ul {
                gap: 1.5rem;
            }
            .tools .sub-menu { display: none !important; } /* Tool menüdeki gereksiz submenüleri mobilde gizle */
        }

    /* ==========================================================================
   THE BELLISAN PROTOCOL™ NATIVE APP-LIKE MOBILITY SUITE (768px and Below)
   ========================================================================== */
@media (max-width: 768px) {
    /* 1. Tüm ekranın dış sınırlarını siber olarak mühürlüyoruz */
    html, body {
        max-width: 100% !important;
        overflow-x: hidden !important; /* Sağa yatay kaydırmayı imkansız hale getirir */
        position: relative;
        touch-action: pan-y; /* Sağa-sola esnemeyi (elastic scroll) telefonda engeller */
        -webkit-overflow-scrolling: touch; /* Kaydırma momentumunu hızlandırır */
    }
}

  /* ==========================================================================
   ONLY FOR THEBELLISAN INDEX PAGE (768px and Below)
   ========================================================================== */
@media (max-width: 768px) {
    /* Sadece ana sayfadaki taşıyıcıların sol-sağ simetrisini eşitliyoruz */
    .bg_grad_002 {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        float: none !important;
    }

    /* Ana sayfadaki o lacivert makale ve haber kartlarını genişletip ortalıyoruz */
    .bg_grad_002 .card,
    .bg_grad_002 .panel,
    .bg_grad_002 [class*="card-"] {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Üst taraftaki ARTICLES - NEWS menüsünün sola çekmesini engelliyoruz */
    .bg_grad_002 .nav_header_main,
    .bg_grad_002 .menu {
        text-align: center !important;
        margin: 0 auto !important;
        padding: 0 !important;
    }
}  

/* -----------------------------------------------------------------
   🏛️ FOOTER & QUICK LINKS RE-ARCHITECTURE (Sıfırdan İnşa)
   ----------------------------------------------------------------- */

/* 1. Ana Footer Kapsayıcısını Zırhlama ve Grid Nizamı */



@keyframes bounce {

    20%,
    53%,
    80%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1);
        transform: translate3d(0, 0, 0)
    }

    40%,
    43% {
        animation-timing-function: cubic-bezier(.755, .050, .855, .060);
        transform: translate3d(0, -30px, 0)
    }

    70% {
        animation-timing-function: cubic-bezier(.755, .050, .855, .060);
        transform: translate3d(0, -15px, 0)
    }

    90% {
        transform: translate3d(0, -4px, 0)
    }
}

.bounce {
    animation-name: bounce;
    transform-origin: center bottom
}

@keyframes flash {

    50%,
    from,
    to {
        opacity: 1
    }

    25%,
    75% {
        opacity: 0
    }
}

.flash {
    animation-name: flash
}

@keyframes pulse {
    from {
        transform: scale3d(1, 1, 1)
    }

    50% {
        transform: scale3d(1.05, 1.05, 1.05)
    }

    to {
        transform: scale3d(1, 1, 1)
    }
}

.pulse {
    animation-name: pulse
}

@keyframes rubberBand {
    from {
        transform: scale3d(1, 1, 1)
    }

    30% {
        transform: scale3d(1.25, .75, 1)
    }

    40% {
        transform: scale3d(.75, 1.25, 1)
    }

    50% {
        transform: scale3d(1.15, .85, 1)
    }

    65% {
        transform: scale3d(.95, 1.05, 1)
    }

    75% {
        transform: scale3d(1.05, .95, 1)
    }

    to {
        transform: scale3d(1, 1, 1)
    }
}

.rubberBand {
    animation-name: rubberBand
}

@keyframes shake {

    from,
    to {
        transform: translate3d(0, 0, 0)
    }

    10%,
    30%,
    50%,
    70%,
    90% {
        transform: translate3d(-10px, 0, 0)
    }

    20%,
    40%,
    60%,
    80% {
        transform: translate3d(10px, 0, 0)
    }
}

.shake {
    animation-name: shake
}

@keyframes headShake {
    0% {
        transform: translateX(0)
    }

    6.5% {
        transform: translateX(-6px) rotateY(-9deg)
    }

    18.5% {
        transform: translateX(5px) rotateY(7deg)
    }

    31.5% {
        transform: translateX(-3px) rotateY(-5deg)
    }

    43.5% {
        transform: translateX(2px) rotateY(3deg)
    }

    50% {
        transform: translateX(0)
    }
}

.headShake {
    animation-timing-function: ease-in-out;
    animation-name: headShake
}

@keyframes swing {
    20% {
        transform: rotate3d(0, 0, 1, 15deg)
    }

    40% {
        transform: rotate3d(0, 0, 1, -10deg)
    }

    60% {
        transform: rotate3d(0, 0, 1, 5deg)
    }

    80% {
        transform: rotate3d(0, 0, 1, -5deg)
    }

    to {
        transform: rotate3d(0, 0, 1, 0deg)
    }
}

.swing {
    transform-origin: top center;
    animation-name: swing
}

@keyframes tada {
    from {
        transform: scale3d(1, 1, 1)
    }

    10%,
    20% {
        transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
    }

    30%,
    50%,
    70%,
    90% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
    }

    40%,
    60%,
    80% {
        transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
    }

    to {
        transform: scale3d(1, 1, 1)
    }
}

.tada {
    animation-name: tada
}

@keyframes wobble {
    from {
        transform: none
    }

    15% {
        transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg)
    }

    30% {
        transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg)
    }

    45% {
        transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg)
    }

    60% {
        transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg)
    }

    75% {
        transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg)
    }

    to {
        transform: none
    }
}

.wobble {
    animation-name: wobble
}

@keyframes jello {

    11.1%,
    from,
    to {
        transform: none
    }

    22.2% {
        transform: skewX(-12.5deg) skewY(-12.5deg)
    }

    33.3% {
        transform: skewX(6.25deg) skewY(6.25deg)
    }

    44.4% {
        transform: skewX(-3.125deg) skewY(-3.125deg)
    }

    55.5% {
        transform: skewX(1.5625deg) skewY(1.5625deg)
    }

    66.6% {
        transform: skewX(-.78125deg) skewY(-.78125deg)
    }

    77.7% {
        transform: skewX(.390625deg) skewY(.390625deg)
    }

    88.8% {
        transform: skewX(-.1953125deg) skewY(-.1953125deg)
    }
}

.jello {
    animation-name: jello;
    transform-origin: center
}

@keyframes bounceIn {

    20%,
    40%,
    60%,
    80%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    20% {
        transform: scale3d(1.1, 1.1, 1.1)
    }

    40% {
        transform: scale3d(.9, .9, .9)
    }

    60% {
        opacity: 1;
        transform: scale3d(1.03, 1.03, 1.03)
    }

    80% {
        transform: scale3d(.97, .97, .97)
    }

    to {
        opacity: 1;
        transform: scale3d(1, 1, 1)
    }
}

.bounceIn {
    animation-name: bounceIn
}

@keyframes bounceInDown {

    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(0, -3000px, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, 25px, 0)
    }

    75% {
        transform: translate3d(0, -10px, 0)
    }

    90% {
        transform: translate3d(0, 5px, 0)
    }

    to {
        transform: none
    }
}

.bounceInDown {
    animation-name: bounceInDown
}

@keyframes bounceInLeft {

    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    0% {
        opacity: 0;
        transform: translate3d(-3000px, 0, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(25px, 0, 0)
    }

    75% {
        transform: translate3d(-10px, 0, 0)
    }

    90% {
        transform: translate3d(5px, 0, 0)
    }

    to {
        transform: none
    }
}

.bounceInLeft {
    animation-name:
        bounceInLeft
}

@keyframes bounceInRight {

    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    from {
        opacity: 0;
        transform: translate3d(3000px, 0, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(-25px, 0, 0)
    }

    75% {
        transform: translate3d(10px, 0, 0)
    }

    90% {
        transform: translate3d(-5px, 0, 0)
    }

    to {
        transform: none
    }
}

.bounceInRight {
    animation-name: bounceInRight
}

@keyframes bounceInUp {

    60%,
    75%,
    90%,
    from,
    to {
        animation-timing-function: cubic-bezier(.215, .61, .355, 1)
    }

    from {
        opacity: 0;
        transform: translate3d(0, 3000px, 0)
    }

    60% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }

    75% {
        transform: translate3d(0, 10px, 0)
    }

    90% {
        transform: translate3d(0, -5px, 0)
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

.bounceInUp {
    animation-name: bounceInUp
}

@keyframes bounceOut {
    20% {
        transform: scale3d(.9, .9, .9)
    }

    50%,
    55% {
        opacity: 1;
        transform: scale3d(1.1, 1.1, 1.1)
    }

    to {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }
}

.bounceOut {
    animation-name: bounceOut
}

@keyframes bounceOutDown {
    20% {
        transform: translate3d(0, 10px, 0)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, -20px, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.bounceOutDown {
    animation-name: bounceOutDown
}

@keyframes bounceOutLeft {
    20% {
        opacity: 1;
        transform: translate3d(20px, 0, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.bounceOutLeft {
    animation-name: bounceOutLeft
}

@keyframes bounceOutRight {
    20% {
        opacity: 1;
        transform: translate3d(-20px, 0, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.bounceOutRight {
    animation-name: bounceOutRight
}

@keyframes bounceOutUp {
    20% {
        transform: translate3d(0, -10px, 0)
    }

    40%,
    45% {
        opacity: 1;
        transform: translate3d(0, 20px, 0)
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.bounceOutUp {
    animation-name: bounceOutUp
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.fadeIn {
    animation-name: fadeIn
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInDown {
    animation-name: fadeInDown
}

@keyframes fadeInDownBig {
    from {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInDownBig {
    animation-name: fadeInDownBig
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInLeft {
    animation-name: fadeInLeft
}

@keyframes fadeInLeftBig {
    from {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInLeftBig {
    animation-name: fadeInLeftBig
}

@keyframes fadeInRight {
    from {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInRight {
    animation-name: fadeInRight
}

@keyframes fadeInRightBig {
    from {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInRightBig {
    animation-name: fadeInRightBig
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInUp {
    animation-name: fadeInUp
}

@keyframes fadeInUpBig {
    from {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.fadeInUpBig {
    animation-name: fadeInUpBig
}

@keyframes fadeOut {
    from {
        opacity: 1
    }

    to {
        opacity: 0
    }
}

.fadeOut {
    animation-name: fadeOut
}

@keyframes fadeOutDown {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0)
    }
}

.fadeOutDown {
    animation-name: fadeOutDown
}

@keyframes fadeOutDownBig {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, 2000px, 0)
    }
}

.fadeOutDownBig {
    animation-name: fadeOutDownBig
}

@keyframes fadeOutLeft {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-100%, 0, 0)
    }
}

.fadeOutLeft {
    animation-name: fadeOutLeft
}

@keyframes fadeOutLeftBig {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(-2000px, 0, 0)
    }
}

.fadeOutLeftBig {
    animation-name: fadeOutLeftBig
}

@keyframes fadeOutRight {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0)
    }
}

.fadeOutRight {
    animation-name: fadeOutRight
}

@keyframes fadeOutRightBig {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(2000px, 0, 0)
    }
}

.fadeOutRightBig {
    animation-name: fadeOutRightBig
}

@keyframes fadeOutUp {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -100%, 0)
    }
}

.fadeOutUp {
    animation-name: fadeOutUp
}

@keyframes fadeOutUpBig {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(0, -2000px, 0)
    }
}

.fadeOutUpBig {
    animation-name: fadeOutUpBig
}

@keyframes flip {
    from {
        transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
        animation-timing-function: ease-out
    }

    40% {
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1,
                0, -190deg);
        animation-timing-function: ease-out
    }

    50% {
        transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
        animation-timing-function: ease-in
    }

    80% {
        transform: perspective(400px) scale3d(.95, .95, .95);
        animation-timing-function: ease-in
    }

    to {
        transform: perspective(400px);
        animation-timing-function: ease-in
    }
}

.animated.flip {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    animation-name: flip
}

@keyframes flipInX {
    from {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
    }

    to {
        transform: perspective(400px)
    }
}

.flipInX {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: flipInX
}

@keyframes flipInY {
    from {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        animation-timing-function: ease-in;
        opacity: 0
    }

    40% {
        transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
        animation-timing-function: ease-in
    }

    60% {
        transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
        opacity: 1
    }

    80% {
        transform: perspective(400px) rotate3d(0, 1, 0, -5deg)
    }

    to {
        transform: perspective(400px)
    }
}

.flipInY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: flipInY
}

@keyframes flipOutX {
    from {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0
    }
}

.flipOutX {
    animation-name: flipOutX;
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important
}

@keyframes flipOutY {
    from {
        transform: perspective(400px)
    }

    30% {
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1
    }

    to {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0
    }
}

.flipOutY {
    -webkit-backface-visibility: visible !important;
    backface-visibility: visible !important;
    animation-name: flipOutY
}

@keyframes lightSpeedIn {
    from {
        transform: translate3d(100%, 0, 0) skewX(-30deg);
        opacity: 0
    }

    60% {
        transform: skewX(20deg);
        opacity: 1
    }

    80% {
        transform: skewX(-5deg);
        opacity: 1
    }

    to {
        transform: none;
        opacity: 1
    }
}

.lightSpeedIn {
    animation-name: lightSpeedIn;
    animation-timing-function: ease-out
}

@keyframes lightSpeedOut {
    from {
        opacity: 1
    }

    to {
        transform: translate3d(100%, 0, 0) skewX(30deg);
        opacity: 0
    }
}

.lightSpeedOut {
    animation-name: lightSpeedOut;
    animation-timing-function: ease-in
}

@keyframes rotateIn {
    from {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, -200deg);
        opacity: 0
    }

    to {
        transform-origin: center;
        transform: none;
        opacity: 1
    }
}

.rotateIn {
    animation-name: rotateIn
}

@keyframes rotateInDownLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }

    to {
        transform-origin: left bottom;
        transform: none;
        opacity: 1
    }
}

.rotateInDownLeft {
    animation-name: rotateInDownLeft
}

@keyframes rotateInDownRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }

    to {
        transform-origin: right bottom;
        transform: none;
        opacity: 1
    }
}

.rotateInDownRight {
    animation-name: rotateInDownRight
}

@keyframes rotateInUpLeft {
    from {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }

    to {
        transform-origin: left bottom;
        transform: none;
        opacity: 1
    }
}

.rotateInUpLeft {
    animation-name: rotateInUpLeft
}

@keyframes rotateInUpRight {
    from {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -90deg);
        opacity: 0
    }

    to {
        transform-origin: right bottom;
        transform: none;
        opacity: 1
    }
}

.rotateInUpRight {
    animation-name: rotateInUpRight
}

@keyframes rotateOut {
    from {
        transform-origin: center;
        opacity: 1
    }

    to {
        transform-origin: center;
        transform: rotate3d(0, 0, 1, 200deg);
        opacity: 0
    }
}

.rotateOut {
    animation-name: rotateOut
}

@keyframes rotateOutDownLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, 45deg);
        opacity: 0
    }
}

.rotateOutDownLeft {
    animation-name: rotateOutDownLeft
}

@keyframes rotateOutDownRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

.rotateOutDownRight {
    animation-name: rotateOutDownRight
}

@keyframes rotateOutUpLeft {
    from {
        transform-origin: left bottom;
        opacity: 1
    }

    to {
        transform-origin: left bottom;
        transform: rotate3d(0, 0, 1, -45deg);
        opacity: 0
    }
}

.rotateOutUpLeft {
    animation-name: rotateOutUpLeft
}

@keyframes rotateOutUpRight {
    from {
        transform-origin: right bottom;
        opacity: 1
    }

    to {
        transform-origin: right bottom;
        transform: rotate3d(0, 0, 1, 90deg);
        opacity: 0
    }
}

.rotateOutUpRight {
    animation-name: rotateOutUpRight
}

@keyframes hinge {
    0% {
        transform-origin: top left;
        animation-timing-function: ease-in-out
    }

    20%,
    60% {
        transform: rotate3d(0, 0, 1, 80deg);
        transform-origin: top left;
        animation-timing-function: ease-in-out
    }

    40%,
    80% {
        transform: rotate3d(0, 0, 1, 60deg);
        transform-origin: top left;
        animation-timing-function: ease-in-out;
        opacity: 1
    }

    to {
        transform: translate3d(0, 700px, 0);
        opacity: 0
    }
}

.hinge {
    animation-name: hinge
}

@keyframes jackInTheBox {
    from {
        opacity: 0;
        transform: scale(.1) rotate(30deg);
        transform-origin: center bottom
    }

    50% {
        transform: rotate(-10deg)
    }

    70% {
        transform: rotate(3deg)
    }

    to {
        opacity: 1;
        transform: scale(1)
    }
}

.jackInTheBox {
    animation-name: jackInTheBox
}

@keyframes rollIn {
    from {
        opacity: 0;
        transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg)
    }

    to {
        opacity: 1;
        transform: none
    }
}

.rollIn {
    animation-name: rollIn
}

@keyframes rollOut {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg)
    }
}

.rollOut {
    animation-name: rollOut
}

@keyframes zoomIn {
    from {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    50% {
        opacity: 1
    }
}

.zoomIn {
    animation-name: zoomIn
}

@keyframes zoomInDown {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInDown {
    animation-name: zoomInDown
}

@keyframes zoomInLeft {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(-1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInLeft {
    animation-name: zoomInLeft
}

@keyframes zoomInRight {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(1000px, 0, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-10px, 0, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInRight {
    animation-name: zoomInRight
}

@keyframes zoomInUp {
    from {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    60% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomInUp {
    animation-name: zoomInUp
}

@keyframes zoomOut {
    from {
        opacity: 1
    }

    50% {
        opacity: 0;
        transform: scale3d(.3, .3, .3)
    }

    to {
        opacity: 0
    }
}

.zoomOut {
    animation-name: zoomOut
}

@keyframes zoomOutDown {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, 2000px, 0);
        transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutDown {
    animation-name: zoomOutDown
}

@keyframes zoomOutLeft {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(-2000px, 0, 0);
        transform-origin: left center
    }
}

.zoomOutLeft {
    animation-name: zoomOutLeft
}

@keyframes zoomOutRight {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(-42px, 0, 0)
    }

    to {
        opacity: 0;
        transform: scale(.1) translate3d(2000px, 0, 0);
        transform-origin: right center
    }
}

.zoomOutRight {
    animation-name: zoomOutRight
}

@keyframes zoomOutUp {
    40% {
        opacity: 1;
        transform: scale3d(.475, .475, .475) translate3d(0, 60px, 0);
        animation-timing-function: cubic-bezier(.55, .055, .675, .19)
    }

    to {
        opacity: 0;
        transform: scale3d(.1, .1, .1) translate3d(0, -2000px, 0);
        transform-origin: center bottom;
        animation-timing-function: cubic-bezier(.175, .885, .32, 1)
    }
}

.zoomOutUp {
    animation-name: zoomOutUp
}

@keyframes slideInDown {
    from {
        transform: translate3d(0, -100%, 0);
        visibility: visible
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

.slideInDown {
    animation-name: slideInDown
}

@keyframes slideInLeft {
    from {
        transform: translate3d(-100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

. slideInLeft {
    animation-name: slideInLeft
}

@keyframes slideInRight {
    from {
        transform: translate3d(100%, 0, 0);
        visibility: visible
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

.slideInRight {
    animation-name: slideInRight
}

@keyframes slideInUp {
    from {
        transform: translate3d(0, 100%, 0);
        visibility: visible
    }

    to {
        transform: translate3d(0, 0, 0)
    }
}

.slideInUp {
    animation-name: slideInUp
}

@keyframes slideOutDown {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, 100%, 0)
    }
}

.slideOutDown {
    animation-name: slideOutDown
}

@keyframes slideOutLeft {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        visibility: hidden;
        transform: translate3d(-100%, 0, 0)
    }
}

.slideOutLeft {
    animation-name: slideOutLeft
}

@keyframes slideOutRight {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        visibility: hidden;
        transform: translate3d(100%, 0, 0)
    }
}

.slideOutRight {
    animation-name: slideOutRight
}

@keyframes slideOutUp {
    from {
        transform: translate3d(0, 0, 0)
    }

    to {
        visibility: hidden;
        transform: translate3d(0, -100%, 0)
    }
}

.slideOutUp {
    animation-name: slideOutUp
}

.nice-select {
    -webkit-tap-highlight-color: transparent;
    background-color: #fff;
    border-radius: 5px;
    border: solid 1px #e0e7ee;
    box-sizing: border-box;
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    height: 38px;
    margin-left: 5px;
    line-height: 36px;
    outline: 0;
    padding-left: 18px;
    padding-right: 30px;
    position: relative;
    text-align: left !important;
    -webkit-transition: all .2s ease-in-out;
    transition: all .2s ease-in-out;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    width: auto
}

.nice-select:hover {
    border-color: #d0dae5
}

.nice-select.open,
.nice-select:active,
.nice-select:focus {
    border-color: #88bfff
}

.nice-select:after {
    border-bottom: 2px solid #90a1b5;
    border-right: 2px solid #90a1b5;
    content: '';
    display: block;
    height: 5px;
    margin-top: -4px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    top: 50%;
    -webkit-transform-origin: 66% 66%;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all .15s ease-in-out;
    transition: all .15s ease-in-out;
    width: 5px
}

.nice-select.open:after {
    -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg)
}

.nice-select.open .list {
    opacity: 1;
    pointer-events: auto;
    -webkit-transform: scale(1) translateY(0);
    -ms-transform: scale(1) translateY(0);
    transform: scale(1) translateY(0)
}

.nice-select.disabled {
    border-color: #e7ecf2;
    color: #90a1b5;
    pointer-events: none
}

.nice-select.disabled:after {
    border-color: #cdd5de
}

.nice-select.wide {
    width: 100%
}

.nice-select.wide .list {
    left: 0 !important;
    right: 0 !important
}

.nice-select.right {
    float: right
}

.nice-select.right .list {
    left: auto;
    right: 0
}

.nice-select.small {
    font-size: 12px;
    height: 36px;
    line-height: 34px
}

.nice-select.small:after {
    height: 4px;
    width: 4px
}

.nice-select.small .option {
    line-height: 34px;
    min-height: 34px
}

.nice-select .list {
    background-color: #fff;
    border-radius: 5px;
    box-shadow: 0 0 0 1px rgba(68, 88, 112, .11);
    box-sizing: border-box;
    margin-top: 4px;
    opacity: 0;
    overflow: hidden;
    padding: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    left: 0;
    -webkit-transform-origin: 50% 0;
    -ms-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transform: scale(.75) translateY(-21px);
    -ms-transform: scale(.75) translateY(-21px);
    transform: scale(.75) translateY(-21px);
    -webkit-transition: all .2s cubic-bezier(.5, 0, 0, 1.25), opacity .15s ease-out;
    transition: all .2s cubic-bezier(.5, 0, 0, 1.25), opacity .15s ease-out;
    z-index: 9
}

.nice-select .list:hover .option:not(:hover) {
    background-color: transparent !important
}

.nice-select .option {
    cursor: pointer;
    font-weight: 400;
    line-height: 40px;
    list-style: none;
    min-height: 40px;
    outline: 0;
    padding-left: 18px;
    padding-right: 29px;
    text-align: left;
    -webkit-transition: all .2s;
    transition: all .2s
}

.nice-select .option.focus,
.nice-select .option.selected.focus,
.nice-select .option:hover {
    background-color: #f6f7f9
}

.nice-select .option.selected {
    font-weight: 700
}

.nice-select .option.disabled {
    background-color: transparent;
    color: #90a1b5;
    cursor: default
}

.swiper-container {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

.swiper- container-vertical>.swiper-wrapper {
    -webkit-box-orient: vertical;
    -moz-box-orient: vertical;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,
.swiper-wrapper {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -o-transform: translate(0, 0);
    -ms-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: ease-out;
    -moz-transition-timing-function: ease-out;
    -ms-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative
}

.swiper-slide-bellisan {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100% !important; /* Genişliği Swiper'ın esnek akışına bırakıyoruz, sabit pikseli imha ettik */
    height: 100%;
    position: relative;
     /* İstediğin o asil şeffaf arka plan */

    /* KRİTİK MÜHENDİSLİK: İçindeki her şeyi merkeze çivileyen Flexbox gücü */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center; /* Yatayda tam orta noktaya hizalar */
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;     /* Dikeyde tam orta noktaya hizalar */
    background: #19253b7c;
}

.swiper-slide-bellisan img {
    max-height: 200px; /* İstediğin o harika duran maksimum yükseklik */
    width: auto;       /* Resmin en boy oranını (aspect-ratio) adli nizamda korur */
    max-width: 100%;   /* Resmin kartın dışına taşmasını engeller */
    display: block;    /* Satır içi boşluk anomalilerini sıfırlar */
}

.swiper-container-autoheight,
.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -webkit-box-align: start;
    -ms-flex-align: start;
    -webkit-align-items: flex-start;
    align-items: flex-start;
    -webkit-transition-property: -webkit-transform, height;
    -moz-transition-property: -moz-transform;
    -o-transition-property: -o-transform;
    -ms-transition-property: -ms-transform;
    transition-property: transform, height
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,
.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 27px 44px;
    -webkit-background-size: 27px 44px;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
    
    left: 10px;
    right: auto
}

.swiper-button-prev.swiper-button-black,
.swiper-container-rtl .swiper-button-next.swiper-button-black {
   
}

.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white {
 
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
   
    right: 10px;
    left: auto
}

.swiper-button-next.swiper-button-black,
.swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%
 2Fsvg'%20viewBox%3D' 0%200%2027%2044'%3E%3Cpath%20d%3D' M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D' %23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D' http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D' 0%200%2027%2044'%3E%3Cpath%20d%3D' M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D' %23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s;-moz-transition:.3s;-o-transition:.3s;transition:.3s;-webkit-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-white .swiper-pagination-bullet{background:#fff}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);-moz-transform:translate3d(0,-50%,0);-o-transform:translate(0,-50%);-ms-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:5px 0;display:block}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 5px}.swiper-pagination-progress{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progress .swiper-pagination-progressbar{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);-o-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-moz-transform-origin:left top;-ms-transform-origin:left top;-o-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar{-webkit-transform-origin:right top;-moz-transform-origin:right top;-ms-transform-origin:right top;-o-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progress{width:100%;height:4px;left:0;top:0}.swiper-container-vertical>.swiper-pagination-progress{width:4px;height:100%;left:0;top:0}.swiper-pagination-progress.swiper-pagination-white{background:rgba(255,255,255,.5)}.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar{background:#fff}.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar{background:#000}.swiper-container-3d{-webkit-perspective:1200px;-moz-perspective:1200px;-o-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;-ms-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-
 shadow-left {
            background-image:-webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
        }

        .swiper-container-3d .swiper-slide-shadow-right {
            background-image:-webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
        }

        .swiper-container-3d .swiper-slide-shadow-top {
            background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
        }

        .swiper-container-3d .swiper-slide-shadow-bottom {
            background-image:-webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(rgba(0, 0, 0, 0))); background-image:-webkit-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-moz-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:-o-linear-gradient(top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0)); background-image:linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
        }

        .swiper-container-coverflow .swiper-wrapper, .swiper-container-flip .swiper-wrapper {
            -ms-perspective:1200px
        }

        .swiper-container-cube, .swiper-container-flip {
            overflow:visible
        }

        .swiper-container-cube .swiper-slide, .swiper-container-flip .swiper-slide {
            pointer-events:none; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; backface-visibility:hidden; z-index:1
        }

        .swiper-container-cube .swiper-slide .swiper-slide, .swiper-container-flip .swiper-slide .swiper-slide {
            pointer-events:none
        }

        .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active, .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active {
            pointer-events:auto
        }

        .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top, .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top {
            z-index:0; -webkit-backface-visibility:hidden; -moz-backface-visibility:hidden; -ms-backface-visibility:hidden; backface-visibility:hidden
        }

        .swiper-container-cube .swiper-slide {
            visibility:hidden; -webkit-transform-origin:0 0; -moz-transform-origin:0 0; -ms-transform-origin:0 0; transform-origin:0 0; width:100%; height:100%
        }

        .swiper-container-cube.swiper-container-rtl .swiper-slide {
            -webkit-transform-origin:100% 0; -moz-transform-origin:100% 0; -ms-transform-origin:100% 0; transform-origin:100% 0
        }

        .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev {
            pointer-events:auto; visibility:visible
        }

        .swiper-container-cube .swiper-cube-shadow {
            position:absolute; left:0; bottom:0; width:100%; height:100%; background:#000; opacity:.6; -webkit-filter:blur(50px); filter:blur(50px); z-index:0
        }

        .swiper-container-fade.swiper-container-free-mode .swiper-slide {
            -webkit-transition-timing-function:ease-out; -moz-transition-timing-function:ease-out; -ms-transition-timing-function:ease-out; -o-transition-timing-function:ease-out; transition-timing-function:ease-out
        }

        .swiper-container-fade .swiper-slide {
            pointer-events:none; - webkit-transition-property:opacity; -moz-transition-property:opacity; -o-transition-property:opacity; transition-property:opacity
        }

        .swiper-container-fade .swiper-slide .swiper-slide {
            pointer-events:none
        }

        .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active {
            pointer-events:auto
        }

        .swiper-zoom-container {
            width:100%; height:100%; display:-webkit-box; display:-moz-box; display:-ms-flexbox; display:-webkit-flex; display:flex; -webkit-box-pack:center; -moz-box-pack:center; -ms-flex-pack:center; -webkit-justify-content:center; justify-content:center; -webkit-box-align:center; -moz-box-align:center; -ms-flex-align:center; -webkit-align-items:center; align-items:center; text-align:center
        }

        .swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg {
            max-width:100%; max-height:100%; object-fit:contain
        }

        .swiper-scrollbar {
            border-radius:10px; position:relative; -ms-touch-action:none; background:rgba(0, 0, 0, .1)
        }

        .swiper-container-horizontal>.swiper-scrollbar {
            position:absolute; left:1%; bottom:3px; z-index:50; height:5px; width:98%
        }

        .swiper-container-vertical>.swiper-scrollbar {
            position:absolute; right:3px; top:1%; z-index:50; width:5px; height:98%
        }

        .swiper-scrollbar-drag {
            height:100%; width:100%; position:relative; background:rgba(0, 0, 0, .5); border-radius:10px; left:0; top:0
        }

        .swiper-scrollbar-cursor-drag {
            cursor:move
        }

        .swiper-lazy-preloader {
            width:42px; height:42px; position:absolute; left:50%; top:50%; margin-left:-21px; margin-top:-21px; z-index:10; -webkit-transform-origin:50%; -moz-transform-origin:50%; transform-origin:50%; -webkit-animation:swiper-preloader-spin 1s steps(12, end) infinite; -moz-animation:swiper-preloader-spin 1s steps(12, end) infinite; animation:swiper-preloader-spin 1s steps(12, end) infinite
        }

        .swiper-lazy-preloader:after {
            display:block; content:""; width:100%; height:100%; background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E"); background-position:50%; -webkit-background-size:100%; background-size:100%; background-repeat:no-repeat
        }

        .swiper-lazy-preloader-white:after {
            background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(
 90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .27'%20transform%3D' rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .27'%20transform%3D' rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .37'%20transform%3D' rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .46'%20transform%3D' rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .56'%20transform%3D' rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .66'%20transform%3D' rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .75'%20transform%3D' rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D' %23l'%20opacity%3D' .85'%20transform%3D' rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{transform:rotate(360deg)}}