html {
overflow-x: hidden;
}
* {
font-family: "poppins", sans-serif !important;
}
:root{
--color-: #092f57;
}
.sendmail-btn {
background: var(--color-);
border-radius: 5px;
color: #fff;
float: inline-end;
font-size: 16px;
border-radius: 30px;
}
.sendmail-btn:hover {
color: #fff;
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
.about-btn {
padding: 10px 20px;
}
.about-us-section,
.home-service-section {
padding: 100px 0px 100px 0px;
}
.home-gallery-section {
padding: 50px 0px 100px 0px;
}
.gfc-title {
font-weight: 700;
font-size: 32px;
line-height: 48px;
color: var(--color-);
position: relative;
}
.gfc-para {
font-weight: 400;
font-size: 16px;
line-height: 31px;
text-align: justify;
color: #000000 !important;
}
.about-list > li {
font-size: 15px;
font-weight: 400;
line-height: 31px;
text-align: justified;
}
.home-about-content {
padding: 0px 50px;
}
.copy-txt {
font-size: 14px;
text-align: end;
color: #fff !important;
}
.span {
font-size: 16px;
font-weight: 600;
}
ul.acanav li a {
display: flex;
gap: 8px;
font-size: 14px;
}
.open-time {
color: #fff;
display: flex;
gap: 8px;
align-items: center;
font-size: 15px;
}
.logoimg {
max-width: 300px !important;
margin-right: 20px;
border-radius: 20px;
height: 130px !important;
object-fit: cover;
}
.nav-head {
position: absolute;
top: 0;
z-index: 999;
left: 0;
right: 0;
background: transparent !important;
}
.design47-nav {
background-color: transparent;
/* border-bottom: 1px solid rgba(255, 255, 255, 0.5); */
}
.gfc-navbar > li > a {
color: #fff;
}
.nav-item > .nav-link {
font-weight: 400;
font-size: 16px;
}
.text-right > p {
justify-content: end;
}
.home-header {
font-weight: 700;
font-size: 36px;
color: #ffd44a;
margin-bottom: 20px;
text-align: left;
}
.home-header-info {
font-size: 16px;
font-weight: 400;
color: #fff;
/* padding: 0px 50px; */
text-align: justify;
line-height: 2;
max-width: 580px;
}
.inner-nav-head {
position: relative;
}
.carousel-caption {
text-align: center;
position: absolute;
top: 35%;
}
.caption-inner {
max-width: 647px;
/* margin: 0 auto; */
}
.home-header > span {
color: #ffffff !important;
font-size: 26px;
font-weight: 600;
display: block;
margin-top: 10px;
}
.list-inline > li > a {
font-size: 16px !important;
}
.list-inline > .list-inline-item {
font-size: 16px !important;
}
.mm-navbar {
background-color: #041f32 !important;
}
.mm-listitem_selected {
color: #041f32 !important;
}
.mm-navbar__title{
color: #fff !important;
}
.titleimage > img {
display: block;
}
.about-content {
padding-left: 150px;
}
.contact-info-txt {
font-size: 16px;
font-weight: 400;
line-height: 29px;
text-align: left;
}
footer {
padding-top: 30px;
padding-bottom: 0px;
}
.footer-left {
margin-top: 20px;
}
.home-about-image > .about-img {
position: relative;
border-radius: 30px;
}
.home-about-image > .about-img-one {
position: absolute;
bottom: -15%;
left: 6%;
z-index: -1;
}
.home-about-image > .about-img-two {
position: absolute;
bottom: -15%;
right: -20%;
z-index: 9999;
border-radius: 30px;
width: 400px;
}
.service-block-img {
display: flex;
justify-content: center;
}
.service-content > h3 {
font-size: 20px;
font-weight: 600;
line-height: 30px;
text-align: center;
color: #000;
max-width: 300px;
margin: 0 auto;
margin-bottom: 16px;
}
.service-content > p {
font-size: 15px;
text-align: center;
padding: 0px 20px;
height: 120px;
}
.service-btn {
font-size: 15px;
color: #092f57;
font-weight: 500;
}
.img-wrapper {
max-width: 400px;
}
.owl-prev {
position: absolute;
left: -9%;
top: 45%;
background-color: transparent !important;
}
.owl-next {
position: absolute;
top: 45%;
right: -4%;
background-color: transparent !important;
}
.footer-content > h3,
.quick-lnk > div > h3 {
font-size: 20px;
font-weight: 500;
line-height: 29px;
text-align: left;
color: #fff;
}
.footer-contact-info {
font-size: 16px;
font-weight: 500;
text-align: left;
color: #fff;
}
/* .quick-lnk {
display: flex;
justify-content: center;
} */
.quick-links {
list-style-type: none;
padding: 0px;
columns: 2;
width: 100%;
}
.quick-links > li > a {
font-size: 16px;
font-weight: 500;
line-height: 29px;
color: #fff;
text-decoration: none;
}
.social > h3 {
text-align: left;
}
.social > div {
justify-content: end;
}
.footer-hr {
border-top: 1px solid rgba(255, 255, 255, 0.5);
margin-bottom: 0px !important;
}
.footer-info-txt {
font-weight: 400;
font-size: 14px;
line-height: 26px;
color: #ffffff;
margin-bottom: 0px !important;
padding: 10px 0px;
}
@media (min-width: 1400px) {
.container {
max-width: 1300px !important;
}
}
@media (max-width: 1399px) and (min-width: 1200px) {
.carousel-caption {
left: 10%;
top: 33%;
}
.home-header {
font-size: 32px !important;
}
.about-content {
padding-left: 100px;
}
}
@media (min-width: 1200px) {
.phone-break {
display: none;
}
}
@media (max-width: 1199px) and (min-width: 350px) {
.slider-btn {
display: none !important;
}
}
@media (max-width: 1199px) and (min-width: 992px) {
.home-header {
font-size: 28px !important;
}
.gfc-title {
font-size: 30px;
}
.home-about-image {
padding: 0px 0px;
}
.about-content {
padding-left: 80px;
}
.service-bdr {
max-width: 265px;
}
.sendmail-btn {
margin-top: 20px;
}
.phone-break {
display: block;
}
.home-about-content {
padding: 0px 30px;
}
.home-about-image > .about-img-one {
bottom: 32%;
left: 6%;
}
.home-about-image > .about-img-two {
bottom: 31%;
right: -18%;
}
}
@media (max-width: 991px) and (min-width: 768px) {
.nav-head {
position: relative !important;
}
.carousel-caption {
text-align: center !important;
top: 20%;
}
.home-header {
font-size: 29px !important;
}
.caption-inner {
max-width: 100%;
}
.gfc-title {
font-size: 30px;
}
.home-contact-flex > img {
max-width: 550px;
}
.home-about-image-show > .about-img {
position: relative;
}
.home-about-image-show > .about-img-two {
position: absolute;
bottom: -24%;
right: -8%;
z-index: 9999;
}
.home-about-image-show > .about-img-one {
position: absolute;
bottom: -18%;
left: 9%;
z-index: -1;
}
.service-block-md{
margin-top: 80px;
}
.home-service-section {
padding: 100px 0px 0px 0px;
}
}
@media (max-width: 767px) and (min-width: 576px) {
.nav-head {
position: relative !important;
}
.carousel-caption {
text-align: center !important;
top: 20%;
}
.home-header {
font-size: 25px !important;
}
.home-header-info {
font-size: 14px;
padding: 0px 0px;
}
.caption-inner {
max-width: 100%;
}
.gfc-title {
font-size: 30px;
}
.service-block-sm{
margin-top: 70px;
}
.home-service-section {
padding: 100px 0px 0px 0px;
}
.home-about-image-show > .about-img {
position: relative;
}
.home-about-image-show > .about-img-two {
position: absolute;
bottom: -24%;
right: 1%;
z-index: 9999;
}
.home-about-image-show > .about-img-one {
position: absolute;
bottom: -18%;
left: 9%;
z-index: -1;
}
.quick-lnk{
display: none;
}
}
@media (max-width: 575px) and (min-width: 420px) {
.nav-head {
position: relative !important;
}
.home-header {
font-size: 25px !important;
}
.home-header-info {
display: none;
}
.caption-inner {
max-width: 100%;
}
.carousel-caption {
display: none;
}
.service-margin-right {
margin-right: 5px;
}
.service-margin-bottom {
margin-bottom: 5px;
}
.home-about-image-show > .about-img {
position: relative;
}
.home-about-image-show > .about-img-two {
position: absolute;
bottom: -24%;
right: 0%;
z-index: 9999;
max-width: 350px;
}
.home-about-image-show > .about-img-one {
position: absolute;
bottom: -18%;
left: 9%;
z-index: -1;
}
.img-wrapper {
max-width: 320px;
margin: 0 auto;
}
}
@media (max-width: 575px) and (min-width: 350px) {
.gfc-title::before {
width: 95px;
}
.gfc-title {
font-size: 28px;
}
.quick-lnk{
display: none;
}
.service-block-sm{
margin-top: 50px;
}
.home-service-section {
padding: 100px 0px 0px 0px;
}
}
@media (max-width: 419px) and (min-width: 350px) {
.caption-inner {
max-width: 100%;
}
.carousel-caption {
display: none;
}
.service-bdr {
max-width: 170px;
}
.contact-info {
width: auto;
margin-right: 10px !important;
font-size: 16px;
}
.caption {
background-color: #f3f6f6;
padding: 10px 0px;
min-height: 87px;
display: flex;
justify-content: center;
align-items: center;
}
.caption > h4 {
color: #000;
font-size: 15px;
line-height: 22pt;
text-align: center;
font-weight: 400;
padding: 0px 20px;
}
.logoimg {
margin-right: 15px !important;
}
.home-about-image-show > .about-img {
position: relative;
}
.home-about-image-show > .about-img-two {
position: absolute;
bottom: -30%;
right: 3%;
z-index: 9999;
max-width: 300px;
}
.home-about-image-show > .about-img-one {
display: none;
}
.img-wrapper {
max-width: 320px;
margin: 0 auto;
}
}
@media (max-width: 599px) and (min-width: 576px) {
.carousel-caption {
text-align: left !important;
top: 3%;
}
}
@media (min-width: 992px) {
.home-about-image-show {
display: none;
}
}
@media (max-width: 991px) and (min-width: 350px) {
.nav-head {
position: relative !important;
background-color: #0b4770 !important
}
.top_row {
display: none !important;
}
.home-about-image {
display: none;
}
.home-about-image-show {
margin-top: 20px;
}
.about-us-section {
padding: 70px 0px 70px 0px;
}
.sendmail-btn {
margin-top: 20px;
margin-bottom: 50px;
}
.home-service-flex {
justify-content: center;
}
.home-contact-flex {
display: flex;
justify-content: center;
margin-bottom: 50px;
}
.breakhide {
display: none !important;
}
.home-about-content {
padding: 0px 0px;
}
.logotitle {
color: #33a7b1 !important;
font-size: 20px !important;
}
.copy-txt {
text-align: start;
}
.footer-txt {
text-align: start;
}
.hidemedium {
display: none !important;
}
.about-content {
padding-left: 0px !important;
}
.hidebr {
display: none !important;
}
.social > h3 {
text-align: left;
}
.social > div {
justify-content: start;
}
.social{
margin-top: 20px;
}
}
@media(max-width: 1700px){
.owl-next, .owl-prev{
display: none !important;
}
}
/* =========================================
HOME HERO CAROUSEL
========================================= */
.homeCarousel {
position: relative;
overflow: hidden;
}
.homeCarousel .carousel-item {
position: relative;
height: 700px;
}
.homeCarousel .carousel-item img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
/* Dark overlay */
.homeCarousel .carousel-item::after {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(
to right,
rgba(0, 0, 0, 0.65) 0%,
rgba(0, 0, 0, 0.40) 45%,
rgba(0, 0, 0, 0.10) 100%
);
z-index: 1;
}
/* Caption */
.homeCarousel .carousel-caption {
position: absolute;
z-index: 2;
top: 55%;
left: 0;
right: 0;
transform: translateY(-50%);
padding: 0;
text-align: left;
}
/* Content width */
.homeCarousel .caption-inner {
width: 100%;
max-width: 650px;
}
.homeCarousel .home-header-info:last-child {
margin-bottom: 0;
}
/* =========================================
LARGE DESKTOP
========================================= */
@media (min-width: 1400px) {
.homeCarousel .carousel-item {
height: 760px;
}
.homeCarousel .caption-inner {
max-width: 700px;
}
}
/* =========================================
LAPTOP
========================================= */
@media (max-width: 1399px) {
.homeCarousel .carousel-item {
height: 680px;
}
.homeCarousel .caption-inner {
max-width: 600px;
}
}
/* =========================================
TABLET
========================================= */
@media (max-width: 991px) {
.homeCarousel .carousel-item {
height: 600px;
}
.homeCarousel .carousel-caption {
top: 50%;
padding: 0 40px;
}
.homeCarousel .caption-inner {
max-width: 600px;
}
.homeCarousel .home-header {
font-size: 34px;
line-height: 1.2;
}
.homeCarousel .home-header span {
font-size: 22px;
}
.homeCarousel .home-header-info {
font-size: 14px;
line-height: 1.7;
}
}
/* =========================================
MOBILE
========================================= */
@media (max-width: 767px) {
.homeCarousel .carousel-item {
height: 520px;
}
.homeCarousel .carousel-item img {
object-position: center;
}
.homeCarousel .carousel-caption {
top: 50%;
left: 0;
right: 0;
padding: 0 25px;
transform: translateY(-50%);
text-align: left;
}
.homeCarousel .caption-inner {
max-width: 100%;
}
.homeCarousel .home-header {
margin-bottom: 15px;
font-size: 28px;
line-height: 1.15;
}
.homeCarousel .home-header span {
margin-top: 6px;
font-size: 19px;
line-height: 1.3;
}
.homeCarousel .home-header-info {
margin-bottom: 10px;
font-size: 13px;
line-height: 1.65;
}
}
@media (max-width: 575px) {
.homeCarousel .carousel-item {
height: 250px;
}
.homeCarousel .carousel-caption {
padding: 0 20px;
}
.homeCarousel .home-header {
margin-bottom: 12px;
font-size: 24px;
line-height: 1.2;
}
.homeCarousel .home-header span {
font-size: 17px;
line-height: 1.35;
}
.homeCarousel .home-header-info {
font-size: 12px;
line-height: 1.6;
}
}
/* =========================================
VERY SMALL MOBILE
========================================= */
@media (max-width: 420px) {
.homeCarousel .carousel-item {
height: 480px;
}
.homeCarousel .carousel-caption {
padding: 0 18px;
}
.homeCarousel .home-header {
font-size: 22px;
}
.homeCarousel .home-header span {
font-size: 16px;
}
.homeCarousel .home-header-info {
font-size: 12px;
line-height: 1.55;
}
}
/* ****************** Header ****************** */
ul.navbar-nav.gfc-navbar.ml-auto {
gap: 40px;
}
nav.navbar.navbar-expand-lg.design47-nav {
padding: 10px 0;
}
.header {
position: relative;
top: 0;
left: 0;
width: 100%;
z-index: 99999;
}
.nav-background {
position: relative;
width: 100%;
z-index: 99999;
}
.nav-head, .menu {
position: relative;
z-index: 99999;
background: #ffffff;
}
.design47-nav {
position: relative;
z-index: 99999;
display: flex;
align-items: center;
}
/* Logo */
.design47-nav .navbar-brand {
position: relative;
z-index: 100000;
display: flex;
align-items: center;
}
.design47-nav .logoimg {
display: block;
max-width: 100%;
/* border-radius: 100px; */
height: auto;
/* width: 100px; */
}
#navbarSupportedContent {
position: relative;
z-index: 100000;
}
.gfc-navbar {
margin-left: auto;
}
.innerPageBanner-wrapper {
position: relative;
z-index: 1;
}
#innerPageBanner {
position: relative;
z-index: 1;
}
#innerPageBanner .banner-overlay {
position: absolute;
inset: 0;
z-index: 2;
}
#innerPageBanner .container {
position: relative;
z-index: 3;
}
.carousel-item {
height: 700px;
}
@media (max-width: 991.98px) {
.header {
position: relative;
}
}
/* ***************************** Home ******************************* */
.about-section {
padding: 120px 0;
background: #f7f7f7;
}
.about-image-wrapper {
position: relative;
padding-right: 40px;
}
.about-image-wrapper::after {
content: "";
position: absolute;
right: 0;
bottom: -30px;
width: 180px;
height: 180px;
background: #ffd23d;
z-index: 0;
}
.about-image {
position: relative;
z-index: 1;
display: block;
width: 100%;
height: 600px;
object-fit: cover;
}
.about-content {
max-width: 600px;
padding-left: 45px;
}
.about-subtitle {
display: inline-block;
margin-bottom: 10px;
color: #d9a707;
font-size: 22px;
font-weight: 600;
letter-spacing: 1px;
}
.about-content h2 {
margin: 0 0 25px;
color: #161616;
/* font-size: clamp(36px, 4vw, 58px); */
font-weight: 600;
line-height: 1.2;
letter-spacing: -1.5px;
}
.about-content h2 span {
color: #ddaf1c;
}
.about-company {
margin-bottom: 25px;
color: #161616;
font-size: 20px;
font-weight: 600;
line-height: 1.5;
}
.about-content p:not(.about-company) {
margin-bottom: 16px;
color: #3a3a3a;
font-size: 16px;
line-height: 2;
text-align: justify;
}
.about-line {
width: 100%;
height: 1px;
margin: 35px 0 25px;
background: #ddd;
}
.about-values {
display: flex;
gap: 60px;
}
.about-values > div {
display: flex;
flex-direction: column;
gap: 6px;
}
.about-values strong {
color: #161616;
font-size: 16px;
font-weight: 600;
}
.about-values span {
color: #777;
font-size: 14px;
line-height: 1.5;
}
.about-images {
position: relative;
width: 100%;
max-width: 560px;
min-height: 560px;
margin: 0 auto;
}
.about-image-main {
width: 78%;
height: 480px;
overflow: hidden;
}
.about-image-main img,
.about-image-small img {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.about-image-small {
position: absolute;
right: 0;
bottom: 0;
width: 48%;
height: 300px;
overflow: hidden;
border: 12px solid #f7f7f7;
}
.about-image-main img,
.about-image-small img {
transition: transform 0.5s ease;
}
.about-image-main:hover img,
.about-image-small:hover img {
transform: scale(1.05);
}
/* Tablet */
@media (max-width: 991px) {
.about-images {
margin-bottom: 60px;
}
.about-content {
padding-left: 0;
}
}
/* Mobile */
@media (max-width: 575px) {
.about-images {
min-height: 430px;
}
.about-image-main {
width: 82%;
height: 370px;
}
.about-image-small {
width: 50%;
height: 220px;
border-width: 8px;
}
}
/* ================================
Responsive
================================ */
@media (max-width: 991px) {
.about-section {
padding: 80px 0;
}
.about-image-wrapper {
padding-right: 20px;
margin-bottom: 60px;
}
.about-image {
height: 500px;
}
.about-content {
max-width: 100%;
padding-left: 0;
}
.about-content h2 {
font-size: clamp(34px, 7vw, 50px);
}
}
@media (max-width: 575px) {
.about-section {
padding: 60px 0;
}
.about-image-wrapper {
padding-right: 10px;
margin-bottom: 45px;
}
.about-image-wrapper::after {
width: 100px;
height: 100px;
bottom: -20px;
}
.about-image {
height: 380px;
}
.about-content h2 {
font-size: 28px;
letter-spacing: -1px;
line-height: 1.3;
}
.about-company {
font-size: 17px;
}
.about-content p:not(.about-company) {
font-size: 15px;
line-height: 1.7;
}
.about-values {
flex-direction: column;
gap: 20px;
}
}
.products-section {
padding: 90px 0 100px;
background: #ffffff;
}
.products-heading {
max-width: 700px;
margin: 0 auto 60px;
}
.products-subtitle {
display: inline-block;
margin-bottom: 10px;
color: #d9a707;
font-size: 22px;
font-weight: 600;
letter-spacing: 1px;
}
.products-heading h2 {
margin: 0 0 20px;
color: #161616;
/* font-size: clamp(38px, 5vw, 60px); */
font-weight: 600;
line-height: 1.1;
letter-spacing: -1.5px;
}
.products-heading h2 span {
color: #e5b61e;
}
.products-heading p {
max-width: 600px;
margin: 0 auto;
color: #2a2a2a;
font-size: 16px;
line-height: 1.8;
}
.product-item {
height: 100%;
background: #f7f7f5;
overflow: hidden;
}
/* =================================
Product Image
================================= */
.product-image {
width: 100%;
height: 380px;
overflow: hidden;
}
.product-image img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
transition: transform 0.5s ease;
}
.product-item:hover .product-image img {
transform: scale(1.04);
}
/* =================================
Product Content
================================= */
.product-content {
padding: 40px;
}
.product-content h3 {
margin: 0 0 8px;
color: #d9a707;
font-size: 26px;
font-weight: 600;
line-height: 1.2;
}
.product-content h4 {
margin: 0 0 18px;
color: #303030;
font-size: 20px;
font-weight: 500;
line-height: 1.4;
}
.product-content p {
max-width: 580px;
margin: 0 0 30px;
color: #323232;
font-size: 15px;
line-height: 2;
height: 80px;
text-align: justify;
}
.product-btn {
display: inline-flex;
align-items: center;
gap: 15px;
color: #161616;
font-size: 14px;
font-weight: 600;
text-decoration: none;
transition: gap 0.3s ease;
}
.product-btn span {
color: #b38b00;
font-size: 20px;
line-height: 1;
}
.product-btn:hover {
color: #161616;
gap: 20px;
}
.product-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 14px;
padding: 13px 24px;
background: #e5b207;
color: #ffffff;
font-size: 16px;
font-weight: 500;
text-decoration: none;
transition: all 0.3s ease;
}
.product-btn span {
color: #161616;
font-size: 20px;
line-height: 1;
transition: transform 0.3s ease;
}
.product-btn:hover {
background: #161616;
color: #ffffff;
}
.product-btn:hover span {
color: #ffffff;
transform: translateX(4px);
}
/* =================================
Responsive
================================= */
@media (max-width: 991px) {
.products-section {
padding: 80px 0;
}
.products-heading {
margin-bottom: 45px;
}
.product-image {
height: 350px;
}
.product-content {
padding: 35px;
}
}
@media (max-width: 575px) {
.products-section {
padding: 60px 0;
}
.products-heading h2 {
font-size: 28px;
letter-spacing: -1px;
}
.products-heading p {
font-size: 15px;
}
.product-image {
height: 280px;
}
.product-content {
padding: 30px 25px;
}
.product-content h3 {
font-size: 23px;
}
.product-content h4 {
font-size: 17px;
}
.product-content p {
font-size: 14px;
}
}
/* ********************* Inner banner ***************** */
.innerPageBanner-wrapper {
position: relative;
width: 100%;
}
#innerPageBanner {
position: relative;
min-height: 550px;
background-size: cover;
background-position: center;
background-repeat: no-repeat;
display: flex;
align-items: center;
}
#innerPageBanner .banner-overlay {
position: absolute;
inset: 0;
background: linear-gradient(
to right,
rgb(0 0 0 / 45%) 0%,
rgb(0 0 0 / 25%) 45%,
rgb(0 0 0 / 0%) 100%
);
z-index: 1;
}
#innerPageBanner .container {
position: relative;
z-index: 2;
}
.inner_banner_wrap {
min-height: 380px;
padding-top: 80px;
padding-bottom: 50px;
}
.inner-title {
margin: 0 0 22px;
color: #fff;
font-weight: 700;
line-height: 1.2;
padding-top: 60px;
font-size: 38px;
}
.custom-breadcrumb {
display: flex;
align-items: center;
flex-wrap: wrap;
margin: 0;
padding: 0;
background: transparent;
}
.custom-breadcrumb .breadcrumb-item {
color: #fff;
font-size: 16px;
}
.custom-breadcrumb .breadcrumb-item a {
color: #fff;
text-decoration: none;
transition: 0.3s ease;
padding: 8px 16px;
border-radius: 50px;
background: #daaa19;
}
.custom-breadcrumb .breadcrumb-item a:hover {
opacity: 0.8;
}
.custom-breadcrumb .breadcrumb-item.active {
color: rgba(255, 255, 255);
}
.custom-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
color: rgba(255, 255, 255);
content: "/";
padding: 0 10px;
}
.custom-breadcrumb i {
margin-right: 5px;
font-size: 14px;
}
@media (max-width: 991.98px) {
#innerPageBanner {
min-height: 330px;
}
.inner_banner_wrap {
min-height: 330px;
padding-top: 100px;
padding-bottom: 40px;
}
}
@media (max-width: 575.98px) {
#innerPageBanner {
min-height: 240px;
}
.inner_banner_wrap {
min-height: 280px;
padding-top: 90px;
padding-bottom: 30px;
}
.inner-title {
font-size: 28px;
margin-bottom: 18px;
}
.inner-title {
padding-top: 40px;
}
.custom-breadcrumb .breadcrumb-item {
font-size: 15px;
}
}
/* ************************ About Us *********************** */
section.vision-values-section {
padding: 120px 0;
background: #fff;
}
.vision-values-section {
padding: 100px 0;
background: #f7f8f6;
}
.vision-mission-grid {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 24px;
margin-bottom: 24px;
}
.vision-card {
padding: 40px;
background: #fff;
border: 2px solid #e1e6e8;
transition: 0.3s ease;
border-radius: 20px;
}
.vision-card:hover {
border-color: #ffd23d;
transform: translateY(-4px);
}
.vision-icon {
width: 58px;
height: 58px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 28px;
background: #1d4665;
color: #ffffff;
font-size: 23px;
border-radius: 16px;
}
/* Text */
.vision-card h3 {
margin: 0 0 16px;
color: #262626;
font-size: 22px;
font-weight: 700;
}
.vision-card p {
margin: 0;
color: #404040;
font-size: 16px;
line-height: 2;
}
.values-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 18px;
}
.value-card {
padding: 30px;
background: #fff;
border: 2px solid #e1e6e8;
transition: 0.3s ease;
border-radius: 20px;
}
.value-card:hover {
border-color: #ffd23d;
transform: translateY(-4px);
}
/* Icon */
.value-icon {
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 28px;
background: #edf3f6;
color: #1d4665;
font-size: 21px;
border-radius: 10px;
}
/* Text */
.value-card h3 {
margin: 0 0 14px;
color: #262626;
font-size: 18px;
font-weight: 700;
line-height: 1.4;
}
.value-card p {
margin: 0;
font-size: 16px;
color: #383838;
line-height: 2;
}
@media (max-width: 991px) {
.vision-mission-grid {
grid-template-columns: 1fr;
}
.values-grid {
grid-template-columns: repeat(2, 1fr);
}
}
/* =========================================
Mobile
========================================= */
@media (max-width: 575px) {
.vision-values-section {
padding: 65px 0;
}
.vision-card {
padding: 30px 25px;
}
.vision-card h3 {
font-size: 20px;
}
.values-grid {
grid-template-columns: 1fr;
}
.value-card {
padding: 28px 25px;
}
}
/* about images */
.three-image-section {
padding: 100px 0;
}
.three-image-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 20px;
}
.three-image-item {
height: 400px;
overflow: hidden;
}
.three-image-item img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
transition: transform 0.5s ease;
}
.three-image-item:hover img {
transform: scale(1.04);
}
/* Tablet */
@media (max-width: 991px) {
.three-image-grid {
grid-template-columns: repeat(2, 1fr);
}
.three-image-item {
height: 350px;
}
}
/* Mobile */
@media (max-width: 575px) {
.three-image-grid {
grid-template-columns: 1fr;
}
.three-image-item {
height: 300px;
}
}
section.three-image-section {
padding: 10px 0 150px;
}
/* ********************** Rice & Corn *********************** */
.rice-product-section {
padding: 110px 0;
background: #f5f5f2;
}
.rice-images {
position: relative;
min-height: 600px;
padding-right: 80px;
padding-bottom: 70px;
}
.rice-image-main {
width: 90%;
height: 650px;
overflow: hidden;
}
.rice-image-main img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.rice-image-small {
position: absolute;
right: 0;
bottom: 0;
width: 45%;
height: 320px;
padding: 12px;
background: #ffffff;
}
.rice-image-small img {
width: 100%;
height: 100%;
display: block;
object-fit: cover;
}
.rice-content {
padding-left: 25px;
}
.rice-subtitle {
display: inline-block;
margin-bottom: 10px;
color: #d9a707;
font-size: 22px;
font-weight: 600;
letter-spacing: 1px;
}
.rice-content h2 {
margin: 0 0 14px;
color: #161616;
/* font-size: clamp(36px, 4vw, 58px); */
font-weight: 600;
line-height: 1.2;
letter-spacing: -1.5px;
}
.rice-content h2 span {
color: #ddaf1c;
}
.rice-content > h4 {
margin: 0 0 25px;
color: #262626;
font-size: 22px;
font-weight: 600;
line-height: 1.5;
}
.rice-content > p {
max-width: 620px;
margin: 0 0 15px;
color: #2e2e2e;
font-size: 16px;
line-height: 2;
text-align: justify;
}
/* =========================================
Products
========================================= */
.rice-products {
margin-top: 30px;
}
.rice-products h3, .rice-packing h3 {
margin: 0 0 17px;
color: #dfaa00;
font-size: 18px;
font-weight: 500;
letter-spacing: 1px;
}
.rice-product-list {
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 10px 25px;
}
.rice-product-item {
display: flex;
align-items: center;
gap: 10px;
color: #282828;
font-size: 15px;
}
.rice-product-item i {
color: #111111;
font-size: 17px;
}
/* =========================================
Packing
========================================= */
.rice-packing {
margin-top: 28px;
padding-top: 22px;
border-top: 1px solid #d5d5d0;
}
.rice-packing p {
max-width: 620px;
margin: 0;
color: #383838;
font-size: 16px;
line-height: 2;
}
.rice-quote-btn {
display: inline-flex;
align-items: center;
gap: 18px;
margin-top: 30px;
padding: 15px 25px;
background: #e5b207;
color: #ffffff;
font-size: 16px;
font-weight: 600;
letter-spacing: 0.5px;
text-decoration: none;
transition: 0.3s ease;
}
.rice-quote-btn i {
font-size: 17px;
transition: 0.3s ease;
}
.rice-quote-btn:hover {
background: #161616;
color: #fff;
}
.rice-quote-btn:hover i {
transform: translate(3px, -3px);
}
/* =========================================
Tablet
========================================= */
@media (max-width: 991px) {
.rice-product-section {
padding: 80px 0;
}
.rice-content {
padding-left: 0;
}
.rice-images {
min-height: 520px;
}
.rice-image-main {
height: 450px;
}
}
/* =========================================
Mobile
========================================= */
@media (max-width: 575px) {
.rice-product-section {
padding: 65px 0;
}
.rice-images {
min-height: auto;
padding-right: 40px;
padding-bottom: 45px;
}
.rice-image-main {
height: 380px;
}
.rice-image-small {
width: 50%;
height: 170px;
}
.rice-content h2 {
font-size: 38px;
}
.rice-product-list {
grid-template-columns: 1fr;
}
.rice-quote-btn {
width: 100%;
justify-content: center;
}
}
section.rice-product-section {
padding: 120px 0;
background: #fff;
}
.rice-product-list {
display: flex;
flex-direction: column;
gap: 12px;
}
.rice-product-item {
display: flex;
align-items: flex-start;
gap: 8px;
color: #3c3c3c;
font-size: 16px;
line-height: 2;
}
.rice-product-item span {
color: #1c1c1c;
font-weight: 500;
}
.rice-product-item strong {
color: #555;
font-weight: 400;
}
/* ************************ Contact Us ******************* */
.contact-card {
width: 100%;
padding: 45px;
background: #ededed82;
border-radius: 30px;
}
.contact-info {
margin-bottom: 28px;
}
.contact-info h3 {
margin: 0 0 18px;
font-weight: 600;
line-height: 1.25;
color: #102d42;
font-size: 28px;
}
.contact-info p {
margin: 0;
color: #666;
font-size: 15px;
line-height: 1.8;
}
.official-channels {
width: 100%;
}
.official-channels > h4 {
margin: 0 0 25px;
padding-bottom: 15px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
font-size: 21px;
font-weight: 600;
line-height: 1.3;
color: #222;
}
.contact-method {
display: flex;
align-items: flex-start;
gap: 18px;
padding: 22px 0;
border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}
.contact-method:first-of-type {
padding-top: 0;
}
.contact-method:last-child {
padding-bottom: 0;
border-bottom: 0;
}
.contact-method-icon {
flex: 0 0 48px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
font-size: 21px;
}
.facebook-icon {
background: #d8e6ff;
color: #1877f2;
}
.telegram-icon {
background: #d6edf5;
color: #229ed9;
}
.contact-method-content {
min-width: 0;
flex: 1;
}
.contact-method-content h5 {
margin: 0 0 8px;
font-size: 16px;
font-weight: 600;
line-height: 1.4;
color: #222;
}
.contact-method-content a {
display: inline-block;
max-width: 100%;
margin-bottom: 8px;
color: #222;
font-size: 14px;
font-weight: 500;
line-height: 1.6;
text-decoration: none;
overflow-wrap: anywhere;
transition: color 0.3s ease;
}
.contact-method-content a:hover {
color: #1877f2;
}
.contact-method-content p {
margin: 0;
color: #666;
font-size: 14px;
line-height: 1.7;
margin-bottom: 12px;
}
@media (max-width: 991.98px) {
.contact-card {
padding: 38px;
border-radius: 18px;
}
.contact-info {
margin-bottom: 35px;
}
.contact-info h3 {
font-size: 34px;
}
}
@media (max-width: 575.98px) {
.contact-card {
padding: 28px 22px;
border-radius: 16px;
}
.contact-info {
margin-bottom: 30px;
}
.contact-info h3 {
margin-bottom: 15px;
font-size: 28px;
}
.contact-info p {
font-size: 14px;
line-height: 1.75;
}
.official-channels > h4 {
margin-bottom: 20px;
font-size: 19px;
}
.contact-method {
gap: 13px;
padding: 20px 0;
}
.contact-method-icon {
flex: 0 0 42px;
width: 42px;
height: 42px;
border-radius: 10px;
font-size: 18px;
}
.contact-method-content h5 {
font-size: 15px;
}
.contact-method-content a {
font-size: 13px;
}
.contact-method-content p {
font-size: 13px;
line-height: 1.65;
}
}
.contact-link-btn {
display: inline-flex !important;
align-items: center;
justify-content: center;
gap: 9px;
width: fit-content;
margin-bottom: 10px !important;
padding: 10px 16px;
border-radius: 20px;
font-size: 13px !important;
font-weight: 600 !important;
line-height: 1.2 !important;
text-decoration: none !important;
transition: all 0.3s ease;
}
.contact-link-btn i {
font-size: 16px;
}
.facebook-btn {
background: #092f57;
color: #fff !important;
}
.facebook-btn:hover {
background: #092f57;
color: #fff !important;
transform: translateY(-2px);
}
.telegram-btn {
background: #092f57;
color: #fff !important;
}
.telegram-btn:hover {
background: #092f57;
color: #fff !important;
transform: translateY(-2px);
}
@media (max-width: 575.98px) {
.contact-link-btn {
padding: 9px 14px;
font-size: 12px !important;
}
.contact-link-btn i {
font-size: 15px;
}
.service-content > p {
font-size: 15px;
text-align: center;
padding: 0px 20px;
height: auto;
}
}
/* form content */
.form-content {
width: 100%;
}
.form-content .form-group {
margin-bottom: 20px;
}
.form-content .form-group.row {
margin-left: -10px;
margin-right: -10px;
}
.form-content .form-group > [class*="col-"] {
padding-left: 10px;
padding-right: 10px;
}
.form-content .input-group {
position: relative;
width: 100%;
}
.form-content .reservation-form-control {
width: 100%;
min-height: 54px;
padding: 14px 18px;
border: 2px solid #a2afc1;
border-radius: 14px;
background: #fff;
color: #222;
font-family: inherit;
font-size: 14px;
font-weight: 400;
line-height: 1.5;
outline: none;
box-shadow: none;
transition: border-color 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease;
}
.form-content .reservation-form-control::placeholder {
color: #999;
opacity: 1;
}
.form-content .reservation-form-control:hover {
border-color: #bfc4ca;
}
.form-content .reservation-form-control:focus {
border-color: #222;
background: #fff;
outline: none;
box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
}
.form-content textarea.reservation-form-control {
min-height: 130px;
padding: 16px 18px;
resize: vertical;
line-height: 1.6;
}
@media (max-width: 575.98px) {
.form-content textarea.reservation-form-control {
min-height: 120px;
}
}
.form-content .reservation-form-control:required:valid {
border-color: #dcdfe3;
}
.form-content .reservation-form-control:focus:invalid {
border-color: #004f7c;
}
.form-content .margintop15 {
margin-top: 25px !important;
margin-bottom: 0;
}
.form-content .form-margin {
margin-bottom: 0 !important;
}
.form-content .btn-submit {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 150px;
min-height: 50px;
padding: 13px 28px;
border: 1px solid #222;
border-radius: 50px;
background: #102d42;
color: #fff;
font-family: inherit;
font-size: 14px;
font-weight: 600;
line-height: 1;
text-align: center;
text-decoration: none;
cursor: pointer;
outline: none;
transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.form-content .btn-submit:hover {
background: #000;
border-color: #000;
color: #fff;
transform: translateY(-2px);
box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}
.form-content .btn-submit:active {
transform: translateY(0);
box-shadow: none;
}
.form-content .btn-submit:focus {
outline: none;
box-shadow:
0 0 0 3px rgba(0, 0, 0, 0.12);
}
.form-content .btn-submit:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
box-shadow: none;
}
.form-content .reservation-form-control:-webkit-autofill,
.form-content .reservation-form-control:-webkit-autofill:hover,
.form-content .reservation-form-control:-webkit-autofill:focus {
-webkit-text-fill-color: #222;
box-shadow: 0 0 0 1000px #fff inset;
transition: background-color 5000s ease-in-out 0s;
}
@media (max-width: 991.98px) {
.form-content .reservation-form-control {
min-height: 52px;
}
}
@media (max-width: 767.98px) {
.form-content .form-group {
margin-bottom: 16px;
}
.form-content .xs-margin {
margin-bottom: 16px;
}
.form-content .reservation-form-control {
min-height: 50px;
padding: 13px 16px;
font-size: 14px;
}
.form-content textarea.reservation-form-control {
min-height: 120px;
}
.form-content .btn-submit {
width: 100%;
min-height: 50px;
}
}
@media (max-width: 575.98px) {
.form-content .form-group.row {
margin-left: 0;
margin-right: 0;
}
.form-content .form-group > [class*="col-"] {
padding-left: 0;
padding-right: 0;
}
.form-content .xs-margin {
margin-bottom: 16px;
}
.form-content .reservation-form-control {
border-radius: 7px;
}
}
.form-bg {
width: 100%;
padding: 20px 40px;
}
.form-header {
margin-bottom: 30px;
}
.form-header-label {
display: inline-block;
margin-bottom: 10px;
color: #193b63;
font-size: 12px;
font-weight: 600;
letter-spacing: 1.5px;
text-transform: uppercase;
}
.form-header h2 {
margin: 0 0 14px;
color: #092342;
font-size: clamp(28px, 3vw, 40px);
font-weight: 600;
line-height: 1.2;
font-size: 36px;
}
.form-header p {
max-width: 600px;
margin: 0;
color: #66717d;
font-size: 14px;
line-height: 1.8;
}
.form-section {
width: 100%;
}
.form-content {
width: 100%;
}
.form-content .form-group {
margin-bottom: 18px;
}
.form-content .form-group.row {
margin-left: -8px;
margin-right: -8px;
}
.form-content .form-group > [class*="col-"] {
padding-left: 8px;
padding-right: 8px;
}
.form-content .reservation-form-control {
width: 100%;
min-height: 52px;
padding: 13px 16px;
border: 1px solid #d6dce2;
border-radius: 16px;
background: #fff;
color: #222;
font-family: inherit;
font-size: 14px;
outline: none;
box-shadow: none;
transition: border-color 0.3s ease, box-shadow 0.3s ease;
}
.form-content .reservation-form-control::placeholder {
color: #9aa1a8;
}
.form-content .reservation-form-control:hover {
border-color: #b8c2cc;
}
.form-content .reservation-form-control:focus {
border-color: #092f57;
box-shadow:
0 0 0 3px rgba(9, 47, 87, 0.08);
}
.form-content textarea.reservation-form-control {
min-height: 130px;
padding: 15px 16px;
resize: vertical;
line-height: 1.6;
}
.form-content .btn-submit {
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 140px;
min-height: 50px;
padding: 12px 25px;
border: 1px solid #e5b207;
border-radius: 0px;
background: #e5b207;
color: #fff;
font-size: 14px;
font-weight: 600;
cursor: pointer;
transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}
.form-content .btn-submit:hover {
background: #061f3b;
border-color: #061f3b;
color: #fff;
transform: translateY(-2px);
box-shadow:
0 8px 20px rgba(9, 47, 87, 0.18);
}
@media (max-width: 767.98px) {
.form-bg {
padding: 35px 25px;
border-radius: 18px;
}
.form-header {
margin-bottom: 25px;
}
.form-header h2 {
font-size: 30px;
}
.form-header p {
font-size: 13px;
}
.form-content .xs-margin {
margin-bottom: 16px;
}
.form-content .btn-submit {
width: 100%;
}
}
@media (max-width: 575.98px) {
.form-bg {
padding: 28px 20px;
border-radius: 16px;
}
.form-header h2 {
font-size: 27px;
}
.form-content .form-group.row {
margin-left: 0;
margin-right: 0;
}
.form-content .form-group > [class*="col-"] {
padding-left: 0;
padding-right: 0;
}
.form-content .reservation-form-control {
min-height: 50px;
}
.form-content textarea.reservation-form-control {
min-height: 120px;
}
}
/* address section */
.branch-info-section {
padding: 120px 0;
}
.branch-info-intro {
max-width: 750px;
margin: 15px auto 0;
color: #6b6b6b;
font-size: 15px;
line-height: 1.7;
}
.branch-info-card {
height: 100%;
padding: 38px;
background: #fff;
border: 1px solid #dfe4ea;
border-radius: 20px;
transition:
transform 0.3s ease,
box-shadow 0.3s ease,
border-color 0.3s ease;
}
.branch-info-card:hover {
transform: translateY(-4px);
border-color: #c8d2df;
box-shadow:
0 15px 40px rgba(9, 35, 66, 0.09);
}
.branch-info-card-header {
display: flex;
align-items: center;
gap: 16px;
padding-bottom: 25px;
border-bottom: 1px solid #e5e9ee;
}
.branch-info-card-header > div:last-child {
min-width: 0;
}
.branch-info-card-header span {
display: block;
margin-bottom: 5px;
color: #193b63;
font-size: 14px;
font-weight: 600;
letter-spacing: 1.2px;
text-transform: uppercase;
}
.branch-info-card-header h3 {
margin: 0;
color: #092342;
font-size: 22px;
font-weight: 600;
line-height: 1.35;
}
.branch-info-icon {
flex: 0 0 52px;
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 14px;
background: #eaf0f7;
color: #092f57;
font-size: 22px;
}
.branch-info-content > p {
margin: 0 0 25px;
color: #5f6872;
font-size: 16px;
line-height: 1.8;
}
.branch-info-content > p {
margin: 0 0 25px;
color: #424951;
font-size: 15px;
line-height: 1.8;
padding-top: 20px;
}
.branch-contact-item {
display: flex;
align-items: flex-start;
gap: 15px;
padding: 18px 0;
border-top: 1px solid #e8ebef;
}
.branch-contact-item:first-of-type {
padding-top: 20px;
border-top: 0;
}
.branch-contact-icon {
flex: 0 0 42px;
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 10px;
background: #edf2f7;
color: #0b355f;
font-size: 17px;
transition:
background-color 0.3s ease,
color 0.3s ease;
}
.branch-contact-item:hover .branch-contact-icon {
background: #092f57;
color: #fff;
}
.branch-contact-text {
flex: 1;
min-width: 0;
}
.branch-contact-text > span {
display: block;
margin-bottom: 6px;
color: #193b63;
font-size: 14px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
}
.branch-contact-text p {
margin: 0;
color: #333f4d;
font-size: 16px;
line-height: 1.7;
}
.branch-contact-btn {
display: inline-flex;
align-items: center;
gap: 8px;
width: fit-content;
max-width: 100%;
padding: 9px 13px;
border: 1px solid #cbd5e0;
border-radius: 7px;
background: #f7f9fb;
color: #092f57;
font-size: 13px;
font-weight: 600;
line-height: 1.3;
text-decoration: none;
overflow-wrap: anywhere;
transition:
background-color 0.3s ease,
border-color 0.3s ease,
color 0.3s ease,
transform 0.3s ease,
box-shadow 0.3s ease;
}
.branch-contact-btn i {
font-size: 14px;
}
.branch-contact-btn:hover {
background: #092f57;
border-color: #092f57;
color: #fff;
transform: translateY(-2px);
box-shadow:
0 6px 15px rgba(9, 47, 87, 0.18);
}
@media (max-width: 991.98px) {
.branch-info-section {
padding: 70px 0;
}
.branch-info-card {
padding: 32px;
}
}
@media (max-width: 575.98px) {
.branch-info-section {
padding: 55px 0;
}
.branch-info-card {
padding: 25px 20px;
border-radius: 16px;
}
.branch-info-card-header {
gap: 12px;
padding-bottom: 20px;
}
.branch-info-icon {
flex: 0 0 44px;
width: 44px;
height: 44px;
border-radius: 11px;
font-size: 19px;
}
.branch-info-card-header h3 {
font-size: 19px;
}
.branch-info-card-header span {
font-size: 10px;
}
.branch-info-content {
padding-top: 20px;
}
.branch-info-content > p {
font-size: 13px;
}
.branch-contact-item {
gap: 12px;
padding: 16px 0;
}
.branch-contact-icon {
flex: 0 0 38px;
width: 38px;
height: 38px;
border-radius: 9px;
font-size: 15px;
}
.branch-contact-btn {
font-size: 12px;
}
}
.contact-us-page {
padding: 60px 0 140px;
}
/* contact us new info */
.contact-card {
padding: 45px;
background: #f7f7f5;
border: 1px solid #e5e5e2;
}
.contact-subtitle {
display: inline-block;
margin-bottom: 10px;
color: #d9a707;
font-size: 22px;
font-weight: 600;
letter-spacing: 1px;
}
.contact-info h3 {
margin: 0 0 25px;
color: #161616;
/* font-size: clamp(36px, 4vw, 58px); */
font-weight: 600;
line-height: 1.2;
letter-spacing: -1.5px;
font-size: 32px;
}
.contact-info h3 span {
color: #ddaf1c;
}
.contact-info h4 {
margin: 0 0 18px;
color: #222222;
font-size: 20px;
font-weight: 600;
line-height: 1.5;
/* text-transform: uppercase; */
}
.contact-info > p {
max-width: 600px;
margin: 0;
color: #363636;
font-size: 15px;
line-height: 2;
text-align: justify;
}
.contact-details {
margin-top: 35px;
border-top: 1px solid #dededb;
}
.contact-detail {
display: flex;
align-items: flex-start;
gap: 18px;
padding: 22px 0;
border-bottom: 1px solid #dededb;
}
.contact-detail-icon {
width: 42px;
height: 42px;
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: center;
background: #ddaf1c;
color: #ffffff;
font-size: 17px;
border-radius: 50px;
}
.contact-detail-content {
padding-top: 2px;
}
.contact-detail-content span {
display: block;
margin-bottom: 7px;
color: #2e2e2e;
font-size: 16px;
font-weight: 600;
/* letter-spacing: 1.5px; */
}
.contact-detail-content p {
margin: 0;
color: #2e2e2e;
font-size: 15px;
line-height: 2;
}
/* =========================================
Mobile
========================================= */
@media (max-width: 575px) {
.contact-card {
padding: 30px 25px;
}
.contact-info h3 {
font-size: 30px;
}
.contact-info h4 {
font-size: 14px;
}
.contact-detail {
gap: 14px;
}
}
/* map section */
.map-section {
padding: 100px 0 120px;
}
.location-map {
position: relative;
width: 100%;
overflow: hidden;
border: 1px solid #dce3ea;
border-radius: 20px;
background: #f4f6f8;
box-shadow:
0 15px 40px rgba(9, 35, 66, 0.08);
}
.location-map iframe {
display: block;
width: 100%;
height: 450px;
border: 0;
filter: saturate(0.9);
}
.location-map {
transition:
transform 0.3s ease,
box-shadow 0.3s ease;
}
.location-map:hover {
transform: translateY(-3px);
box-shadow:
0 20px 45px rgba(9, 35, 66, 0.12);
}
@media (max-width: 991.98px) {
.map-section {
padding-bottom: 70px;
}
.location-map {
border-radius: 16px;
}
.location-map iframe {
height: 400px;
}
}
@media (max-width: 575.98px) {
.map-section {
padding-bottom: 55px;
}
.location-map {
border-radius: 12px;
}
.location-map iframe {
height: 320px;
}
}
/* ******************* Footer ********************** */
footer {
position: relative;
padding: 70px 0 0;
background: #1c1c1c;
color: #fff;
}
/* =========================================
FOOTER CONTENT
========================================= */
.footer-content {
height: 100%;
}
.footer-content h3 {
margin: 0 0 25px;
color: #fff;
font-size: 19px;
font-weight: 600;
line-height: 1.3;
}
/* =========================================
CONTACT DETAILS
========================================= */
.footer-content > .d-flex {
display: flex;
align-items: flex-start;
margin-bottom: 18px;
}
.footer-content > .d-flex > div {
flex: 0 0 22px;
width: 22px;
}
.footer-content > .d-flex img {
display: block;
width: 20px;
height: 20px;
object-fit: contain;
margin-top: 6px;
}
.footer-contact-info {
margin: 0 0 0 14px !important;
color: #d4dce5;
font-size: 16px;
font-weight: 400;
line-height: 1.7;
}
.quick-lnk {
padding-left: 30px;
}
.quick-links {
margin: 0;
padding: 0;
list-style: none;
}
.quick-links li {
position: relative;
padding-bottom: 10px !important;
}
.quick-links li a {
position: relative;
display: inline-block;
color: #d4dce5;
font-size: 16px;
font-weight: 400;
text-decoration: none;
transition: color 0.3s ease, padding-left 0.3s ease;
}
.quick-links li a::before {
content: "→";
position: absolute;
left: -18px;
opacity: 0;
color: #fff;
transition:
opacity 0.3s ease,
left 0.3s ease;
}
.quick-links li a:hover {
color: #fff;
}
.quick-links li a:hover::before {
opacity: 1;
}
.quick-links li.active a {
color: #fff;
font-weight: 500;
}
.social {
padding-left: 30px;
}
.social .d-flex {
display: flex;
align-items: center;
gap: 12px;
}
.social .d-flex img {
display: block;
width: 40px;
height: 40px;
object-fit: contain;
transition:
transform 0.3s ease,
opacity 0.3s ease;
}
.social .d-flex img:hover {
transform: translateY(-4px);
opacity: 0.8;
}
.footer-hr {
margin-top: 45px;
padding: 22px 0;
border-top: 1px solid rgba(255, 255, 255, 0.15);
}
.footer-info {
width: 100%;
}
.footer-info-txt {
margin: 0;
color: #bfcbd8;
font-size: 13px;
line-height: 1.7;
}
.footer-info-txt span {
color: #fff;
}
.footer-info-txt a {
color: #fff;
transition: opacity 0.3s ease;
}
.footer-info-txt a:hover {
opacity: 0.7;
}
@media (max-width: 1199.98px) {
.quick-lnk,
.social {
padding-left: 15px;
}
}
@media (max-width: 991.98px) {
footer {
padding-top: 55px;
}
.footer-content {
margin-bottom: 35px;
}
.footer-content h3 {
margin-bottom: 20px;
}
.quick-lnk,
.social {
padding-left: 0;
}
.footer-hr {
margin-top: 15px;
}
}
@media (max-width: 767.98px) {
footer {
padding-top: 50px;
}
.footer-content {
margin-bottom: 30px;
}
.footer-content h3 {
font-size: 18px;
}
.footer-contact-info {
font-size: 13px;
}
.quick-links li a {
font-size: 13px;
}
.social .d-flex img {
width: 36px;
height: 36px;
}
.footer-hr {
margin-top: 10px;
padding: 20px 0;
}
.footer-info-txt {
font-size: 12px;
}
}
@media (max-width: 575.98px) {
footer {
padding-top: 45px;
}
.footer-content {
margin-bottom: 30px;
}
.footer-content > .d-flex {
margin-bottom: 15px;
}
.footer-contact-info {
font-size: 13px;
}
.social .d-flex {
gap: 10px;
}
.social .d-flex img {
width: 34px;
height: 34px;
}
.footer-hr {
margin-top: 5px;
}
}
.social-links {
display: flex;
align-items: center;
gap: 12px;
}
.social-links a {
width: 42px;
height: 42px;
display: flex;
align-items: center;
justify-content: center;
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 10px;
background: rgba(255, 255, 255, 0.06);
color: #fff;
font-size: 18px;
text-decoration: none;
transition:
background-color 0.3s ease,
border-color 0.3s ease,
transform 0.3s ease,
color 0.3s ease;
}
.social-links a:hover {
/* background: #fff; */
border-color: #fff;
color: #092342;
transform: translateY(-4px);
}
.social-links a i {
line-height: 1;
}
.footer-contact-info a {
color: #d4dce5;
text-decoration: none;
transition: color 0.3s ease;
}
.footer-contact-info a:hover {
color: #fff;
}
@media (max-width: 575.98px) {
.social-links {
gap: 10px;
}
.social-links a {
width: 38px;
height: 38px;
border-radius: 8px;
font-size: 16px;
}
}
/* copyright */
.footer-hr {
margin-top: 45px;
padding: 22px 0;
border-top: 1px solid rgba(255, 255, 255, 0.15);
}
.footer-info {
width: 100%;
text-align: center;
}
.footer-info p {
margin: 0;
color: #eaf2fb;
font-size: 14px;
font-weight: 400;
line-height: 1.7;
}
.footer-info a {
color: #ffffff;
font-weight: 500;
text-decoration: none;
transition: color 0.3s ease,
opacity 0.3s ease;
}
.footer-info a:hover {
color: #d4e1ef;
opacity: 0.85;
}
@media (max-width: 991.98px) {
.footer-hr {
margin-top: 20px;
padding: 20px 0;
}
}
@media (max-width: 575.98px) {
.footer-hr {
margin-top: 10px;
padding: 18px 0;
}
.footer-info p {
font-size: 12px;
line-height: 1.8;
}
}
/* go top */
.scrollup {
position: fixed;
right: 30px;
bottom: 90px;
width: 48px;
height: 48px;
display: flex;
align-items: center;
justify-content: center;
z-index: 999;
border-radius: 50%;
background: #1c1c1c;
color: #fff;
font-size: 20px;
line-height: 1;
text-decoration: none;
box-shadow: 0 8px 25px rgba(9, 35, 66, 0.2);
transition: background-color 0.3s ease, color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
border: 2px solid;
}
.scrollup i {
line-height: 1;
}
.scrollup:hover {
background: #fff;
color: #1c1c1c;
transform: translateY(-4px);
box-shadow: 0 12px 30px rgba(9, 35, 66, 0.25);
}
@media (max-width: 991.98px) {
.scrollup {
right: 25px;
width: 44px;
height: 44px;
font-size: 18px;
}
}
@media (max-width: 575.98px) {
.scrollup {
right: 18px;
width: 40px;
height: 40px;
font-size: 16px;
}
}
/* */
.mm-listitem__text {
font-size: 16px !important;
}
.mm-navbar>* {
font-size: 16px;
}
.service-block-img img {
border-radius: 500px;
width: 300px;
height: 300px;
object-fit: cover;
}
.owl-carousel .owl-item img {
display: block;
width: 100%;
border-radius: 30px !important;
height: 400px;
object-fit: cover;
}
/* menu active and hover */
.gfc-navbar .nav-link {
position: relative;
color: #333;
transition: color 0.3s ease;
font-weight: 500;
}
.gfc-navbar .nav-link:hover {
color: #d9a707 !important;
}
.gfc-navbar .nav-link.active {
color: #d9a707 !important;
}
/* Underline */
.gfc-navbar .nav-link::after {
content: "";
position: absolute;
left: 50%;
bottom: 5px;
width: 0;
height: 2px;
background: #ffd23d;
transform: translateX(-50%);
transition: width 0.3s ease;
}
.gfc-navbar .nav-link:hover::after {
width: 70%;
}
.gfc-navbar .nav-link.active::after {
width: 70%;
}
section#map {
padding: 0 0 119px;
}
.footer-content img {
width: 20px;
}