@import 'https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700&display=swap';
@import 'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap';
@import 'https://fonts.googleapis.com/css2?family=Rubik:wght@400;500;600;700&display=swap';
@import 'https://fonts.googleapis.com/css2?family=Be+Vietnam:wght@300;400;500;600;700&display=swap';
@import "responsive.css";
@import "bootstrap.css";
@import "animate.css";
@import "jquery.fancybox.min.css";
@import "../css/icomoon.css";
@import "font-awesome.css";
@import "shortcodes.css";
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline;
    font-family:inherit;
    font-size:100%;
    font-style:inherit;
    font-weight:inherit
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
    display:block
}
html{
    font-size:62.5%;
    overflow-y:scroll;
    -webkit-text-size-adjust:100%;
    -ms-text-size-adjust:100%
}
*,*:before,*:after{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
body{
    background:#fff;
    line-height:1
}
article,aside,details,figcaption,figure,footer,header,main,nav,section{
    display:block
}
ol,ul{
    list-style:none
}
table{
    border-collapse:collapse;
    border-spacing:0
}
caption,th,td{
    font-weight:400;
    text-align:left
}
blockquote:before,blockquote:after,q:before,q:after{
    content:'';
    content:none
}
blockquote,q{
    quotes:none
}
a img{
    border:0
}
img{
    max-width:100%;
    height:auto
}
select{
    max-width:100%
}
body,button,input,select,textarea{
    font-family:roboto,sans-serif;
    color:#191919;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
    text-rendering:optimizeLegibility;
    overflow-x:hidden;
    overflow-y:auto
}
img{
    height:auto;
    max-width:100%;
    vertical-align:middle;
    -ms-interpolation-mode:bicubic
}
p{
    font-weight:400;
    font-size:16px;
    line-height:29px
}
strong,b,cite{
    font-weight:700
}
dfn,cite,em,i,blockquote p{
    font-family:barlow,sans-serif;
    font-size:24px;
    font-weight:500;
    line-height:40px;
    font-style:italic;
    color:#fff!important
}
blockquote h4{
    font-family:rubik,sans-serif;
    font-size:16px;
    font-weight:400;
    margin-bottom:17px
}
blockquote{
    position:relative;
    background-color:var(--primary-color2);
    color:#fff;
    text-align:center;
    padding:40px 20px 52px;
    margin:-57px 8.3% 0;
    border-radius:6px
}
blockquote::after{
    content:'';
    position:absolute;
    top:0;
    left:50%;
    transform:translateX(-50%);
    right:0;
    height:2px;
    width:90%;
    background-color:var(--primary-color)
}
blockquote>p:last-child{
    margin-bottom:0
}
blockquote cite{
    position:absolute;
    right:0;
    bottom:0
}
blockquote em,blockquote i{
    font-style:normal
}
abbr,acronym{
    border-bottom:1px dotted #e0e0e0;
    cursor:help
}
mark,ins{
    text-decoration:none
}
sup,sub{
    font-size:75%;
    height:0;
    line-height:0;
    position:relative;
    vertical-align:baseline
}
sup{
    top:-6px
}
sub{
    bottom:-3px
}
small{
    font-size:75%
}
big{
    font-size:125%
}
address{
    font-style:italic;
    margin:0 0 20px
}
code,kbd,tt,var,samp,pre{
    margin:20px 0;
    padding:4px 12px;
    background:#f5f5f5;
    border:1px solid #e0e0e0;
    overflow-x:auto;
    -webkit-hyphens:none;
    -moz-hyphens:none;
    hyphens:none;
    border-radius:0;
    height:auto
}
html{
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box
}
*,*:before,*:after{
    -webkit-box-sizing:inherit;
    -moz-box-sizing:inherit;
    box-sizing:inherit
}
hr{
    margin-bottom:20px;
    border:dashed 1px #ccc
}
ul,ol{
    padding:0
}
ul{
    list-style:disc
}
ol{
    list-style:decimal
}
li>ul,li>ol{
    margin-bottom:0
}
li{
    list-style:none
}
ul li,ol li{
    padding:.1em 0
}
dl,dd{
    margin:0 0 20px
}
dt{
    font-weight:700
}
del,.disable{
    text-decoration:line-through;
    filter:alpha(opacity=50);
    opacity:.5
}
table,th,td{
    border:1px solid #e0e0e0
}
table{
    border-collapse:separate;
    border-spacing:0;
    border-width:1px 0 0 1px;
    margin:0 0 30px;
    table-layout:fixed;
    width:100%
}
caption,th,td{
    font-weight:400;
    text-align:left
}
th{
    border-width:0 1px 1px 0;
    font-weight:700
}
td{
    border-width:0 1px 1px 0
}
th,td{
    padding:8px 12px
}
embed,object,video{
    margin-bottom:20px;
    max-width:100%;
    vertical-align:middle
}
p>embed,p>iframe,p>object,p>video{
    margin-bottom:0
}
button,input{
    line-height:normal
}
button,input,select,textarea{
    font-size:100%;
    line-height:inherit;
    margin:0;
    vertical-align:baseline
}
input,textarea,select{
    font-size:14px;
    max-width:100%;
    background-image:-webkit-linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0))
}
textarea{
    overflow:auto;
    vertical-align:top
}
input[type=checkbox]{
    display:inline
}
button,input[type=button],input[type=reset],input[type=submit]{
    line-height:1;
    cursor:pointer;
    -webkit-appearance:button;
    border:0
}
input[type=checkbox],input[type=radio]{
    padding:0;
    width:18px;
    height:18px;
    margin-right:11px;
    cursor:pointer;
    vertical-align:sub
}
input[type=search]{
    -webkit-appearance:textfield
}
input[type=search]::-webkit-search-decoration{
    -webkit-appearance:none
}
button::-moz-focus-inner,input::-moz-focus-inner{
    border:0;
    padding:0
}
input:-webkit-autofill{
    -webkit-box-shadow:0 0 0 1000px #f7f7f7 inset
}
input[type=search]{
    outline:0
}
input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{
    display:none
}
select,textarea,input[type=text],input[type=password],input[type=datetime],input[type=datetime-local],input[type=date],input[type=month],input[type=time],input[type=week],input[type=number],input[type=email],input[type=url],input[type=search],input[type=tel],input[type=color]{
    color:#565872;
    border:1px solid #e7e7e700;
    padding:16px 23px;
    letter-spacing:.4px;
    line-height:inherit;
    width:100%;
    height:auto;
    text-shadow:none;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow:none;
    -webkit-box-sizing:border-box;
    -moz-box-sizing:border-box;
    box-sizing:border-box;
    -webkit-transition:border ease .238s;
    -moz-transition:border ease .238s;
    transition:border ease .238s
}
.wpcf7-form select,.wpcf7-form textarea,.wpcf7-form input{
    margin-bottom:0
}
textarea:focus,input[type=text]:focus,input[type=password]:focus,input[type=datetime]:focus,input[type=datetime-local]:focus,input[type=date]:focus,input[type=month]:focus,input[type=time]:focus,input[type=week]:focus,input[type=number]:focus,input[type=email]:focus,input[type=url]:focus,input[type=search]:focus,input[type=tel]:focus,input[type=color]:focus{
    border-color:var(--primary-color);
    outline:0;
    -webkit-box-shadow:none;
    -moz-box-shadow:none;
    box-shadow:none
}
textarea::placeholder,input[type=text]::placeholder,input[type=password]::placeholder,input[type=datetime]::placeholder,input[type=datetime-local]::placeholder,input[type=date]::placeholder,input[type=month]::placeholder,input[type=time]::placeholder,input[type=week]::placeholder,input[type=number]::placeholder,input[type=email]::placeholder,input[type=url]::placeholder,input[type=search]::placeholder,input[type=tel]::placeholder,input[type=color]::placeholder{
    font-size:16px;
    font-weight:400;
    line-height:26px;
    color:#ccc
}
button,input[type=button],input[type=reset],input[type=submit]{
    font-weight:700;
    font-size:15px;
    background-color:var(--primary-color);
    color:#ffff;
    border-radius:4px;
    padding:18px 23px;
    display:inline-block;
    -webkit-appearance:none;
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    transition:all ease .3s
}
button:hover,input[type=button]:hover,input[type=reset]:hover,input[type=submit]:hover,button:focus,input[type=button]:focus,input[type=reset]:focus,input[type=submit]:focus{
    outline:0
}
::-webkit-input-placeholder{
    color:#999
}
:-moz-placeholder{
    color:#999
}
::-moz-placeholder{
    color:#999;
    opacity:1
}
.error{
    font-size:16px;
    color:var(--primary-color5);
    margin-bottom:10px;
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    transition:all ease .3s
}
:-ms-input-placeholder{
    color:#999
}
h1,h2,h3,h4,h5,h6{
    font-weight:700;
    text-rendering:optimizeLegibility
}
h1{
    font-size:40px
}
h2{
    font-size:2em
}
h3{
    font-size:1.714em
}
h4{
    font-size:1.428em
}
h5{
    font-size:1.2em
}
h6{
    font-size:1.142em
}
h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{
    color:inherit
}
.back-ground-style{
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center;
    overflow:hidden
}
.no-margin{
    margin:0!important
}
.no-border{
    border:0!important
}
.no-letter-spacing{
    letter-spacing:0!important
}
.border-radius-4,.border-radius-4 img{
    border-radius:4px
}
.border-radius-8,.border-radius-8 img{
    border-radius:8px
}
.border-radius-10,.border-radius-10 img{
    border-radius:10px
}
.max-width-770{
    max-width:770px!important
}
.max-width-680{
    max-width:680px!important
}
.font-heading{
    font-family:montserrat,sans-serif
}
.font-size-40{
    font-size:40px!important
}
.font-size-35{
    font-size:35px!important
}
.font-size-30{
    font-size:30px!important
}
.font-size-28{
    font-size:28px!important
}
.font-size-16{
    font-size:16px!important
}
.font-size-14{
    font-size:14px!important
}
.font-weight-700{
    font-weight:700!important
}
.font-weight-600{
    font-weight:600!important
}
.font-weight-500{
    font-weight:500!important
}
.font-weight-400{
    font-weight:400!important
}
.line-height-62{
    line-height:62px!important
}
.line-height-50{
    line-height:50px!important
}
.line-height-39{
    line-height:39px!important
}
.line-height-35{
    line-height:35px!important
}
.line-height-32{
    line-height:32px!important
}
.line-height-29{
    line-height:29px!important
}
.line-height-28{
    line-height:28px!important
}
.line-height-27{
    line-height:27px!important
}
.line-height-26{
    line-height:26px!important
}
.line-height-25{
    line-height:25px!important
}
.line-height-24{
    line-height:24px!important
}
.line-height-normal{
    line-height:normal!important
}
.letter-spacing-1-4{
    letter-spacing:1.4px!important
}
.letter-spacing-1-1{
    letter-spacing:1.1px!important
}
.letter-spacing-1-8{
    letter-spacing:1.8px!important
}
.letter-spacing-03{
    letter-spacing:.3px!important
}
.letter-spacing-01{
    letter-spacing:.1px!important
}
.letter-spacing-005{
    letter-spacing:-.05px!important
}
.font-size-icon{
    font-size:37px
}
.text-under{
    text-decoration-line:underline
}
.text-accent{
    color:var(--primary-color)!important
}
.text-white{
    color:#fff!important
}
.text-pri{
    color:var(--primary-color)
}
.text-808{
    color:gray!important
}
.text-center{
    text-align:center
}
.list-center{
    justify-content:center
}
.text-777{
    color:#777!important
}
.text-666{
    color:#666!important
}
.bg-light-grey{
    background-color:#f3f4f6!important
}
.bg-white-column{
    background-color:#fff!important
}
.bg-light-snow{
    background-color:#fafafb
}
.bg-f7f{
    background-color:#f7f7f7!important
}
.bg-ffc{
    background-color:#ffc30c!important
}
.padding-top-45{
    padding-top:45px
}
.padding-top-17{
    padding-top:17px
}
.padding-top-16{
    padding-top:16px
}
.padding-left-13{
    padding-left:13px
}
.padding-left-7{
    padding-left:7px
}
.padding-right-100{
    padding-right:100px
}
.margin-top-55{
    margin-top:55px
}
.margin-top-53{
    margin-top:53px
}
.margin-top-51{
    margin-top:51px
}
.margin-top-48{
    margin-top:48px
}
.margin-top-40{
    margin-top:40px
}
.margin-top-37{
    margin-top:37px
}
.margin-top-33{
    margin-top:33px
}
.margin-top-30{
    margin-top:30px
}
.margin-top-28{
    margin-top:28px
}
.margin-top-27{
    margin-top:27px
}
.margin-top-22{
    margin-top:22px
}
.margin-top-20{
    margin-top:20px
}
.margin-top-18{
    margin-top:18px
}
.margin-top-17{
    margin-top:17px
}
.margin-top-15{
    margin-top:15px
}
.margin-top-14{
    margin-top:14px
}
.margin-top-13{
    margin-top:13px
}
.margin-top-11{
    margin-top:11px
}
.margin-top-10{
    margin-top:10px
}
.margin-top-7{
    margin-top:7px
}
.margin-top-5{
    margin-top:5spx
}
.margin-top-3{
    margin-top:3px
}
.margin-bottom-58{
    margin-bottom:58px
}
.margin-bottom-52{
    margin-bottom:52px
}
.margin-bottom-50{
    margin-bottom:50px
}
.margin-bottom-47{
    margin-bottom:47px
}
.margin-bottom-45{
    margin-bottom:45px
}
.margin-bottom-43{
    margin-bottom:43px
}
.margin-bottom-40{
    margin-bottom:40px
}
.margin-bottom-35{
    margin-bottom:35px
}
.margin-bottom-31{
    margin-bottom:31px
}
.margin-bottom-30{
    margin-bottom:30px
}
.margin-bottom-20{
    margin-bottom:20px
}
.margin-bottom-25{
    margin-bottom:25px
}
.margin-bottom-27{
    margin-bottom:27px
}
.margin-bottom-32{
    margin-bottom:32px!important
}
.margin-bottom-38{
    margin-bottom:38px
}
.margin-bottom-18{
    margin-bottom:18px
}
.margin-bottom-17{
    margin-bottom:17px
}
.margin-bottom-15{
    margin-bottom:15px
}
.margin-bottom-14{
    margin-bottom:14px
}
.margin-bottom-12{
    margin-bottom:12px
}
.margin-right-18{
    margin-right:18px
}
.margin-bottom-10{
    margin-bottom:10px
}
.margin-bottom-8{
    margin-bottom:8px
}
.margin-bottom-5{
    margin-bottom:5px!important
}
.margin-right-100{
    margin-right:100px
}
.margin-right-10{
    margin-right:10px
}
.margin-right-12{
    margin-right:12px
}
.margin-right-8{
    margin-right:8px
}
.margin-right-6{
    margin-right:6px
}
.margin-right-15{
    margin-right:15px
}
.margin-left-10{
    margin-left:10px
}
.margin-left-15{
    margin-left:15px
}
.position-relative{
    position:relative
}
.right-38{
    right:38px!important
}
.maxwidth-99{
    max-width:99%!important
}
.float-left{
    float:left
}
.float-right{
    float:right
}
.display-flex{
    display:flex;
    display:-webkit-flex
}
.align-items-center{
    align-items:center!important
}
.box-8{
    float:left;
    margin-right:15px;
    width:calc(66.666667% - 15px)
}
.box-6{
    float:left;
    margin-right:15px;
    width:calc(50% - 15px)
}
.box-4{
    float:left;
    margin-left:15px;
    width:calc(33.333333% - 15px)
}
.tf-space{
    padding:110px 0
}
.tf-row{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    margin-right:-15px;
    margin-left:-15px
}
.tf-col-4{
    padding:0 15px;
    width:33.333%;
    float:left
}
.tf-col-6{
    padding:0 15px;
    width:50%;
    float:left
}
.tf-col-12{
    padding:0;
    width:100%;
    float:none
}
.ptlg-120{margin-top:-120px;}
a{
    text-decoration:none;
    color:var(--primary-color);
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
a:hover,a:focus{
    color:var(--primary-color2);
    text-decoration:none;
    outline:0;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-2 a{
    color:var(--primary-color2);
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-2 a:hover,.link-style-2 a:focus{
    color:var(--primary-color)
}
.link-style-3 a{
    color:#616161;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-3 a:hover,.link-style-3 a:focus{
    color:var(--primary-color)
}
.link-style-4 a{
    color:#555;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-4 a:hover{
    color:var(--primary-color)
}
.link-style-5 a{
    color:#fff;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-6 a{
    color:var(--primary-color);
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-6 a:hover,.link-style-6 a:focus{
    color:var(--primary-color6)
}
.link-style-7 a{
    color:var(--primary-color5);
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.link-style-7 a:hover,.link-style-7 a:focus{
    color:var(--primary-color)
}
.read-more::before{
    content:'\e909';
    font-family:icomoon
}
.section-14px-regular{
    font-size:14px;
    letter-spacing:0;
    font-weight:400;
    line-height:26px
}
.section-14px-regular-rubik{
    font-size:14px;
    font-family:rubik,sans-serif;
    letter-spacing:0;
    font-weight:400;
    line-height:30px
}
.section-16px-regular{
    font-size:16px;
    letter-spacing:0;
    font-weight:400;
    line-height:35px
}
.desc-slider{
    font-size:17px;
    font-weight:500;
    line-height:32px
}
.section-17px-regular{
    font-size:17px;
    letter-spacing:0;
    font-weight:400;
    line-height:30px
}
.section-20px-regular{
    font-size:20px;
    letter-spacing:0;
    font-weight:400;
    line-height:45px
}
.section-22px-barlow{
    font-size:22px;
    font-family:barlow,sans-serif;
    letter-spacing:0;
    font-weight:700;
    line-height:32px
}
.section-24px-medium{
    font-size:24px;
    letter-spacing:0;
    font-weight:500;
    line-height:30px
}
.section-24px-barlow{
    font-size:24px;
    font-family:barlow,sans-serif;
    letter-spacing:0;
    font-weight:700;
    line-height:30px
}
.section-35px-barlow{
    font-size:35px;
    font-family:barlow,sans-serif;
    letter-spacing:0;
    font-weight:700;
    line-height:30px
}
.section-40px-barlow{
    font-size:40px;
    font-family:barlow,sans-serif;
    letter-spacing:0;
    font-weight:700;
    line-height:60px
}
.section-title-page{
    font-family:barlow,sans-serif;
    font-size:40px;
    font-weight:700;
    line-height:60px
}
.section-subtitle{
    position:relative;
    display:inline;
    font-size:17px;
    font-family:dm sans,sans-serif;
    font-weight:700;
    line-height:22px;
    color:var(--primary-color)
}
:root{
    --primary-color: #1177cc;
    --primary-color2: #222429;
    --primary-color3: #054055;
    --primary-color4: #DCDCDC;
    --primary-color5: #262626;
    --primary-color6: #181818;
    --primary-color7: #FCE9E7
}
.parallax{
    width:100%;
    background-attachment:fixed;
    background-position:50% 0;
    background-repeat:repeat
}
#site-header-wrap{
    position:relative
}
#top-bar{
    position:relative;
    z-index:1;
    background-color:#fff;
    height:50px;
    border-bottom:solid 1px #dcdcdc7a;
    padding-left:2.2%;
    padding-right:3.5%
}
#top-bar .top-bar-content{
    display:flex;
    justify-content:space-between;
    line-height:50px
}
.top-bar-content .top-bar-left span,.top-bar-content .top-bar-right span:first-child{
    padding:0 27px
}
.top-bar-content span a{
    color:#616161
}
.top-bar-content span a:hover{
    color:var(--primary-color)
}
#top-bar .top-bar-left .map,#top-bar .top-bar-left .mail,#top-bar .top-bar-right .phone{
    position:relative
}
#top-bar .socials-header{
    display:inline-block
}
.widget-socials{
    display:flex;
    display:-webkit-flex
}
.widget-socials li{
    width:28px;
    height:28px;
    line-height:28px;
    margin:0 3px;
    background-color:#f2f2f2;
    border-radius:50%;
    font-size:13px;
    text-align:center;
    object-fit:cover
}
#top-bar .map::before,#top-bar .mail::before,.phone::before{
    position:absolute;
    left:0;
    top:45%;
    transform:translateY(-50%);
    color:var(--primary-color)
}
#top-bar .mail::before{
    font-size:20px
}
.map::before{
    content:'\e914';
    font-family:icomoon
}
.mail::before{
    content:'\e906';
    font-family:icomoon
}
.phone::before{
    content:'\e915';
    font-family:icomoon
}
.facebook::before,.twitter::before,.linked-in::before,.instagram::before{
    content:'\f09a';
    font-family:fontawesome
}
.twitter::before{
    content:'\f099'
}
.linked-in::before{
    content:'\f0e1'
}
.instagram::before{
    content:'\f16d'
}
#site-header{
    position:relative;
    display:flex;
    width:100%;
    background-color:#fff;
    border-bottom:solid 1px #dcdcdc7a;
    border-top:solid 1px #dcdcdc7a
}
#site-header .header-box{
    width:80%
}
#site-header-inner{
    position:relative;
    height:80px
}
.menu-has-search #site-header #main-nav{
    right:28px
}
.menu-has-search #site-header #header-search{
    display:block
}
#site-header #header-search{
    position:absolute;
    right:15px;
    top:50%;
    z-index:10;
    display:none;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%)
}
#site-logo{
    width:30%;
    line-height:132px
}
#site-logo-inner{
    background-color:#eee;
    clip-path:polygon(0 0,79% 0,69% 100%,0% 100%)
}
#site-logo-inner .main-logo{
    padding-left:14.8%;
    display:block
}
#site-logo-inner .main-logo img{
	width:220px
}
#main-nav ul{
    margin:0
}
#main-nav ul li{
    position:relative;
    list-style:none
}
#main-nav>ul>li{
    float:left;
    padding:32px 20px
}
#main-nav>ul>li>a{
    display:block;
    font-size:18px;
    font-weight:500;
    color:#101010;
    position:relative
}
#main-nav>ul>li>a::before{
    content:"";
    position:absolute;
    bottom:-15px;
    left:0;
    width:0%;
    height:3px;
    background-color:var(--primary-color);
    opacity:0;
    visibility:hidden;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
