*,
*::after,
*::before {
    box-sizing: border-box;
}

:root {
    font-size: 20px;
    --color-text: #111;
    --color-text-alt: #c1c1c3;
    --color-bg: #f9fafe;
    --color-link: #111;
    --color-link-hover: #111;
    --color-page: #f1f3f8;
    --color-info: #c0c0c2;
    color: var(--color-text);
    background-color: #f7f7f7;
    font-family: niveau-grotesk, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    counter-reset: section;
    --cursor-stroke: none;
    --cursor-fill: #1043db;
    --cursor-stroke-width: 1px;
    --margin-images: 50px
}

body {
    margin: 0;
    --color-text: #fff;
    --color-bg: #000;
    --color-link: #cea052;
    --color-link-hover: #8c6c35;
    --color-frame: #ff5ba4;
    color: var(--color-text);
    background-color: #f7f7f7;;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Page Loader */
.js .loading::before,
.js .loading::after {
    content: '';
    position: fixed;
    z-index: 1000;
}

.js .loading::before {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-bg);
}

.js .loading::after {
    top: 50%;
    left: 50%;
    width: 60px;
    height: 60px;
    margin: -30px 0 0 -30px;
    border-radius: 50%;
    opacity: 0.4;
    background: var(--color-link);
    animation: loaderAnim 0.7s linear infinite alternate forwards;

}

@keyframes loaderAnim {
    to {
        opacity: 1;
        transform: scale3d(0.5, 0.5, 1);
    }
}

a {
    text-decoration: none;
    color: var(--color-link);
    outline: none;
    position: relative;
}

.container, .container-lg, .container-md, .container-sm, .container-xl {
    max-width: 100% !important;
}

/*a::after {*/
/*    content: '';*/
/*    position: absolute;*/
/*    width: 50%;*/
/*    height: 1px;*/
/*    background: currentColor;*/
/*    left: 0;*/
/*    bottom: -25%;*/
/*    transform: scale3d(0,1,1);*/
/*    opacity: 0;*/
/*    transform-origin: 0% 50%;*/
/*    transition: transform 0.3s, opacity 0s 0.3s;*/
/*}*/

/*a:hover::after {*/
/*    opacity: 1;*/
/*    transition: transform 0.3s;*/
/*    transform: scale3d(1,1,1);*/
/*}*/

a:hover {
    color: var(--color-link-hover);
    outline: none;
}

/* Better focus styles from https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible */
a:focus {
    /* Provide a fallback style for browsers
     that don't support :focus-visible */
    outline: none;
    background: lightgrey;
}

a:focus:not(:focus-visible) {
    /* Remove the focus indicator on mouse-focus for browsers
     that do support :focus-visible */
    background: transparent;
}

a:focus-visible {
    /* Draw a very noticeable focus style for
     keyboard-focus on browsers that do support
     :focus-visible */
    outline: 2px solid red;
    background: transparent;
}

.frame {
    padding: 3rem 5vw;
    text-align: center;
    position: relative;
    z-index: 1000;
    color: var(--color-frame);
}

.frame a {
    color: var(--color-frame);
}

.frame__title {
    font-size: 1.25rem;
    margin: 0 0 1rem;
}

.frame__title span {
    position: absolute;
    pointer-events: none;
    opacity: 0;
}

.frame__links {
    display: inline;
}

.frame__links a:not(:last-child),
.frame__demos a:not(:last-child) {
    margin-right: 1rem;
}

.frame__demos {
    margin: 1rem 0;
}

a.frame__demo--current,
a.frame__demo--current:hover {
    color: var(--color-text);
}

.slideshow {
    width: 100vw;
    height: 100vh;
    position: relative;
    overflow: hidden;
}

.slide {
    margin: 0;
}

.slide,
.slide__img-wrap,
.slide__img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

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

.js .slide {
    opacity: 0;
    pointer-events: none;
}

.js .slide--current {
    opacity: 1;
    pointer-events: auto;
}

