/*
    Theme Name: idealogic-theme
    Author: Gravitas Digital Sdn. Bhd.
    Version: 1.5
*/

:root {
	--primary: #C82121;
    --secondary: #F3F3F3;
    --sub: #F9F9F9;
    --basic: #000000;
}

@font-face {
	font-family: Figtree;
	src: url(../idealogic-theme/assets/fonts/Figtree-Regular.ttf);
  }

@font-face {
	font-family: Avenir;
	src: url(../idealogic-theme/assets/fonts/AvenirLTStd-Book.otf);
  }

  @font-face {
	font-family: Helvetica;
	src: url(../idealogic-theme/assets/fonts/Helvetica.ttf);
  }

html {
	height: 100%;
	box-sizing: border-box;
	scroll-behavior: smooth;
  }
  
  *,
  *:before,
  *:after {
	box-sizing: inherit;
  }

*, html {
    margin:0;
    padding:0;  
}

body{
     overflow-x:hidden;
}

h1, h2, h3, h4, h5, h6, a {
	font-family: 'Montserrat', sans-serif !important;
}

h1{
	font-size: 2.25rem !important;
	line-height: 1 !important;
}

h5,h6{
	text-transform: none !important;
}

p {
	color: var(--basic);
	font-weight: 300!important;
	font-family: 'Helvetica', sans-serif !important;
}

a{
	text-decoration: none !important;
}

a:hover{
	cursor: pointer;
}

i{
	color: var(--primary) !important;
	font-size: 1.5rem !important;
}

.testimonial-left i,
.testimonial-center i,
.testimonial-right i{
	color: #FFDF00 !important;
}

.container-sm{
	padding-right: 1.5rem!important;
    padding-left: 1.5rem!important;
}

.form-select{
	background-image: url('../idealogic-theme/assets/images/icon/drop-down-form.svg') !important ;
}

input, select, textarea{
	border: 1px solid var(--primary) !important;
	font-family: 'Montserrat', sans-serif !important;
}

.underline{
	text-decoration: underline red 2px;
	text-underline-offset: 5px;
}

/*  Navbar  */
.navbar-collapse{
	flex-grow: 0 !important;
}

.navbar-brand{
	width:65%;
}

.navbar-nav .nav-link.active{
	color: var(--primary) !important;
}

.nav-link{
	font-size:18px !important;
}

/* Contact Form 7 */

.wpcf7 form.sent .wpcf7-response-output{
	border-color: var(--basic);
	border-radius: 10%;
}

/*  Swiper */

.swiper-container-logo,
.swiper-container-testimonial,
.swiper-container-gallery1,
.swiper-container-gallery2,
.swiper-container-gallery3,
.swiper-container-gallery4,
.swiper-container-gallery5{ 

	position: relative;
	width: 100%;
	margin: 0 auto;
}

.swiper-container-logo .swiper-pagination,
.swiper-container-testimonial .swiper-pagination,
.swiper-container-gallery1 .swiper-pagination,
.swiper-container-gallery2 .swiper-pagination,
.swiper-container-gallery3 .swiper-pagination,
.swiper-container-gallery4 .swiper-pagination,
.swiper-container-gallery5 .swiper-pagination,
.swiper-container-about .swiper-pagination {
	bottom: -30px!important;
}

.swiper-pagination-bullet{
	background:#FFF !important ;
	border: 1px solid var(--primary) !important;
	opacity: 1 !important;
}

.swiper-pagination-bullet-active{
	background:var(--primary) !important;
}
.swiper.logoSwiper{
	height:70vw;
}

/*.swiper.gallerySwiper1,
.swiper.gallerySwiper2,
.swiper.gallerySwiper3,
.swiper.gallerySwiper4,
.swiper.gallerySwiper5 {
	height: 50vw;
}*/


.testimonialSwiper .swiper-slide{
	background-color:var(--sub);
}

.logoSwiper .swiper-slide
{
	height: calc((120% - 0px) / 4) !important; 
}

.logoSwiper img{
	width: 90px;
	height: 75px;
	object-fit: contain;
}

/*  Accordion  */

.accordion-item{
	border: none !important;
}

.accordion-button{
	color: var(--primary) !important;
	background-color: var(--secondary) !important;
	border-top-left-radius: var(--bs-accordion-inner-border-radius) !important;
    border-top-right-radius: var(--bs-accordion-inner-border-radius) !important;
	font-size: 1.75rem !important
}

.accordion-button:focus{
	border:none !important;
	box-shadow: none !important;
}

.accordion-button:not(.collapsed){
	color:#FFF !important;
	background-color: var(--primary) !important;
}

.accordion-button::after{
	width: 1rem !important;
    height: 1rem !important;
	margin-top: 0.5rem;
	background-image: url('../idealogic-theme/assets/images/icon/accordion-close.svg') !important ;
	background-size: contain !important;
}

.accordion-button:not(.collapsed)::after{
	background-image: url('../idealogic-theme/assets/images/icon/accordion-open.svg') !important ;
	transform: none !important;
}

/*  Talk with Us Background */