#main-nav>ul>li>a:hover::before{
    opacity:1;
    visibility:visible;
    width:100%
}
#main-nav>.menu>li.menu-item-has-children>a::after{
    content:'\f107';
    font-family:fontawesome;
    font-weight:700;
    margin-left:4px
}
#main-nav .sub-menu{
    position:absolute;
    top:120%;
    left:0;
    width:250px;
    background-color:#ffff;
    border-radius:6px;
    box-shadow:-2px 6px 23px #b4b4b44f;
    z-index:9999;
    opacity:0;
    visibility:hidden;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease;
    -webkit-transform:translateY(15px);
    -moz-transform:translateY(15px);
    -ms-transform:translateY(15px);
    -o-transform:translateY(15px);
    transform:translateY(15px)
}
#main-nav .sub-menu::before{
    content:'';
    position:absolute;
    top:-5px;
    left:25px;
    height:15px;
    width:15px;
    transform:rotate(45deg);
    background-color:#fff
}
#main-nav .right-sub-menu{
    left:auto;
    right:0
}
#main-nav .sub-menu li a{
    display:block;
    font-size:16px;
    color:var(--primary-color6);
    padding:20px;
    font-weight:600
}
#main-nav .sub-menu li:not(:last-child) a{
    border-bottom:1px solid #e1e1e18e
}
#main-nav li:hover .sub-menu{
    opacity:1;
    visibility:visible;
    -webkit-transform:translateY(0);
    -moz-transform:translateY(0);
    -ms-transform:translateY(0);
    -o-transform:translateY(0);
    transform:translateY(0)
}
#main-nav .sub-menu li a:hover,#main-nav .sub-menu li.current-item a,#main-nav>ul>li>a:hover{
    color:var(--primary-color)
}
#site-header-right{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    z-index:99
}
#site-header-right .button-header{
    display:inline-block;
    font-size:18px;
    font-weight:700;
    line-height:80px;
    padding:0 59px;
    background-color:var(--primary-color);
    clip-path:polygon(8% 0,100% 0%,100% 100%,0% 100%);
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
#site-header-right .button-header a{
    color:#fff
}
#site-header-right .button-header:hover{
    background-color:var(--primary-color2)
}
#site-header-right .button-header a::after{
    content:'\e904';
    font-family:icomoon;
    margin-left:15px;
    vertical-align:middle
}
#site-header-right .header-menu,#site-header-right .header-search{
    display:inline-block;
    margin-right:40px
}
#site-header-right .header-menu a,#site-header-right .header-search a{
    color:var(--primary-color2)
}
#site-header-right .header-menu a:hover,#site-header-right .header-search a:hover{
    color:var(--primary-color)
}
#site-header-right .header-search{
    margin-right:60px
}
#site-header-right .header-search-trigger::before{
    content:'\e913';
    font-family:icomoon;
    font-size:23px
}
.mobile-nav-toggler{
    cursor:pointer;
    display:inline-block;
    transform:rotateY(190deg)
}
.mobile-nav-toggler .bar{
    width:29px;
    height:3px;
    background-color:var(--primary-color2);
    display:block;
    transition:all 500ms ease
}
.mobile-nav-toggler .bar+.bar{
    margin-top:7px
}
.mobile-nav-toggler:hover span{
    width:29px!important
}
.mobile-nav-toggler .bar:nth-child(2){
    width:23px
}
.mobile-nav-toggler .bar:nth-child(3){
    width:15px
}
#main-nav-mobi{
    display:block;
    margin:0 auto;
    width:100%;
    position:absolute;
    top:100%;
    left:0;
    z-index:9999;
    background-color:var(--primary-color6)
}
#main-nav-mobi ul{
    display:block;
    list-style:none;
    margin:0;
    padding:0
}
#main-nav-mobi ul li{
    margin:0;
    text-align:left;
    cursor:pointer;
    padding:0;
    border-top:1px solid #43516991;
    position:relative
}
#main-nav-mobi ul>li>a{
    color:#fff;
    display:inline-block;
    font-size:16px;
    line-height:48px;
    padding:0 15px;
    font-weight:500
}
#main-nav-mobi ul li:first-child{
    border-top:0
}
#main-nav-mobi ul>li.current-menu-item>a,#main-nav-mobi .current-item>a,#main-nav-mobi ul>li>a:hover{
    color:var(--primary-color)
}
#main-nav-mobi .sub-menu .menu-item a{
    margin-left:15px
}
#main-nav-mobi .menu-item-has-children .arrow{
    cursor:pointer;
    display:inline-block;
    font-size:20px;
    font-family:fontawesome;
    line-height:48px;
    position:absolute;
    right:15px;
    text-align:center;
    top:0;
    width:48px
}
#main-nav-mobi .menu-item-has-children .arrow:before{
    content:"\f107";
    color:#fff
}
#main-nav-mobi .menu-item-has-children .arrow.active:before{
    content:"\f107"
}
#main-nav-mobi ul ul li{
    background-color:var(--primary-color6);
    border-top:1px solid #43516991
}
#site-header .header-search-icon{
    display:block;
    font-size:14px;
    line-height:100px
}
.flat-show-search{
    position:relative;
    z-index:99
}
.top-search.show{
    visibility:visible;
    opacity:1;
    top:60px
}
.top-search{
    position:absolute;
    right:0;
    top:80px;
    width:250px;
    opacity:0;
    z-index:9999;
    visibility:hidden;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.mobile-button{
    display:none;
    position:absolute;
    width:26px;
    height:26px;
    float:right;
    top:50%;
    right:15px;
    background-color:transparent;
    cursor:pointer;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%)
}
.mobile-button:before,.mobile-button:after,.mobile-button span{
    background-color:var(--primary-color);
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    transition:all ease .3s
}
.mobile-button:before,.mobile-button:after{
    content:'';
    position:absolute;
    top:0;
    height:3px;
    width:100%;
    left:0;
    top:50%;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%
}
.mobile-button span{
    position:absolute;
    width:100%;
    height:3px;
    left:0;
    top:50%;
    overflow:hidden;
    text-indent:200%
}
.mobile-button:before{
    -webkit-transform:translate3d(0,-7px,0);
    -moz-transform:translate3d(0,-7px,0);
    transform:translate3d(0,-7px,0)
}
.mobile-button:after{
    -webkit-transform:translate3d(0,7px,0);
    -moz-transform:translate3d(0,7px,0);
    transform:translate3d(0,7px,0)
}
.mobile-button.active span{
    opacity:0
}
.mobile-button.active:before{
    -webkit-transform:rotate3d(0,0,1,45deg);
    -moz-transform:rotate3d(0,0,1,45deg);
    transform:rotate3d(0,0,1,45deg)
}
.mobile-button.active:after{
    -webkit-transform:rotate3d(0,0,1,-45deg);
    -moz-transform:rotate3d(0,0,1,-45deg);
    transform:rotate3d(0,0,1,-45deg)
}
#site-header.is-fixed{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    box-shadow:1px 1px 5px 0 rgb(0 0 0/20%);
    z-index:9999
}
#site-header #main-nav{
    position:absolute;
    right:30px;
    top:50%;
    z-index:99;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%)
}
.header-style-1.menu-has-search #site-header #main-nav{
    right:44px
}
#site-header #main-nav>ul>li.current-menu-item>a,#site-header #main-nav>ul>li:hover>a{
    color:var(--primary-color)
}
.icon-Group-1199{
    position:absolute;
    right:0;
    top:50%;
    transform:translateY(-50%);
    font-size:31px
}
.themesflat-pagination{
    margin:32px 30px
}
.themesflat-pagination ul{
    margin:0;
    position:relative
}
.themesflat-pagination ul li{
    display:inline-block;
    padding:0;
    margin-right:7px
}
.themesflat-pagination ul li .page-numbers{
    display:inline-block;
    font-size:14px;
    font-family:rubik,sans-serif;
    font-weight:400;
    color:#787878;
    text-align:center;
    width:29px;
    height:30px;
    border-radius:3px;
    border:1px solid var(--primary-color4);
    line-height:30px
}
.themesflat-pagination ul li .page-numbers:hover,.themesflat-pagination ul li .page-numbers.current{
    background-color:var(--primary-color);
    color:#fff;
    border-color:var(--primary-color)
}
.themesflat-pagination ul li .next,.themesflat-pagination ul li .prev{
    font-size:14px;
    font-weight:700;
    color:#878787
}
.themesflat-pagination ul li .next:hover,.themesflat-pagination ul li .prev:hover{
    color:var(--primary-color)
}
@media(max-width:575px){
    .side-menu__block-inner{
        max-width:480px
    }
}
@media(max-width:480px){
    .side-menu__block-inner{
        max-width:400px
    }
}
@media(max-width:375px){
    .side-menu__block-inner{
        max-width:300px
    }
}
.flat-title-page{
    position:relative;
    height:309px
}
.parallax-1{
    background-image:url(../images/background-section/mark-page-title.jpg)
}
.parallax-2{
    background-image:url(../images/background-section/about-background-page@2x.jpg)
}
.parallax-3{
    background-image:url(../images/background-section/service-page-title@2x.jpg)
}
.parallax-4{
    background-image:url(../images/background-section/service-details-page-title@2x.jpg)
}
.parallax-5{
    background-image:url(../images/background-section/team-page-title@2x.jpg)
}
.parallax-6{
    background-image:url(../images/background-section/faq-page-title@2x.jpg)
}
.parallax-7{
    background-image:url(../images/background-section/portfolio-mark-page@2x.jpg)
}
.parallax-8{
    background-image:url(../images/background-section/portfolio-details-page-title@2x.jpg)
}
.parallax-9{
    background-image:url(../images/background-section/contact-page-title@2x.jpg)
}
.flat-title-page::after{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#071327;
    opacity:.6
}
.flat-title-page .breadcrumbs{
    margin:0 auto;
    padding:104px 10px;
    color:#fff;
    z-index:50;
    text-align:center
}
.breadcrumbs .breadcrumb-trail{
    display:block;
    width:100%;
    text-align:center;
    font-size:18px;
    font-weight:700
}
.breadcrumbs .breadcrumb-trail>a,.breadcrumbs .breadcrumb-trail>span{
    position:relative;
    display:inline-block;
    padding-right:16px;
    margin-top:15px
}
.breadcrumbs .breadcrumb-trail>span{
    padding-right:unset;
    padding-left:16px
}
.breadcrumbs .breadcrumb-trail>a:before{
    content:"\f068";
    font-family:fontawesome;
    font-size:16px;
    color:#fff;
    line-height:normal;
    position:absolute;
    right:-6px;
    top:3px
}
.flat-blog{
    padding:108px 0 72px
}
.flat-blog .post-wrap{
    display:flex;
    flex-wrap:wrap;
    margin-left:-30px
}
.flat-blog .post-content{
    padding-bottom:60px
}
.flat-blog .post-content-archive{
    width:calc(50% - 30px);
    margin-left:30px;
    margin-bottom:8px
}
.flat-blog .post-content-archive .post-media{
    position:relative;
    z-index:-1;
    overflow:hidden
}
.flat-blog .post-content-archive .post-media img{
    width:100%
}
.flat-blog .post-media .post-media-tags{
    position:absolute;
    top:31px;
    left:22px
}
.flat-blog .post-media-tags span{
    font-size:14px;
    color:#fff;
    background-color:var(--primary-color);
    padding:8px 10px;
    border-radius:6px
}
.flat-blog .post-content-wrap{
    position:relative;
    background-color:#fff;
    padding:23px 27px 30px;
    margin:-53px 5.2% 21px;
    box-shadow:4px -2px 33px #b4b4b447
}
.flat-blog .post-meta{
    display:flex;
    flex-wrap:wrap;
    justify-content:space-between;
    margin-bottom:3px
}
.flat-blog .post-meta .date:before,.flat-blog .post-meta .author:before{
    color:var(--primary-color);
    font-size:17px;
    padding-right:7px
}
.flat-blog .post-content-wrap .post-title{
    position:relative;
    padding-left:21px;
    margin-bottom:23px
}
.flat-blog .post-content-wrap .post-title::before{
    position:absolute;
    left:0;
    content:'\e924';
    font-family:icomoon;
    color:var(--primary-color);
    font-size:45px;
    line-height:67px
}
.post-readmore .read-more,.flat-latest .latest-content .read-more{
    display:inline-block;
    line-height:38px;
    width:40px;
    height:40px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%;
    object-fit:cover;
    text-align:center;
    border:1px solid var(--primary-color4);
    color:var(--primary-color2);
    font-size:17px
}
.flat-blog .post-content-archive:hover .post-title a{
    color:var(--primary-color)
}
.flat-blog .post-content-archive:hover .read-more{
    background-color:var(--primary-color);
    border:1px solid var(--primary-color);
    color:#fff
}
.flat-blog .post-content-archive .post-media:before,.flat-latest .latest-content-box .latest-post::after{
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    right:0;
    content:"";
    border-radius:0%;
    background-color:#05405559;
    z-index:1;
    transform:scale(0) perspective(400px);
    transform-origin:bottom left;
    transform-style:preserve-3d;
    transition:all 700ms ease
}
.flat-blog .post-content-archive:hover .post-media:before,.flat-latest .latest-content-box:hover .latest-post::after{
    transform:scaleX(1) perspective(400px)
}
.flat-blog .post-content-archive:hover .post-content-wrap::after{
    transform:scale(1,1);
    transform-origin:right center
}
.flat-latest .latest-content-box:hover .latest-content::after{
    transform:scale(1,1);
    transform-origin:left center
}
.flat-latest .latest-content-box:hover .latest-post img{
    transform:scale(1.1)
}
.flat-latest .latest-content-box:hover .post-readmore .read-more{
    width:144px
}
.flat-latest .latest-content-box:hover .post-readmore .text{
    opacity:1
}
.flat-blog .post-content-wrap::after,.flat-latest .latest-content::after{
    content:'';
    position:absolute;
    bottom:0;
    left:0;
    width:100%;
    height:4px;
    background-color:var(--primary-color);
    transform:scale(0,1);
    transform-origin:left center;
    transition:transform 500ms ease
}
.flat-latest .latest-content::after{
    transform-origin:right center
}
.blog-single{
    padding-bottom:111px
}
.blog-single .post-title{
    padding:8px 0;
    line-height:54px;
    font-family:barlow,sans-serif
}
.blog-single .post-author{
    margin-top:28px;
    margin-bottom:35px
}
.blog-single .post-author .btn-author{
    padding:5px 14px;
    background-color:var(--primary-color);
    color:#fff;
    border-radius:4px;
    float:left;
    margin-right:41px
}
.blog-single .post-author .btn-author:hover{
    background-color:var(--primary-color2)
}
.blog-single .post-author .post-author-inner{
    display:flex;
    align-items:center
}
.blog-single .post-author img{
    width:37px;
    height:37px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%;
    object-fit:cover;
    margin-right:21px
}
.blog-single .post-author .post-author-inner a{
    font-size:15px;
    font-weight:500;
    text-transform:uppercase;
    line-height:27px
}
.blog-single .post-author .post-author-inner span{
    font-size:12px
}
.blog-single p{
    margin-bottom:16px;
    line-height:30px;
    color:#565872
}
.blog-single .post-media img{
    margin-top:35px;
    border-radius:8px
}
.blog-single h2.post-title{
    margin:38px 0 5px;
    font-size:37px;
    letter-spacing:-.7px
}
.blog-single .post-list-quotes{
    margin-left:.4%;
    margin-bottom:11px
}
.blog-single .post-list-quotes li p::before{
    content:'\f111';
    font-family:fontawesome;
    color:var(--primary-color2);
    font-size:8px;
    vertical-align:top;
    margin-right:11px
}
.blog-single .post-list-quotes p{
    margin-bottom:0
}
.blog-single .post-media-box{
    display:flex;
    display:-webkit-flex;
    margin:54px 0 26px -20px
}
.blog-single .post-media-box .media{
    margin-left:20px;
    width:calc(3333.333333% - 20px)
}
.blog-single .post-media-box .media img{
    border-radius:5px
}
.blog-single .post-tags{
    border-bottom:1px solid;
    padding:54px 0 56px;
    display:flex;
    justify-content:space-between;
    align-items:center
}
.blog-single .post-tags span{
    font-size:18px;
    font-weight:700;
    color:var(--primary-color3);
    margin-right:12px
}
.blog-single .post-tags .inner-left{
    padding-left:10px
}
.blog-single .post-tags .inner-left a{
    display:inline-block;
    font-size:12px;
    font-weight:500;
    padding:6px 10px;
    background-color:#f2f5f6;
    border-radius:12px;
    color:#757575;
    margin-right:8px
}
.blog-single .post-tags .inner-left a:hover{
    background-color:var(--primary-color);
    color:#fff
}
.blog-single .post-tags .inner-right li{
    background-color:unset;
    font-size:19px;
    margin:0 4.5px
}
.blog-single .post-pagination{
    margin-top:32px;
    display:flex;
    align-items:center;
    justify-content:space-between
}
.blog-single .post-pagination .button{
    font-family:rubik,sans-serif;
    font-size:14px;
    font-weight:500;
    padding:8px 14px
}
#comments .comments-title{
    position:relative;
    font-family:barlow,sans-serif;
    font-size:30px;
    font-weight:700;
    margin:67px 0 38px
}
#comments .comments-title::after{
    content:'';
    position:absolute;
    bottom:-15px;
    left:0;
    width:50px;
    height:1px;
    background-color:var(--primary-color3)
}
#comments .comment-list li{
    padding:40px 0;
    border-bottom:2px solid #ccc
}
#comments .comment-list li:last-child{
    border-bottom:unset
}
#comments .comment-avatar img{
    width:97px;
    height:97px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%;
    float:left;
    margin-right:20px;
    object-fit:cover
}
#comments .comment-content{
    display:table
}
#comments .comment-content .comment-meta{
    padding-left:20px
}
#comments .comment-content .comment-time{
    font-size:14px;
    display:inline-block;
    margin-bottom:12px
}
#comments .comment-content .comment-author{
    font-size:16px;
    font-weight:700
}
#comments .comment-content .comment-text{
    margin-top:17px;
    margin-bottom:16px;
    background-color:#f0f4f9;
    padding:10px 20px 16px;
    border-radius:5px
}
#comments .comment-content .comment-text p{
    margin-bottom:unset
}
#comments .comment-content .comment-reply{
    font-size:14px;
    font-weight:500
}
#comments .comment-content .comment-reply .like{
    margin:0 29px 0 20px;
    color:var(--primary-color2)
}
#comments .comment-reply-box{
    margin-left:25%
}
#comments .comment-reply-box .reply{
    color:var(--primary-color2)
}
#comments .text-wrap{
    margin-left:-30px;
    margin-bottom:0!important
}
#comments .respond-comment .comments-title{
    margin-top:101px;
    margin-bottom:68px
}
#comments .name-wrap,#comments .email-wrap{
    float:left;
    margin-left:30px;
    width:calc(50% - 30px);
    border-bottom:3px solid #ebebeb;
	border-radius:10px!important;
}
#comments .name-wrap2,#comments .email-wrap2{
    float:none;display:block;
    width:100%;
    border-bottom:3px solid #ebebeb;
	background:#fff;
	margin-bottom:2rem;
	padding:.5rem 2rem
}
#comments .name-wrap input,#comments .email-wrap input{
    padding:23px;
	
}
#comments .name-wrap input:focus,#comments .email-wrap input:focus{
    border:1px solid transparent
}
#comments .message-wrap textarea{
    background-color:#ebebeb40;
    border:1px solid #ebebeb
}
#comments .btn-submit-comment{
    margin-top:74px;
    font-size:18px;
    font-weight:700
}
.side-bar .widget{
    padding:31px 36px 28px 32px;
    box-shadow:1px 7px 15px #b4b4b447;
    margin-bottom:40px
}
.widget-title{
    position:relative;
    color:var(--primary-color2);
    margin-bottom:40px
}
.widget-title::before{
    position:absolute;
    bottom:-25px;
    left:21px;
    content:'\e924';
    font-family:icomoon;
    color:var(--primary-color3);
    font-size:45px;
    transform:rotate(90deg)
}
.search-form{
    position:relative
}
.search-form .search-field{
    background-color:#f4f6f9
}
.search-submit{
    position:absolute;
    right:0;
    font-weight:400;
    font-size:20px;
    background-color:var(--primary-color);
    color:#ffff;
    padding:14px;
    border-radius:0;
    -webkit-transition:all ease .3s;
    -moz-transition:all ease .3s;
    transition:all ease .3s
}
.search-submit:hover{
    background-color:var(--primary-color2)
}
.widget-category .cat-item{
    font-size:16px;
    border-bottom:1px solid var(--primary-color4);
    padding:18.4px 0;
    font-weight:700
}
.widget-category .cat-item:last-child{
    border-bottom:unset;
    padding-bottom:0
}
.widget-category .cat-item a,.cat-item span{
    color:#22242993
}
.widget-category .cat-item a{
    position:relative;
    -webkit-transition:all 500ms ease;
    transition:all 500ms ease
}
.widget-category .cat-item a:hover{
    padding-left:15px
}
.widget-category .cat-item a::after{
    position:absolute;
    content:'\f101';
    font-family:fontawesome;
    top:50%;
    transform:translateY(-50%);
    left:0;
    opacity:0;
    -webkit-transition:all 500ms ease;
    transition:all 500ms ease
}
.widget-category .cat-item a:hover::after{
    opacity:1
}
.widget-category .cat-item:hover a,.widget-category .cat-item.active a,.cat-item:hover span,.cat-item.active span{
    font-weight:700;
    color:#222429
}
.cat-item span{
    float:right
}
.widget-category .widget-title{
    margin-bottom:26px
}
.side-bar .widget-recent-post .widget-title{
    margin-bottom:16px
}
.recent-news .thumb{
    width:85px;
    overflow:hidden;
    float:left;
    border-radius:3px;
    margin-right:9px
}
.recent-news li{
    padding:28px 0;
    border-bottom:1px dashed #ccc
}
.recent-news li:last-child{
    border-bottom:unset;
    padding-bottom:0
}
.recent-news .texts{
    margin-top:-4px
}
.recent-news .texts a{
    font-size:17px;
    font-weight:500;
    line-height:28px;
    padding-bottom:8px;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:break-word
}
.recent-news .texts span{
    font-size:14px;
    line-height:30px
}
.widget-gallery-instagram .widget-gallery-item{
    font-size:0;
    line-height:0;
    margin:-5px
}
.widget-gallery-instagram .widget-gallery-item li{
    margin:5px;
    display:inline-block;
    vertical-align:top;
    width:calc(33.33% - 10px)
}
.widget-gallery-instagram .widget-gallery-item img{
    border-radius:4px;
    width:100%
}
.widget-gallery-instagram .thumb-instagram{
    position:relative
}
.widget-gallery-instagram .thumb-overlay-effect:hover{
    opacity:1
}
.widget-gallery-instagram .thumb-overlay-effect{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgb(0 0 0/36%);
    border-radius:4px;
    opacity:0;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.widget-gallery-instagram .thumb-overlay-effect .instagram-icon-thumb{
    width:36px;
    height:36px;
    display:inline-block;
    background-color:#ffaa189e;
    border-radius:50%
}
.widget-gallery-instagram .thumb-overlay-effect .instagram-icon-thumb::after,.widget-gallery-instagram .thumb-overlay-effect .instagram-icon-thumb{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    content:'\f16d';
    font-family:fontawesome;
    font-size:15px;
    color:#fff
}
.widget-tag-cloud .tag-cloud{
    margin:-5px -8px
}
.widget-tag-cloud .tag-cloud a{
    display:inline-block;
    line-height:30px;
    letter-spacing:.1px;
    font-weight:500;
    padding:5px 20px;
    background-color:#f4f6f9;
    margin:5px 8px;
    border-radius:106px;
    color:var(--primary-color3)
}
.widget-tag-cloud .tag-cloud a:hover,.widget-tag-cloud .tag-cloud a.active{
    background-color:var(--primary-color);
    color:#fff
}
.date:before{
    content:'\e902';
    font-family:icomoon
}
.author:before{
    content:'\e91e';
    font-family:icomoon
}
.search::before{
    content:'\e913';
    font-family:icomoon
}
.flat-features{
    margin:3px 0 -13px;
    background-image:url(../images/mark-page/mark-features.png);
    background-repeat:no-repeat;
    background-position:center
}
.flat-features .features-content-left,.flat-features .features-content-right{
    width:50%;
    display:inline-block;
    float:left
}
.section-title h3.section-heading{
    margin-bottom:22px
}
.section-title h2{
    font-family:barlow,sans-serif;
    font-size:40px;
    line-height:48px
}
.flat-features .section-title p{
    margin-top:21px
}
.section-title.st-2 .features-content-left h3,.flat-service .section-title h2,.flat-contact-request .section-title h2{
    margin-top:28px;
    font-family:barlow,sans-serif;
    font-size:35px;
    line-height:42px
}
.flat-features .features-content-right{
    padding-left:93px;
    padding-top:4px
}
.flat-features .features-box{
    position:relative;
    padding:29px 20px 136px;
    border-radius:8px;
    margin:0 10px;
    background-color:#fff;
    box-shadow:0 2px 13px #fd4a362b;
    text-align:center
}
.flat-features .features-box3{
    padding:20px ; padding-bottom:10px;margin:0;height:100%;transition:all .3s
}
.flat-features .features-box3:hover{box-shadow:0 0 13px #1177cc;}
.flat-features .features-box3 a{color:#000;cursor:pointer}
.flat-features .features-box2{
    position:relative;
    padding:0 0 2rem 0;
    border-radius:8px;
    margin:0 10px;
    background-color:#fff;
    box-shadow:0 2px 13px #fd4a362b;
    text-align:center
}


.flat-features .features-box3 h3{
    font-size:1.4rem!important;line-height:1.4rem!important;
}

.item-shape{
    position:absolute;
    width:75px;
    height:61px;
    background-color:#eee;
    top:0;
    left:23px;
    z-index:20;
    clip-path:polygon(50% 100%,0 0,100% 0);
    -webkit-transition:all .6s ease;
    -moz-transition:all .6s ease;
    -ms-transition:all .6s ease;
    -o-transition:all .6s ease;
    transition:all .6s ease
}
.flat-features .features-box .item-shape.item-shape2{
    background-color:#ccc;
    left:68px;
    z-index:1
}
.flat-features .features-box:hover .item-shape,.flat-features .features-box.active .item-shape{
    background-color:var(--primary-color)
}
.flat-features .features-box:hover .item-shape.item-shape2,.flat-features .features-box.active .item-shape.item-shape2{
    background-color:#39d6fb
}
.flat-features .features-box .icon-features{
    margin-bottom:23px
}
.flat-features .features-box .headline{
    font-family:barlow,sans-serif;
    font-size:20px;
    margin-bottom:22px
}
.flat-features .box-content{
    position:absolute;
    left:0;
    right:0
}
.flat-features .features-box2 .box-content{
    position:relative;
    left:0;
    right:0;
	margin-bottom:3rem
}

.flat-features .features-box .content-post img{
    width:100%;
    border-radius:8px
}
.flat-features .features-box .content-post{
    position:relative;
    margin:0 39px
}
.flat-features .features-box2 .content-post{
    position:relative;
    margin:0 
}
.flat-features .features-box2 .features-box-inner{
    position:relative;
    margin:3rem;
}
.flat-features .box-content .post-readmore{
    position:absolute;
    bottom:17px;
    left:21px
}
.flat-about{
    margin-bottom:-23px;
    background-image:url(../images/mark-page/mark-about.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-size:cover
}
.flat-about .about-left-content{
    padding-top:50px
}
.flat-about .section-title{
    margin-bottom:37px
}
.flat-about p{
    line-height:29px;
    margin-bottom:28px
}
.progress-about{
    display:inline-block;
    margin-top:-3px;
    padding:0 11px;
    margin-bottom:20px
}
.progress-about .couter .chart{
    position:relative;
    display:inline-block;
    margin-right:18px
}
.progress-about .couter{
    display:flex;
    align-items:center
}
.progress-about .couter .chart span.percent{
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    font-family:barlow,sans-serif;
    font-size:24px;
    font-weight:700;
    display:inline-block;
    color:var(--primary-color5)
}
.progress-about .couter .chart span.percent::after{
    content:'%'
}
.progress-about .heading-progress{
    font-size:20px;
    line-height:29px
}
.flat-about .about-right-content .about-post{
    position:relative
}
.flat-about .about-right-content .about-post img{
    border-radius:6px
}
.flat-about .about-right-content{
    margin-top:-54px
}
.about-video{
    position:absolute;
    top:31px;
    right:29px;
    width:60px;
    height:60px;
    border-radius:50%;
    background-color:var(--primary-color)
}
.about-video.video::before{
    position:absolute;
    top:50%;
    left:50%;
    font-size:19px;
    transform:translate(-40%,-50%);
    padding-right:unset;
    color:#fff
}
.flat-about .about-right-content .about-counter-box,.flat-about-2 .about-2-content-right .about-counter-box{
    position:absolute;
    bottom:-28px;
    left:54px;
    background-color:var(--primary-color);
    padding:35px;
    border-radius:8px;
    background-image:url(../images/mark-page/mark-about-counter.png);
    background-repeat:no-repeat;
    background-position:center left;
    box-shadow:0 5px 17px #fd4a368c
}
.flat-about .about-right-content .about-counter-inner,.flat-about-2 .about-2-content-right .about-counter-inner,.flat-counter .about-counter-inner{
    display:flex;
    align-items:end
}
.flat-about .about-counter-box .number-counter,.flat-about-2 .about-2-content-right .about-counter-box .number-counter,.flat-counter .about-counter-inner .number-counter{
    margin-right:11px
}
.flat-about .about-counter-box .number-counter span,.flat-about-2 .about-2-content-right .about-counter-box .number-counter span,.flat-counter .about-counter-inner .number-counter span{
    font-size:65px;
    font-family:barlow,sans-serif;
    font-weight:700;
    color:#fff
}
.flat-counter .about-counter-inner .number-counter span{
    font-size:60px;
    color:var(--primary-color)
}
.flat-about .about-counter-box .heading-count h3,.flat-about-2 .about-2-content-right .about-counter-box .heading-count h3{
    font-size:20px;
    line-height:29px;
    color:#fff
}
.flat-counter .about-counter-inner .heading-count h3{
    font-size:16px;
    line-height:24px
}
.flat-work{
    margin:-2px 0 -19px
}
.flat-work .work-box{
    position:relative;
    background-color:#f9f9f9;
    padding:30px 35px;
    border-radius:8px;
    text-align:center;
    overflow:hidden;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-work .work-carousel{
    padding:50px 0 20px
}
.flat-work .work-box .item-shape{
    width:52px;
    height:42px;
    left:26px;
    background-color:#fd8173
}
.flat-work .work-box .item-shape2,.flat-team .bottom.item-shape2{
    left:58px;
    background-color:#fe7262;
    z-index:1
}
.flat-work .top.item-shape{
    top:-60px
}
.flat-work .bottom.item-shape,.flat-work .bottom.item-shape2,.flat-team .bottom.item-shape,.flat-team .bottom.item-shape2{
    top:unset;
    left:unset;
    bottom:-60px;
    right:62px;
    transform:rotate(58deg)
}
.flat-work .bottom.item-shape2,.flat-team .bottom.item-shape2{
    right:32px
}
.flat-work .master-icon-box .icon-wrap{
    margin-bottom:23px
}
.flat-work .work-icon .icon{
    font-family:icomoon;
    font-size:60px
}
.flat-work .work-icon .icon-programer::after{
    content:'\e91a'
}
.flat-work .master-icon-box .text-wrap h3{
    font-size:24px;
    font-family:barlow,sans-serif;
    margin-bottom:17px
}
.flat-work .master-icon-box .text-wrap p{
    line-height:28px;
    margin-bottom:29px
}
.flat-work .master-icon-box .text-wrap a{
    font-size:16px;
    font-weight:500;
    color:var(--primary-color5)
}
.flat-work .work-icon .icon-data::after{
    content:'\e903'
}
.flat-work .work-box:hover,.flat-work .work-box.active{
    background-color:var(--primary-color);
    color:#fff;
    box-shadow:0 5px 17px #fd4a368c
}
.flat-work .work-box:hover a,.flat-work .work-box.active a{
    color:#fff
}
.flat-work .work-box:hover .top.item-shape,.flat-work .work-box.active .top.item-shape{
    top:0
}
.flat-work .work-box:hover .bottom.item-shape,.flat-work .work-box.active .bottom.item-shape{
    bottom:-10px
}
.flat-wcu{
    margin-top:4px;
    background-image:url(../images/mark-page/mark-wcu.jpg);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover
}
.flat-wcu2{
    background:none;margin:0;
}
.flat-wcu .section-title h2{
    margin-bottom:24px
}
.flat-wcu .section-title p{
    margin-right:55px;
    line-height:30px
}
.flat-wcu .wcu-list-services{
    margin-top:28px;
    display:flex;
    align-items:baseline
}
.flat-wcu .master-icon-box{
    text-align:center;
    margin-right:30px
}
.flat-wcu .master-icon-box .icon{
    font-size:50px
}
.flat-wcu .master-icon-box .icon-2{
    font-size:42px
}
.flat-wcu .master-icon-box:first-child h3{
    margin-top:14px
}
.flat-wcu .master-icon-box h3{
    margin-top:16px;
    font-size:20px
}
.flat-wcu .contact-request{
    background-color:#fff;
    padding:36px 35px;
    border-radius:10px;
    text-align:center;
    box-shadow:0 7px 10px #fd4a364d;
    transform:translateY(56%)
}
.flat-wcu .contact-request h2{
    margin-top:6px;
    margin-bottom:22px;
    font-size:30px;
    font-family:barlow,sans-serif
}
.flat-wcu .contact-request hr,.flat-service hr{
    height:1px;
    background-image:linear-gradient(90deg,#ccc,#ccc 75%,transparent 75%,transparent 100%);
    background-size:6px 1px;
    border:none;
    margin:0;
    margin-bottom:4px
}
.flat-wcu .contact-request form{
    margin-top:26px
}
.flat-our-ex{
    margin-top:73px;
    background-position:0 100%;
    background-image:url(../images/mark-page/mark-our-ex.jpg);
    background-repeat:no-repeat
}
.flat-our-ex .our-ex-content-right{
    padding-top:50px;
    padding-left:78px
}
.flat-our-ex .our-ex-box{
    position:relative;
    border-radius:8px;
    overflow:hidden;
    margin-bottom:30px
}
.flat-our-ex .our-ex-box img{
    width:100%;
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -ms-transition:all .4s ease;
    -o-transition:all .4s ease;
    transition:all .4s ease
}
.flat-our-ex .our-ex-box:hover img{
    transform:scale(1.1);
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -ms-transition:all .4s ease;
    -o-transition:all .4s ease;
    transition:all .4s ease
}
.flat-our-ex .our-ex-box.view-all-project .button,.flat-our-ex .our-ex-box .button{
    border:solid 1px #fff;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    left:20%;
    right:20%;
    text-align:center
}
.flat-our-ex .our-ex-box .button{
    top:100%;
    opacity:0
}
.flat-our-ex .our-ex-box .button:hover{
    border:solid 1px var(--primary-color5)
}
.flat-our-ex .our-ex-box:hover .overlay-box{
    opacity:1;
    background-color:var(--primary-color)
}
.flat-our-ex .our-ex-box:hover .button,.flat-our-ex .our-ex-box.view-all-project .button{
    top:50%;
    opacity:1
}
.flat-our-ex .our-ex-box .button:hover{
    background-color:var(--primary-color5);
    border:solid 1px var(--primary-color5)
}
.flat-our-ex .overlay-box{
    position:absolute;
    left:0;
    top:0;
    width:100%;
    height:100%;
    opacity:0;
    -webkit-transition:all .4s ease;
    -moz-transition:all .4s ease;
    -ms-transition:all .4s ease;
    -o-transition:all .4s ease;
    transition:all .4s ease
}
.flat-progress{
    margin:-27px 0 0
}
.flat-progress .progress-content-left{
    padding-right:7%
}
.flat-progress .progress-content-right .progress-post img{
    max-width:760.3px;
    margin-left:-91px
}
.flat-progress .section-title{
    margin-bottom:24px
}
.flat-progress .section-title p{
    padding-right:10px
}
.flat-progress .section-title h2{
    margin-bottom:26px
}
.flat-progress .content-progress-box .donat-headline{
    display:flex;
    align-items:center;
    justify-content:space-between
}
.flat-progress .content-progress-box .donat-headline h4,.flat-progress .content-progress-box .donat-headline span{
    font-size:16px;
    font-weight:500
}
.flat-progress .content-progress-box .progress-button{
    margin-top:69px
}
.flat-progress .content-progress-box .progress-button .button{
    padding:13px 25px;
    background-color:#fff;
    color:var(--primary-color5);
    border:1px solid var(--primary-color5)
}
.flat-progress .content-progress-box .progress-button .button:hover{
    background-color:var(--primary-color);
    color:#fff;
    border:1px solid var(--primary-color)
}
.flat-skill{
	
}
.flat-skill .section-title h2{
    margin-bottom:26px
}
.flat-skill .about-left-content p{
    margin-bottom:38px;
    margin-right:50px
}
.flat-skill .about-left-content .progress-about{
    padding:0;
    padding-right:21px
}
.flat-skill .progress-about .couter .chart span.percent{
    color:var(--primary-color)
}
.flat-team{
    margin-top:3px;
    margin-bottom:-22px
}
.flat-team-3{
    margin-top:-50px;
    margin-bottom:-21px
}
.flat-team-3 .team-2{
    margin-top:-42px
}
.flat-team .team-content-box{
    position:relative;
    overflow:hidden;
    padding:19px 19px 42px;
    background-color:#f9f9f9;
    border-radius:8px;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-team .team-content-box .team-post{
    position:relative;
    border-radius:8px;
    overflow:hidden
}
.flat-team .team-content-box .team-info h4{
    margin:21px 0 7px;
    font-size:18px;
    font-weight:500
}
.flat-team .team-content-box .team-info h5{
    font-size:15px;
    font-weight:400
}
.flat-team .team-content-box .item-shape{
    right:73px;
    width:75px;
    height:61px;
    background-color:#f9e6e4;
    transform:rotate(60deg)
}
.flat-team .team-content-box .item-shape.item-shape2{
    right:28px;
    background-color:#f9ecea
}
.flat-team .bottom.item-shape,.flat-team .bottom.item-shape2{
    bottom:-15px;
    transform:rotate(60deg)
}
.flat-team .team-content-box .widget-social{
    position:absolute;
    bottom:-50px;
    left:0;
    right:0;
    padding:7px 0;
    background-color:var(--primary-color);
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-team .team-content-box .widget-social ul{
    justify-content:center
}
.flat-team .team-content-box .widget-social li{
    margin-right:unset;
    margin:0 8px
}
.flat-team .slide-active .widget-social,.flat-team .team-content-box:hover .widget-social{
    bottom:0
}
.flat-team .team-content-box:hover .item-shape,.flat-team .slide-active .item-shape{
    background-color:var(--primary-color)
}
.flat-team .team-content-box:hover .item-shape.item-shape2,.flat-team .slide-active .item-shape.item-shape2{
    background-color:#fb796a
}
.flat-team .carousel-2{
    padding:53px 0 20px
}
.flat-team .slide-active.team-content-box,.flat-team .team-content-box:hover{
    box-shadow:0 5px 17px #fd4a368c
}
.flat-subcribe{
    margin-top:-19px;
    padding:117px 0 13px;
    background-color:var(--primary-color)
}
.flat-subcribe .subcribe-content{
    color:#fff;
    padding-right:8.4%
}
.flat-subcribe .subcribe-content h3{
    font-size:20px;
    font-weight:500;
    margin-bottom:15px
}
.flat-subcribe .subcribe-content h2{
    font-size:40px;
    font-family:barlow,sans-serif;
    margin-bottom:30px
}
.flat-subcribe .subcribe-content .subcribe-form{
    position:relative
}
.flat-subcribe .subcribe-form .btn-subcribe{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:7px;
    font-size:16px;
    padding:18px 33px;
    font-weight:600;
    font-family:be vietnam,sans-serif
}
.flat-subcribe .subcribe-form .btn-subcribe:hover{
    background-color:var(--primary-color5)
}
.flat-subcribe .subcribe-content input{
    padding:23px 135px 23px 30px;
    border-radius:6px
}
.flat-subcribe .subcribe-content-right .subcribe-post img{
    max-width:490px;
    transform:translateY(13px);
    margin-left:-20px
}
.flat-testimonial{
    margin-top:2px;
    margin-bottom:-4px
}
.flat-testimonial .section-title{
    margin-bottom:50px
}
.flat-testimonial .section-title h3{
    border-left:unset
}
.flat-testimonial .testimonial-content-left .testimonial-post{
    position:relative
}
.flat-testimonial .testimonial-post .main-post{
    border-radius:10px;
    overflow:hidden;
    box-shadow:0 5px 19px #c3b9b87a
}
.flat-testimonial .testimonial-post .mark-post-1{
    position:absolute;
    top:-28px;
    left:31px;
    animation:rotated 10s infinite linear
}
.flat-testimonial .testimonial-post .mark-post-2{
    position:absolute;
    bottom:-47px;
    left:-39px;
    z-index:-1
}
.flat-testimonial .testimonial-post .testimonial-btn-slider{
    position:absolute;
    top:67%;
    right:9%;
    transform:rotate(90deg)
}
.flat-testimonial .swiper-container.slider-vertical{
    height:417px;
    overflow:hidden
}
.flat-testimonial .testimonial-slide-box{
    display:flex;
    align-items:center;
    padding:17px 30px 14px;
    background-color:#fff;
    border:1px solid #eee;
    border-radius:6px;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-testimonial .testimonial-slide-box .testimonal-content p{
    font-weight:500;
    color:#8a8a8a;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:break-word
}
.flat-testimonial .testimonal-icon .icon-tes{
    width:44px;
    height:44px;
    display:inline-block;
    object-fit:cover;
    text-align:center;
    line-height:44px;
    border-radius:50%;
    background-color:var(--primary-color7);
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-testimonial .testimonal-icon .icon-tes::after{
    content:'\f10e';
    font-family:fontawesome;
    color:var(--primary-color);
    font-size:16px
}
.flat-testimonial .swiper-slide-active .testimonial-slide-box{
    background-color:var(--primary-color)
}
.flat-testimonial .swiper-slide-active .testimonial-slide-box p{
    color:#fff
}
.flat-testimonial .swiper-button-prev.btn-custom-carousel-prev{
    right:76px
}
.flat-logo-slogan{
    background-color:#f6f6f6;
	padding:50px 0;
}
.flat-logo-slogan .slogan-logo{
    display:-webkit-box;
    display:-ms-flexbox;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.flat-logo-slogan .slogan-logo img{
    display:block;
    height:138px;
    object-fit:contain;
    -webkit-filter:grayscale(100%);
    -ms-filter:grayscale(100%);
    -moz-filter:grayscale(100%);
    filter:grayscale(100%);
    transition:all 300ms ease;
    border-radius:7px
}
.flat-logo-slogan .slogan-logo:hover img{
    -webkit-filter:grayscale(0%);
    -ms-filter:grayscale(0%);
    -moz-filter:grayscale(0%);
    filter:grayscale(0%)
}
.flat-latest{
    margin-top:-3px;
    margin-bottom:32px
}
.flat-latest .latest-content-wrap{
    margin-top:-57px
}
.flat-latest .latest-content-wrap .features-content-left{
    margin-bottom:25px
}
.flat-latest .latest-content-wrap p{
    margin-bottom:56px
}
.flat-latest .latest-post{
    position:relative;
    z-index:-1;
    overflow:hidden;
    border-radius:8px
}
.flat-latest .latest-post img{
    width:100%;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-latest .latest-post .post-date{
    position:absolute;
    top:24px;
    right:18px;
    font-size:16px;
    font-weight:700;
    line-height:22px;
    width:72px;
    height:72px;
    border-radius:6px;
    padding:13px 9px;
    background-color:var(--primary-color);
    color:#fff
}
.flat-latest .latest-content-box .latest-content{
    position:relative;
    padding:28px 31px;
    margin:-93px 6.5% 0;
    border-radius:8px;
    box-shadow:0 5px 17px #bbb2b24a;
    background-color:#fff
}
.flat-latest .latest-content a{
    font-size:20px;
    line-height:29px;
    font-weight:700
}
.flat-latest .latest-content-bottom{
    margin-top:17px;
    display:flex;
    align-items:center;
    justify-content:space-between
}
.flat-latest .latest-content-bottom .post-tag{
    font-size:14px;
    font-weight:400;
    color:var(--primary-color);
    background-color:var(--primary-color7);
    border-radius:29px;
    padding:8px 18px
}
.flat-about-2{
    margin-top:24px;
    margin-bottom:-8px;
    background-image:url(../images/mark-page/mark-about.jpg);
    background-repeat:no-repeat;
    background-position:right
}
.flat-about-2 .about-2-content-left{
    margin-top:32px
}
.flat-about-2 .section-title .features-content-left h3{
    margin-bottom:21px
}
.flat-about-2 .section-title p{
    margin-bottom:3px
}
.flat-about-2 .about-2-content-left .icon-tick,.flat-service-details .post-inner .icon-tick{
    width:34px;
    height:34px;
    line-height:34px;
    background-color:#fff;
    border-radius:50%;
    text-align:center;
    object-fit:cover;
    box-shadow:0 7px 12px #77737347
}
.flat-about-2 .about-2-content-left .about-our-company{
    margin-top:13px;
    margin-bottom:-6px;
    display:-webkit-box;
    display:-webkit-inline-box
}
.flat-about-2 .about-2-content-left .icon-tick::after,.flat-service-details .post-inner .icon-tick::after,.flat-portfolio-details .icon-tick::after{
    content:'\f00c';
    font-family:fontawesome;
    color:var(--primary-color);
    font-size:20px
}
.flat-about-2 .about-2-content-left .content-box{
    padding:7px 30px 7px 19px
}
.flat-about-2 .about-2-content-left .content-box h4{
    font-size:20px;
    margin-bottom:9px
}
.flat-about-2 .about-2-content-left .about-our-company p{
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:break-word
}
.flat-about-2 .about-2-content-left .button-contact{
    margin-top:56px;
    margin-left:-6px
}
.flat-about-2 .about-2-content-right{
    position:relative
}
.flat-about-2 .about-2-content-right .about-2-post{
    border-radius:8px 8px 8px 280px;
    overflow:hidden
}
.flat-about-2 .about-2-content-right .about-counter-box{
    bottom:45px;
    left:-3px
}
.flat-about-2 .about-2-content-right .mark-about-post{
    position:absolute;
    top:-25px;
    right:-29px
}
.flat-counter{
    padding:116px 0;
    background-image:url(../images/mark-page/mark-counter.jpg);
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover
}
.flat-counter .about-counter-inner{
    justify-content:center
}
.flat-team-2{
    margin-top:3px;
    margin-bottom:10px
}
.flat-team-2 .section-title h3{
    border:unset;
    padding-left:unset;
    margin-bottom:25px
}
.flat-team-2 .section-title{
    margin-bottom:-3px
}
.flat-team-2 .section-title h2{
    font-size:35px
}
.flat-team-2 .col-md-12:nth-child(3) .carousel-2{
    margin-top:-41px
}
.flat-team-2 .view-team-2{
    margin-top:40px;
    text-align:center
}
.flat-client{
    background-image:url(../images/mark-page/mark-clients.jpg);
    background-position:center;
    background-repeat:no-repeat
}
.flat-client .client-title-left{
    margin-top:4px
}
.flat-client .client-content-box{
    position:relative;
    padding:35px;
    background-color:#fff;
    border-radius:6px;
    text-align:center;
    box-shadow:0 7px 12px #77737347;
    overflow:hidden
}
.flat-client .client-content-box .client-author{
    position:relative;
    display:inline
}
.flat-client .client-content-box .client-author img{
    width:144px;
    height:144px;
    object-fit:cover;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%
}
.flat-client .client-content-box .mark-client{
    position:absolute;
    top:-50px;
    right:-18px;
    width:38px;
    height:38px;
    text-align:center;
    line-height:38px;
    object-fit:cover;
    border-radius:50px;
    border:3px solid var(--primary-color);
    background-color:#fff
}
.flat-client .client-content-box .mark-client::after{
    content:'\f10e';
    font-family:fontawesome;
    font-size:15px;
    color:var(--primary-color)
}
.flat-client .client-content-box .client-name{
    margin:28px 0 19px;
    font-size:24px;
    font-family:barlow,sans-serif
}
.flat-client .client-content-box .client-job{
    margin-bottom:16px;
    font-size:16px;
    font-weight:400;
    color:#777
}
.flat-client .client-content-box .list-review ul{
    margin-top:20px;
    display:flex;
    justify-content:center
}
.flat-client .list-review .star-rate{
    margin:0 3px
}
.flat-client .list-review .star-rate::after{
    content:'\e91b';
    font-family:icomoon;
    font-size:18px;
    color:var(--primary-color)
}
.flat-client .list-review .star-rate.un-active::after{
    color:#c2c2c2
}
.flat-client .client-content-box .item-shape2{
    left:72px;
    opacity:.3
}
.flat-client .client-content-box .bottom.item-shape{
    top:unset;
    left:unset;
    bottom:-25px;
    right:29px;
    transform:rotate(60deg)
}
.flat-client .client-content-box .bottom.item-shape2{
    right:70px
}
.flat-client .section-title h3{
    border:unset;
    padding-left:unset
}
.flat-client .client-carousel{
    margin-top:50px;
    cursor:ew-resize
}
.flat-service{
    margin-bottom:16px;
    background-image:url(../images/mark-page/mark-service.png);
    background-repeat:no-repeat
}
.flat-service .service-box{
    margin:48px 0 -19px
}
.flat-service .service-box .services-post{
    position:relative;
    z-index:-1;
    overflow:hidden;
    border-radius:8px
}
.flat-service .service-box .services-post::after{
    content:'';
    position:absolute;
    background-color:var(--primary-color5);
    opacity:0;
    top:0;
    left:0;
    right:0;
    bottom:0;
    -webkit-transition:all .6s ease;
    -moz-transition:all .6s ease;
    -ms-transition:all .6s ease;
    -o-transition:all .6s ease;
    transition:all .6s ease
}
.flat-service .service-box .services-post img{
    width:100%;
    overflow:hidden;
    -webkit-transition:all .6s ease;
    -moz-transition:all .6s ease;
    -ms-transition:all .6s ease;
    -o-transition:all .6s ease;
    transition:all .6s ease
}
.flat-service .service-box .service-content{
    text-align:center;
    background-color:#fff;
    padding:32px 25px 30px;
    margin:-36.5% 10% 0;
    border-radius:8px;
    box-shadow:0 7px 10px #fd4a364d;
    -webkit-transition:all .6s ease;
    -moz-transition:all .6s ease;
    -ms-transition:all .6s ease;
    -o-transition:all .6s ease;
    transition:all .6s ease
}
.flat-service .section-title h2{
    margin-top:0
}
.flat-service .service-content-right{
    padding-left:13.6%
}
.flat-service .service-box .service-content h4{
    font-size:18px;
    color:var(--primary-color);
    margin-bottom:20px
}
.flat-service .service-box .service-content h3{
    font-size:24px;
    font-family:barlow,sans-serif;
    margin-bottom:23px
}
.flat-service .service-box .service-content hr{
    margin-bottom:20px
}
.flat-service .service-box a.readmore{
    font-size:16px;
    font-weight:500;
    color:#8a8a8a
}
.flat-service .service-box:hover .service-content,.flat-service .service-box:hover .service-content h4,.flat-service .service-box:hover a.readmore,.flat-service .service-box.active .service-content,.flat-service .service-box.active .service-content h4,.flat-service .service-box.active a.readmore{
    color:#fff
}
.flat-service .service-box:hover .services-post img{
    transform:scale(1.1)
}
.flat-service .service-box:hover .service-content,.flat-service .service-box.active .service-content{
    background-color:var(--primary-color)
}
.flat-service .service-box:hover .services-post::after{
    opacity:.6
}
.flat-contact-request{
    position:relative;
    background-image:url(../images/mark-page/mark-required.jpg);
    background-repeat:no-repeat;
    background-size:cover;
    background-position:center
}
.flat-contact-request .contact-request-form{
    padding-right:21%
}
.flat-contact-request .section-title h2{
    margin-top:unset;
    margin-bottom:38px;
    color:#fff
}
.flat-contact-request .contact-request-form input{
    background-color:transparent;
    border:1px solid #fff;
    border-radius:8px;
    padding:21px 30px;
    margin-bottom:17px
}
.flat-contact-request .contact-request-form button{
    margin-top:15px;
    background-color:#fff;
    padding:16px 50px;
    border-radius:6px;
    color:var(--primary-color)
}
.flat-contact-request .contact-request-form button:hover{
    background-color:var(--primary-color5);
    color:#fff
}
.flat-contact-request .contact-request-content{
    position:absolute
}
.flat-contact-request .contact-request-content .post{
    border-radius:10px;
    overflow:hidden
}
.flat-contact-request .about-video{
    top:unset;
    bottom:40px;
    right:unset;
    left:40px
}
.flat-service-details{
    margin-bottom:-30px
}
.flat-service-details .post-inner{
    margin-top:8px
}
.flat-service-details .post-inner h2{
    margin-bottom:21px
}
.flat-service-details .post-inner p{
    margin-bottom:25px
}
.flat-service-details .post-inner .post-media{
    border-radius:8px;
    overflow:hidden;
    margin-bottom:24px
}
.flat-service-details .post-inner .work-process{
    display:flex;
    flex-wrap:wrap;
    margin-top:-3px;
    margin-bottom:10px
}
.flat-service-details .post-inner .work-process li,.flat-portfolio-details .work-process li{
    display:flex;
    align-items:center;
    margin-right:30px;
    margin-bottom:22px
}
.flat-service-details .post-inner .work-process .icon-tick,.flat-portfolio-details .icon-tick{
    display:inline-block;
    width:28px;
    height:28px;
    line-height:28px;
    margin-right:13px;
    background-color:var(--primary-color);
    flex-shrink:0
}
.flat-service-details .post-inner .work-process .icon-tick::after,.flat-portfolio-details .icon-tick:after{
    color:#fff
}
.flat-service-details .post-inner .work-process h4,.flat-portfolio-details .work-process h4{
    display:inline-block;
    font-size:16px;
    font-weight:500
}
.flat-portfolio-details .work-process h4{
    font-weight:700;
    -webkit-line-clamp:1;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:break-word
}
.flat-service-details .side-bar .list-menu{
    margin-bottom:42px
}
.flat-service-details .side-bar .list-menu li{
    position:relative;
    padding:17px 29px;
    border:1px solid var(--primary-color);
    margin-bottom:19px;
    border-radius:6px
}
.flat-service-details .side-bar .list-menu li a{
    font-size:20px;
    font-family:barlow,sans-serif;
    font-weight:700;
    color:var(--primary-color6)
}
.flat-service-details .side-bar .list-menu .readmore,.flat-faq .faq-content .readmore{
    position:absolute;
    top:0;
    right:0;
    line-height:54px;
    height:100%;
    background-color:var(--primary-color);
    width:76px;
    border-radius:0 6px 6px 0;
    z-index:-1;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-service-details .side-bar .list-menu .readmore::after,.flat-faq .faq-content .readmore::after{
    position:absolute;
    color:#fff;
    right:27px;
    top:50%;
    transform:translateY(-50%)
}
.flat-service-details .side-bar .list-menu li:hover .readmore,.flat-service-details .side-bar .list-menu li.active .readmore{
    width:100%
}
.flat-service-details .side-bar .list-menu li:hover a,.flat-service-details .side-bar .list-menu li.active a{
    color:#fff
}
.flat-service-details .side-bar .section-title-service h2{
    position:relative;
    font-size:24px;
    font-family:barlow,sans-serif
}
.flat-service-details .side-bar .section-title-service h2::after{
    content:'';
    bottom:-13px;
    left:0;
    position:absolute;
    height:1px;
    width:42%;
    background-image:linear-gradient(90deg,#FD4A36,#FD4A36 75%,transparent 75%,transparent 100%);
    background-size:6px 1px;
    border:none;
    margin:0
}
.flat-service-details .meta-phone::before,.flat-service-details .meta-mail::before,.flat-service-details .meta-address::before{
    color:#707070
}
.flat-service-details .widget-list-contact li{
    color:var(--primary-color5);
    font-weight:500;
    margin-bottom:17px
}
.flat-service-details .widget-list-contact{
    margin-top:30px;
    margin-bottom:38px
}
.flat-service-details .question-box{
    position:relative;
    border-radius:6px;
    overflow:hidden;
    margin-bottom:43px
}
.flat-service-details .question-box .media img{
    width:100%
}
.flat-service-details .question-box::after{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#262626;
    opacity:.8;
    z-index:1
}
.flat-service-details .side-bar .question-box .content a{
    position:absolute;
    top:50%;
    left:0;
    right:0;
    transform:translateY(-50%);
    font-size:24px;
    font-family:barlow,sans-serif;
    font-weight:700;
    color:#fff;
    line-height:38px;
    text-align:center;
    z-index:20
}
.flat-service-details .side-bar .question-box .content a:hover{
    text-decoration:underline
}
.flat-service-details .side-bar .brochures{
    margin-top:32px
}
.flat-service-details .side-bar .brochures li{
    padding:18px 29px;
    border:1px solid #dbdbdb;
    border-radius:6px;
    margin-bottom:20px
}
.flat-service-details .side-bar .brochures li a{
    position:relative;
    font-size:18px;
    font-family:barlow,sans-serif;
    font-weight:700;
    padding-left:47px
}
.flat-service-details .side-bar .brochures .icon{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    left:0;
    font-size:32px
}
.flat-testimonial-2{
    margin-bottom:-27px;
    background-image:url(../images/mark-page/mark-client-2.jpg);
    background-position:center;
    background-repeat:no-repeat;
    background-size:cover
}
.flat-testimonial-2 .testimonial-content-left{
    margin-top:-26px
}
.flat-testimonial-2 .section-title,.flat-testimonial .section-title h3{
    padding-left:unset
}
.flat-testimonial-2 .section-title,.flat-testimonial-2 .section-heading{
    color:#fff
}
.flat-testimonial-2 .section-title p{
    margin-top:15px;
    padding-right:91px
}
.flat-testimonial-2 .testimonial-2-btn{
    padding-top:9px
}
.flat-testimonial-2 .testimonial-2-btn .swiper-button-next,.flat-testimonial-2 .testimonial-2-btn .swiper-button-prev{
    position:unset;
    background-color:#fff
}
.flat-testimonial-2 .swiper-button-prev.btn-custom-carousel-prev{
    transform:rotate(90deg)
}
.flat-testimonial-2 .swiper-button-next.btn-custom-carousel-next{
    transform:rotate(-90deg);
    margin-right:10px
}
.flat-testimonial-2 .swiper-button-next.btn-custom-carousel-next:hover{
    background-color:var(--primary-color5)
}
.flat-testimonial-2 .swiper-button-next.btn-custom-carousel-next::after{
    color:var(--primary-color)
}
.flat-testimonial-2 .swiper-button-prev.btn-custom-carousel-prev:hover{
    background-color:var(--primary-color);
    border:1px solid #fff
}
.flat-testimonial-2 .testimonial-slide-box .testimonal-content p{
    color:#fff
}
.flat-testimonial-2 .testimonial-slide-box{
    background-color:var(--primary-color)
}
.flat-testimonial-2 .swiper-slide-active .testimonial-slide-box{
    background-color:#fff
}
.flat-testimonial-2 .swiper-slide-active .testimonial-slide-box p{
    color:#8a8a8a
}
.flat-faq .faq-title-box{
    text-align:center;
    margin-bottom:45px
}
.flat-faq .fl-faq-content{
    width:100%;
    display:flex;
    flex-wrap:wrap
}
.flat-faq .flat-toggle{
    margin-bottom:31px
}
.flat-faq .faq-title-box .icon{
    display:inline-block;
    width:66px;
    height:66px;
    text-align:center;
    line-height:66px;
    background-color:var(--primary-color7);
    border-radius:50%;
    margin-bottom:21px
}
.flat-faq .faq-title-box .icon::after{
    content:'\e910';
    font-family:icomoon;
    font-size:35px;
    color:var(--primary-color)
}
.flat-faq .faq-title-box .section-title p{
    color:#8a8a8a;
    margin-top:25px;
    padding:0 18%
}
.flat-accordion{
    margin-bottom:30px
}
.flat-accordion .flat-toggle .toggle-title{
    cursor:pointer;
    position:relative;
    font-size:18px;
    font-family:barlow,sans-serif;
    font-weight:500;
    border:solid 1px #c2c2c2;
    border-radius:6px;
    padding:24px 29px
}
.flat-accordion .flat-toggle .toggle-content{
    display:none
}
.flat-accordion .flat-toggle .toggle-title.active{
    width:100%;
    display:block
}
.flat-accordion .flat-toggle .toggle-content p{
    font-size:15px;
    line-height:26px;
    color:#8a8a8a;
    padding:10px 31px;
    border-radius:0 0 6px 6px;
    box-shadow:0 7px 12px #7773731c
}
.flat-faq .toggle-title.active{
    color:#fff;
    transition:.6s
}
.flat-faq .toggle-title.active .readmore{
    width:100%
}
.flat-faq .toggle-title.active .readmore::after{
    top:unset;
    transform:rotate(90deg);
    line-height:68px
}
.flat-faq-contact{
    margin-top:-172px
}
.flat-faq-contact .faq-contact-form{
    background:linear-gradient(rgba(12,41,87,0.74),#0c29579a),url(../images/mark-page/contact-faq.jpg);
    background-position:center;
    background-size:cover;
    padding:110px 100px
}
.flat-faq-contact .faq-contact-form .section-title{
    margin-bottom:50px
}
.flat-faq-contact .faq-contact-form input{
    border-radius:4px
}
.flat-faq-contact .faq-contact-form .name-wrap,.flat-faq-contact .faq-contact-form .email-wrap,.flat-faq-contact .faq-contact-form .phone-wrap,.flat-faq-contact .faq-contact-form .subject-wrap{
    width:48.3%;
    display:inline-block;
    margin-bottom:30px
}
.flat-faq-contact .faq-contact-form .message-wrap{
    border-radius:4px;
    overflow:hidden;
    margin-bottom:62px
}
.flat-faq-contact .faq-contact-form .name-wrap,.flat-faq-contact .faq-contact-form .phone-wrap{
    margin-right:30px
}
.flat-faq-contact .faq-contact-form button{
    display:block;
    margin:0 auto;
    font-size:16px;
    border-radius:29px;
    padding:17px 30px
}
.flat-faq-contact .faq-contact-form button:hover{
    background-color:var(--primary-color2)
}
.flat-portfolio .portfolio-box{
    position:relative;
    border-radius:6px;
    overflow:hidden;
    margin-bottom:30px
}
.flat-portfolio .portfolio-box .portfolio-media img{
    width:100%
}
.flat-portfolio .portfolio-box .portfolio-readmore{
    position:absolute;
    bottom:0;
    right:-1px;
    width:133px;
    height:104px;
    line-height:36px;
    background-color:var(--primary-color5);
    clip-path:polygon(100% 100%,100% 0,0 100%);
    z-index:100;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-portfolio .portfolio-box .portfolio-readmore .readmore{
    position:absolute;
    bottom:15px;
    right:22px;
    width:36px;
    height:36px;
    line-height:36px;
    border-radius:50%;
    text-align:center;
    background-color:var(--primary-color);
    z-index:100
}
.flat-portfolio .portfolio-box .portfolio-readmore .readmore::after{
    color:#fff;
    font-size:15px;
    margin-left:unset
}
.flat-portfolio .portfolio-box .portfolio-layer-content{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#262626c5;
    opacity:0;
    -webkit-transition:all .7s ease;
    transition:all .7s ease;
    z-index:1
}
.flat-portfolio .portfolio-box .portfolio-layer-content .content{
    position:absolute;
    bottom:62px;
    left:20px;
    color:#fff;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
.flat-portfolio .portfolio-box .portfolio-layer-content .content a{
    font-size:24px;
    font-family:barlow,sans-serif;
    font-weight:700;
    color:#fff;
    line-height:51px
}
.flat-portfolio .portfolio-box .portfolio-layer-content .content a:hover{
    text-decoration:underline
}
.flat-portfolio .portfolio-box .portfolio-layer-content .content p{
    font-size:15px;
    line-height:26px;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    display:-webkit-box;
    overflow:hidden;
    text-overflow:ellipsis;
    word-break:break-word
}
.flat-portfolio .portfolio-box:hover .portfolio-readmore,.flat-portfolio .portfolio-box.active .portfolio-readmore{
    background-color:var(--primary-color)
}
.flat-portfolio .portfolio-box:hover .portfolio-readmore .readmore,.flat-portfolio .portfolio-box.active .portfolio-readmore .readmore{
    background-color:#fff;
    color:var(--primary-color5)
}
.flat-portfolio .portfolio-box:hover .portfolio-readmore .readmore::after,.flat-portfolio .portfolio-box.active .portfolio-readmore .readmore::after{
    color:var(--primary-color5)
}
.flat-portfolio .portfolio-box:hover .portfolio-layer-content,.flat-portfolio .portfolio-box.active .portfolio-layer-content{
    opacity:1
}
.flat-portfolio .portfolio-menu{
    margin-bottom:50px;
    margin-top:3px
}
.flat-portfolio .flat-filter-isotope{
    display:flex;
    justify-content:center
}
.flat-portfolio .flat-filter-isotope li a{
    font-size:16px;
    font-weight:700
}
.flat-portfolio .flat-filter-isotope li.active a{
    color:var(--primary-color)
}
.flat-portfolio .flat-filter-isotope li.active::after{
    content:'';
    position:absolute;
    bottom:-6px;
    left:0;
    height:1px;
    width:100%;
    background-image:linear-gradient(90deg,#FD4A36,#FD4A36 75%,transparent 75%,transparent 100%);
    background-size:6px 1px;
    border:none;
    margin:0;
    margin-bottom:4px
}
.flat-portfolio .flat-filter-isotope li{
    position:relative;
    margin:0 14px
}
.flat-portfolio .fl-gallery{
    width:100%;
    display:flex;
    flex-wrap:wrap
}
.flat-portfolio-details .main-content .post-media{
    position:relative;
    border-radius:10px;
    overflow:hidden;
    margin-bottom:40px
}
.flat-portfolio-details .post-media .content{
    position:absolute;
    bottom:0;
    left:0;
    width:470px;
    background-color:var(--primary-color);
    border-radius:0 40px 0 0;
    overflow:hidden
}
.flat-portfolio-details .post-media .content .top{
    padding:19px 40px;
    background-color:var(--primary-color5)
}
.flat-portfolio-details .post-media .content .top h2{
    font-size:24px;
    color:#fff
}
.flat-portfolio-details .post-media .content .list li{
    display:flex;
    justify-content:space-between;
    padding:17px 40px;
    border-bottom:dashed 1px #fff
}
.flat-portfolio-details .post-media .content .list li:last-child{
    border-bottom:unset
}
.flat-portfolio-details .post-media .content .list li h4,.flat-portfolio-details .post-media .content .list li span{
    font-size:16px;
    color:#fff
}
.flat-portfolio-details .main-content .section-title{
    margin-bottom:25px
}
.flat-portfolio-details .main-content p{
    line-height:30px
}
.flat-portfolio-details .main-content .post-project-content{
    margin-top:-14px
}
.flat-portfolio-details .main-content .post-project-content h3{
    font-size:30px;
    font-family:barlow,sans-serif;
    margin-bottom:17px
}
.flat-portfolio-details .work-process{
    margin-top:16px
}
.flat-portfolio-details .work-process li{
    margin-bottom:12px
}
.flat-portfolio-details .section-wrap{
    margin-top:24px
}
.flat-portfolio-details .icon-tick{
    display:inline-block;
    width:25px;
    height:25px;
    line-height:25px;
    border-radius:50%;
    text-align:center;
    object-fit:cover;
    margin-right:16px;
    background-color:var(--primary-color);
    flex-shrink:0
}
.flat-portfolio-details .icon-tick::after{
    font-size:15px
}
.flat-portfolio-news{
    margin-top:-150px;
    margin-bottom:-29px
}
.portfolio-carousel{
    margin-top:50px
}
.flat-contact{
    
}
.flat-contact2 {
    background-image: url(../images/mark-page/mark-contact.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    margin-bottom: -17px;
}
.flat-title-page.contact-page-title::after{
    display:none
}
.flat-title-page.contact-page-title .breadcrumbs{
    color:var(--primary-color6)
}
.flat-title-page.contact-page-title .breadcrumbs .breadcrumb-trail>a:before{
    color:var(--primary-color6)
}
.flat-contact .features-content-left{
    color:#fff;
    margin-bottom:31px
}
.flat-contact .contact-icon-box{
    background-color:#fff;
    border-radius:6px;
    padding:40px 30px;
    margin-bottom:21px;
	display:flex;align-items:center;
}
.flat-contact .contact-icon-box .content{width:70%;}
.flat-contact .contact-icon-box .icon{
    display:inline-block;
    width:60px;
    height:60px;
    line-height:60px;
    border-radius:50%;
    margin-right:16px;
    object-fit:cover;
    text-align:center;
    background-color:var(--primary-color7);
}
.flat-contact .contact-icon-box .icon::before{
    margin:0;
    color:var(--primary-color)
}
.flat-contact .contact-icon-box .content h4{
    font-size:16px;
    font-weight:500;
    line-height:28px
}
.flat-contact .title{
    margin-top:55px;
    margin-bottom:31px
}
.flat-contact .title h3{
    font-size:30px;
    font-family:barlow,sans-serif;
    line-height:36px;
    color:#fff
}
.tf-map .inner .map-contact, .tf-map .inner {
    width: 100%;
    height: 400px;
}
.flat-contact .contact-form{
    background-color:var(--primary-color);
    background-image:url(../images/mark-page/mark-contact-form.png);
    background-repeat:no-repeat;
    background-position:center;
    border-radius:8px;
    padding:35px 67px 45px
}
.flat-contact .contact-form input{
    background-color:#fff;border-radius:8px;
    padding:13px 1rem!important
}
.flat-contact #comments .name-wrap,#comments .email-wrap{
    border-bottom:2px solid #ebebeb
}
.flat-contact #comments .text-wrap{
    margin-bottom:30px
}
.flat-contact #comments .message-wrap textarea{
    background-color:#fff;
    border-radius:6px
}
.flat-contact #comments .btn-submit-comment{
    margin-top:19px;
    font-size:16px
}
#footer{
    background:url(../images/mark-page/mark-footer.png) no-repeat center center;
    background-color:#ccc;
    background-size:cover;
    position:relative;
    z-index:1;
    padding:60px 0 44px
}
#footer-top{
    padding-bottom:65px
}
#footer-top .footer-schedule{
    position:relative;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    background-color:#fff;
    padding:0 62px;
    height:129px;
    border-radius:8px;
    z-index:100
}
#footer-top .footer-schedule::before,#footer-top .footer-schedule::after{
    content:'';
    position:absolute;
    top:0;
    right:15px;
    left:15px;
    bottom:-8px;
    border-radius:8px;
    background-color:rgb(255 255 255/39%);
    z-index:-1
}
#footer-top .footer-schedule::after{
    right:35px;
    left:35px;
    bottom:-17px
}
#footer .footer-widgets-nav-menu .widget-title-link-wrap{color:#333}
#footer-top .footer-schedule h2{
    color:var(--primary-color5)
}
#footer-top .footer-schedule h2::after{
    content:'\e905';
    font-family:icomoon;
    position:absolute;
    left:52px;
    color:#fd4a3641;
    z-index:-1;
    font-size:63px
}
#footer .logo-footer img{
    width:250px
}
#footer .logo-footer{
    margin-bottom:24px
}
#footer .text-widget{
    color:#555;
    line-height:30px;
    margin-bottom:24px
}
.widget-social ul{
    display:flex;
    display:-webkit-flex
}
.widget-social ul li{
    display:inline-block;
    width:28px;
    height:28px;
    border-radius:50%;
    line-height:28px;
    background-color:var(--primary-color);
    margin-right:6px;
    text-align:center;
    object-fit:cover;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
#footer .widget-social ul li a{
    color:#fff
}
#footer .widget-social ul li:hover a{
    color:var(--primary-color)
}
.widget-social ul li:hover{
    background-color:var(--primary-color2)
}
.facebook-icon::after,.twitter-icon::after,.linked-icon,.instagram-icon{
    content:'\f09a';
    font-family:fontawesome;
    font-size:12px
}
.twitter-icon::after{
    content:'\f099'
}
.linked-icon::after{
    content:'\f0e1'
}
.instagram-icon::after{
    content:'\f16d'
}
#footer .footer-widgets-nav-menu{
    display:flex;
    display:-webkit-flex
}
#footer .menu-1{
    width:35%;
    padding:15px 10px 10px 7px
}
#footer .menu-2{
    width:30%;
    padding:15px 10px 10px 16px
}
#footer .menu-3{
    width:45%;
    padding:15px 0 10px 21px
}
#footer .footer-widgets-nav-menu .widget-title-link-wrap{
    position:relative;
    font-size:20px;
    font-weight:450;
    margin:8px 0 27px 13px
}
#footer .footer-widgets-nav-menu .widget-title-link-wrap::after{
    content:'';
    position:absolute;
    bottom:-12px;
    left:0;
    width:70px;
    height:2px;
    background-color:var(--primary-color)
}
#footer .menu-3 li{
    margin-bottom:18px
}
#footer .link-wrap{
    width:48%;
    display:inline-block
}
#footer .menu-1 .link-wrap:last-child{
    padding-left:26px
}
#footer .link-wrap.menu2{
    width:100%;
    display:block
}
#footer .link-wrap li::before{
    content:"\f105";
    font-family:fontawesome;
    font-size:15px;
    color:var(--primary-color);
    margin-right:4%;
    -webkit-transition:all .3s ease-in-out;
    -moz-transition:all .3s ease-in-out;
    -ms-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out
}
.widget-list-contact li{
    color:#555;
    font-size:16px;
    font-weight:300;
	margin-bottom:1rem;
}
#footer .link-wrap li a{
    position:relative;
    font-size:16px;
    line-height:30px;
    color:#555
}
#footer .link-wrap li{
    margin-bottom:5px
}
#footer .link-wrap li a::before{
    position:absolute;
    content:"";
    width:100%;
    height:1px;
    top:100%;
    left:0;
    background:var(--primary-color);
    transition:transform .3s;
    transform:scaleX(0);
    transform-origin:left
}
#footer .link-wrap li a:hover::before,#footer .link-wrap li:hover::before,#footer .link-wrap li:hover{
    transform:scaleX(1);
    transform-origin:left;
    color:var(--primary-color);
    margin-right:7%
}
#footer .menu-3 .widget-title-link-wrap{
    margin:8px 0 30px -2px
}
.meta-phone::before,.meta-mail::before,.meta-address::before,.list-note-content li::before{
    font-family:fontawesome;
    color:#fff;
    font-size:16px;
    vertical-align:middle;
	display:inline-block;
	width:24px;text-align:center!important;
}
.meta-phone::before{
    content:"\f095"
}
.meta-mail::before{
    content:"\f0e0"
}
.meta-address::before{
    content:"\f041"
}
.widget-social-header{
    position:absolute;
    top:50%;
    right:2%;
    color:var(--primary-color6)
}
#bottom{
    background-color:#777;
    font-size:16px;
    color:#fff;
}
#bottom .bottom-bar-inner-wrap{
    position:relative;
    padding:10px 0;
    display:flex;
    flex-wrap:wrap-reverse;
    justify-content:space-between
}
#bottom .bottom-bar-inner-wrap::after{
    content:'';
    position:absolute;
    top:0;
    left:0;
    right:0;
    width:100%;
    height:1.4px;
}
#bottom .bottom-bar-inner-wrap .text{
    margin-top:10px;
    font-size:15px
}
#bottom .bottom-bar-inner-wrap .widget-links-bottom ul{
    display:flex;
    margin-right:-26px
}
#bottom .bottom-bar-inner-wrap .widget-links-bottom ul li{
    font-size:15px;
    letter-spacing:0;
    margin-right:26px
}
#scroll-top{
    position:fixed;
    display:block;
    width:50px;
    height:50px;
    line-height:50px;
    border-radius:4px;
    text-align:center;
    z-index:1;
    right:14px;
    bottom:23px;
    border-radius:50%;
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%;
    opacity:0;
    visibility:hidden;
    cursor:pointer;
    overflow:hidden
}
#scroll-top.show{
    right:24px;
    opacity:1;
    visibility:visible
}
#scroll-top:before,#scroll-top:after{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    -webkit-transition:all .3s ease;
    -moz-transition:all .3s ease;
    -ms-transition:all .3s ease;
    -o-transition:all .3s ease;
    transition:all .3s ease
}
#scroll-top:before{
    z-index:-1;
    background-color:var(--primary-color)
}
#scroll-top:after{
    content:"\f077";
    font-family:fontawesome;
    font-size:18px;
    color:#fff
}
#scroll-top:hover{
    transform:translateY(-7%)
}
.flat-alert.msg-success{
    color:green;
    padding:20px;
    background-color:rgb(194 231 203);
    border-radius:6px;
    color:green;
    font-size:16px;
    line-height:30px
}

