/*
Template Name: Pet Love
Author: Ingrid Kuhn
Author URI: themeforest/user/ingridk
Version: 1.0
Last change: 28th February 2024

	Table of Contents
    #Root settings
	#General and Typography
	#Custom Elements
	#Responsive

/* Import color styles */

@import url("../styles/maincolors.css");

/*********** Root Settings ***********/
 :root {
	--font1: 'Baloo Thambi 2', sans-serif;
	--font2: 'Inter', sans-serif;
	--bs-border-radius: 2rem;
	--form-border-radius: 15px;
	--bs-btn-padding-x: 0.9rem;
	--bs-btn-padding-y: 0.4rem;
	--fw-medium: 600;
	--fw-bold: 700;
	--main-mb: 0.5em;
	--main-mt: 0.5em;
	--transition: all ease-in-out 0.3s;
	--bs-body-color: #7A7A7A;
	--bs-body-bg: #fff;
	--bs-black: #000000;
	--bs-link-color: #003049;
	--bs-link-hover-color: #cca000;
	--bs-code-color: #d63384;
	--bs-highlight-bg: #fff4cc;
	--bs-disabled:#cecece!important;
}
/*********** General and Typography ***********/
 html {
     overflow-x: hidden;
}
 body, p {
     color:#000;
     font-family: var(--font2);
     line-height: 1.5;
}
 a {
     transition: var(--transition);
     text-decoration: none;
     color: var(--bs-primary);
}
 a:hover, a:active {
     color: var(--bs-secondary);
}
 h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
     font-family: var(--font1);
     color: var(--bs-primary);
     font-weight: var(--fw-medium);
}
.lead {
    font-family: var(--font1);
    color: #79b8c0;
    text-transform: uppercase;
    font-weight: var(--fw-bold);
    font-size: 1.020rem;
    letter-spacing: 1.3px;
}

