/*
Theme Name: ABPC
Theme URI: http://abpc.bj/
Author: Intside
Author URI: http://intside.com/
Description: Abpc is a official WordPress theme based on Bootstrap
Version: 0.1
Tags: blue, black, white, light, one-column, two-columns, right-sidebar, fluid-layout, responsive-layout, custom-header, custom-menu, editor-style, featured-images, microformats, post-formats, rtl-language-support, sticky-post, translation-ready
Text Domain: ABPC 0.1
*/

/**
 * Table of Contents:
 *
 * 1.0 - Basic Structurex
 * 2.0 - Media Queries
 * ----------------------------------------------------------------------------
 */

:root {
  --color-primary: #ed7f15;
  --color-secondary: #0061ad;
  --color-tertiary: #fafafb;
  --color-title: #0061ad;
  --color-text: #52525b;
}

html :where(.wp-block) {
	max-width: 100% !important;
}

.site-content > *:not(div) {
	margin-left: auto;
	margin-right: auto;
}

html {
  font-size: 16px;
}
/**
 * 1.0 Basic Structure
 * ----------------------------------------------------------------------------
 */
body {
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--color-text);
}

img,
figure {
  max-width: 100%;
}

ul {
  padding: 0;
  margin: 0;
} 
ul li {
  list-style-type: none;
}

a {
  color: var(--color-text);
}
a,
a:hover {
  display: inline-block;
  text-decoration: none;
}
a:hover {
  color: var(--color-primary);
}


h1, .h1,
h4,
h6, .h6 {
  font-weight: 700;
}
h5, .h5 {
  font-weight: 500;
}
h2,
.h4 {
  font-weight: 600;
}

h1, .h1 {
  font-size: 2.5rem;
}
 
 
h2, .h2 {
  font-size: 2rem;
}

h3, .h3 {
  font-size: 1.5rem;
}

h5, .h5, 
h4, .h4 {
  font-size: 1.125rem;
}
h6, 
.h6 {
  font-size: 1rem;
}
h2,
h4, .h4,
h5, .h5,
h6 {
  color: var(--color-title);
}

.secondary-text  {
  color: var(--color-secondary);
}

.vertical-space {
  padding: 3.125rem 0;
}
.vertical-top {
  padding: 3.125rem 0 0;
}
.vertical-bottom {
  padding: 0 0 3.125rem;
}

.edge-space {
  margin: 3.125rem 0;
}
.edge-top {
  margin: 3.125rem 0 0;
}
.edge-bottom {
  margin: 0 0 3.125rem;;
}

.header-logo img {
	max-width: 9rem;
  width: auto;
}
.footer-logo img {
	max-width: 6rem;
}

.logo img {
  max-width: 4rem;
}
.logo-misp img {
  max-width: 12rem;
}

.text-block {
  padding: .5rem 1rem;
  border: 1px solid #e0deda;
  border-radius: 8px;
}
.text-block li {
  white-space: normal;
  word-break: break-word; 
}
.text-block li a {
  background-color: var(--color-primary);
  display: inline-block;
  width: 2.5rem;
  height: 2.5rem;
  line-height: 2.5rem;
  text-align: center;
  border-radius: 100px;
}

.text-block li a:hover svg path {
  stroke: #fff;
}

.view-posts img {
  width: 100%;
  height: auto;
}
.view-posts ul li {
  list-style-type: disc; 
}

.last-posts {
  background-color: #fff7f8;
}

#customForm .customForm-content {
  background-color: var(--color-tertiary);
}

.form-control,
#customForm form .form-control {
  padding: 1rem;
  border-color: #ebedef;
  border-radius: 8px;
}
#customForm form input[type="text"],
#customForm form input[type="email"],
#customForm form input[type="tel"]   {
  height: 3.5rem;
}
#body-search form input[type="search"]:focus,
.form-control:focus,
#customForm form .form-control:focus {
  border-color: var(--color-primary);
  outline: none;
}
.form-control::placeholder,
#customForm form .form-control::placeholder {
  color: #626262;
}
#customForm form textarea {
  resize: none;
  box-shadow: none;
}

