@charset "UTF-8";
/*
Theme Name: Kids Gift Shop
Author: TheMagnifico52
Theme URI: https://www.themagnifico.net/products/free-gift-shop-wordpress-theme
Author URI: https://www.themagnifico.net/
Description: Kids Shop is a vibrant and versatile theme designed for parents seeking the cuteness their children adore. This delightful theme is perfect for any online store focusing on kids’ toys, computer games, children's apparel, essential items for children, gift shops, toddler's gifts, baby clothes, and similar products. Built on a robust framework, it allows you to create a fully functional and feature-rich website. The theme is not only fully customizable but also highly SEO-friendly, responsive, and interactive, boasting impressive page load speeds. With its well-crafted design, Kids Shop includes a clear CTA button and clean code for seamless navigation. Social media icons ensure that potential customers stay updated on business news, while various customization options cater to your specific preferences. Additionally, the theme features a testimonial section and captivating banner animations that are sure to attract attention and entice any buyer visiting your homepage. 
Version: 0.5.7
Tested up to: 6.9
Requires PHP: 7.2
Requires at least: 5.0
License: GNU General Public License v3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Template: kids-online-store
Text Domain: kids-gift-shop
Tags: custom-logo, one-column, two-columns, wide-blocks, block-styles, editor-style, sticky-post, custom-background, custom-colors, custom-header, custom-menu, footer-widgets, featured-images, flexible-header, full-width-template, threaded-comments, theme-options, rtl-language-support, left-sidebar, right-sidebar, grid-layout, blog, e-commerce, education

Kids Gift Shop WordPress Theme has been created by TheMagnifico52(themagnifico.net), 2022.
Kids Gift Shop WordPress Theme is released under the terms of GNU GPL
*/

/*--------------------------------------------------------------
# Global Color
--------------------------------------------------------------*/

:root {
  --first-color:#e74c25;
  --second-color: #0a303a;
}

body{
    font-family: 'Baloo Chettan 2', cursive;
}
#colophon ul, #colophon p, .tagcloud, .widget{
    color: #fff;
}
a, .sidebar ul li a:hover, #colophon a:hover, #colophon a:focus, p.price, .woocommerce ul.products li.product .price, .woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce-message::before, .woocommerce-info::before, .woocommerce .star-rating span::before, .navbar-brand a,.slider-inner-box h2{
    color: var(--first-color);
}

.sidebar h5, .sidebar h2.wp-block-heading, .sticky .entry-title::before, #button, .slide-btn a, .sidebar input[type="submit"], .btn-primary, .pro-button a, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt, .woocommerce .woocommerce-ordering select, .woocommerce-account .woocommerce-MyAccount-navigation ul li, .wp-block-button__link, .comment-respond input#submit,.toggle-nav i, .header-menu.stick_header, #colophon, .load hr {
    background: var(--first-color);
}
.top-info span i, .sidebar h5, .sidebar h2.wp-block-heading{
    color: #fff;
}
.article-box,hr,.sidebar section,.sidebar input[type="search"]{
    border-color: #ffdbd2;
}
.article-box a:hover{
    color: var(--first-color);
}
.calendar_wrap th,.calendar_wrap td, .widget #wp-calendar caption, #colophon a, #colophon h5,.footer-column li,.sidebar h5,.top-info span,.top-info span a,.top-info i,.footer-menu-left span,.slide-btn a{
    color: #fff;
}
.top-info span a:hover, .social-link i:hover,a, .sidebar ul li a:hover, #colophon a:hover, #colophon a:focus, p.price, .woocommerce ul.products li.product .price, .woocommerce div.product p.price, .woocommerce div.product span.price, .woocommerce-message::before, .woocommerce-info::before, .woocommerce .star-rating span::before, .navbar-brand a, .box-content .slide-btn a{
    color:var(--second-color);
}
.sidebar .calendar_wrap td, .sidebar .calendar_wrap th, .sidebar .widget #wp-calendar caption{
    color: #3c3c3c;
}
.sidebar ul {
    padding: 0px 0px 0px 15px !important;
}
h1, h2, h3, h4, h5, h6,a:hover,.page-template-home-template .navbar-brand p, .page-template-home-template .main-navigation .menu > li > a{
    color: var(--second-color);
}

.btn-primary,a.button.product_type_simple:hover, .woocommerce button.button:hover, .woocommerce a.button:hover, .woocommerce a.button.alt:hover, .woocommerce button.button:hover, .woocommerce button.button.alt:hover, .woocommerce #respond input#submit:hover, .comment-respond input#submit:hover, .woocommerce-account .woocommerce-MyAccount-navigation ul li:hover, .post-navigation .nav-previous a:hover, .post-navigation .nav-next a:hover, .posts-navigation .nav-previous a:hover, .posts-navigation .nav-next a:hover, .slide-btn a:hover, .main-navigation .sub-menu > li > a:hover, #button:hover,.sidebar .tagcloud a:hover{
    background: var(--second-color);
    color: #fff;
}