.slide__img-wrap {
    will-change: transform;
    overflow: hidden;
}

.slide__img {
    background-size: cover;
    will-change: transform;
    -webkit-backspace-visibility: hidden;
}

.slide__caption {
    position: relative;
    padding: 0 10vw;
    cursor: default;
    width: 100%;
}

.slides__caption-headline {
    font-size: 6.5vw;
    line-height: 0.9;
    margin: 0;
    text-transform: uppercase;
    font-weight: normal;
}

.text-row {
    position: relative;
    overflow: hidden;
    display: block;
    /*white-space: nowrap;*/
    width: 500px;
}
@media (max-width: 640px) {
    .text-row {
        width: 100%;
    }
}

.text-row > span {
    display: block;
    position: relative;
    padding: 1rem 0;
}

.text-row2 {
    font-size: 3rem;
    font-weight: 300;
    line-height: 1.4;
    max-width: 500px;
}

.slides__caption-headline {
    font-weight: 300;
}

.slides__caption-headline em,
.slides__caption-headline strong {
    font-family: freight-big-pro, serif;
    font-size: 6.75vw;
    font-size: clamp(2rem, 7vw, 6rem);
}

.slides__caption-headline em {
    font-weight: 400;
    font-style: italic;
}

.slides__caption-headline strong {
    font-weight: 400;
}

.slides__caption-link {
    display: inline-block;
    margin-top: 1rem;
    text-indent: 0.2vw;
    font-size: 1.4rem;
    font-weight: 300;
    font-size: clamp(1rem, 5vw, 1.4rem);
}

.slides-nav {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    right: 10vw;
    bottom: 100px;
}

.slides-nav__button {
    display: block;
    cursor: pointer;
    background: none;
    border: 0;
    width: 55px;
    height: 24px;
    padding: 0;
    margin: 0 0.75rem;
    -webkit-appearance: none;
    -moz-appearance: none;
}

.slides-nav__button:focus {
    outline: none;
}

.slides-nav svg {
    display: block;
    width: 100%;
    height: 100%;
    fill: #fff;
}

.slides-nav__index {
    margin-left: 0;
    white-space: nowrap;
    color: var(--color-text);
    border: 1px solid var(--color-text);
    border-radius: 50%;
    padding: 1rem 1.5rem;
    text-align: center;
    display: flex;
    align-items: center;
    opacity: 0 !important;
}

.slides-nav__index > span {
    width: 2rem;
}

.slides-nav__index-current {
    position: relative;
    overflow: hidden;
}

.slides-nav__index-current span {
    display: inline-block;
}


.slides__caption-headline {
    font-size: 2.5rem !important;
    line-height: 1;
    margin: 0;
    text-transform: uppercase;
    font-weight: normal;
    position: relative;
    text-shadow: 0 3px 4px black;

}

.slides__caption-headline span {
    z-index: 3;
}

/*.slides__caption-headline:before, .stroke-double:before {*/
/*    text-shadow: 0 3px 8px black;*/
/*    content: attr(title);*/
/*    position: absolute;*/
/*    -webkit-text-stroke: 0.3rem #cea052;*/
/*    right: 0;*/
/*    z-index: 1;*/
/*    top: 8px;*/
/*}*/

.bt-menu-trigger span {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    width: 8%;
    background-color: #C79E52;
    font-size: 0px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 3px;
}

.bt-menu-trigger {
    top: 30px;
    width: 50px;
    height: 40px;
}

.bt-menu-trigger span:before, .bt-menu-trigger span:after {
    position: absolute;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #C79E52;
    content: '';
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    border-radius: 3px;
    top: 3px;
}

.bt-menu-trigger:hover span:before, .bt-menu-trigger:hover span:after {
    top: -3px;
}

.bt-menu-trigger:hover span {
    top: 3px;
}

.bt-menu-trigger span {
    right: 0 !important;
    left: 0 !important;
    margin: auto;
}