.button.orcamento{
	background:#fff;color:var(--primary-color);border:2px solid var(--primary-color)!important;
}

.contact-request textarea{
	border: 1px solid var(--primary-color4);
	border-radius:4px!important;
	padding:13px 19px;
}
@media(max-width:768px){
	.ptlg-120{margin:50px 0;}
	.features-box-mobile{height:auto!important; margin-bottom:2rem!important}
}
.imovel-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 20px;
}
.swiper-container{position:relative;border-radius:10px;}
.swiper {
	width: 100%;
	height: 500px;
	margin-bottom: 30px;border-radius:10px;
}

.swiper-slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;border-radius:10px;
}

.swiper-container .swiper-button-next,
.swiper-container .swiper-button-prev {
    position: absolute;
    top: 50% !important; /* Centralização vertical */
    transform: translateY(-50%); /* Garantir centralização perfeita */
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: var(--primary-color);
    border: 2px solid var(--primary-color);
    transition: all 0.3s ease;
    z-index: 10;
    cursor: pointer;

    /* Remove a seta padrão do Swiper */
    &::after {
        font-size: 18px;
        color: #fff;
    }

    /* Efeito hover */
    &:hover {
        background-color: transparent;
        border-color: var(--primary-color);
        
        &::after {
            color: var(--primary-color);
        }
    }
}
.swiper-container .swiper-button-prev {
    left: 20px!important;
	transform: rotate(-90deg)!important;
}