#customForm form .btn-primary,
.btn-primary,
.btn-outline-primary {
	padding: 1rem 1.5rem;
  border-radius: 12px;
}
#customForm form .btn-primary,
.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
:not(.btn-check)+.btn:active.btn-primary,
.btn:focus-visible.btn-primary, 
.btn-outline-primary:hover,
.btn-outline-primary:focus,
:not(.btn-check)+.btn:active.btn-outline-primary,
.btn:focus-visible.btn-outline-primary,
.btn:first-child:active.btn-outline-primary {
	background-color: var(--color-primary);
  border-color: var(--color-primary) ;
  box-shadow: var(--color-primary);
  color: #fff;
}
.btn-outline-primary  {
  background-color: #fff;
  border-color: var(--color-primary) ;
  box-shadow: var(--color-primary);
  color: var(--color-primary);
}
 
#show-search, 
#close-search {
  cursor: pointer;
}

#search {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2055;
  background-color:rgba(255, 255, 255, 0.95);
  display: none;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 2rem;
}
#content-search {
  display: flex;
  height: 100%;
}
#body-search {
  display: inline-block;
  width: 100%;
  margin: auto;
}
#close-search {
  position: absolute;
  top: 2rem;
  right: 2rem;
  z-index: 10;
}
#body-search form {
  position: relative;
  display: block;
}
.search-form label {
  display: block;
}
#body-search form input[type="search"] {
  width: 100%;
  padding: 1.125rem 1.25rem;
  border: 1px solid #000;
  border-radius: 12px;
}
#body-search form input[type="submit"] {
  position: absolute;
	top: 50%;
	right: .25rem;
	transform: translateY(-50%);
  background-color: var(--color-primary);
  background-image: url(assets/images/search-outline.svg);
  background-repeat: no-repeat;
  background-position: right 12px center;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 12px;
}

.slick-slide {
  margin: 0 .625rem;
}
.slick-slide > div { 
  height: 100%;
}
.slick-slide img {
  display: inline-block !important;
}
.slick-prev, .slick-next {
  background-color: var(--color-primary) !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 0;
} 
.slick-prev:hover, .slick-next:hover {
  background-color: #fff !important;
  border: 1px solid var(--color-primary) !important;
}
.slick-prev:hover img, .slick-next:hover img {
  filter: brightness(0) saturate(100%) invert(41%) sepia(95%) saturate(902%) hue-rotate(7deg) brightness(104%) contrast(102%);
}
.slick-prev:hover, .slick-next:hover, 
.slick-prev:before, .slick-next:before {
  content: '' !important; 
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.slick-initialized .slick-dots {
  position: relative;
  bottom: auto;
  margin-top: 1rem;
}
.slick-initialized  .slick-dots li button::before {
  font-size: .625rem;
  border-radius: 4px;
  color: var(--color-primary);
}
.slick-initialized  .slick-dots li.slick-active button:before {
  background-color: var(--color-primary);
  margin: .275rem 0;
  width: 1.625rem;
  height: .625rem;
  opacity: 1;
  color: transparent;
}

.nav-links .page-numbers {
  display: inline-block;
  background-color: #f0f0f0;
  text-align: center;
  line-height: 2.5;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 24px;
  color: var(--color-text);
}
.nav-links .page-numbers.current {
  background-color: var(--color-primary);
  color: #fff;
}

.nav-links .page-numbers svg {
  stroke: var(--color-secondary);
}

.call {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1;
  background-color: #2eab1a;
  padding: .5rem .75rem;
  margin-top: 7.5rem;
  border-top-left-radius: 100px;
  border-bottom-left-radius: 100px;
  color: #fff;
}
.call svg {
  width: 1.25rem;
  height: 1.25rem;
}
.call span {
	font-size: 1.5rem;
	font-weight: 600;
	line-height: 1;
}

/**
 * 2.0 Media Queries
 * ----------------------------------------------------------------------------
 */

nav.navbar {
  background-color: var(--color-primary);
}

nav.navbar .navbar-toggler {
  border-color: #fff;
}
nav .navbar-nav .menu-item a {
  position: relative;
  display: block;
  margin: .5rem 0;
}
nav .navbar-nav .menu-item-has-children {
  position: relative;
  margin-right: 0;
}
nav .navbar-nav .menu-item-has-children > a::before  {
  content: '';
  background-image: url(assets/images/down.svg);
	background-repeat: no-repeat;
	background-position: center;
  position: absolute;
  top: 0;
  right: 0;
  width: 1rem;
  height: 1rem;
  transition: transform 0.2s ease-in-out;
} 
nav .navbar-nav .menu-item-has-children >  a[aria-expanded="true"]::before {
  transform: rotate(-180deg); 
}

nav .navbar-nav .current-menu-ancestor a,
nav .navbar-nav .menu-item a[aria-current="page"]{
  font-weight: 500;
  color: var(--color-primary);
}

nav .navbar-nav .menu-item .sub-menu .menu-item a {
  font-size: .875rem;
  padding: 0.5rem 0.75rem;
  margin: 0;
  color: var(--color-secondary);
} 
nav .navbar-nav .menu-item .sub-menu .menu-item a:hover {
  background-color: rgba(240, 126, 1, .1);
}
nav .navbar-nav .menu-item .sub-menu .menu-item a:hover,
nav .navbar-nav .menu-item .sub-menu .menu-item a[aria-current="page"] {
  color: var(--color-primary);
}

#carouselCaptions .carousel-indicators {
  top: auto;
  left: 50%;
  right: auto;
  width: auto;
  margin: 0 0 1.5rem;
  transform: translate(-50%);
}
#carouselCaptions .carousel-indicators [data-bs-target] {
  background-color: #fff;
  width: 8px;
  height: 8px;
  padding: 0;
  margin: 0 4px;
  border-radius: 8px;
  border-top: 0;
  border-bottom: 0;
  opacity: 1;
}
#carouselCaptions .carousel-indicators .active {
  background-color: var(--color-primary);
}
.carousel-item {
  min-height: 450px;
  height: calc(-250px + 100vh);
  background-position: center center;
  color: #fff;
}