.talk-with-us{
	background-image: url('../idealogic-theme/assets/images/bg-talk.png') ;
	background-repeat: no-repeat;
  	background-position: top; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

/*  Homepage Page */
.home-header{
	background-image: url('../idealogic-theme/assets/images/bg-homepage.png') ;
	background-repeat: no-repeat;
  	background-position: center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.home-detail{
	background-image: url('../idealogic-theme/assets/images/bg-homepage-1.png') ;
	background-repeat: no-repeat;
  	background-position: center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.home-service{
	background-image: url('../idealogic-theme/assets/images/bg-homepage-2.png') ;
	background-repeat: no-repeat;
  	background-position: left; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
}

.home-client{
	background-image: url('../idealogic-theme/assets/images/bg-homepage-3.png') ;
	background-repeat: no-repeat;
  	background-position: left; 
	  -webkit-background-size: cover;
	  -moz-background-size: cover;
	  -o-background-size: cover;
}

.home-testimonial{
	background-image: url('../idealogic-theme/assets/images/bg-homepage-4.png') ;
	background-repeat: no-repeat;
  	background-position: right; 
	background-size: 101% 100%;
    -webkit-background-size: 101% 100%;
    -moz-background-size: 101% 100%;
    -o-background-size: 101% 100%;
}

.services-1 img, .services-2 img, .services-3 img, .services-4 img, .services-5 img{
	height:2.5rem
}

.services-1, .services-2, .services-3, .services-4{
	border-bottom: 1px solid #dee2e6;
}

#panelsStayOpen-heading-1, #panelsStayOpen-heading-2,#panelsStayOpen-heading-3, #panelsStayOpen-heading-4, #panelsStayOpen-heading-5{
scroll-margin-top:8rem;
}

/*  About Page */
.about-detail{
	background-image: url('../idealogic-theme/assets/images/bg-about.png') ;
	background-repeat: no-repeat;
  	background-position: center; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.about-detail .description{
	width: 100%;
}

.about-description{
	background-image: url('../idealogic-theme/assets/images/bg-about-1.png') ;
	background-repeat: no-repeat;
  	background-position: bottom; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.our-team{
	background-image: url('../idealogic-theme/assets/images/bg-about-2.png') ;
	background-repeat: no-repeat;
  	background-position: bottom; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
}

.about::after{
  content:"";
  position:absolute;
  background: rgba(255,255,255,0.8);
  z-index:0;
  height:28%;
  width:100%;
  bottom:0;
  left:0;
}

/* Blog Page */

.card-blog {
        background-color: var(--sub);
        border-radius: 1.5rem !important;
	text-align:left;
    }

    .card-blog a {
        text-decoration: none !important;
    }

    .card-blog:hover {
        box-shadow: 0 0 0 0.1rem var(--primary) !important;
    }

    .card-blog img {
        border-radius: 2rem 2rem 0 0;
        width: 100% !important;
        height: auto;
    }

/*  Contact Page */

.contact-us{
	background-image: url('../idealogic-theme/assets/images/bg-contact-us.png') ;
	background-repeat: no-repeat;
  	background-position: bottom; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: 101% 100%;
}

.lets-talk{
	font-size:2.5rem !important;
}

.vl {
	border-left: 1px solid #E6E6E6
}

.list-contact p{
	font-family: 'Figtree', sans-serif !important;
}

.submit-button{
	background: var(--primary) !important;
}

@media (min-width: 576px){
	h1{
		font-size: 2.75rem !important;
	}
	.navbar-brand{
		width:unset;
	}
	.navbar-brand img{
		width:50% !important;
	}
	.swiper.logoSwiper {
		height:70vw;
	}
}

@media (min-width: 768px){
	.swiper.logoSwiper {
		height: 65vw;
	}

	.swiper-container-logo .swiper-pagination{
		bottom:-30px !important;
	}
	.services{
		border-bottom: 1px solid #dee2e6;
		border-right: 1px solid #dee2e6;
	}
	.services-1, .services-2, .services-3{
		border-bottom: 1px solid #dee2e6;
	}
	.services-2, .services-4{
		border-right: 1px solid #dee2e6;
	}
	.services-3{
		border-right: 0;
	}
	.services-4{
		border-bottom: 0;
	}
	.container-sm{
		max-width: 100% !important;
		padding-left:5rem !important;
		padding-right:0 !important
	}
	.lets-talk{
		font-size:3.5rem !important;
	}
}

@media (min-width: 991px){
	h1{
		font-size: 3.25rem !important;
	}
	.swiper.logoSwiper {
		height: 35vw;
	}
	.navbar-expand-lg .navbar-nav .nav-link{
		padding-left: 1rem !important;
		padding-right: 1rem !important;
	}
	.services-1, .services-3{
		border-right: 1px solid #dee2e6;
	}
	.services-2{
		border-right: 0;
	}
	.services-3, .services-4{
		border-bottom: 0;
	}
	.home-header img{
		width:90% !important;
	}
	.home-detail img,
	.about-detail .description,
	.about-detail .image-about img{
		width:75% !important;
	}
	.about-description .description{
		width:50% !important;
	}
	.logoSwiper img{
		width: 100px;
		height: 100px;
		object-fit: contain;
	}
	.testimonial-left,
	.testimonial-right{
		position: relative;
	}
	.testimonial-left:after{
		position: absolute;
		content: '';
		left: 0;
		top: 0;
		border-style: solid;
		border-color: #FFF transparent #FFF transparent;
		border-width: 125px 100px 0px 0px;
	}
	.testimonial-right:after{
		position: absolute;
		content: '';
		right: 0;
		bottom: 0;
		border-style: solid;
		border-color: #FFF transparent #FFF transparent;
		border-width: 0px 0px 125px 100px;
	}
}