.woocommerce ul.products li.product .onsale, .woocommerce span.onsale{
    background: #ffdbd2;
}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover{
  color: #fff;
}
/* Topbar Section */
.top-info span {
    font-weight: bold;
}
.page-template-home-template .socialmedia{
    position: static;
}
.socialmedia {
    background: transparent;
}
.top-info {
    background: var(--first-color);
    height: auto;
    padding: 10px 0;
    text-align: left;
}
.social-link {
    text-align: right;
}
.social-link i.fab.fa-facebook-f, .social-link i.fab.fa-pinterest-p,.social-link i.fab.fa-twitter,.social-link i.fab.fa-instagram,.social-link i.fab.fa-linkedin-in{
    background: transparent;
}
.social-link i {
    margin-right: 15px;
}
.social-link i{
    padding: 0;
    width: auto;
    height: auto;
}
.header-menu .nav {
    justify-content: flex-end;
}
.page-template-home-template #site-navigation .menu ul li a {
    color: var(--second-color);
}
.main-navigation .menu > li {
    font-size: 15px;
    text-transform: uppercase;
}
.main-navigation .menu > li > a, #site-navigation .menu ul li a{
    color: var(--second-color);
    font-weight: 600;
    text-transform: capitalize;
    font-size: 15px;
}
.main-navigation .menu > li > a:hover, #site-navigation .menu ul li a:hover{
    color: var(--first-color);
}
.main-navigation ul.sub-menu > li > a:hover, .main-navigation ul.sub-menu > li > a:focus {
    background: var(--first-color);
    color: #fff !important;
}
.main-navigation .menu > li > a{
    padding: 15px 15px;
}
#site-navigation .menu ul li a{
    color: #000 !important;
    text-transform: uppercase;
}
.header-menu {
    border-bottom: solid 1px #ffdbd2;
    background: #fff;
    padding: 10px 0px 10px 0px !important;
}
.header-menu .nav {
    justify-content: flex-start;
}
.comment-respond input#submit,.pro-button a, .woocommerce #respond input#submit, .woocommerce a.button, .woocommerce button.button, .woocommerce input.button, .woocommerce #respond input#submit.alt, .woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,.slide-btn a {
    border-radius: 5px;
}
.sidebar section {
    padding: 10px;
}
/* Slider  */

.slider-box:after {
    content: "";
    background-image: url(assets/img/slider-design.png);
    background-repeat: repeat-x;
    background-position: center top;
    display: block;
    height: 186px;
    position: absolute;
    bottom: 0px;
    width: 100%;
}
.slider-box img {
    position: static;
    -webkit-mask-image: none;
    height: 700px;
}
.slider-inner-box {
    right: 60%;
    text-align: left;
}
.slider-inner-box p{
    color: var(--second-color);
}
/* Services Section */

.box{
    text-align: center;
    overflow: hidden;
    position: relative;
    border-radius: 15px;
}
.box:before{
    content: "";
    background: var(--first-color);
    width: 0;
    height: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 50%;
    transition: all .5s ease;
}
.box:hover:before{
    width: 100%;
    opacity: 1;
    left: 0;
}
.box img{
    width: 100%;
    height: auto;
    transform: scale(1);
    transition: all 0.5s ease-in-out;
}
.box:hover img{
    opacity: 0.4;
    transform: scale(1.5);
}
.box .box-content{
    color: #fff;
    width: 100%;
    padding: 0 20px;
    opacity: 0;
    transform: translateY(-50%) scale(3);
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 1;
    transition: all .5s ease;
}
.box:hover .box-content{
    transform: translateY(-50%) scale(1);
    opacity: 1;
}
.box .title{
    font-size: 25px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: capitalize;
    margin: 0 0 7px;
}
.box .post{
    font-size: 15px;
    font-weight: 400;
    font-style: italic;
    letter-spacing: 1px;
    text-transform: capitalize;
    margin: 0 0 11px;
    padding: 0 0 2px;
    border: 1px dashed rgba(255,255,255,0.3);
    border-right: none;
    border-left: none;
    display: inline-block;
}
.box:hover .box-cont{
    opacity: 0;
}
.box-cont {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 10px;
    background-image: linear-gradient(rgb(255 255 255 / 0%), #000);
    color: #fff;
}
.box-content h3,.box-cont h3 {
    color: #fff;
}
.box-content .slide-btn a{
    background: #fff;
    color: var(--first-color);
}
.footer_info{
    background: var(--first-color);
    height: auto;
}
@keyframes loading {
  0%,
  100% {
    transform: translatey(-2.5rem);
    background-color: #000;
  }
  50% {
    transform: translatey(2.5rem);
    background-color: #ff6f69;
  }
}
@media screen and (max-width: 435px){
    .slider-inner-box{
        right: 40%;
        left: 5%;
    }
}
@media screen and (max-width: 767px){
    .slider-box:after{
        display: none;
    }
    .navbar-brand {
        text-align: center;
    }
    .slider-box img{
        height: 300px;
    }
    .top-info span{
        display: inline-block;
    }
}
@media screen and (min-width: 320px) and (max-width: 720px){
    .main-navigation .menu > li > a{
        color: #fff;
    }
    .main-navigation .sub-menu{
        background: transparent;
    }
    .social-link{
      text-align: center;
    }
}
@media screen and (min-width: 768px) and (max-width: 991px){
    .slider-inner-box p{
        display: none;
    }
    .slider-inner-box{
        top: 50%;
    }
}
@media screen and (max-width: 1000px){
    .page-template-home-template .main-navigation .menu > li > a, .main-navigation .menu > li > a {
        color: #fff !important;
    }
    .sidenav .closebtn{
        background: var(--first-color);
        color: #fff;
    }
    .main-navigation ul.sub-menu > li > a:hover, .main-navigation ul.sub-menu > li > a:focus, .main-navigation .menu > li > a:hover {
        background: transparent;
        color: var(--first-color) !important;
    }
    .toggle-nav i{
        color: #fff;
    }
    .page-template-home-template #site-navigation .menu ul li a, #site-navigation .menu ul li a {
        color: #fff;
    }
    body.admin-bar .sidenav {
        margin-top: 46px;
    }
}