.bt-menu-trigger span:before {
    -webkit-transform: translateX(10px);
    transform: translateX(10px);
}

.bt-menu-trigger span:after {
    -webkit-transform: translateX(-10px);
    transform: translateX(-10px);
}

img.custom-logo {
    width: 120px !important;
}


.about-info-text ul.nav {
    max-width: 100%;
    margin-bottom: 50px;
}

.about-info-text2 {
    width: 95%;
}

.about-info-text2 .panel {
    direction: ltr;
}

.intro-logo img {
    max-height: 150px;
    margin-bottom: 30px;
}
@media screen and (min-width: 53em) {
    .frame {
        position: fixed;
        text-align: left;
        z-index: 100;
        top: 0;
        left: 0;
        display: grid;
        align-content: space-between;
        width: 100%;
        max-width: none;
        height: 100vh;
        padding: 2rem 3.5rem;
        pointer-events: none;
        grid-template-columns: 25% 50% 25%;
        grid-template-rows: auto auto auto;
        grid-template-areas: 'title links info'
							'... ... ...'
							'demos demos nav';
    }

    .frame__title {
        margin: 0;
        grid-area: title;
    }

    .frame__demos {
        margin: 0;
        grid-area: demos;
        justify-self: start;
        align-self: end;
    }

    .frame__links {
        grid-area: links;
        padding: 0;
        justify-self: center;
    }

    .frame__info {
        grid-area: info;
        justify-self: end;
        align-self: start;
    }

    .slides-nav {
        /*grid-area: nav;*/
        justify-self: end;
        align-self: end;
    }

    .frame a,
    .frame button {
        pointer-events: auto;
    }

    .slideshow {
        height: 100vh;
    }

    .slides-nav {
        margin-bottom: -1rem;
    }

    .slides-nav__index {
        margin-left: -2rem;
    }

    .slideshow {
        background: var(--color-bg);
    }

}


@media (max-width: 640px) {
    .intr-inner h1 {
        font-size: 18px;
        padding: 0 20px;
    }
    .intr-inner p {
        font-size: 18px;
    }
    .intro {
        background-image: none;
    }


    .frame {

        position: absolute !important;
        bottom: 0;
    }

    .slides__caption-headline {
        font-size: 2rem !important;

    }


    .intro-logo img {
        max-height: 100px;
    }

}

/**********************/


.panel {
    margin: 5rem auto
}

.js .panel {
    width:  100% ;
    display: grid;
    grid-template-areas:"item"
}

.panel__item {
    position: relative;
    grid-area: item;
    width: 100%;
    display: grid;
    grid-gap: 1rem;
    grid-template-columns:auto minmax(0, 1fr) auto;
    grid-template-areas:"image title title" "image title title" "subtitle subtitle subtitle" "... ... close" "... details ...";
    grid-template-rows:1fr auto auto auto
}

.no-js .panel__item {
    margin: 0 0 5rem;
    grid-template-areas:"image title title" "image title title" "subtitle subtitle subtitle"
}

.js .panel__item {
    pointer-events: none
}

.panel__item-imgwrap {
    grid-area: image;
    position: relative;
    border-radius: .35rem;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: start;
    width: min-content
}

.js .panel__item-imgwrap {
    cursor: pointer;
    pointer-events: auto;
    will-change: transform, opacity
}

.panel__item-img {
    position: relative;
    width: 20vw;
    height: auto;
    max-width: 250px;
    display: block
}

.panel__item-title {
    grid-area: title;
    font-size: 30px;
    margin: 0;
    font-weight: 100;
    direction: rtl;
}

.panel__item-title span {
    display: inline-block;
    padding-bottom: 1.85vw;
    will-change: transform, opacity
}

.panel__item-title span:first-child {
    /*font-style: italic;*/
    font-weight: 300
}

.panel__item-title span:last-child {
    font-weight: 700;
    /*text-indent: 10vw;*/
    display: block
}