.bg-default {
  background: linear-gradient(rgba(68, 84, 106, 1), rgba(68, 84, 106, 1));
}
.bg-image {
  background: linear-gradient(rgba(68, 84, 106, .6), rgba(68, 84, 106, .6)), var(--url_carousel) no-repeat;
  background-size: cover;
}

.banner {
  background-color: var(--color-secondary);
  color: #fff;
}

.partner {
  background-color: var(--color-tertiary);
}
.partner-slick .slick-slide img {
  max-width: 200px;
  width: auto;
  max-height: 4rem;
  height: auto;
}

.service-item {
  background-color: var(--color-tertiary);
  padding: 1.5rem;
  height: 100%;
}
.service-icon {
  display: inline-block ;
}

.slick-service-prev.slick-prev, .slick-posts-prev.slick-prev,  
.slick-service-next.slick-next, .slick-posts-next.slick-next {
	position: relative;
	top: auto;
	left: auto !important;
	right: auto !important;
	display: inline-block;
	-webkit-transform: none;
	-ms-transform: none;
	transform: none;
}

.about {
  position: relative;
}
.about-header,
.about-content {
  background-color: var(--color-tertiary);
}

.section-description p {
  margin-bottom: 0;
}
.section-content h2, .section-content h3 {
  margin-bottom: 1rem;
  color: var(--color-primary);
}
.section-content h4, .section-content h5 {
  margin-bottom: 1rem;
  color: var(--color-secondary);
}
.section-content ul {
  margin: 0 0 1rem 1.5rem;
}
.section-content ul li {
  list-style-type: disc; 
}
.section-img {
  position: relative;
  z-index: 1;
}
.section-img::before {
  background-color: var(--color-primary);
  content: '';
  position: absolute;
  top: 0;
  z-index: -1;
  width: 170px;
  height: 110px;
}
.section-img-left::before {
  left: 0;
}
.section-img-right::before {
  right: 0;
}

.training_item {
  background-color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  text-align: center;
  transform: translate(-50%, -50%);  
}

.newsletter {
  background-color: var(--color-tertiary);
  padding: 3.125rem 0;
}
.newsletter #customForm form {
  position: relative;
}
.newsletter #customForm form input[type="email"] {
  height: 3rem;
}
.newsletter #customForm form .gform-footer input[type="submit"] {
  position: absolute;
  top: 0;
  right: 0;
  background-image: url(assets/images/btn-icon.svg);
  background-repeat: no-repeat;
  background-size: 20px 20px;
  background-position: right 10px center;
  padding-right: 40px;
  margin-top: 0;
}

.newsletter #customForm form .btn-primary {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

footer, footer a {
  color: #fff;
}
footer section:first-child {
  background-color: var(--color-secondary);
}
footer section:first-child .h6 + ul li,
footer section:first-child .h6 + div ul li {
  margin: .375rem 0;
}
.custom-link a:hover img {
  filter: brightness(0) saturate(100%) invert(41%) sepia(95%) saturate(902%) hue-rotate(7deg) brightness(104%) contrast(102%);
}

footer section:last-child {
  background-color: var(--color-primary);
}
footer section:last-child a,
footer section:last-child a:hover {
  font-weight: 700;
  color: #fff;
}