.swiper-container .swiper-button-next {
    right: 20px!important;
	transform: rotate(90deg)!important;
}

@media (max-width: 768px) {
    .swiper-container .swiper-button-next,
    .swiper-container .swiper-button-prev {
        width: 40px;
        height: 40px;
        
        &::after {
            font-size: 16px;
        }
    }
}

.imovel-info {
	display: grid;
	grid-template-columns: 2fr 1fr;
	gap: 30px;
}

.caracteristicas {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
	gap: 15px;
	margin: 20px 0;
}

.caracteristica-item {
	background: #f5f5f5;
	padding: 15px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	font-size:16px;
	gap: 10px;
}
.caracteristica-item i{color:var(--primary-color)!important}

.valor-box {
	background: #f8f8f8;
	padding: 20px;
	border-radius: 10px;
	margin-bottom: 20px;
}

.valor {
	font-size: 28px;
	color: #2c3e50;
	font-weight: bold;
}

.descricao {
	line-height: 1.6;
}

@media (max-width: 768px) {
	.imovel-info {
		grid-template-columns: 1fr;
	}
}
.tb-my-input{background:#fff!important;}
.primeiro-acesso-link,
.voltar-login-link {
	margin-top:2rem;
    color: #fff;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s ease;
	display:block;
}

.primeiro-acesso-link:hover,
.voltar-login-link:hover {
	color: #fff;
    text-decoration: underline;
}

/* Animação de fade */
.fade-in {
    animation: fadeIn 0.5s ease-in;
}

.fade-out {
    animation: fadeOut 0.5s ease-out;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
}

/* Estilização do input CPF */
#cpf {
    font-size: 16px;
}