.panel__item-subtitle {
    grid-area: subtitle;
    justify-self: start
}

.details {
    grid-area: details;
    justify-self: start
}

.panel__item-subtitle > span {
    display: inline-block;
    position: relative;
    color: var(--color-text-alt)
}

.panel__item-subtitle h4 {
    position: relative;
    margin: .5rem 0 0;
    font-weight: 400;
    font-size: 1.5rem;
    font-size: clamp(.75rem, 8vw, 1.5rem)
}

.panel__item-subtitle h4 span.char {
    will-change: transform, opacity
}

.panel__item-close {
    /*grid-area: close;*/
    border: 0;
    padding: 0;
    margin: 0;
    /*position: relative;*/
    /*background: none;*/
    cursor: pointer;
    /*align-self: end*/

    position: absolute;
    right: 0px;
    top: 0;
    width: 200px;
    height: 200px;
    border: none;
    background: none;
}

.no-js .panel__item-close {
    display: none
}

.panel__item-close:focus {
    outline: none
}

@media screen and (min-width: 760px) {
    .panel__item {
        grid-gap: 2rem;
        grid-template-columns:auto minmax(0, 1fr) auto;
        grid-template-areas:"image title title" "image subtitle close";
        grid-template-rows:1fr auto
    }

    .no-js .panel__item {
        margin: 0 0 5rem;
        grid-template-areas:"image title title" "image subtitle subtitle"
    }
}

@media screen and (min-width: 1170px) {
    .panel__item {
        grid-template-columns:auto minmax(0, 1fr) 250px;
        grid-template-areas:"image title close" "image subtitle close" "... details ...";
        grid-template-rows:1fr auto
    }

    .panel__item-close {
        align-self: unset
    }

    .panel__item-close span {
        display: none
    }

    .panel__item-close:after, .panel__item-close:before {
        content: "";
        width: 1px;
        height: 100%;
        background: currentColor;
        position: absolute;
        transform-origin: 50% 50%;
        left: 50%;
        top: 0;
        transform: scale(1.15) rotate(32deg)
    }

    .panel__item-close:after {
        transform: scale(1.15) rotate(-32deg)
    }
}

.js .panel__item-close, .js .panel__item-subtitle > *, .js .panel__item-title > * {
    opacity: 0;
    pointer-events: none
}

.js .panel__item--open .panel__item-close, .js .panel__item--open .panel__item-subtitle > *, .js .panel__item--open .panel__item-title > * {
    pointer-events: auto
}

.js .panel__item--open {
    z-index: 1000
}

.panel__item--open .details {
    display: block !important;
    width: 800px;
    margin-left: -220px;
}

.panel__item--open .word span {
    display: none;
}

.panel__item--open .word:after {
    content: attr(data-word);
}

@media (any-pointer: fine) {
    .cursor {
        position: fixed;
        top: 0;
        left: 0;
        display: block;
        pointer-events: none;
        z-index: 1001
    }

    .cursor__inner {
        fill: var(--cursor-fill);
        stroke: var(--cursor-stroke);
        stroke-width: var(--cursor-stroke-width);
        opacity: .7
    }

    .no-js .cursor {
        display: none
    }
}

.splitting .char, .splitting .word {
    display: inline-block;
    transition: inherit;
}

.splitting .char {
    position: relative
}

.splitting .char:after, .splitting .char:before {
    content: attr(data-char);
    position: absolute;
    top: 0;
    left: 0;
    visibility: hidden;
    transition: inherit;
    user-select: none
}

.splitting {
    --word-center: calc(var(--word-total) / 2 - 0.5);
    --char-center: calc(var(--char-total) / 2 - 0.5);
    --line-center: calc(var(--line-total) / 2 - 0.5)
}

.splitting .word {
    --word-percent: calc(var(--word-index) / var(--word-total));
    --line-percent: calc(var(--line-index) / var(--line-total))
}

