/*
    Theme Name: WPS-WPT-00
    Theme URI: N/A
    Author: 
    Author URI: N/A
    Description: WordPress theme for informative services website
    Version: 1.0.1
    License: GNU General Public License v2 or later
    License URI: https://www.gnu.org/licenses/gpl-2.0.html
    Text Domain: wpswpt00
    Tags: responsive, earthy, warm, minimal, informative
*/

/* ===============================
   COLOR VARIABLES
   =============================== */
:root {
    
  /* Brand Colors */
  --bs-primary: #8B4513;    /* Saddle Brown - headers, buttons, menu */
  --bs-secondary: #D2691E;  /* Chocolate / Rust - accent CTA */
  --bs-accent1: #FFDEAD;    /* Navajo White - backgrounds, cards */
  --bs-accent2: #556B2F;    /* Dark Olive Green - decorative */
  --bs-highlight: #B22222;  /* Firebrick Red - optional highlight */

  /* Neutrals */
  --bs-neutral-light: #FFF8E1; /* Light Cream */
  --bs-neutral-dark: #333333;  /* Charcoal */

  /* Base Text Colors */
  --bs-body-bg: var(--bs-neutral-light);
  --bs-body-color: var(--bs-neutral-dark);

  /* Typography */
  --font-heading: "Poppins", "Montserrat", sans-serif;
  --font-body: "Open Sans", "Roboto", sans-serif;

  --font-size-base: 16px;
  --line-height-base: 1.6;
  
}

/* ===============================
   BUTTONS
   =============================== */
	.btn-primary {
	  background-color: var(--bs-primary);
	  border-color: var(--bs-primary);
	  color: #fff;
	}
	.btn-primary:hover {
	  background-color: #7a3f10;
	  border-color: #7a3f10;
	}

	.btn-secondary {
	  background-color: var(--bs-secondary);
	  border-color: var(--bs-secondary);
	  color: #fff;
	}
	.btn-secondary:hover {
	  background-color: #b85d1a;
	  border-color: #b85d1a;
	}

	.btn-highlight {
	  background-color: var(--bs-highlight);
	  border-color: var(--bs-highlight);
	  color: #fff;
	}
	.btn-highlight:hover {
	  background-color: #9a1c1c;
	  border-color: #9a1c1c;
}

/* ===============================
   CONTENT SECTIONS
   =============================== */
section {
  padding: 4rem 0;
}

.bg-accent1 {
  background-color: var(--bs-accent1) !important;
}
.bg-accent2 {
  background-color: var(--bs-neutral-light) !important;
}
.bg-neutral-light {
  background-color: var(--bs-neutral-light) !important;
}
.bg-neutral-dark {
  background-color: var(--bs-neutral-dark) !important;
  color: var(--bs-accent1);
}

/* Alternate background styling */
.section-alt:nth-child(even) {
  background-color: var(--bs-accent1);
}
.section-alt:nth-child(odd) {
  background-color: var(--bs-neutral-light);
}

* {
    -webkit-text-size-adjust: none;
}
html {
    width: 100%;
}
a[href^="tel:"] {
    color: inherit;
	text-decoration: none;
}
p{
	/* text-align: justify; */
}
h1{
	padding-top:4px;
	font-weight:normal;
	font-size:40px;
	color: var(--bs-primary);
}
h2{
	font-weight:bold;
	font-size:32px;
	color: var(--bs-primary);
}
h3{
	color: var(--bs-primary);	
	font-weight:bold;
	font-size:24px;
}
h4,h5,h6{
	font-weight:bold;
	font-size:20px;
}
body{
	font-family: var(--font-body);
	font-size: var(--font-size-base);
	line-height: var(--line-height-base);
	background-color: var(--bs-body-bg);
	color: var(--bs-body-color);
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 0;
	padding-bottom: 1%;
}
#site-main-container{
}
#site-pre-header{	
	padding-right:1%;
	background-color: var(--bs-neutral-light);
}
#site-pre-header .bi{
	color:var(--bs-primary);
}
#site-header-top{
	background-color:var(--bs-primary);
	color:white;
}
#site-header-top .navbar-brand{
	font-weight:bold;
	color:var(--bs-neutral-light);
}

/* Menu container */
#site-header-top .navbar {
    background-color: var(--bs-primary); 
}

/* Menu items */
#site-header-top .navbar-nav .nav-link {
    color:var(--bs-neutral-light);
}

/* Hover effect */
#site-header-top .navbar-nav .nav-link:hover {
    border-bottom:5px solid var(--bs-neutral-light);
	border-bottom-style: double;
	color:var(--bs-neutral-light);
}
#collapsible-navbar .menu-item{
    padding:5px;
}
#collapsible-navbar .menu-item a {
    color: var(--bs-neutral-light);
    text-decoration: none;
    display: inline-block;                 /* important */
    border-bottom: 5px double transparent;  /* reserve space */
}
#site-banner{	
	margin-bottom:0;
	padding:0%;
}
#site-banner label{
	font-size:32px;
	font-weight:bold;
}
#site-banner p{
	font-size:22px;
	font-weight:normal;
}

#site-banner-carousel .carousel-inner {
  max-width: 1200px;
  /*max-height: 400px;*/
}   

/* ===============================
   Carousel Image Ratio
   =============================== */
   
.default-ratio{
    padding-top: 15%;
}

.front-ratio{
    padding-top: 35%;
}
.archive-ratio{
    padding-top: 15%;
}
.page-ratio{
    padding-top: 15%;
}