.alert {
    padding: 15px;
    border-radius: 4px;
    margin-bottom: 20px;
}

.alert-success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
}

.alert-danger {
    background-color: #f8d7da;
    border-color: #f5c6cb;
    color: #721c24;
}

/* Validação visual dos campos */
.tb-my-input:invalid {
    border-color: #dc3545;
}

.tb-my-input:valid {
    border-color: #28a745;
}

.form-text {
    font-size: 12px;
    color: #fff!important;
    margin-top: 5px;
    display: block;
}

.dashboard-card {
    background: #fff;
    border-radius: 15px;
    padding: 25px;
    text-align: center;
    transition: all 0.3s ease;
    height: 100%;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.dashboard-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
}

.card-icon {
    font-size: 2.5em;
    color: var(--primary-color);
    margin-bottom: 15px;
}

.dashboard-card h3 {
    font-size: 2em;
    margin-bottom: 10px;
    color: #333;
}

.dashboard-card p {
    color: #666;
    font-size: 1.5em;
    margin-bottom: 20px;
}

.card-link {
    color: var(--primary-color);
    text-decoration: none;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: all 0.3s ease;
	font-size: 1.5em;
}

.card-link:hover {
    color: var(--primary-color-dark);
}

.card-link i {
    font-size: 2em;
    transition: transform 0.3s ease;
	color:var(--primary-color)!important;
}