:root {
    --bs-primary: #50372f !important;
    --bs-primary-rgb: 0, 48, 53;
    --bs-secondary: #b8d034;
    --bs-dark: #b8d034;
    --bs-border-color: #f6ffc2;
    --bs-light: #FFF3E7;
}
 .text-secondary {
     color: var(--bs-secondary)!important;
}
 .h1, h1 {
     font-size: 4.925rem;
}
 .h2, h2 {
     margin-bottom: var(--main-mb);
    font-size: 2.375rem;
}
 .h3, h3 {
     margin-bottom: var(--main-mb);
     font-size: 2.75rem;
}
 .h4, h4 {
     font-size: 2rem;
}
 .h5, h5 {
     color: var(--bs-black);
     font-size: 1.56rem;
}
 .h6, h6 {
     color: var(--bs-black);
     font-size: 1.3rem;
}
/* blockquote*/
 blockquote, .blockquote {
     padding: 2em;
     margin: 2em 0;
     font-style: italic;
     border: 2px solid var(--bs-light);
}
 .blockquote:before, blockquote:before {
     position: absolute;
     font-family: 'Font Awesome 6 Free';
     font-weight: 900;
     content: "\f10d";
     font-size: 50px;
     color: var(--bs-dark);
     margin-top: -70px;
     margin-left: -40px;
}
 .blockquote-footer {
     margin-top: 1rem;
}
/* navbar */
 .navbar-nav {
     text-align: center;
}
 .nav-item {
     transition: var(--transition);
}
 .nav-item:hover .nav-link {
     transform: scale(1.1);
}
 .nav-link {
     transition: var(--transition);
     color: var(--bs-body-bg);
     font-weight: var(--fw-medium);
}
.nav-item.dropdown.active > a,.nav-link:focus, .nav-link:hover, .navbar-nav .nav-link.active, .navbar-nav .nav-link.show {
     color: #b8d034;
}
 .navbar-toggler {
     transition: var(--transition);
     background-color: var(--bs-body-bg);
}
 .navbar-toggler:hover {
     background-color: var(--bs-dark);
}
 .dropdown-item {
     color: var(--bs-body-bg);
    text-align: left;
    padding: 5px 15px 5px 15px;
    line-height: 29px;
}
 .dropdown-menu {
     padding:0;
     border-radius: 1rem;
     background-color: var(--bs-primary);
}

 .dropdown-menu li:last-child a:focus, .dropdown-menu li:last-child a:hover, .dropdown-menu li:last-child a.active {
     border-radius: 0 0 1rem 1rem;
}
 .dropdown-item.active, .dropdown-item:active, .dropdown-item:focus, .dropdown-item:hover {
     color: var(--bs-primary);
     background-color: var(--bs-dark);
}
/* bg */
 .bg-primary {
     background-color: #50372f !important ;
}
 .bg-secondary {
     background-color: var(--bs-secondary) !important;
}
/* accordion*/
 .accordion-item {
     border: 0;
}
 .accordion-button {
     font-family: var(--font1);
     color: var(--bs-primary);
     font-size: 20px;
     font-weight: var(--fw-medium);
     line-height: 1.2em;
     padding: 0.7em 0;
}
 .accordion-button:focus, .accordion-button:hover, .accordion-button:not(.collapsed) {
     background-color: var(--bs-body-bg);
     color: var(--bs-black);
     box-shadow: none;
     outline: 0;
     border: 0;
}
/* Buttons */
 .btn-primary {
     --bs-btn-color: var(--bs-body-bg);
     --bs-btn-bg: var(--bs-secondary);
     --bs-btn-border-color: var(--bs-secondary);
     --bs-btn-hover-color: var(--bs-body-bg);
     --bs-btn-hover-bg: var(--bs-dark);
     --bs-btn-hover-border-color: var(--bs-dark);
     --bs-btn-active-color: var(--bs-body-bg);
     --bs-btn-active-bg: var(--bs-primary);
     --bs-btn-active-border-color: var(--bs-primary);
}
 .btn-secondary {
     --bs-btn-color: var(--bs-body-bg);
     --bs-btn-bg: var(--bs-primary);
     --bs-btn-border-color: var(--bs-primary);
     --bs-btn-hover-color: var(--bs-body-bg);
     --bs-btn-hover-bg: var(--bs-secondary);
     --bs-btn-hover-border-color: var(--bs-secondary);
     --bs-btn-active-color: var(--bs-body-bg);
     --bs-btn-active-bg: var(--bs-secondary);
     --bs-btn-active-border-color: var(--bs-secondary);
}
 .btn-outline-primary {
     --bs-btn-color: var(--bs-secondary);
     --bs-btn-border-color: var(--bs-secondary);
     --bs-btn-hover-color: var(--bs-body-bg);
     --bs-btn-hover-bg: var(--bs-primary);
     --bs-btn-hover-border-color: var(--bs-primary);
     --bs-btn-active-color: var(--bs-body-bg);
     --bs-btn-active-bg: var(--bs-secondary);
     --bs-btn-active-border-color: var(--bs-secondary);
}
.btn-outline-secondary {
	 --bs-btn-color: var(--bs-primary);
     --bs-btn-border-color: var(--bs-primary);
     --bs-btn-hover-color: var(--bs-body-bg);
     --bs-btn-hover-bg: var(--bs-secondary);
     --bs-btn-hover-border-color: var(--bs-secondary);
     --bs-btn-active-color: var(--bs-body-bg);
     --bs-btn-active-bg: var(--bs-primary);
     --bs-btn-active-border-color: var(--bs-primary);

}
 .btn {
     transition: background ease-in-out 0.2s;
     margin-top: var(--main-mt);
     border-radius: var(--bs-border-radius);
     font-family: var(--font1);
     font-weight: var(--fw-medium);
     --bs-btn-padding-y: 0.75rem;
     --bs-btn-padding-x: 1.9rem;
     --bs-btn-font-size: 1.2rem;
     --bs-btn-disabled-bg: var(--bs-disabled);
     --bs-btn-disabled-border-color: var(--bs-disabled);
}
 .btn-group-sm>.btn, .btn-sm {
     --bs-btn-padding-y: 0.55rem;
     --bs-btn-padding-x: 1.8rem;
     font-size: 1em;
}
 .btn-group-lg>.btn, .btn-lg {
     --bs-btn-padding-y: 0.8rem;
     --bs-btn-padding-x: 1.9rem;
     --bs-btn-font-size: 1.45rem;
}
/* blog */
 .recent-posts .img-recent {
     max-width: 80px;
     float: left;
     border-radius: 50%;
}
 .recent-posts img {
     border:5px solid transparent;
     transition: var(--transition);
}
 .recent-posts li:hover img {
     transform:scale(1.1)rotate(20deg);
     border:5px solid var(--bs-dark);
}
 .recent-posts li{
     border-top:1px solid var(--bs-dark);
     background: var(--bs-body-bg);
     margin-bottom: 0.5em;
     padding: 1em;
     border-radius: var(--bs-border-radius);
}
 .blog-post-meta i{
     color:var(--bs-dark);
}
/*blog style1 - boxes */
 .blog-box {
     position: relative;
     overflow: hidden;
     width: 100%;
     background-color: var(--bs-light);
     text-align: left;
     margin-bottom: 30px;
     border-radius:var(--bs-border-radius);
}
 .blog-box * {
     -webkit-transition: all 0.3s ease;
}
 .blog-box .image {
     overflow: hidden;
}
 .blog-box img {
     max-width: 100%;
     vertical-align: top;
     position: relative;
}
 .blog-box .blog-box-caption {
     padding: 35px 25px 0px 25px;
     position: relative;
     background-color: var(--bs-light);
}
 .blog-box .date {
     top: -25px;
     color: #fff;
     left: 15px;
     min-height: 48px;
     min-width: 48px;
     position: absolute;
     text-align: center;
     font-size: 20px;
     font-weight: 700;
     text-transform: uppercase;
     background: var(--bs-dark);
}
 .blog-box .date span {
     display: block;
     line-height: 24px;
}
 .blog-box .date .month {
     font-size: 14px;
     background-color: rgba(0, 0, 0, 0.1);
}
 .blog-box .btn {
     margin-top: 20px;
}
 .blog-box h3, .blog-box p {
     margin: 0;
     padding: 0;
}
 .blog-box h4 {
     min-height: 50px;
     margin-top: 20px;
     display: inline-block;
}
 .blog-box p {
     margin-bottom: 20px;
}
 .blog-box .blog-box-footer {
     padding: 20px 25px 35px 20px;
     font-size: 0.9em;
     text-align: center;
     background-color: var(--bs-light);
}
 .blog-box .blog-box-footer > div {
     display: inline-block;
     margin-left: 10px;
     font-weight: 600;
}
 .blog-box .blog-box-footer i {
     margin: 0 5px ;
}
 .blog-box:hover img{
     -webkit-transform: scale(1.15);
     transform: scale(1.15);
}
/*blog style2 - cards */
 .blog-card .post-info{
     font-weight: 700;
     margin-bottom:2em;
     margin-top:1em;
}
 .blog-card .post-info i{
     margin-right:5px;
}
 .blog-card .card-body{
     padding:3em;
}
 .card.blog-card{
     overflow: hidden;
     background:var(--bs-light);
     border-radius:var(--bs-border-radius);
     margin-bottom:3em;
}
 .blog-card .card-img-top{
     transition: all .3s ease-out;
}
 .blog-card .blog-img{
     overflow:hidden;
}
 .blog-card:hover .card-img-top{
     transform:scale(1.1);
}

