@import url('https://fonts.googleapis.com/css?family=Raleway:300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i');

body {

    font-family: Montserrat, sans-serif;

}

/*========================================== NAV START ===========================================*/
.border-stone-200:checked {
   --tw-border-opacity: 1;
    border-color: gold / var(--tw-border-opacity));
}
/*========================================== NAVIGATION START ===========================================*/

.menu-underline::before {
    background-color: black;
    border-radius: 3px;
    content: "";
    height: 50px;
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    top: 0;
    opacity: 0;
    transform: translateY(100%);
    transition: transform 0.5s ease 0s, opacity 0.33s ease 0s;
}

.menu-underline:hover::before {
    opacity: 1;
    transform: translateY(0px);
}

.menu-fs,
.menu-fs li {
    color: #666666;
    font-size: 14px;
    font-weight: 600;
    line-height: 22px;
    letter-spacing: 1px;
}

.menu-bg {
    background: rgb(255, 255, 255) none repeat scroll 0 0;
    opacity:70%;
}

.navbar {
    margin-bottom: 0;
}

.navbar-default .navbar-nav > li > a {
    color: #666666 !important;
    background-color: transparent !important;
    margin: 0 0;
    padding: 15px 15px 15px 15px;
}

    .navbar-default .navbar-nav > li > a:hover {
        color: #f3f3f3 !important;
        background-color: transparent !important;
    }

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
    color: #A67D32 !important;
}

.navigation-tb {
    margin: 10px 0;
}

.nav > li {
    display: table;
}

.navbar-right {
    margin-right: 0;
}
/*========================================== NAVIGATION END ===========================================*/
.text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
}
.hover\:border-stone-300:hover {
    --tw-border-opacity: 1;
    border-color: gold;
}

.hover\:border-gold:hover {
    --tw-border-opacity: 1;
    border-color: gold;
    color: black;
}
.border-gold {
    --tw-border-opacity: 1 !important;
    border-color: gold !important;
    color: black !important;
}


.gold
{
  --tw-border-opacity: 1;
  border-color: gold !important;
  display: none;
}


.submit input:invalid {
    border-color:red;
}
/*========================================== HERO START ===========================================*/

.relative {
    position: relative;
}
.h-screen {
    height: 100vh;
}
.absolute {
    position: absolute;
}
.inset-0 {
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.object-cover {
    -o-object-fit: cover;
    object-fit: cover;
}

.h-full {
    height: 100%;
}
img, video {
    max-width: 100%;
    height: auto;
}
.bg-white60 {
    background-color: #666565;
    opacity: 60%;
}

.text-stone-800 {
    --tw-text-opacity: 1;
    color: rgb(41 37 36 / var(--tw-text-opacity));
}

.w-16 {
    width: 4rem;
}

.h-12 {
    height: 3rem;
}
.m-2 {
    margin: .5rem;
}



img {
    overflow-clip-margin: content-box;
    overflow: clip;
}
@media (min-width: 768px) {
    .md\:text-2xl {
        font-size: 2rem;
        line-height: 2rem;
    }
}
@media (min-width: 768px) {
    .md\:text-7xl {
        font-size: 4.5rem;
        line-height: 1;
    }
}
.tracking-wider {
    letter-spacing: .05em;
}
.tracking-widest {
    letter-spacing: .1em;
}


.text-5xl {
    font-size: 3rem;
    line-height: 1;
}

img, video {
    max-width: 100%;
    height: auto;
}
img, svg, video, canvas, audio, iframe, embed, object {
    display: block;
    vertical-align: middle;
}
.gap-4 {
    gap: 1rem;
}
.px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
}
.py-3 {
    padding-top: .75rem;
    padding-bottom: .75rem;
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity));
    border-top-color: ;
    border-right-color: ;
    border-bottom-color: ;
    border-left-color: ;
}
.border-black {
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0 / var(--tw-border-opacity));
    border-top-color: ;
    border-right-color: ;
    border-bottom-color: ;
    border-left-color: ;
}
/*
.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
}
.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity));
}
.text-black:hover {
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity));
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}

.bg-black:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.bg-white:hover{
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity));
}
*/
/*========================================== HERO END ===========================================*/
/*========================================== SERVICES START ===========================================*/


.bg-stone-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(250 250 249 / var(--tw-bg-opacity));
}


@media (min-width: 1024px) {
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

.gap-8 {
    gap: 2rem;
}


.bg-white-box {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
}
.hover\:shadow-md:hover {
    --tw-shadow: 0 4px 66px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
    --tw-shadow-colored: 0 54px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}
.transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}
.shadow-sm {
    --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
    --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.p-8 {
    padding: 2rem;
}
/*
.font-light {
    font-weight: 300;
}*/
.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
}
.mb-2 {
    margin-bottom: .5rem;
}
.text-stone-800 {
    --tw-text-opacity: 1;
    color: rgb(41 37 36 / var(--tw-text-opacity));
}
.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
}
.mb-4 {
    margin-bottom: 1rem;
}
.text-stone-600 {
    --tw-text-opacity: 1;
    color: rgb(87 83 78 / var(--tw-text-opacity));
}


/*========================================== SERVICES END ===========================================*/
/*========================================== STYLIST START ===========================================*/


.text-3xl {
    font-size: 1.875rem;
    line-height: 2.25rem;
}
/*.text-center {
    text-align: center;
}
.mb-16 {
    margin-bottom: 4rem;
}
*/
@media (min-width: 768px) {
    .md\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

.gap-8 {
    gap: 2rem;
}

.h-400px {
    height: 400px;
}
.group:hover .group-hover\:bg-black40 {
    background-color: #0006;
}

.transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}
.bg-black0 {
    background-color: #0000;
}
.group:hover .group-hover\:translate-y-0 {
    --tw-translate-y: 0px;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: .15s;
}
.duration-300 {
    transition-duration: .3s;
}

.p-6 {
    padding: 1.5rem;
}
.translate-y-full {
    --tw-translate-y: 100%;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}
.right-0 {
    right: 0;
}
.left-0 {
    left: 0;
}
.bottom-0 {
    bottom: 0;
}


/*========================================== STYLIST END ===========================================*/


.text-stone-400 {
    --tw-text-opacity: 1;
    color: rgb(168 162 158 / var(--tw-text-opacity));
}
.text-stone-500 {
    --tw-text-opacity: 1;
    color: rgb(120 113 108 / var(--tw-text-opacity));
}
.text-sm {
    font-size: .875rem;
    line-height: 1.25rem;
}

/*========================================== WhatsApp STARTS ===========================================*/

.float{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:gold;/*#25d366*/
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.my-float{
	margin-top:16px;
}

.bounce {
    animation: bounce 2s infinite;
}

@keyframes bounce {
    0%,
    25%,
    50%,
    75%,
    100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-20px);
    }
    60% {
        transform: translateY(-12px);
    }
}