.card-link:hover i {
    transform: translateX(5px);
}

.welcome-section {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 30px;
}

.welcome-section h2 {
    margin-bottom: 5px;
    color: #333;
}

.text-muted {
    color: #6c757d;
}

@media (max-width: 768px) {
    .col-md-4 {
        margin-bottom: 20px;
    }
    
    .welcome-section {
        text-align: center;
    }
    
    .welcome-section .text-end {
        text-align: center !important;
        margin-top: 15px;
    }
}

/* Animação de entrada dos cards */
.dashboard-card {
    animation: fadeInUp 0.5s ease forwards;
    opacity: 0;
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Aplicar delay na animação para cada card */
.col-md-4:nth-child(1) .dashboard-card { animation-delay: 0.1s; }
.col-md-4:nth-child(2) .dashboard-card { animation-delay: 0.2s; }
.col-md-4:nth-child(3) .dashboard-card { animation-delay: 0.3s; }
.col-md-4:nth-child(4) .dashboard-card { animation-delay: 0.4s; }
.col-md-4:nth-child(5) .dashboard-card { animation-delay: 0.5s; }
.col-md-4:nth-child(6) .dashboard-card { animation-delay: 0.6s; }

.password-field {
    position: relative;
}

.toggle-password {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    color: #666;
}
.table-responsive *{font-size:14px!important;}
.button-area-restrita{
	line-height:20px;padding:10px 20px;margin:1rem 0!important;display:inline-block;
}
.whatsapp-button {
	position: fixed;
	bottom: 100px;
	right: 20px;
	z-index: 1000;
	display: flex;
	align-items: center;
	background-color: #000000;
	color: white;
	border-radius: 50px;
	padding: 10px 20px;
	text-decoration: none;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
	transition: all 0.3s ease;
	font-family: Arial, sans-serif;
	font-size: 16px;
	font-weight: bold;
}

.whatsapp-button:hover {
	transform: scale(1.05);
	box-shadow: 0 6px 12px rgba(0, 0, 0, 0.3);
	color:var(--primary-color)
}

.whatsapp-icon {
	width: 30px;
	height: 30px;
	margin-left: 10px;
	background-color: #25D366;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 5px;
}

.whatsapp-icon svg {
	fill: white;
	width: 20px;
	height: 20px;
}

/* Animação de pulsar (opcional) */
@keyframes pulse {
	0% { transform: scale(1); }
	50% { transform: scale(1.1); }
	100% { transform: scale(1); }
}

.pulse {
	animation: pulse 2s infinite;
}