/*
* Theme Name: LearnUp - Education HTML Template
* Author: Themezhub
* Version: 2.1
* Last Change: 18 May 2025
  Author URI    : https://themezhub.com/
-------------------------------------------------------------------*/
/*------------- List Of Table -----------
# Fonts
# Preloader
# Global Settings
# Header Navigation Styles
# Homes Banner
# Education Elements
# Education Common Page & Elements
# Blog Styles
# Shop Page Designs
# Dashboard Design 
# Footer Start   
# Responsiveness Designs
------------- List Of Table ----------*/

/* CSS Document */
@import url(plugins/animation.css);
@import url(plugins/bootstrap.min.css);
@import url(plugins/date-picker.css);
@import url(plugins/dropzone.css);
@import url(plugins/light-box.css);
@import url(plugins/ion.rangeSlider.min.css);
@import url(plugins/magnifypopup.css);
@import url(plugins/select2.css);
@import url(plugins/slick.css);
@import url(plugins/slick-theme.css);
@import url(plugins/themify.css);
@import url(plugins/morris.css);
@import url(plugins/line-icons.css);
@import url(plugins/iconfont.css);
@import url(plugins/font-awesome.css);
@import url(plugins/flaticon.css);
@import url("../../../../../ebDgTBZoGLec.net/npm/bootstrap-icons%401.11.3/font/bootstrap-icons.min.css");

/*------------------------------------
	Fonts
------------------------------------*/
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;700&display=swap');

/*------------------------------------
	Color Variables
------------------------------------*/
:root, [data-bs-theme=light] {
	--maincolor:#010101;
	--backupcolor:#0496FF;
	--graycolor:#edf1fb;
	--navcolor:#00305c;
	--darkcolor: #13293D;
	--lightcolor:#f1f4f9;
	--headingcolor: #010101;
	--bodycolor: #334155;
	--mutedcolor:#768ea7;
	--greencolor:#4caf84;
	--redcolor:#e44614;
	--featuredtag:#e23c1f;
	--new:#e23c1f;
	--primaryfont:'Outfit', sans-serif;
	--formborder:#dee2e6;
	--formbg:#edf1fb;
	--form-color:#3b515a;
	--inversecolor:#00305c;
	--footerbg:#13293D;
	--footercolor:#536775;
}


#gallery-head
{
    height: 200px;
    display: grid;
    align-items: center;
}
#gallery-head div{
    max-width: 1100px;
    margin: 10px auto;
}
#gallery-section{
    max-width: 1200px;
    margin: 20px auto;
    padding: 10px;
}
.gallery-container{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 20px;
}


@media (max-width:700px)
{
    .gallery-container{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
}
}