.carousel-img {
  position: relative;
  width: 100%;
  height:0;
  overflow: hidden;
}

/* image positioning */
.carousel-img img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* very important */
}
.carousel-item {
  color: #2C4964;
  font-weight: bold;
}
.carousel-item img {
  opacity: 0.25;
}
.carousel-caption{
    top:20%;
}
.carousel-caption h2 {
  font-weight: bold;
  color: #2C4964;
}
.carousel-caption p {
  font-weight: bold;
  color: #000;
}
#site-contents-container{
	background-color:transparent;
	margin:0;
	padding:1%;
	/* min-height:350px; */
}
#site-breadcrumb, .breadcrumb{
	background-color:#f1f7fd;
}

/* ===============================
   Inside Loop General
   =============================== */
   /*
   .entry-header{
       
   }
   .entry-content{
       
   }    
   */
   
/* ===============================
   Inside Loop
   =============================== */
   /*
   .post-thumbnail, 
   .service-thumbnail{
       
   }
   */   
   
   .post-content,
   .service-content{
       text-align: justify;
       text-justify: inter-word;
   }
   
   /*
   .comments-section{ 
   }       
   
   .post-navigation,
   .service-navigation{
       
   }
    */
   

#site-footer-container{
	background-color:var(--bs-neutral-dark);
	color:var(--bs-neutral-light);
}
#site-footer h5{
	color:var(--bs-accent1);
}

#site-footer a{
	color: var(--bs-secondary);
	text-decoration: none;;
}
#site-footer a:hover{
	color: var(--bs-accent1);
}
#site-footer input{
	max-width:200px;
}
#site-footer button{
	color:black;
	background-color:silver;
}
#site-footer .bi{
	font-size:24px;
}
#site-footer-bottom{
	background-color:var(--bs-accent2);
	color:white;
}

/* ===============================
   Back To Top
   =============================== */
#back-to-top {
    position: fixed;
    bottom: 45px;
    right: 10px;
    z-index: 99999999;
}
#back-to-top a {
    width: 40px;
    display: block;
    text-align: center;
    -webkit-transition: 1s;
    -moz-transition: 1s;
    transition: 1s;
    opacity: 0.7;
}
#back-to-top a:hover {
    opacity: 1;
}
#back-to-top span {
    width: 40px;
    height: 40px;
    display: block;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    /* background-color: #F4C700; */
	background-color:var(--bs-primary);
}
#back-to-top span:before {
    font-family: 'FontAwesome';
    content: "\f106";
    line-height: 40px;
    font-size: 25px;
    color: #fff;
}
/* Ends back to top ---------------------- */

/* ===============================
   Sidebar Right
   =============================== */

/*
.post-sidebar,
.service-sidebar {
    
}
*/

.sidebar-right {
    width: 300px;
    float: left;
    padding: 20px;
}

.sidebar-right .widget {
    margin-bottom: 30px;
}

.sidebar-right .widget-title {
    font-weight: bold;
    margin-bottom: 15px;
}

.sidebar-right .social-links li {
    list-style: none;
    margin-bottom: 5px;
}

.sidebar-right .social-links li a {
    text-decoration: none;
    /* color: #333; */
	color: #fff
}

/* ===============================
   .post-navigaton nav-links 
   =============================== */
.post-navigation .nav-links{
    width:100%;
    display: flex;
    justify-content: space-between; 
    align-items:center;
}

/* ===============================
   404
   =============================== */
   .page-404{
    min-height:400px; 
    padding-top:60px; 
    padding-bottom:60px;       
   }    


/* Responsive CSS
***************************************************************/

/* Extra Small devices */
/*
@media (min-width: 320px) and (max-width: 479.98px) {
	
N/A
}
*/

/* XS: Extra Small devices */
@media (max-width: 480px) {
	
    .default-ratio{
        padding-top: 25%;
    }
    .front-ratio{
        padding-top: 100%;
    }
    .archive-ratio{
        padding-top: 25%;
    }
    .page-ratio{
        padding-top: 25%;
    }
    .carousel-caption{
        top:10%;   
    }
    .carousel-caption h1{
		font-size:24px;
	}
	.carousel-caption p{
		/*display:none;*/
	}
	#features-section h2 {
	    text-align:center;
	}
	#features-section .row ul{
	    text-align:center; 
	}
	#quick-contact-section{
	    text-align:center; 
	}
}

/* SM:Small devices */
@media (min-width: 481px) and (max-width: 768px) {
	
	.default-ratio{
        padding-top: 22%;
    }
	.front-ratio{
        padding-top: 70%;
    }
    .archive-ratio{
        padding-top: 22%;
    }
    .page-ratio{
        padding-top: 22%;
    }
    .carousel-caption{
        top:5%;   
    }
    .carousel-caption h1{
		font-size:22px;
	}
	#features-section h2 {
	    text-align:center;
	}
	#features-section .row ul{
	    text-align:center; 
	}
	#quick-contact-section{
	    text-align:center; 
	}
}

/* MD: Medium devices */
@media (min-width: 769px) and (max-width: 1024px) {
	.carousel-caption h1{
		font-size:32px;
	}
	.carousel-caption{
        top:5%;   
    }
}
/* LG: Large devices */
@media (min-width: 1025px) {
    .carousel-caption{
        top:25%;
    }
	.carousel-caption h1{
		font-size:42px;
	}
}

/* Ends Responsive CSS 
************************************************/