.splitting .char {
    --char-percent: calc(var(--char-index) / var(--char-total));
    --char-offset: calc(var(--char-index) - var(--char-center));
    --distance: calc(var(--char-offset) * var(--char-offset) / var(--char-center));
    --distance-sine: calc(var(--char-offset) / var(--char-center));
    --distance-percent: calc(var(--distance) / var(--char-center))
}

.splitting.cells img {
    width: 100%;
    display: block
}

@supports (display:grid) {
    .splitting.cells {
        position: relative;
        overflow: hidden;
        background-size: cover;
        visibility: hidden
    }

    .splitting .cell-grid {
        background: inherit;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: grid;
        grid-template:repeat(var(--row-total), 1fr)/repeat(var(--col-total), 1fr)
    }

    .splitting .cell {
        background: inherit;
        position: relative;
        overflow: hidden
    }

    .splitting .cell-inner {
        background: inherit;
        position: absolute;
        visibility: visible;
        width: calc(100% * var(--col-total));
        height: calc(100% * var(--row-total));
        left: calc(-100% * var(--col-index));
        top: calc(-100% * var(--row-index))
    }

    .splitting .cell {
        --center-x: calc(var(--col-total) / 2 - 0.5);
        --center-y: calc(var(--row-total) / 2 - 0.5);
        --offset-x: calc(var(--col-index) - var(--center-x));
        --offset-y: calc(var(--row-index) - var(--center-y));
        --distance-x: calc(var(--offset-x) * var(--offset-x) / var(--center-x));
        --distance-y: calc(var(--offset-y) * var(--offset-y) / var(--center-y))
    }
}

.mobile_gallery {
    display: none;
}
.mobile_gallery_slider {
    margin-top: 125px;
}
.desctop_paneel{
    display: block;
}

.video-list{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
}
.vid-item {
    width: 140px;
    height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 5px;
    margin-right: 5px;
    transition: all .3s ease-in-out;
    border-radius: 10px;
    overflow: hidden;
}
.vid-item a {
    color: #C79E52;
    width: 140px;
    height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: all .3s ease-in-out;

}
.vid-item img{
    object-fit: cover;
    height: 100%;
}
.vid-item:hover , .vid-item a {
    /*width: 180px;*/
}
.vid-item:nth-child(even){
    margin-top: 50px;
}
@media (max-width: 640px) {

    .panel__item--open .details {
        display: block !important;
        width: 300px;
        margin-left: -99px;
    }

    .mobile_gallery{
        display: block;
    }
    .desctop_paneel , #mediaG{
        display: none;
    }

    .panel__item-close {
       top: -60px;
       width: auto;
       height: auto;
    }
    .panel__item-title {
         font-size: 20px;
    }
    .panel__item-subtitle{
    width: 100%;
    }
    .panel__item-subtitle h4 {

        font-size: 16px !important;
    }

    .details{
    font-size: 16px;
    }

    .slides__caption-link{
        font-size: 1rem !important;
    }
}
.accordion>.card>.card-header{
    background: #cea052 ;
    color:#ffffff;
    text-align: right;

}
.accordion>.card>.card-header.collapsed{
    background: #ececec ;
    color:#555555;
    text-align: right;
}

