body{
padding: 0px;
margin: 0px;
background: black !important;
background-size: cover !important;
background-attachment: fixed !important;
}
@font-face{
font-family: 'Manrope';
src: url('../font/Manrope-VariableFont_wght.ttf');
}
*{
font-family: 'Manrope';
}
@font-face{
font-family: 'Volkhov-Regular';
src: url('../font/Volkhov-Regular.ttf');
}
.vb_font{
font-family: "Volkhov-Regular" !important;
}
.more-img{
position: absolute;
right: 0;
top: -5px;
width: 258px;
}
.owl-carousel .img-bg{
border: 10px solid white;
}
.item-left:hover .details-left{
left: 184px;
display: block !important;
transition: 0.3s;
}
.item-left{
filter: brightness(50%);
transition: 0.4s;
}
.item-left-active{
cursor: pointer;
filter: brightness(100%);
transition: 0.4s;
}
.details-left{
position: absolute;
width: 500px;
font-size: 20px;
text-align: left;
background-color: #00000094;
padding: 23px;
top: -27px;
left: -500px;
display: none;
}
.img-bg:hover{
filter: brightness(30%);
transition: 0.3s;
cursor: pointer;
}
.a-h:hover .icon-search{
display: block !important;
transition: 0.3s;
}
html {
scroll-behavior: smooth;
}
.icon-search{
font-size: 57px;
position: absolute;
top: 128px;
left: 88px;
display: none;
}
.owl-carousel {
padding-top: 50px;
padding-right: 30px;
padding-left: 30px;
padding-bottom: 80px;
}
.details-item{
color: white;
display: block;/* or inline-block */
text-overflow: ellipsis;
word-wrap: break-word;
overflow: hidden;
max-height: 3.6em;
line-height: 1.8em;
}
.owl-dots{
background: black;
margin-top: 30px;
text-align: center;
position: absolute;
width: 100%;
left: 0;
}
.product_sz_sm .owl-dots{
display: none;
}
/* .owl-dots .owl-dot span{
background: #c5c5c5;
z-index: 99;
position: relative;
border-radius: 50%;
margin-left: auto;
padding: 0px 9px 0px 12px;
margin: 12px;
} */
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot{
background: #7f7f7f !important;
z-index: 99;
position: relative;
border-radius: 50%;
margin-left: auto;
margin: 3px;
width: 15px;
height: 15px;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot.active{
background: #fff !important;
}
.slick-arrow{
z-index: 1 !important;
}
.active span {
background: white !important;
}
.new-more{
background-color: #d5832e;
color: white;
border-radius: 5px;
padding: 5px 10px 5px 10px;
box-shadow: 3px 3px 10px black;
}
.nav-header{
z-index: 9;
position: fixed;
top: 0px;
right: 43px;
width: 100%;
}
.scrolling{
background-color: #000000b0;
}
#myVideo {
margin-top: -40px;
position: relative;
z-index: -1;
width: 100%;
filter: brightness(30%);
}
.img-project{
filter: brightness(30%);
}
.img-project:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
}
.readmore{
background-color: white;
color: #bd7d02;
padding: 5px 20px 5px 20px;
}
.readmore:hover{
text-decoration: none;
cursor: pointer;
color: black;
}
.dowload-style{
width: 90%;
background-color: #bd7d02;
padding: 6px 10px 1px 10px;
border-radius: 2px;
margin-bottom: 10px;
}
.dowload-style:hover{
cursor: pointer;
}
.more{
position: absolute;
bottom: 16px;
right: 86px;
font-size: 12px;
background-color: #d99207;
color: white;
padding: 1px 5px 1px 5px;
}
.more:hover{
color: white;
}
/* .imgsoho{
right:
} */
.gpbanner{
top: 205px;
right: 50px;
}
.gpbanner h1{
font-size: 70px;
color: white;
font-weight: bold;
}
.img-trump{
background: linear-gradient(90deg, rgba(13,25,37,1) 0%, rgba(20,25,68,1) 100%);
margin-top: -7px;
}
.h1pt{
font-weight: 600;
color: #dc960f;
text-align: center;
}
.hdxf{
background-color: #dc960f;
color: white;
padding: 1px 5px 1px 7px;
}
.stv{
display: none;
}
.toggle-ul{
position: absolute;
right: 35px;
top: 5px;
font-size: 30px;
display: none !important;
}
.bars-x{
width: 100%;
height: 36px;
background-color: #000000ad;
position: fixed;
}
.navbars-sm{
list-style: none;
position: fixed;
right: -230px;
top: 0;
height: 100%;
background: black;
width: 210px;
padding-left: 0;
}
.nb-toggle{
transition: 0.3s;
right: 0px !important;
}
.r-200{
right: -230px;
transition: 0.3s;
}
.toggle-ul-x{
display: none;
}
.about{
padding-top: 88px;
padding-bottom: 88px;
/* padding: 88px;
padding-left: 88px !important;
padding-right: 88px !important; */
}
.about button[type=submit]{
border: 0;
}
.product_sz_sm{
display: none !important;
}
.product_img{
width: 100%;
height: 430px;
}
.leftLst img , .rightLst img{
width: 30px;
}
.g-arrow{
position: relative;
top: -164px;
}
.prev-slick , .prev-slick-2{
position: absolute;
left: 0px;
}
.next-slick , .next-slick-2{
position: absolute;
right: 0px;
}
.parter-btn{
position: relative !important;
z-index: 99;
}
.slick-arrow{
padding: 3px;
z-index: 9;
background-color: #2d2d2dc4;
border: 0;
top: 130px;
width: 24px;
}
.leftLst , .rightLst{
padding: 3px;
background-color: #2d2d2dc4;
border: 0;
top: 130px;
}
.product-leftLst{
position: absolute;
z-index: 10;
left: 5px;
top: 130px !important;
}
.product-rightLst{
position: absolute;
z-index: 10;
right: 5px;
top: 130px !important;
}
.product_icon_and_text{
display: grid;
position: relative;
height: 100% !important;
width: 100% !important;
}
.product_icon_and_text p{
color: #000000;
text-shadow: 0 0px 5px white;
font-size: 24px;
font-weight: 600;
}
body {
padding-top: 20px;
}
.carousel {
width: 100%;
}
.slide-box {
display: flex;
justify-content: space-between;
}
.carousel-caption {
background-color: rgba(0, 0, 0, 0.5);
padding: 20px;
border-radius: .5rem;
}
.carousel-control-next, .carousel-control-prev {
width: 6%;
}
.cl-slide2 {
width: 130px;
}
.carousel-indicators{
background-color: black;
bottom: -39px;
width: 110%;
left: -181px;
padding: 18px;
margin-bottom: -10px;
margin-left: -5% !important;
}
.carousel-indicators li {
height: 15px !important;
width: 15px !important;
border-radius: 50%;
width: 15px;
}
.for-only-md{
display: block;
}
.for-only-sm{
display: none;
}
#about{
margin-top: 20px;
}
.hilight_project{
color : #e58c30;
font-size: 45px;
text-shadow: 0 6px 6px black;
}
.navbars-sm .nav-link{
padding: 0px ;
}
.navbars-sm .nav-link{
padding-left: 15px ;
}
.navbars-sm .nav-item{
padding: 10px 20px;
}
@media only screen and (max-width: 1200px) {
.product_sz{
display: none !important;
}
.product_sz_sm{
display: block !important;
}
}
@media only screen and (max-width: 990px) {
.hilight_project{
font-size: 20px !important;
}
.menu-item{
width: 115px !important;
padding-top: 0px !important;
}
.menu-item img{
width: 95px !important;
}
.menu-item span{
display: none;
}
.details-left{
left: 102px !important;
font-size: 15px !important;
}
.sm-mt-15{
margin-top: 30px !important;
}
.more-img{
top: 9px !important;
width: 120px !important;
}
.for-only-md{
display: none !important;
}
#about{
margin-top: 30px !important;
}
.gpbanner {
top: 150px;
}
.for-only-sm{
display: block !important;
}
.about{
padding: 20px !important;
padding-left: 20px !important;
padding-right: 20px !important;
}
.img-project{
width: 100px;
}
.more {
right: 20px !important;
}
.toggle-ul , .toggle-ul-x{
display: block !important;
}
}
.product_icon_and_text{
padding: 5px !important;
}
.badge-wnt{
background-color: #e58c30;
color: white;
font-size: 18px !important;
}
@media screen and (min-width : 900px) {
.client_res{
margin-top: 130px !important;
/* display: none; */
}
}
@media only screen and (max-width: 500px) {
.gpbanner {
top: 120px;
}
.gpbanner h1{
font-size: 25px;
color: white;
font-weight: bold;
}
.gpbanner img{
float: right;
width: 200px !important;
}
}
@media only screen and (max-width: 800px) {
.video-height-mb{
height: 240px;
position: relative;
overflow: inherit !important;
}
.video-height-mb #myVideo{
position: absolute;
width: 200%;
top: 0;
left: -100%;
}
/* #myVideo{
display: none;
} */
.mt-max-5{
margin-top: 150px !important;
}
.details-sm-show{
position: fixed;
width: 67%;
font-size: 14px;
top: 40px;
left: 107px;
z-index: 999;
background-color: black !important;
color: white;
display: none;
transition: 0.5s;
padding: 10px;
border-radius: 10px;
}
.item-left:hover .details-sm-show{
left: 14px !important;
top: 40px;
}
.product-hilight img{
width: 100% !important;
}
.product-hilight-slide .owl-stage-outer .owl-stage .owl-item{
padding: 10px;
}
.owl-carousel .img-bg {
border: 4px solid white;
}
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev, .owl-carousel button.owl-dot{
width: 11px;
height: 11px;
}
.product-hilight-slide{
padding: 0px;
}
.stv{
display: block;
margin-top: -40px;
position: relative;
z-index: -1;
width: 100%;
filter: brightness(30%);
}
.gpbanner h1{
font-size: 40px;
color: white;
font-weight: bold;
}
.gpbanner {
top: 120px;
}
.gpbanner img{
float: right;
width: 250px !important;
}
.nav-top{
display: none !important;
}
}
.pjm{
display: none;
}
.responsive-min-height{
max-height: 550px;
}
@media only screen and (max-width: 630px) {
.gpbanner {
top: 150px;
}
.pjpc{
display: none !important;
}
.pjm{
display: block !important;
}
.responsive-min-height{
max-height: 340px;
}
}
@media only screen and (max-width: 1200px) {
.menu-item img {
width: 122px;
}
.menu-item i {
font-size: 45px !important;
}
.menu-item span {
font-size: 13px !important;
}
}
@media only screen and (max-width: 440px) {
.gpbanner {
top: 120px;
}
.gpbanner h1{
font-size: 27px;
color: white;
font-weight: bold;
}
.pad15 img{
width: 100px !important;
height: 43px !important;
margin: auto;
}
.gpbanner img{
float: right;
width: 150px !important;
}
}
.logo-slide .MultiCarousel-inner .item{
margin-right: 13px;
}
.slide-parter .slick-arrow{
padding: 0px 7px;
background-color: #2d2d2dc4;
border: 0;
color: white;
font-size: 23px;
}
.group-product::before{
content: '';
position: absolute;
left: 0;
top: 60%;
z-index: 1;
transform: translateY(-50%);
width: 90%;
height: 4px;
margin: auto;
background-color: white;
left: 5%;
}
.gpbanner a{
float: right;
border: 1px solid #b07709;
color: white !important;
padding: 9px 15px 7px 15px;
}
.gpbanner a:hover{
background-color: #b07709;
color: white;
cursor: pointer;
}
.icon-row{
font-size: 60px; transform: skewX(9deg) !important;
}
.text-row{
color:#e68c31; transform: skewX(9deg) !important; font-weight: 600; text-shadow: 0 0px 3px black; font-size: 14px;
}
.gpbanner img{
float: right;
width: 400px;
}
.active-link{
color: white !important;
}
.nav-link{
color: #818181;
}
.nav-link:hover{
color: white;
}
.diagonal-box {
position: relative;
}
.diagonal-box:before {
position: absolute;
top: 0;
right: 0;
left: 0;
bottom: 0;
background-image: linear-gradient(45deg, #654ea3, #eaafc8);
transform: skewY(-11deg);
}
.content {
max-width: 50em;
margin: 0 auto;
position: relative;
}
.diagonal-box {
background-image: linear-gradient(45deg, #654ea3, #eaafc8);
transform: skewY(-11deg);
}
.content {
max-width: 50em;
margin: 0 auto;
transform: skewY(11deg);
}
.img-tranx1{
transform: skewX(-11deg);
position: relative;
right: 48px;
filter: grayscale(100%);
width: 195px;
height: 336px;
overflow: hidden;
z-index: 2;
transition: 0.5s;
}
.img-tranx1 img{
transform: skewX(11deg);
filter: brightness(100%);
}
.img-tranx1-sm{
filter: brightness(60%);
width: 230px;
height: 450px;
}
.img-tranx1:hover img{
filter: brightness(0%) !important;
}
.img-tranx1:hover{
filter: grayscale(0%);
}
.x1:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
color: black !important;
}
.x2:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
}
.x3:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
}
.input-group{
border-bottom: 1px solid;
}
.x4:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
}
.x5:hover{
filter: brightness(100%);
transition: 0.3s;
cursor: pointer;
}
.t1-active{
text-shadow: #fff 0px 0px 6px;
color: black;
}
.footer{
background: #000000;
padding: 20px;
}
.form-control-contact{
background: none;
border: none;
padding: 0px;
color: white;
}
.send{
background-color: #dc960f;
padding: 0px 15px 0px 15px;
position: relative;
top: -8px;
margin-left: auto;
}
.send:hover{
color: white;
text-decoration: none;
}
.menu-item{
position: absolute;
width: 185px;
height: 640px;
background-color: #000000b8;
top: 0px;
text-align: center;
color: white;
padding-top: 30px;
z-index: 0;
}
.menu-item-sm{
position: absolute;
width: 100px;
height: 640px;
background-color: #000000b8;
top: 0px;
text-align: center;
color: white;
padding-top: 30px;
z-index: 0;
}
.thico{
border-top: 1px solid white;
border-bottom: 1px solid white;
font-size: 13px;
width: 68px;
margin: auto;
margin-top: 1px;
}
.header-line::before {
content: '';
position: absolute;
left: 0;
top: 40%;
transform: translateY(-50%);
width: 100%;
height: 5px;
background-color: #fff;
}
.header-line::after {
content: '';
position: absolute;
left: 0;
top: 60%;
transform: translateY(-50%);
width: 100%;
height: 5px;
background-color: #fff;
}
.text-pd-sm{
color: white;
position: relative;
top: -150px !important;
font-weight: 700;
font-size: 20px;
display: grid;
}
.MultiCarousel { float: left; overflow: hidden; padding: 15px; width: 100%; position:relative; }
.MultiCarousel .MultiCarousel-inner { transition: 1s ease all; float: left; }
.MultiCarousel .MultiCarousel-inner .item { float: left;}
.MultiCarousel .MultiCarousel-inner .item > div { text-align: center; padding:10px; height: 75px; margin:10px; color:#000000c9;}
.MultiCarousel .leftLst, .MultiCarousel .rightLst { position:absolute;top:calc(50% - 30px); }
.MultiCarousel .leftLst {
}
.MultiCarousel .rightLst {}
.MultiCarousel .leftLst.over, .MultiCarousel .rightLst.over { pointer-events: none; background:#ccc; }