/* forms */
 label {
     margin-bottom: 0.2em;
}
 .form-check-input:checked {
     background-color: var(--bs-primary);
     border-color: var(--bs-primary);
}
 .form-control, .form-select {
     border-radius: var(--form-border-radius);
}
 .form-check-input:focus, .form-control:focus, .form-select:focus {
     border-color: var(--bs-primary-rgb);
     box-shadow: 0 0 0 0.25rem rgb(var(--bs-primary-rgb), 10%);
}
 input[type="range"]:focus::-webkit-slider-thumb {
     background: var(--bs-secondary);
     outline: 0;
}
 input[type=range]::-webkit-slider-thumb {
     height: 30px;
     width: 15px;
     border-radius: 5px;
     background: var(--bs-primary);
     cursor: pointer;
     -webkit-appearance: none;
     margin-top: -11px;
}
 form.site-form .alert{
     margin: 1em 0;
     padding: 20px;
     text-align: center;
}
 form.site-form .alert i{
     font-size: 50px;
     margin-bottom: 0.5em;
     display: block;
}
 #spinner-form{
    display:none;
}
/* Nav pills */
 .nav-pills {
     --bs-nav-pills-border-radius: var(--bs-border-radius);
     --bs-nav-pills-link-active-color: var(--bs-body-bg);
     --bs-nav-pills-link-active-bg: var(--bs-secondary);
}
/* bg */
 .bg-light {
         background-color: #fff3e7b3 !important;
}
/* Pagination */
 .page-link:hover, .page-link:focus, .active>.page-link, .page-link.active {
     color: var(--bs-body-bg);
     background-color: var(--bs-secondary);
     border-color: var(--bs-secondary);
     box-shadow:none;
}
 .page-link {
     border: var(--bs-primary);
     color: var(--bs-body-bg);
     background-color: var(--bs-primary);
}
/*********** Custom Elements ***********/
 .navbar-brand img {
         max-height: 61px;
    border-radius: 8px;
}
 .navbar-brand {
     font-family: var(--font1);
     font-size: 2.2em;
     font-weight: 900;
}
/* social icons list */
 .social-icons.text-white a i {
     color: var(--bs-body-bg);
     transition: var(--transition);
     font-size: 1.3em;
     margin-left: 0.5em;
}
 .social-icons.text-white a i:hover {
     color: var(--bs-secondary);
}
 .social-icons a i{
     transition: var(--transition);
}
 .social-icons a i:hover {
     transform:scale(1.2);
}
 .social-icons.social-circles a i {
     color: var(--bs-body-bg);
     transition: var(--transition);
     background: var(--bs-secondary);
     font-size: 1.4em;
     line-height:40px;
     width: 40px;
     display: block;
     height: 40px;
     border-radius: 50%;
     text-align: center;
}
 .social-icons.social-circles a i:hover {
     background: var(--bs-primary);
}
 .social-icons.social-circles .list-inline-item:not(:last-child) {
     margin-right: 0;
}
 .item-hidden {
     display: none;
     transition: var(--transition);
}
 .sticky-top {
     top: 6em;
}
 .btn.btn-flat {
     margin-top: 0;
     border-radius: 0 40px 40px 0;
}
/* top-bar */
 .top-bar {
     transition: var(--transition);
     top: 0;
     padding: 0.5em 0;
     position: relative;
     color: var(--bs-primary);
     background: var(--bs-body-bg);
}
 .top-bar .contact-details li:first-child {
     margin-left: 0px;
}
 .top-bar .contact-details i {
     margin-right: 8px;
     color: var(--bs-secondary);
}
 .top-bar .contact-details li {
     font-size: 0.9em;
     font-weight: var(--fw-medium);
     padding: 0px 20px;
}
/* typewriter effect*/
 .typewriter-text {
     font-size: 1.5em;
     font-weight: var(--fw-bold);
     color: var(--bs-secondary);
}
 .typewriter-text .wrap:after {
     content: '';
     padding-right: 5px;
     border-right: 0.2em solid #cecece;
     animation: blink-animation 1s steps(5, start) infinite;
     -webkit-animation: blink-animation 1s steps(5, start) infinite;
}
 @keyframes blink-animation {
     to {
         visibility: hidden;
    }
}
 @-webkit-keyframes blink-animation {
     to {
         visibility: hidden;
    }
}
/* ken burns slideshow*/
 .ken-burns-slideshow {
     left: 0;
     z-index: -2;
     margin: 0;
     padding: 0;
     width: 100%;
     overflow: hidden;
}
 .ken-burns-slideshow .bg {
	position: absolute;
	top: 0;
	left: 0;
	right : 0;
	bottom: 0;
	width: 100%;
	height : 100%;
	object-fit: cover;
	opacity: 0;
	transform: scale(1.2);
	animation: kenburns 24s linear infinite;	
}
 .ken-burns-slideshow .bg:nth-child(1) {
     animation-delay: 0s;
}
 .ken-burns-slideshow .bg:nth-child(2) {
     animation-delay: 6s;
}
 .ken-burns-slideshow .bg:nth-child(3) {
     animation-delay: 12s;
}
 .ken-burns-slideshow .bg:nth-child(4) {
     animation-delay: 18s;
}
.ken-burns-slideshow .bg-container {
	position: relative;
	width : 100%;
	height : 100%;
}

 @keyframes kenburns {
     10% {
         opacity: 1;
    }
     25% {
         opacity: 1;
         transform: scale(1);
    }
     40% {
         opacity: 0;
         transform: scale(1);
    }
}
 .box-main {
     position: absolute;
     top: 0;
     width: 100%;
}
/*margin-top between headers and page*/
 .ken-burns-slideshow .slide, .ken-burns-slideshow, .box-main {
     height: 700px;
}
/* Preloader */
 #preloader {
     position: fixed;
     top: 0;
     background:#fff;
     left: 0;
     width: 100%;
     height: 100%;
     z-index: 9999;
}
 .spinner {
     text-align: center;
     position: absolute;
     top: 50%;
     width: 10%;
     left: 43%;
     animation: rotate 2.0s infinite linear;
}
 .spinner > div {
     border-radius: 100%;
     display: inline-block;
     animation: bouncedelay 1.4s infinite ease-in-out;
     animation-fill-mode: both;
}
 .spinner .bounce1 {
     animation-delay: -0.32s;
}
 .spinner .bounce1:after {
     content: "\f1b0";
     position: absolute;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
     font-size: 40px;
     margin-top: -40px;
     margin-left: -10px;
}
 @keyframes bouncedelay {
     0%, 80%, 100% {
         transform: scale(1.0);
    }
     40% {
         transform: scale(1.5);
    }
}
/* CTA 1*/
 #cta-1 {
     background: url("../img/cta1.jpg");
     background-size: cover;
     background-position: center;
}
/*counter section*/
 #counter-section {
     background: url('../img/counter.jpg');
     background-size: cover;
     background-position: top;
}
 #counter-section2 {
     background: url('../img/counter2.jpg');
     background-size: cover;
     background-position: top;
}
 #testimonials {
     background: url('../img/testimonials.jpg');
     background-size: cover;
     background-position: center;
}
 #box-with-img {
     background: url('../img/box-img.png');
     background-position: 120% 220%;
     background-repeat: no-repeat;
}
/* reviews */
 .review {
     text-align: center;
}
 .review-text {
     font-size: 1.2em;
     font-style: italic;
}
 .slick-slide .review-info img {
     border: 5px solid var(--bs-dark);
     display: inline-block;
}
/* page */
 /* .page {
  padding-top: 6rem;
    padding-bottom: 6rem;
} */
 .theme-padding {
     padding: 2em 0 2em 0;
}
/* cards */
 .card {
     border: 0;
}
 .card-custom {
     border-bottom: 4px solid var(--bs-dark);
     border-top: 4px solid var(--bs-dark);
}
/* Clouds */
 #clouds path {
       fill: #f6ffc2;
    stroke: #f6ffc2;
}
/* parallax */
 .parallax1 {
     position: absolute;
     margin-top: -230px;
     max-width: 500px;
}
 .parallax2 {
     position: absolute;
     margin-top: 170px;
     max-width: 500px;
     margin-left: 80px;
     z-index: 999;
}
/* zig zag borders */
 .zig-zag-top:before {
     display: block;
     content: "";
     width: 100%;
     height: 12px;
     background: linear-gradient(135deg, white 25%, transparent 25%), linear-gradient(-135deg, white 25%, transparent 25%);
     background-size: 12px 12px;
     background-position: -50px;
     position: absolute;
     left: 0;
}
 .zig-zag-bottom:after {
     display: block;
     content: "";
     width: 100%;
     height: 12px;
     background: linear-gradient(45deg, white 25%, transparent 25%), linear-gradient(-45deg, white 25%, transparent 25%);
     background-size: 12px 12px;
     background-position: -50px;
     position: absolute;
     margin-top: -12px;
     left: 0;
     z-index: 99;
}
/* Jumbotron */
 .jumbotron {
     background: url("../img/jumbotron.jpg");
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center center;
     margin-bottom: 0px;
}
 .jumbotron .breadcrumb {
     display: inline-flex;
}
 .jumbotron .breadcrumb a {
     color: var(--bs-body-bg);
}
 .jumbotron .breadcrumb-item a:hover, .jumbotron .breadcrumb-item.active, .jumbotron .breadcrumb-item+.breadcrumb-item::before {
     color: var(--bs-dark);
}
.breadcrumb-item.active {
    font-weight: var(--fw-bold);
}
/* number counter */
 .counter {
     background: var(--bs-primary);
     transition: all ease-in-out 0.2s;
     border-radius: var(--bs-border-radius);
     text-align: center;
     padding: 50px 50px 50px 50px;
}
 .counter .counter-value {
     font-weight: 700;
     font-size: 3.8em;
     color: var(--bs-body-bg);
     letter-spacing: 2px;
}
 .counter .counter-value.plus:after {
     content: "+";
}
 .counter .title {
     font-size: 13px;
     color: var(--bs-body-bg);
     letter-spacing: 0.7px;
     margin: 0;
     font-weight: var(--fw-bold);
     text-transform: uppercase;
}
/* footer with zig zag*/
 footer {
z-index: 999;
    position: relative;
    background: linear-gradient(117deg, rgb(175 199 42 / 68%), rgb(121 184 192));
    background-size: cover;
	    background-position: top;
}
 footer:before {
        display: block;
    content: "";
    width: 100%;
    height: 12px;
    background: linear-gradient(45deg, #f6ffc2 25%, transparent 25%), linear-gradient(-45deg, #f6ffc2 25%, transparent 25%);
    background-size: 12px 12px;
    background-position: -50px;
    position: absolute;
    margin-top: -12px;
    left: 0;
    z-index: 99;
}
/* Go to top icon */
 .back-to-top {
     transition: var(--transition);
     z-index: 1000;
     text-align: center;
     position: absolute;
     margin-top: -30px;
     margin-left: -24px;
}
 .back-to-top i {
     background: var(--bs-secondary);
     width: 54px;
     height: 54px;
     line-height: 50px;
     font-size: 22px;
     color: #fff;
     border-radius: 50%;
}
 .back-to-top:hover {
     transform: scale(1.3);
}
/* elements */
 .elements-heading{
     padding-bottom:0.5em;
     border-bottom:1px dotted;
}
/* Overlay */
 .bg-overlay {
     box-shadow: inset 0 0 0 1000px rgba(var(--bs-primary-rgb), 0.52);
}
 .bg-overlay-dark {
     box-shadow: inset 0 0 0 1000px rgba(var(--bs-primary-rgb), 0.84);
}
 .feature-with-icon {
     display: inline-block;
}
 .feature-with-icon .icon-features {
border-radius: 50%;
    padding:9px;
    border: 5px solid transparent;
    background: var(--bs-light);
    float: left;
    margin: 0 12px;
    transition: var(--transition);
}
 .feature-with-icon:hover .icon-features {
     transform: scale(1.1) rotate(10deg);
     border: 5px solid var(--bs-dark);
}
 .feature-with-icon .icon-features img {
     width: 40px;
}
/* Custom list */
 ul.custom {
     margin-bottom: 1rem;
     line-height: 1.5;
     margin-left: 0;
     padding: 0;
     list-style: none;
}
 ul.custom li {
     margin-bottom: 1em;
}
 ul.custom li:last-child {
     margin-bottom: 0em;
}
 ul.custom li:before {
     content: "\f1b0";
     font-size: 16px;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
     padding-right: 7px;
}
/* borders */
 .border-box {
     border-top: 5px solid var(--bs-dark);
     border-bottom: 5px solid var(--bs-dark);
     border-radius: var(--bs-border-radius);
     margin-top: 15%;
}
/* hover wrapper */
 .wrapper {
     border-top-right-radius: var(--bs-border-radius);
     border-top-left-radius: var(--bs-border-radius);
}
 .wrapper, .wrapper-hover {
     overflow: hidden;
}
 .wrapper-hover img {
     transition: var(--transition);
}
 .wrapper:hover img {
     transform: scale(1.1);
}
/* pet info */
 .pet-info {
     margin-top: -2.6em;
     z-index: 99;
     position: relative;
}
 .pet-info li {
     text-align: center;
     background: var(--bs-body-bg);
     border-radius: 50%;
     width: 50px;
     padding: 0.5em;
     height: 50px;
}
 .pet-info .dog:before {
     content: "\f6d3";
     font-size: 23px;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
}
 .pet-info .cat:before {
     content: "\f6be";
     font-size: 23px;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
}
 .pet-info .female:before {
     content: "\f221";
     font-size: 23px;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
}
 .pet-info .male:before {
     content: "\f222";
     font-size: 23px;
     color: var(--bs-dark);
     font-weight: 900;
     font-family: 'Font Awesome 6 Free';
}
/*hover border*/
 .hover-border {
     transition: var(--transition);
     border: 10px solid transparent;
}
 .hover-border:hover {
     border: 10px solid var(--bs-dark);
}
/* slick slider*/
 .slick-prev:before, .slick-next:before {
     color: var(--bs-primary);
     opacity: 1;
}
 .arrows-dark .slick-prev:hover:before, .arrows-dark .slick-prev:focus:before, .arrows-dark .slick-next:hover:before, .arrows-dark .slick-next:focus:before, .slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {
     color: var(--bs-secondary);
}
 .arrows-dark .slick-prev:before, .arrows-dark .slick-next:before {
     color: var(--bs-dark);
     opacity: 1;
}
 .slider-center .slick-next {
     text-align: left;
	 padding: 0 10px;
}
 .slider-center .slick-prev {
     text-align: right;
	 padding: 0 10px;
}
 .slider-center .slick-next, .slider-center .slick-prev {
     top: -25px;
     width: 50%;
}
/* Comments */
 .comments-block .card .comment-img {
     height: 100px;
     width: 100px;
     border-radius: 50%;
}
/* Mailchimp message */
 #mce-error-response, #mce-success-response {
     display: none;
     margin-top: 20px;
}
/* Map */
 #map-canvas {
     max-width: 100%;
     height: 350px;
     border-radius: 0px;
}
 #map-canvas.contact {
     height: 500px;
}
/*********** Responsive ***********/
/* max width 767px */
 @media (max-width: 767px) {
	 .left1{
	text-align: center !important;
	padding-bottom:10px;
}

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

.rounded {
  
    margin-top: 21px !important;
}
	 
    /* home slider */
     .box-main {
         position: relative;
         margin-top: -50px;
    }
   .ken-burns-slideshow .slide, .ken-burns-slideshow, .box-main {
    height: 425px;
}
.feature-with-icon {
   
    text-align: center;
}
    /* gutter */
     .g-5, .gx-5 {
         --bs-gutter-x: 0rem;
    }
    /* slick slider */
     .slick-slider .slick-prev {
         left: 5px;
         z-index: 99;
    }
     .slick-slider .slick-next {
         right: 15px;
         z-index: 99;
    }
    /* hide bg image*/
     #box-with-img{
        background-image:none;
    }
    /* headers */
     .h1, h1 {
         font-size: 2.7rem;
    }
     h2, h2 {
         font-size: 2.475rem;
    }
    /* feature icon */
     .feature-with-icon .icon-features {
         float: none;
         width: 150px;
         height: 150px;
         margin:1em auto;
         line-height: 80px;
         padding-bottom:1em;
    }
    /* input group */
     .input-group .form-control, .input-group-btn {
         display: inline-table;
         width: 100%;
         margin-top: 10px;
    }
     .input-group {
         display: block;
    }
     .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu):not(.form-floating), .input-group .btn.btn-flat {
         margin-top:var(--main-mt);
         border-radius: var(--bs-border-radius);
    }
    /* navbar */
     .navbar-brand{
         font-size: 1.8em;
    }
}
/* min width 1200px */
 @media (min-width: 1200px) {
    /* navbar */
     .navbar, .navbar .navbar-nav{
         height:90px;
    }
     .navbar .social-icons {
         width: 15%;
    }
     .navbar .navbar-nav {
         width: 85%;
    }
     .navbar .navbar-nav .nav-link {
         padding-right: 1.2em;
         padding-left: 1.2em;
         height: 100%;
         display: flex;
         align-items: center;
         justify-content: center;
    }
	.navbar-expand-xl .navbar-nav .dropdown-menu {
		 min-width: 200px;
		 border-radius: 0;
    }
     .dropdown:hover>.dropdown-menu {
         display: block;
         -webkit-animation: fadeIn 0.5s;
         animation: fadeIn 0.5s;
    }
     @-webkit-keyframes fadeIn {
         from {
             opacity: 0;
        }
         to {
             opacity: 1;
        }
    }
     @keyframes fadeIn {
         from {
             opacity: 0;
        }
         to {
             opacity: 1;
        }
    }
     .dropdown>.dropdown-toggle:active {
        /*Without this, clicking will make it sticky*/
         pointer-events: none;
    }
}
/* max width 1200px*/
 @media (max-width: 1200px) {
    /* nav link */
     .nav-link, .dropdown-item {
         padding: 1em;
		 line-height: normal;
    }
    /* page-padding */
     .page {
         padding-top: 4rem;
         padding-bottom: 4rem;
    }
    /* parallax */
     .parallax1 {
         position: relative;
         margin-top: 0px;
         max-width: 100%;
    }
     .parallax2 {
         position: relative;
         margin-top: 170px;
         max-width: 100%;
         margin-left: 0px;
    }
    /* social icons */
     .social-icons.justify-content-end {
         justify-content: center!important;
         margin-top:20px;
    }
}