.accordion>.card>.card-header .btn-link{
    color:#ffffff;
    text-align: right;
    width: 100%;
    outline: none !important;
    box-shadow: none !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.accordion>.card>.card-header.collapsed .btn-link {
    color:#555555;

}
.accordion>.card{
    border: 1px solid rgba(0,0,0,.125) !important;
    border-radius: 5px !important;
    margin-bottom: 15px;
}

img{
    height: auto;
}
.bt-menu ul li a img {
    margin-left: 10px;
    max-width: 25px;
}

.section_about h2{
    font-size: 30px;
    margin-bottom: 20px;

    opacity: 0;
    z-index: 99;
    visibility: hidden;
    -webkit-transform: translateX(-220%);
    -ms-transform: translateX(-220%);
    transform: translateX(-220%);

    -webkit-transition-delay: 3s;
    -moz-transition-delay: 3s;
    -ms-transition-delay: 3s;
    -o-transition-delay: 3s;
    transition-delay: 3s;

    -webkit-transition: all 1.5s ease-out;
    -moz-transition: all 1.5s ease-out;
    -ms-transition: all 1.5s ease-out;
    -o-transition: all 1.5s ease-out;
    transition: all 1.5s ease-out;
}

.section_about .pdetails{

    opacity: 0;
    z-index: 99;
    visibility: hidden;
    -webkit-transform: translateX(-220%);
    -ms-transform: translateX(-220%);
    transform: translateX(-220%);

    -webkit-transition-delay: 3s;
    -moz-transition-delay: 3s;
    -ms-transition-delay: 3s;
    -o-transition-delay: 3s;
    transition-delay: 3s;

    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
    -ms-transition: all 2s ease-out;
    -o-transition: all 2s ease-out;
    transition: all 2s ease-out;
}
.section_about .ab-img{
    width: 350px;
    /*height: 350px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    /*border-radius: 50%;*/
    overflow: hidden;


    opacity: 0;
    z-index: 99;
    visibility: hidden;
    -webkit-transform: translateX(-220%);
    -ms-transform: translateX(-220%);
    transform: translateX(-220%);

    -webkit-transition-delay: 3s;
    -moz-transition-delay: 3s;
    -ms-transition-delay: 3s;
    -o-transition-delay: 3s;
    transition-delay: 3s;

    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
    -ms-transition: all 2s ease-out;
    -o-transition: all 2s ease-out;
    transition: all 2s ease-out;
}

.section_about .ab-img.right-img{
    max-width: 350px;
    height: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    /*border-radius: 50%;*/
    /*overflow: hidden;*/


    opacity: 0;
    z-index: 99;
    visibility: hidden;
    -webkit-transform: translateX(220%);
    -ms-transform: translateX(220%);
    transform: translateX(220%);

    -webkit-transition-delay: 3s;
    -moz-transition-delay: 3s;
    -ms-transition-delay: 3s;
    -o-transition-delay: 3s;
    transition-delay: 3s;

    -webkit-transition: all 2s ease-out;
    -moz-transition: all 2s ease-out;
    -ms-transition: all 2s ease-out;
    -o-transition: all 2s ease-out;
    transition: all 2s ease-out;
}

.ab-img img{
    object-fit: cover;
    width: 100%;
    height: auto !important;
}
.pt-page-current .section_about h2 {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}

.pt-page-current .section_about .ab-img , .pt-page-current .section_about .pdetails{
    opacity: 1;
    visibility: visible;

    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
}
.section_about{
    padding: 40px 0;
    margin: auto;
    width: 80%;
}
.about-info-text2{
    width: 100%;
}
.about-2-parallax{
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
   min-height: 350px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
    border-radius: 0;
    margin: 40px 0;
    background-attachment: fixed, scroll;


    opacity: 0;
    z-index: 99;
    visibility: hidden;
    -webkit-transform: translateY(-101%);
    -ms-transform: translateY(-101%);
    transform: translateY(-101%);

    -webkit-transition: all 0.7s ease;
    -moz-transition: all 0.7s ease;
    -ms-transition: all 0.7s ease;
    -o-transition: all 0.7s ease;
    transition: all 0.7s ease;
}

.pt-page-current  .about-2-parallax{

    opacity: 1;
    visibility: visible;

    -webkit-transform: translateY(0%);
    -ms-transform: translateY(0%);
    transform: translateY(0%);
}

.vc_separator{
    margin-top: 90px !important;
    margin-bottom: 35px !important;
}


.vc_parallax .vc_parallax-inner{
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
@media (max-width: 640px) {
    .section_about .ab-img{
        width: 250px !important;
        /*height: 250px !important;*/
        margin: auto;
        margin-bottom: 20px;
    }
}