@import url(../font/stylesheet.css);
* {margin: 0;padding: 0;box-sizing: border-box;}
html{scroll-behavior: smooth;scroll-padding-top: 100px; overflow: auto;}
img {max-width: 100%;height: auto;}
body {background: #ffffff;font-size:16px;color: #000000;font-family: 'P22 Underground';font-weight: 300;line-height: 1;}
ul {list-style: none;padding: 0;}
p {margin-bottom: 35px;line-height: 24px;font-size: 16px;}
a {color: inherit;text-decoration: none;transition: 0.4s;}

/* ----- Heading Font CSS ------ */

h1,h2,h3,h4,h5,h6 {margin-bottom: 35px;line-height: 1.2;font-family: 'P22 Underground';font-weight: 300;text-transform: uppercase;letter-spacing: 3px;}
h1{font-size: 32px;}
h2{font-size: 30px;}
h3{font-size: 20px;}
h4{font-size: 18px;}
h5{font-size: 16px;}
h6{font-size: 14px;}
a:focus,.btn:focus,button:focus,.btn-primary:not(:disabled):not(.disabled):active:focus {outline: none;box-shadow: none;}
input:focus{border: none;outline: none;}
.h3-imp {font.size:22px;margin-bottom: 35px;line-height: 1.2;font-family: 'P22 Underground';font-weight: 300;text-transform: none;letter-spacing: 1px;}
/* global css start */ 
.full_width{width: 100%;float: left;}
.wrapper{max-width:1280px;margin: 0 auto;width: 100%;padding: 0 30px;}
.wrap_left{width: 33%;}
.wrap_right{width: calc(67% - 20px);}
.main-content{margin-top: 150px;}
.title_border h1,.title_border h2{position: relative;margin-bottom: 38px;padding-bottom: 38px;letter-spacing: 5px;}
.title_border h1::after,.title_border h2::after{content: ''; width: 147px; height: 1px; background: #000000; position: absolute;left: 0;bottom: 0;}
.d-flex{display: flex;flex-wrap: wrap;}
strong{font-family: 'P22 Underground Medium PCp';font-weight: 500;}
.list ul,.list ol{margin-bottom: 35px;}
.list ol{padding-left: 18px;}
.list li{line-height: 24px;}
.list ul li{position: relative;padding:0px 0px 0px 18px;}
.list ul li::before{content: "";width: 5px; height: 5px;background: #000000;position: absolute;left: 0;top: 10px;transform: rotate(45deg);border-radius: 100%;}
/* global css end */
/* ******************************* main css ***************************** */


/* header css start */
.header{padding: 20px 0;transition: 0.4s;position: fixed;left: 0;top: 0;background: #ffffff;z-index: 999;}
.header.sticky{padding: 20px 0;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.2);}
.header.sticky .logo{width: 70px;}
.header .outer_part{display: flex;flex-wrap: wrap;justify-content: space-between;align-items: center;transition: 0.4s ease-in-out;}
.header .menu_bar{width: 56px;transition: 0.4s;cursor: pointer;z-index: 2;height: 33px;}
.header .menu_bar span{display: block;height: 1px;background: #000000;width: 100%;transition: 0.4s;}
.header .menu_bar span:not(:last-child){margin-bottom: 15px;}
.menu_bar.active span:nth-child(1) {transform: translateY(20px) rotate(-45deg);}
.menu_bar.active span:nth-child(2) {display: none;}
.menu_bar.active span:nth-child(3) {transform: translateY(4px) rotate(45deg);width: 100%;}
.stop_scroll {overflow: hidden;}

.header .logo{width: 125px;transition: 0.4s;}
.header .logo a{display: inline-block;}
.header .logo a img{display: block;}
.header .langswitcher{width: auto;display: flex;flex-wrap: wrap;}
.header .langswitcher a{position: relative;font-size: 24px;}
.header .langswitcher a:first-child{padding-right: 10px;margin-right: 10px;display: inline-block;}
.header .langswitcher a:nth-child(1)::after{content: "";position: absolute;right: 0;top: -10px;width: 1px;height: calc(100% + 20px);background: #000000;}
/* menu bar css */
.side_menu_pannel{position: fixed;top: -100%;left: 0;height: 100%;background: #ffffff;width: 400px;transition: 0.4s;overflow: auto;z-index: 99;}
.side_menu_pannel ul{width: 100%;float: left;padding: 170px 0 60px;}
.side_menu_pannel ul li{width: 100%;float: left;border-bottom: 1px solid #4e4e4e;}
.side_menu_pannel li a{display: block;padding:20px 30px;text-transform: uppercase;font-size: 20px;}
.side_menu_pannel li a:hover{text-decoration: underline;}
.side_menu_pannel.open{top: 0;}
/* header css end */

/* hero css */
.hero{background: #EDECEC;padding: 80px 0;min-height: 630px;display: flex;align-items: center;}
.hero img{width: 820px;display: block;margin: 0 auto;}
/* hero end */

/* two column start */
.two_col_text{padding: 100px 0;}
.two_col_text .wrap_right p:last-child{margin-bottom: 0;}
.two_col_text.bg{background: #EDECEC;}
/* two column end */

/* frame geybox start */
.frame_greybox{display: flex;flex-wrap: wrap;gap: 25px;margin-top: 70px;}
.frame_greybox .card{width: calc(33.333% - 17px);position: relative;cursor: pointer;}
.frame_greybox .card img{width: 100%;display: block;max-height: 244px;object-fit: cover;}
.frame_greybox .hover_text{ position: absolute;left: 0;top: 0;width: 100%;height: 100%;background: rgba(0, 0, 0,0.8);padding: 30px;opacity: 0;visibility: hidden;transition: 0.4s;}
.frame_greybox .hover_text .text{text-align: center; border: 1px solid #ffffff;padding: 20px;width: 100%;height: 100%;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;}
.frame_greybox .hover_text .text h4{color: #ffffff;text-transform: uppercase;font-weight: 300;letter-spacing: 2px;margin-bottom: 0;font-size: 16px;}
.frame_greybox .card:hover .hover_text{opacity: 1;visibility: visible;}
/* frame geybox end */

/* text editor start */
.text_editor{padding: 75px 0;}
.text_editor h1:not(.title_border h1),.text_editor h2:not(.title_border h1),.text_editor h3,.text_editor h4,.text_editor h5,.text_editor h6{margin-bottom: 20px;}
.text_editor p a{position: relative;text-decoration: underline;padding-left: 20px;}
.text_editor p a::before{content: "";position: absolute;left: 0;top: 2px;background: url(../images/external-link.svg)center no-repeat;width: 15px;height: 15px;}
/* text editor end */

/* footer start */
.footer{padding: 90px 0 75px;}
.footer_top {display: flex;flex-wrap: wrap;justify-content: space-between;}
.footer_top p{margin-bottom: 0;}
.footer_top .wrap_right{display: flex;flex-wrap: wrap;justify-content: space-between;}
.footer_top .card:first-child{width: 34%;}
.footer_top .card{width: 28%}
.footer a:hover{text-decoration: underline;}
.footer_top .card p span{padding-right: 20px;}
.footer_top h2{margin-bottom: 0;}

.footer_bottom{padding-top: 75px;}
.footer_bottom ul{flex-wrap: wrap;display: flex;justify-content: center;position: relative;}
.footer_bottom li{display: inline-block;border-right: 1px solid #000000;padding-right: 8px;margin-right: 8px;}
.footer_bottom li a{text-transform: uppercase;display: block;}
.footer_bottom ul::before{content: "";position: absolute;left: 50%;transform: translateX(-50%);top: -20px;height: 1px;background:#000000;width: 109px;}
.footer_bottom li:last-child{border-right: none;padding-right: 0;margin-right: 0;}
/* footer end */



/* Responsive css start */

@media only screen and (max-width:1220px) {
.header .logo{width: 90px;} 
.header.sticky .logo{width: 75px;}
.main-content {margin-top: 120px;}
.header{padding: 20px 0;} 
.header .langswitcher a{font-size: 20px;}
.header .langswitcher a:nth-child(1)::after{height: calc(100% + 12px);top: -6px;}
.hero{min-height: 480px;}
.hero img{width: 630px;}
.title_border h1, .title_border h2{margin-bottom: 25px;padding-bottom: 25px;}
h2 {font-size: 25px;}
h4 {font-size: 16px;}
p,.list ul,.list ol{margin-bottom: 25px;}
.side_menu_pannel li a{font-size: 25px;}
.two_col_text {padding: 80px 0;}
.frame_greybox .hover_text,.frame_greybox .hover_text .text{padding: 10px;}
.frame_greybox .card h4{letter-spacing: 1px;}
.wrap_right {width: calc(72% - 20px);}
.wrap_left {width: 30%;}
.footer{padding: 60px 0;}
.footer_bottom{padding-top: 50px;}
html{top: 100px;}



}


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

    .header .outer_part{align-items: center;}
    .header .langswitcher a{font-size: 18px;}
    .hero img{width: 500px;}
    .hero{min-height: auto;}
    .wrap_left{width: 100%;}
    .wrap_right{width: 100%;}
    .frame_greybox .card{width: calc(50% - 13px);}
      



}

@media only screen and (max-width:767px) {
    .frame_greybox{gap: 15px;}
    .frame_greybox .card{width: calc(50% - 8px);}
    .footer_top .card{width: 100% !important;margin-bottom: 25px;}
    .footer_top .card:last-child{margin-bottom: 0;}
    .footer_bottom{padding-top: 80px;}

}

@media only screen and (max-width:600px) {
    .main-content{margin-top: 92px;}
    .header,.header.sticky{padding: 15px 0;}
    .wrapper{padding: 0 20px;}
    .header .logo,.header.sticky .logo{width: 70px;}
    .header .langswitcher a{font-size: 16px;}
    .two_col_text{padding: 60px 0;}
    .frame_greybox{gap: 0;}
    .frame_greybox .card{width: 100%;margin-bottom: 25px;}

   



}