/* WordPress Media Queries */
@media (max-width: 600.98px) {
}
@media (min-width: 601px) and (max-width: 782.98px) {
}
@media (min-width: 783px) {
}

/* X-Small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
  .site-content > *:not(div) {
		max-width: calc(100% - 24px);
	}
}

@media (min-width: 576px) {
 	.site-content > *:not(div) {
		max-width: 540px;
	}
}

/* Small devices (landscape phones, 576px, up to 768px) */
@media (min-width: 576px) and (max-width: 767.98px) {
}

/* Medium devices (tablets, 768px, up to 992px) */
@media (min-width: 768px) and (max-width: 991.98px) {
}
/* Medium devices (tablets, 768px) */
@media (min-width: 768px)   {
  .site-content > *:not(div) {
		max-width: 720px;
	}

  .header-logo img {
	  max-width: 14rem;
  }

  .call {
    padding: .75rem 1rem;
    margin-top: 14.875rem;
  }
  .call svg {
    width: 1.5rem;
    height: 1.5rem;
  }
  .call span {
    font-size: 1.75rem;
  }
}
 
/* Large devices (desktops, 992px) */
@media (min-width: 992px)  {

  .site-content > *:not(div) {
		max-width: 960px;
	}

  h1 {
    font-size: 5rem;
  }
  .h1 {
    font-size: 3.5rem;
  }
  h2, .h2 {
    font-size: 2.5rem;
  }
  h4, .h4 {
    font-size: 1.25rem;
  }

  .vertical-space {
    padding: 6.25rem 0;
  }
  .vertical-top {
    padding: 6.125rem 0 0;
  }
  .vertical-bottom {
    padding: 0 0 6.125rem;
  }

  .edge-space {
    margin: 6.25rem 0;
  }
  .edge-top {
    margin: 6.125rem 0 0;
  }
  .edge-bottom {
    margin: 0 0 6.125rem;
  }

  #body-search form {
    max-width: 720px;
    margin: 0 auto;
  }

  .service-item {
    padding: 2rem;
  }

  .about-image-right {
		position: absolute;
		top: 0;
		right: 55%;
    width: 45%;
		height: 100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}
	.about-image-left {
		position: absolute;
		top: 0;
		left: 55%;
    width: 45%;
		height: 100%;
		background-repeat: no-repeat;
		background-size: cover;
		background-position: center;
	}

  .section-sticky {
    position: sticky;
    top: 2rem;
  }

}

@media (min-width: 1200px) {
	.site-content > *:not(div) {
		max-width: 1140px;
	}
  
  .menu-navigation-menu-container {
    margin: 0 auto;
  }
	nav .navbar-nav .menu-item {
		padding: 10px .75rem;
	}
  nav .navbar-nav .menu-item a, 
  nav .navbar-nav .menu-item a:hover {
    margin: 0;
    color: #fff;
  }
  nav .navbar-nav .menu-item .sub-menu .menu-item  {
    padding: 0;
  }
  nav .navbar-nav .menu-item-has-children > a::before  {
    background-image: url(assets/images/down-line.svg);
    top: 50%; 
    right: -1rem;
    transform: translateY(-50%);
  } 
  nav .navbar-nav .menu-item-has-children:hover > a::before {
    transform: translateY(-50%) rotate(-180deg); 
  } 
  nav .navbar-nav .menu-item .sub-menu {
    background-color: #fff;
    display: none;
    overflow: hidden;
    position: absolute;
    top: 100%;   
    left: 0;
    z-index: 99;
    width: 250px;
    border-radius: 8px;
    box-shadow: 0px 4px 18px 0px rgba(0, 0, 0, 0.05);
  }
  nav .navbar-nav .menu-item-has-children:hover .sub-menu {
    display: block;
  }
  nav .navbar-nav .current-menu-ancestor a,
  nav .navbar-nav .menu-item a[aria-current="page"] {
    color: #fff;
  }

}

/* X-Large devices (large desktops, 1200px, up to 1400px) */
@media (min-width: 1200px) and (max-width: 1399.98px) {
}

/* Large devices (desktops, 992px, up to 1200px) */
@media (min-width: 992px) and (max-width: 1199.98px) {
}

/* X-Large devices (large desktops, 1200px, up to 1400px) */
@media (min-width: 1200px) and (max-width: 1399.98px) {
}

/* XX-Large devices (larger desktops, 1400px and up) */
@media (min-width: 1400px) {
  .site-content > *:not(div) {
		max-width: 1320px;
	}
}