.do111{
      background-color: #afc72a;
    padding: 9px 22px 10px 25px;
    border-radius: 10px;
    color: #fff;
}
.do111:hover{
    
    color: #fff;
}

hr {
    margin: 11px 0;
    color: inherit;
    border: 0;
    border-top: var(--bs-border-width) solid;
    opacity: .25;
}

.slick-dots {
  
    display: none !important;
   
}



.float {
    position: fixed;
    width: 58px;
    left: 8px;
    height: 58px;
    bottom: 8px;
    right: 18px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    z-index: 100;
}

.left1{
	text-align:left;
}

.right2{
	text-align:right;
}
body {
    Background-image: url(https://cdnb.artstation.com/p/assets/images/images/003/704/285/large/dusica-neskovic-muzejdanfinal.jpg?1476637309);
}

h1, h2, h3, h4, h5, h6 {

}
.head{
    font-size: 20px;
    color: #000 !important;
}
.main-head{
    font-size: 26px;
    color: #000 !important;
}
section {
  /* padding: 60px 0; */
}
a, a:hover, a:focus, a:active {
  text-decoration: none;
  outline: none;
}
ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-heading h2 {
display: block;
font-weight: 700;
margin-bottom: 10px;
text-transform: uppercase;
}

.site-heading h2 span {
color: #afc72a !important;
}

.site-heading h4 {
display: inline-block;
padding-bottom: 20px;
position: relative;
text-transform: capitalize;
z-index: 1;
}

.site-heading h4::before {
background: #ff5a6e none repeat scroll 0 0;
bottom: 0;
content: "";
height: 2px;
left: 50%;
margin-left: -25px;
position: absolute;
width: 50px;
}

.site-heading h2 span {
color: #ff5a6e;
}

.site-heading {
margin-bottom: 60px;
overflow: hidden;
margin-top: -5px;
}

.team-area .single-item {
margin-bottom: 30px;
width: 97% !important;
}
.team-area .single1-item {
    margin-bottom: 30px;
   
    }

.team-area .item .thumb {
position: relative;
overflow: hidden;
z-index: 1;
}

.team-area .item .thumb::after {
/* background: #232323 none repeat scroll 0 0; */
content: "";
height: 100%;
left: 0;
opacity: 0;
position: absolute;
top: 0;
transition: all 0.35s ease-in-out;
-webkit-transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
-ms-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
width: 100%;
}

.team-area .team-items .item:hover .thumb::after {
opacity: 0.7;
}

.team-area .item .thumb .overlay {
top: -100%;
left: 0;
padding: 20px;
position: absolute;
text-align: center;
-webkit-transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
-ms-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
width: 100%;
z-index: 1;
}

.team-area .item:hover .thumb .overlay {
top: 50%;
transform: translate(-50%, -50%);
left: 50%;
}

.team-area .item .thumb .overlay p {
color: #ffffff;
}

.team-area .item .thumb .overlay h4 {
color: #ffffff;
display: inline-block;
position: relative;
text-transform: uppercase;
}

.team-area .item .thumb img {
-webkit-transition: all 0.35s ease-in-out;
-moz-transition: all 0.35s ease-in-out;
-ms-transition: all 0.35s ease-in-out;
-o-transition: all 0.35s ease-in-out;
transition: all 0.35s ease-in-out;
}

.team-area .item:hover .thumb img {
opacity: .6;
}

.team-area .item .thumb .social li {
display: inline-block;
}

.team-area .item .thumb .social li a {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
color: #ffffff;
display: inline-block;
height: 40px;
line-height: 40px;
margin: 0 2px;
text-align: center;
width: 40px;
}

.team-area .info {
background: #ffffff none repeat scroll 0 0;
-moz-box-shadow: 0 0 10px #cccccc;
-webkit-box-shadow: 0 0 10px #cccccc;
-o-box-shadow: 0 0 10px #cccccc;
box-shadow: 0 0 10px #cccccc;
padding: 40px 20px 20px;
position: relative;
text-align: center;
z-index: 9;
width:90%;
}

.team-area .info .message {
height: 50px;
line-height: 40px;
margin-left: -25px;
margin-top: -25px;
position: absolute;
text-align: center;
top: 0;
width: 50px;
}

.team-area .info .message a {
background: #fff none repeat scroll 0 0;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
-moz-box-shadow: 0 0 10px #cccccc;
-webkit-box-shadow: 0 0 10px #cccccc;
-o-box-shadow: 0 0 10px #cccccc;
box-shadow: 0 0 10px #cccccc;
box-sizing: border-box;
color: #ff5a6e;
display: inline-block;
font-size: 20px;
height: 50px;
line-height: 50px;
width: 50px;
}

.team-area .info .message a i {
font-weight: 500;
color: #afc72a;
}

.team-area .info h4 {
font-weight: 600;
margin-bottom: 5px;
font-size: 22px;
text-transform: capitalize;
color: #000;
}

.team-area .info span {
color: #000;
font-family: "Poppins",sans-serif;
font-weight: 400;
font-size: 15px;
text-transform: uppercase;
}

.team-area .social li.twitter a {
background-color: #00b6f1;
}

.team-area .social li.pinterest a {
background-color: #bd081c;
}

.team-area .social li.facebook a {
background-color: #3b5998;
}

.team-area .social li.google-plus a {
background-color: #df4a32;
}

.team-area .social li.vimeo a {
background-color: #1ab7ea;
}

.team-area .social li.instagram a {
background-color: #cd486b;
}

/* service */
body{
    background: #f5f5f5;
  }
  .services-block-three{
    margin-bottom" 30px;
  }
  .services-block-three i {
      font-size: 32px;
  }
  .services-block-three>a {
    width: 100%;
    height: 250px;
      display: block;
      border: 2px solid #d5d5d5;
      border-radius: 4px;
      text-align: center;
      background: #fff;
      padding: 20px;
      position: relative;
    margin-bottom:30px;
  
  }
  .services-block-three>a:before {
      display: block;
      content: "";
      width: 9%;
      height: 17%;
      position: absolute;
      bottom: -2px;
      right: -2px;
      border-bottom: 2px solid #03a9f5;
      border-right: 2px solid #03a9f5;
      transition: all 0.5s ease 0s;
      -webkit-transition: all 0.5s ease 0s;
  }
  .services-block-three>a:after {
      display: block;
      content: "";
      width: 9%;
      height: 17%;
      position: absolute;
      top: -2px;
      left: -2px;
      border-top: 2px solid #03a9f5;
      border-left: 2px solid #03a9f5;
      transition: all 0.5s ease 0s;
      -webkit-transition: all 0.5s ease 0s;
  }
  .padding-15px-bottom {
      padding-bottom: 15px;
  }
  .services-block-three h4 {
      color: #6f6f6f;
      font-size: 40px;
      margin-bottom: 10px;
      font-weight: 600;
      padding-top: 25px;
  }
  .services-block-three p {
      margin-bottom: 0;
    color: #757575;
  }
  .services-block-three>a:hover {
      opacity: 1;
      border-color: #d5d5d5;
  }
  a:hover, a:active {
      color: #03a9f5;
      text-decoration: none;
  }
  
  .services-block-three>a:hover:before, .services-block-three>a:hover:after {
      width: 95%;
      height: 90%;
  }

  .text-area h2{
    font-size: 28px;
    color: #000;
  }

  .text-area p{
    font-size: 15px;
    color: #000;
  }


  /* body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f8f9fa;
} */

.faq-container {
    max-width: 100%;
    margin: 50px auto;
    padding: 20px;
    background-color: #ffffff;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

h1 {
    text-align: center;
    color: #333;
}

.faq-item {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
}

.faq-question {
    font-size: 1.2em;
    color: #000;
    cursor: pointer;
    margin: 0;
}

.faq-answer {
    display: none;
    margin-top: 10px;
}

.faq-answer p {
    margin: 0;
}



/* privency policy */

/* h1 {
    font-family: bebas neue;
    font-size: 46px;
    text-align: center;
    color: rgb(44,48,52);
    margin: 0;
    padding: 0 0 6px 0;
    border-bottom: 1px solid rgba(0,0,0,.15);
  }
  h2 {
    font-family: bebas neue;
    font-size: 24px;
    line-height: 20px;
    text-align: left;
    color: rgb(44,48,52);
    margin: 0;
    padding: 20px 0 0 0;
  }
  p {
    font-family: open sans;
    font-size: 13px;
    letter-spacing: 1px;
    color: rgb(44,48,52);
    margin: 0;
    padding: 10px 0 0 0;
  } */
   .achiv{
    font-size: 30px;
    color: #000 !important;

   }
   .content{
    text-align: justify;
   }
   .content-txt{
    padding-left: 14% !important;
   }
   
   *, *:before, *:after {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}

body {
  font-family: 'Nunito', sans-serif;
  color: #384047;
}

form {
  max-width: 300px;
  margin: 10px auto;
  padding: 10px 20px;
  background: #f4f7f8;
  border-radius: 8px;
}

h1 {
  margin: 0 0 30px 0;
  text-align: center;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="datetime"],
input[type="email"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="time"],
input[type="url"],
textarea,
select {
  background: rgba(255,255,255,0.1);
  border: none;
  font-size: 16px;
  height: auto;
  margin: 0;
  outline: 0;
  padding: 15px;
  width: 100%;
  background-color: #e8eeef;
  color: #000;
  box-shadow: 0 1px 0 rgba(0,0,0,0.03) inset;
  margin-bottom: 30px;
}

input[type="radio"],
input[type="checkbox"] {
  margin:16px 10px 57px 40px;
}

select {
  padding: 6px;
  height: 54px;
  border-radius: 2px;
}

button {
  padding: 19px 39px 18px 39px;
  color: #FFF;
  background-color: #50372f ;
  font-size: 18px;
  text-align: center;
  font-style: normal;
  border-radius: 5px;
  width: 100%;
  border: 1px solid #50372f ;
  border-width: 1px 1px 3px;
  box-shadow: 0 -1px 0 rgba(255,255,255,0.1) inset;
  margin-bottom: 10px;
}

fieldset {
  margin-bottom: 30px;
  border: none;
}

legend {
  font-size: 1.4em;
  margin-bottom: 10px;
}

label {
  display: block;
  /*margin-bottom: 8px;*/
      margin-bottom: 13px;
    color: black;
    font-size: 18px;
}
}

label.light {
  font-weight: 300;
  display: inline;
}

.number {
  background-color: #5fcf80;
  color: #fff;
  height: 30px;
  width: 30px;
  display: inline-block;
  font-size: 0.8em;
  margin-right: 4px;
  line-height: 30px;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255,255,255,0.2);
  border-radius: 100%;
}

@media screen and (min-width: 480px) {

  form {
    max-width: 100%;
  }

}