body,html{}
<!--body{font-family: 'Josefin Sans', 'SolaimanLipi', sans-serif; font-weight: normal; background: #fff; line-height: 1.5; color: #000; position: relative; height: 100%; overflow-x: hidden; margin-top: 84px; font-size: 18px; overflow-x: hidden}-->
body{font-family: 'Josefin Sans', 'Ganashakti', sans-serif; font-weight: normal; background: #fff; line-height: 1.5; color: #000; position: relative; height: 100%; overflow-x: hidden; margin-top: 84px; font-size: 18px; overflow-x: hidden}
.light{font-weight: 300}
.regular{font-weight: normal}
.medium{font-weight: 500}
.semibold{font-weight: 600}
.bold{font-weight: bold}
.heavy{font-weight: 900}
p{margin-bottom: 20px; text-align: justify}
b,strong{font-weight: 500}
h1,h2,h3,h4,h5,h6{font-family: 'Lobster Two', 'Ganashakti'; font-weight: 400}
h1{font-size:48px; margin-bottom: 20px}
h2{font-size:40px; margin-bottom: 20px;}
h2 span{font-weight: normal; color:#28398b }
h3{font-size:32px;margin-bottom: 20px}
h4{font-size:26px;margin-bottom: 20px}
h5{font-size:22px;margin-bottom: 15px}
h6{font-size:20px;margin-bottom: 15px}
h2.title{color: #777}

.go-to-top{position:fixed; bottom:20px; right:20px; display:none; z-index:700}
.go-to-top img{width:30px; height:30px;}

.mb-50{margin-bottom: 50px;}
.text-white{color: #fff!important}
.text-black{color: #000!important}
.text-light{color: #777!important}
.text-grey{color: #999!important}
.lead{margin-bottom: 24px; font-weight: 400; font-size: 22px}
ul{padding: 0; margin: 0}
ul li{list-style: none}
a:hover,a:focus,a:active, button:hover,button:focus,button:active{outline: 0;}
button,a{outline: none; outline: 0}
.btn-link:hover,.btn-link:focus,.btn-link:active{text-decoration: none}
.btn:focus{box-shadow: none!important}
.btn {font-weight: 500}
.btn i{margin-left: 30px;}
.btn-primary{background: #2496d5; border-radius: 22px; padding: 10px 25px; border:2px solid #2496d5; color: #fff; transition: ease-in-out 0.3s}
.btn-primary:hover{background: #fff;border:2px solid #2496d5; color: #2496d5}
a{color: #2496d5}
.mb-80{margin-bottom: 80px!important; top:90px;}
.mb-40{margin-bottom: 40px;}
.font-18{font-size: 18px;}
.btn-link{color: #2496d5; transition: ease-in-out 0.3s; font-weight: 500}
.btn-link:hover{color: #1f3b5e}
.borderless td, .borderless th {border: none;}
.owl-theme .owl-nav{position: absolute; top: 50%; left: 0; right: 0; transform: translateY(-40%); z-index: 5}
.owl-theme .owl-dots .owl-dot span{width: 14px ; height: 14px; border-radius: 50%; margin: 5px; background: #ccc}
.owl-theme .owl-dots .owl-dot.active span{background: #5f2b52}
.owl-prev{position: absolute; left: 60px; top: 50%; transform: translateY(-50%)}
.owl-next{position: absolute; right: 60px; top: 50%; transform: translateY(-50%)}

#projects .owl-prev{left: 0}
#projects .owl-next{right: 0}

#bannerhome .owl-prev{left: 60px;}
#bannerhome .owl-next{right: 60px;}

.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{width: 36px; height: 36px; background: rgba(0,0,0,0.5); color: #fff; z-index: 100; border-radius: 50%; line-height: 42px}
.owl-carousel .owl-nav button.owl-next:hover, .owl-carousel .owl-nav button.owl-prev:hover{background: rgba(0,0,0,.9); color: #fff;}
.navbar-light .navbar-nav .nav-link{padding:30px 20px; color: #28398b; font-size: 16px; font-weight: 500; text-transform: uppercase; transition: ease-in-out 0.2s; background: transparent; border-bottom: 2px solid transparent}
.navbar-light .navbar-nav .active .nav-link:hover,.navbar-light .navbar-nav .nav-link:hover,.navbar-light .navbar-nav .nav-link:active,.navbar-light .navbar-nav .nav-link:focus{color: #fff;}
.navbar-light .navbar-nav .active .nav-link{color: #28398b; border-color: #28398b}
.navbar{background: rgba(175,138,85,0.8); padding-top: 0; padding-bottom: 0; transition: ease-in-out 2s}
.navbar.fixed{background: rgba(175,138,85,0.95); box-shadow:0 5px 5px -3px #555; z-index: 2000; position: fixed;left: 0;right: 0;top: 0; height: 84px; }
.navbar .navbar-brand {padding: 0; }
.navbar .navbar-brand img{transition: ease-in-out 0.4s; max-width: 112px;}
.navbar.fixed .navbar-brand img{max-width: 112px;}

.text-blue{color: #243465;}
.btn-blue{padding: 8px 25px; background: #243465; border: 2px solid #af8a55; color: #fff; transition: ease-in-out 0.2s}
.btn-blue:hover{padding: 8px 25px; background: #af8a55; border: 2px solid #af8a55; color: #fff;}

.btn-gold{padding: 8px 25px; background: #fff; border: 2px solid #af8a55; color: #af8a55; transition: ease-in-out 0.2s}
.btn-gold:hover{padding: 8px 25px; background: #af8a55; border: 2px solid #af8a55; color: #fff;}
.details-video{width: 100%; height: auto; border: 6px solid rgba(175,138,85,1);}
#sliderhome .item{position: relative}
#sliderhome .item .content{position: absolute; left: 0; bottom: 20px; z-index: 6; background: rgba(95,43,82,0.8); color: #fff; padding: 20px; text-align: left}
#sliderhome .item .content h2{margin: 0}
#sliderhome .owl-dots{position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); z-index: 7;}
#sliderhome p{font-size: 20px; margin: 0}

.stickymenu{position: fixed; top: 50%; transform: translateY(-50%); right: 0; z-index: 10; background: #fff; padding:10px 15px; width: 250px; margin-right: -194px; transition: ease-in-out 0.3s; font-size: 16px}
.stickymenu:hover{margin-right: 0}
.stickymenu ul{padding: 0; margin: 0}
.stickymenu ul li {display: block; margin: 5px 0}
.stickymenu ul li a{color: #af8a55; display: block}
.stickymenu ul li a:hover{text-decoration: none; color: #243465}
.stickymenu ul li a i{width:30px; height: 30px; border: 2px solid #af8a55; font-size: 24px; margin-right: 12px}

.electronics{background: #0f1d40; color: #fff}
.electronics .nav .nav-item:nth-child(2){margin: 20px 0}
.electronics .nav-link{background: #9c795b; color: #f4e2bc; padding: 40px; font-size: 20px; line-height: 1}
.electronics .nav-link.active{background: #d4b984; color: #8d6e59; padding: 40px; font-size: 20px; position: relative}
.electronics .nav-link.active:after{position: absolute; content: ''; z-index: 5; right: -20px; top: 50%; transform: translateY(-50%); background: url(../images/arrow.png); width: 21px; height: 41px}
.electronics .tab-content{position: relative; padding: 0}
.electronics .tab-content .frame{position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 5}

.video-icon{position: relative}
.video-icon a{position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); z-index: 7}

.projects{background: #243465;}
.projects h2{text-shadow: -2px 2px 4px rgba(0, 0, 0, 0.9), 2px -2px 0 rgba(255, 255, 255, 0.1); } 

#projects .card{border: 0; background: #d6b069; color: #243465; transition: ease-in-out 0.3s}
#projects .card:hover{text-decoration: none; color: #fff;}
#projects .card img{opacity: 1;transition: ease-in-out 0.3s}
#projects .card:hover img{opacity: 0.6}
#projects .card p{color: #333; margin: 0; font-size: 15px}

.connect{background: url(../images/connect.jpg) fixed center; padding: 200px 20px}
.connect2{display: block; width: 100%; max-width: 300px; margin: 0 auto; background: #343434; color: #fff; padding: 15px 20px; text-align: center; font-size: 24px; margin-bottom: -30px; position: relative}
.connect2:after {position: absolute; content: ''; top: -3px; right: -3px; bottom: -3px; left: -3px; border: 2px solid #555;}

.alliances{background-image: url(../images/al_left.png), url(../images/al_right.png); background-position: bottom left, bottom right; background-repeat: no-repeat; height: 180px; padding: 40px 0}
.alliances-wrapper{display: block; margin-left: 320px; margin-right: 41px;}
#alliances img{height: 100px; width: auto; margin: 0 auto}

.social{background: #343434; text-align: center; padding: 30px 0}
.social a{display: inline-block; margin: 0 5px}

.home-reviews{background: #f0e8dc}

footer{background: #504e42; color: #fff;}
footer .logo-footer{margin: 0 0 80px; max-width: 150px; margin-top:30px;}
footer h3{margin: 40px 0 ;}
footer hr{border-color: #f4e2bc}

footer ul{}
footer ul li{}
footer ul li a{display: block; padding: 0 0 8px 0; color: #fff; transition: ease-in-out 0.2s}
footer ul li a:hover{color: #57c2ff; text-decoration: none}
footer .form-control{border-radius: 0; min-height: 44px}
footer .form-group{margin-bottom: 5px}
footer form{margin-top: 10px; display: block}

.static-banner{position: relative;min-height: 150px; height: 35vh; overflow: hidden; background-position: bottom center; background-size: cover; margin-bottom: 40px;box-shadow: 0 20px 40px -15px #999; border-bottom: 1px solid #fff}
.static-banner.about{background-image: url(../images/banners/1.jpg)}
.static-banner.projects{background-image: url(../images/banners/2.jpg)}
.static-banner.projectDtls{background-image: url(../images/banners/3.jpg)}
.static-banner.contact{background-image: url(../images/banners/4.jpg)}
.static-banner.client{background-image: url(../images/banners/5.jpg)}
.static-banner.team{background-image: url(../images/banners/6.jpg)}

.static-banner h2{position: absolute;text-align: center;top: 50%; left: 50%; transform: translate(-50%,-50%); color: #fff; text-shadow: 0 2px 2px #28398b; z-index: 5;margin: 0;font-weight: normal; display: inline-block }
.static-banner h2:after{content: ''; position: absolute; bottom: -5px; left: 25%; right: 25%; height: 3px; background: #28398b}
.w-200{width: 200px}

.page-projects .card{border: 0; background: #d6b069; color: #243465; transition: ease-in-out 0.3s}
.page-projects .card:hover{text-decoration: none; color: #fff;}
.page-projects .card img{opacity: 1;transition: ease-in-out 0.3s}
.page-projects .card:hover img{opacity: 0.6}
.page-projects .card p{color: #333; margin: 0; font-size: 15px}

.gallery {position: relative}
.gallery i{position: absolute; top:-20%; right: 50%; z-index: 100; font-size: 30px; color: #000; transition: all 0.3s; transform: translate(50%,-50%); opacity: 0}
.gallery:hover i{top:50%; opacity: 1}
.gallery p{position: absolute; bottom:-20px; left: 0; right: 0; text-align: center; margin: 0; z-index: 101; font-size: 14px; color: #000; text-transform: uppercase; font-weight: 600; transition: all 0.3s; opacity: 0}
.gallery:hover p{bottom:20px; opacity: 1}
.gallery img{width: 100%; height: auto; transition: all 0.3s}
.gallery:hover img{opacity: 0.5;}
.gallery img{width: 100%; height: auto}

.alliance {position: relative}
.alliance i{position: absolute; top:-20%; right: 50%; z-index: 100; font-size: 30px; color: #000; transition: all 0.3s; transform: translate(50%,-50%); opacity: 0}
.alliance:hover i{top:50%; opacity: 1}
.alliance p{position: absolute; bottom:-20px; left: 0; right: 0; text-align: center; margin: 0; z-index: 101; font-size: 14px; color: #000; text-transform: uppercase; font-weight: 600; transition: all 0.3s; opacity: 0}
.alliance:hover p{bottom:20px; opacity: 1}
.alliance img{height: 70px; width: auto; transition: all 0.3s; margin: 0 auto; display: block}
.alliance:hover img{opacity: 0.5;}

.teamitem {position: relative; display: block; overflow: hidden}
.teamitem img{width: 100%; height: auto; transition: all 0.3s}
.teamitem .btn{position: absolute; top:-20%; right: 50%; z-index: 100; font-size: 30px; color: #000; transition: all 0.3s; transform: translate(50%,-50%); opacity: 0;padding: 9px 15px 3px; border-radius: 50%;}
.teamitem:hover .btn{top:80%; opacity: 1}
.teamitem .btn i{margin: 0; color: #fff}
.teamitem .btn:hover i{color: #000}

@media screen and (min-width: 1250px){
.container-fluid{padding-left: 50px;padding-right: 50px;}
}

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

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

@media screen and (max-width: 1199px){
.navbar .navbar-brand img,.navbar.fixed .navbar-brand img{max-width: 90px}
.navbar .container{width: 100%; max-width: 100%}
.navbar-light .navbar-nav .nav-link{padding: 30px 15px}
}

@media screen and (max-width: 1024px){
.container{width: 100%; max-width: 100%}
}

@media screen and (max-width: 991px){
.navbar-toggler{position: absolute; right: 10px; top: 18px; border-color: #fff!important}
.navbar-toggler i{color: #fff!important}
.navbar-collapse{position: absolute; top: 100%; left: 0; right: 0px; background: #af8a55; padding-top: 10px; padding-bottom: 10px}
.navbar-light .navbar-nav .nav-link{padding: 10px 20px; text-align: center}

.electronics .nav .nav-item:nth-child(2){margin: 0}
.electronics .nav {display: block; text-align: center; margin-top: 40px}
.electronics .nav .nav-item{display: inline-block; text-align: center; width: 30%}
.electronics .nav .nav-link{padding: 30px 20px}
.electronics .nav-link.active:after{display: none}
.electronics .nav-link.active:before{position: absolute; content: ''; z-index: 5; top: -20px; left: 50%; transform: translateX(-50%); background: url(../images/arrow2.png); height: 21px; width: 41px}
}

@media screen and (max-width: 767px){
body{margin-top: 65px}
}

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

@media screen and (max-width: 575px){
.electronics .nav .nav-item{display: block; text-align: center; width: 100%; margin: 2px 0}
.electronics .nav-link.active:before{display: none}
.electronics .nav {margin-top: 25px}
.alliances{background-image: url(../images/al_left.png), url(../images/al_right.png); background-position: top left, bottom right; background-repeat: no-repeat; background-color: #28398b; height: auto; padding: 250px 0 20px}
.alliances-wrapper{display: block; margin-left: 20px; margin-right: 20px; background: #fff; padding: 20px}
#sliderhome .item .content{position: relative; bottom: 0; text-align: center; padding: 10px 0}
#sliderhome .item .content p{text-align: center; margin-bottom: 35px}
#sliderhome .item .content h3{font-size: 24px; margin-bottom: 5px}
.whyus {text-align: center}
.video {text-align: center}
.connect, .connect p{text-align: center;}
footer{text-align: center}
video{height: 200px!important}
body{margin-top: 65px}
}

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

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

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

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