/* ----------------------------------------------------------------
Custom CSS

Add all your Custom Styled CSS here for New Styles or
Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/
.textgold{
	color: #C6C09C !important;
}

.textaccent{
	color: #ffcc66 !important;
}

.textdarkaccent{
	color: #e5b84d !important;
}

.filldarkaccent{
    fill: #e5b84d !important;
}

.textwhite{
	color: #ffffff !important;
}

.textblack{
	color: #000000 !important;
}

.textblue{
	color: #003467 !important;
}

.bgblue{
	background-color: #003467 !important;
}

.bgbrick{
	background-image: url('demos/agency/images/image2.png') !important; /* Path to your custom image */
    background-position: center center !important; /* Center the image */
}

.bgwhite{
	background-color: #ffffff !important;
}

.bgblack{
	background-color: #000000 !important;
}

.bggrey{
	background-color: #4c555f !important;
}

.bggold{
    background-color: #C6C09C !important;
}

html, body {
	overflow-x: hidden !important; /* Prevent horizontal scrolling */
}

.custom-btn {
	font-size: 1.25rem; /* Increase the font size */
	padding: 15px 30px; /* Increase padding (top-bottom, left-right) */
	border-radius: 5px; /* Optional: to make the corners slightly rounded */
}

.primary-menu .menu-link:hover {
    color: #267DF4 !important; /* Background color on hover */
}

.textjustify{
	text-align: justify !important;
}

.textleft{
	text-align: left !important;
}

.textcenter{
	text-align: center !important;
}

@font-face {
    font-family: 'Open Sans';
    src: url('fonts/OpenSans-Regular.otf') format('opentype');
}

@font-face {
    font-family: 'Trade Gothic';
    src: url('fonts/Trade\ Gothic\ LT\ Bold.otf') format('opentype');
}

@font-face {
    font-family: 'Banana';
    src: url('fonts/FreshBanana-aYLMm.otf') format('opentype');
}

.opensans {
    font-family: 'Open Sans', sans-serif !important;
}

.tradegothic {
    font-family: 'Trade Gothic', sans-serif !important;
}

.banana-font {
    font-family: 'Banana', sans-serif !important; 
}

.text32 {
    font-size: 32px !important; /* Font size of 36 pixels */
}

.text20 {
    font-size: 20px !important; /* Font size of 36 pixels */
}

.text18 {
    font-size: 18px !important; /* Font size of 36 pixels */
}

.text16 {
    font-size: 16px !important; /* Font size of 36 pixels */
}

.text12 {
    font-size: 12px !important; /* Font size of 36 pixels */
}

.text14 {
    font-size: 14px !important; /* Font size of 36 pixels */
}

.text86 {
    font-size: 90px !important; /* Font size of 36 pixels */
    letter-spacing: 0 !important; /* Letter spacing of 100 */
    line-height: 0.4 !important; /* Line spacing of 1.4 */
}


.text30 {
    font-size: 30px !important; /* Font size of 36 pixels */
    letter-spacing: 0 !important; /* Letter spacing of 100 */
    line-height: 0.8 !important; /* Line spacing of 1.4 */
}

.text24 {
    font-size: 24px !important; /* Font size of 36 pixels */
    letter-spacing: 0 !important; /* Letter spacing of 100 */
    line-height: 0.8 !important; /* Line spacing of 1.4 */
}

.text42 {
    font-size: 42px !important; /* Font size of 36 pixels */
    letter-spacing: 25 !important; /* Letter spacing of 100 */
    line-height: 1.4 !important; /* Line spacing of 1.4 */
}

.feature-box.media-box img {
    max-width: 80px; /* Set the maximum width of the icon */
    max-height: 80px; /* Set the maximum height of the icon */
    width: 100%; /* Ensure the icon scales properly */
    height: auto; /* Maintain the aspect ratio */
    margin-bottom: 20px; /* Optional: Space between the icon and the text */
}

.feature-box.media-box {
    display: flex;
    flex-direction: column;
    align-items: center; /* Center the icon and content */
    text-align: center; /* Center the text */
}

/* Media query for mobile devices */
@media (max-width: 767px) {
    .col-lg-6.center.col-padding {
        background-size: contain; /* Adjust as needed: 'contain' or a larger percentage */
        background-position: center center;
        min-height: 700px; /* Ensure the background image is visible on small screens */
    }
}

::selection {
    background-color: #beac08;  /* Background color */
    color: white;               /* Text color */
  }

  /* Slideshow container */
.slideshow-container {
    position: relative;
    width: 100%;
    max-width: 340px; /* Set this according to your image width */
    margin: auto;
}

/* Hide all images by default */
.mySlides {
    display: none;
}

/* Fade effect */
.fade {
    animation: fade 1s ease-in-out;
}

@keyframes fade {
    0% { opacity: 0; }
    20% { opacity: 1; }
    80% { opacity: 1; }
    100% { opacity: 0; }
}

@media (max-width: 768px) {
    .menu-item.current .menu-link {
        color: #C6C09C !important; /* Change current page text color to gold on mobile */
    }
}

header {
    background-color: transparent !important; /* Change to your desired color */
}

.justified-text {
    text-align: justify;
    text-align-last: justify;
  }

#header.transparent-header {
    background: transparent !important;
    box-shadow: none !important;
}
  
#portfolio {
    padding: 60px 0;
    background-color: #fff;
  }
  
  .portfolio-img {
    width: 100%;
    height: 500px; /* uniform height */
    object-fit: cover; /* crop neatly */
    transition: transform 0.3s ease, box-shadow 0.3s ease;
  }
  
  .portfolio-img:hover {
    transform: scale(1.05);
    box-shadow: 0 4px 20px rgba(0,0,0,0.2);
  }
  
  .portfolio-item p {
    font-size: 1rem;
    color: #333;
    margin-top: 10px;
  }