/*
Theme Name: ȘCOALA GIMNAZIALĂ BRESTOVĂȚ
Theme URI: 
Author: INFOGHID Caransebeș
Author URI: http://www.cs-infoghid.ro
Description: Responsive design by INFOGHID Caransebeș.
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: 
Text Domain: 

This theme, like WordPress, is licensed under the GPL.
*/


@charset "utf-8";
/* CSS Document */

html { margin:0px; padding:0px;}
body { margin:0px; padding:0px; font-family: 'Open Sans', sans-serif; font-size:1em; line-height:1.5em; max-width: 1920px;  }

:root {
  --p-y-section: 80px;

  --primary-rgb: 200, 80, 70;

  --border-radius-lg: 16px;
  --border-radius-md: 8px;

  --white-color: #ffffff;

  --text-md: 1rem;
  --text-sm: 0.9rem;

  --font-bold: 700;
  --font-medium: 500;

  --accent-gradient: linear-gradient(135deg, #77B39D, #945325);
  --accent-color-contrast: #ffffff;
}


.paginatie { width:100%; max-width:1200px; margin:0 auto; }
.w100_p10 { width: 80%; margin: 0px 10%;}
.p_25vh { padding:25vh 0px; }

#IFG_Top { width:100%; margin:0px; float:left;}

#IFG_Logo { width:40%; margin:0 5%; float:left; }
#IFG_Cautare { width:40%; margin:0 5%; float:left; }
	
	#searchform { text-align:right; width:100%; float:left; padding:50px 0px 0px 0px;}
	#searchform label { display:none;  }
	#searchform input { padding:10px 0px; text-align:left; font-size:0.9em; font-family: 'Open Sans', serif; color:#77B39D; border:1px solid #ccc; }
	#searchform input[type="submit"] { font-size:0.9em; font-family: 'Open Sans', serif; background: #77B39D; padding:11px 25px 10px 25px; color:#fff; border:none; text-decoration:none; transition: all 0.2s ease-in-out; }
  #searchform input[type="submit"]:hover { background:#77B39D
    ; color:#fff; transition: all 0.2s ease-in-out; }
	

	#banner { width:100%; float:left; max-height:200px; background:#77B39D;  overflow:hidden; }
	#banner img { width:100%;  max-width:1920px; }
	#bannerfx { width:100%; float:left; max-height:5px; background:#77B39D;  overflow:hidden; }
	#bannerfx img { width:100%;  max-width:1920px; position: relative; bottom:0; }	

#cssmenu { background: #77B39D; margin: 0; width: auto; padding: 0; line-height: 1em; display: block; position: relative;  font-family: 'Open Sans', sans-serif;  -webkit-box-sizing: content-box;  -moz-box-sizing: content-box;  box-sizing: content-box;  }/* formatare ul pentru referinte  */
#cssmenu ul {  list-style: none;  margin: 0;  padding: 0;  display: block;}
#cssmenu ul li {  margin: 0;  padding: 0;  display: block;  position: relative;}

/* formatare link a */
#cssmenu ul li a { text-decoration: none;   display: block;  margin: 0;  -webkit-transition: color .2s ease;  -moz-transition: color .2s ease;  -ms-transition: color .2s ease;  -o-transition: color .2s ease;  transition: color .2s ease;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;}/* ascunde dropdown */
#cssmenu ul li ul {  position: absolute; z-index:3;  left: -9999px;  top: auto; }/* efect afisare dropdown */
#cssmenu ul li ul li {  max-height: 0;  position: absolute; -webkit-transition: max-height 0.4s ease-out;  -moz-transition: max-height 0.4s ease-out;  -ms-transition: max-height 0.4s ease-out;  -o-transition: max-height 0.4s ease-out;  transition: max-height 0.4s ease-out;   background: #77B39D;}/* formatare buton dropdown */
#cssmenu ul li ul li a {  font-size:1.1em;  font-weight: 400;  text-transform: none;  color: #fff;   display: block;  min-width: 300px;  padding: 20px;}
#cssmenu ul li ul li:hover > a,#cssmenu ul li ul li.active > a {  color: #fff;  background: #1e9455; }
#cssmenu ul li ul li:hover:after, #cssmenu ul li ul li.active:after {  background: #77B39D; }/* afiseaza butoanele principale in linie*/ 
#cssmenu > ul > li {  float: left;}/* efect dropdown */
#cssmenu > ul > li:after {  content: '';  display: block;  position: absolute;  width: 100%;  height: 100%; width:0;  top: 0;  z-index: 0;  background: #4B8F78;  -webkit-transition: height .2s;  -moz-transition: height .2s;  -ms-transition: height .2s;  -o-transition: height .2s;  transition: height .2s;}/* iconita dropdown */
#cssmenu > ul > li.has-sub > a {  padding-right: 35px;}/* iconita dropdown cerc */
#cssmenu > ul > li.has-sub > a:after {  display: block;  content: '';   height: 15px;  width: 15px;  position: absolute;  border-radius: 13px;  right: 14px;  top: 25px;}/* iconita dropdown sageata*/
#cssmenu > ul > li.has-sub > a:before {  display: block;  content: '';  border: 5px solid transparent;  border-top-color: #fff;  z-index: 2;  height: 0;  width: 0;  position: absolute;  right: 16px;  top: 30px;}/* iconita dropdown sageata efect culoare*/
#cssmenu > ul > li:hover > a:before,#cssmenu > ul > li.active > a:before {  border-top-color: #77B39D;}/* formatare buton principal */
#cssmenu > ul > li > a {  color: #ffffff;  padding: 20px 20px;  font-weight: 400; font-size: 1.1em;  z-index: 2;  position: relative;}/* efect de albire */
#cssmenu > ul > li:hover:after, #cssmenu > ul > li.active:after {  width: 100%;}/* culoare hover menu principal */
#cssmenu > ul > li:hover > a,#cssmenu > ul > li.active > a {  color: #fff;  }/* pozitionare dropdon */
#cssmenu > ul > li:hover > ul {  left: 0; }/* fara asta nu se afiseaza dorpdown */
#cssmenu > ul > li:hover > ul > li {  max-height: 600px;  position: relative; }/* buton NAVIGATIE */
#cssmenu #menu-button {  display: none; background: #77B39D;}
	
	
#IFG_Front_page { width: 100%; float: left; }

#IFG_Front_page_banner { width: 100%; float: left; background: url('img/front-page-banner.jpg') center fixed; background-size: cover; }
#IFG_Front_page_banner p { color:#fff; font-size: 2em; text-shadow:5px 5px 12px #000; }
#IFG_Front_page_banner h1 { color:#fff; font-size: 3em; text-shadow:2px 2px 8px #000; }
#IFG_Front_page_banner a { color:#fff; font-size: 2em; text-shadow:2px 2px 8px #000; }
#IFG_Front_page_banner a:hover { color:#f2210e; font-size: 2em; text-shadow:2px 2px 8px #000; }

#IFG_Front_page_banner1 { width: 100%; float: left; background: #fff; }
#IFG_Front_page_banner1 p { color:#555; font-size: 1.2em; }
#IFG_Front_page_banner1 h2 { color:#77B39D; font-size: 2.5em; }
#IFG_Front_page_banner1 a { color:#77B39D;  font-size: 1.2em;  }
#IFG_Front_page_banner1 a:hover { color:#f2210e;  }
#IFG_Front_page_banner1 .left_div { width: 50%; float: left;}
#IFG_Front_page_banner1 .right_div { width: 50%; float: right;;}



#IFG_Front_page_banner2 { width: 100%; float: left;  }
#IFG_Front_page_banner2 p { color:#fff; font-size: 1.2em; }
#IFG_Front_page_banner2 h3 { color:#fff; font-size: 2.5em; }
#IFG_Front_page_banner2 a { color:#77B39D;  font-size: 1.2em;  }
#IFG_Front_page_banner2 a:hover { color:#f2210e;  }
#IFG_Front_page_banner2 .left_div { width: 50%; float: left;}
#IFG_Front_page_banner2 .right_div { width: 50%; float: right;}



	
	#sidebar ul { width:100%; max-width:300px; float:left; margin:0px; padding:0px;}
	#sidebar li { display:block; transition: all 0.2s ease-in-out;  }
	#sidebar li:hover { transition: all 0.2s ease-in-out;}
	#sidebar li a { color:#047062; display:block; font-size:1em; text-decoration:none; }
	#sidebar li a:hover {  text-decoration:underline;  }
	#sidebar p { color:#666; font-size:0.7em;}
	#sidebar a.pis-title-link  { font-size:1.2em; text-decoration:none; color:#77B39D;  } 
	#sidebar a.pis-more-link { color:#333;  }






	
#container { width:90%; padding:0 5%; float:left; font-size:1.2em; overflow: hidden; }
nav {width:90%; padding:0 5%; float:left;  background: #77B39D !important; }
/* are legatura cu buton in varianta mobila  */
		


#left { float:left; width:70%; margin:40px 5% 40px 0px; }	

#sidebar { float:left; width:25%;  margin:40px 0px; }	



#informare { width:90%; padding:140px 5%; float:left; text-align:center; font-size:1.2em; background: #77B39D; color:#fff; }

footer {  width:90%; padding:80px 5%; display:flex;  font-size:1.5em;  background:#212529; color:#ccc; font-size:1.2em; }	
footer .copyright { width:75%; float:left; }	footer .infoghid { width:25%; float:left; text-align:right; }	
footer a { color:#fff; text-decoration:none;}	footer a:hover { color:#016635;}	

#IFG_Contact_map { float:left; width:100%; height:450px; }

h1 { font-size:1.7em; color:#77B39D; line-height:1.5em; }
h2 { font-size:1.2em; color:#77B39D;  line-height:1.3em; }
h3 { font-size:1.1em; color:#77B39D;  line-height:1.1em; }
h4 { font-size:1em; color:#77B39D;  line-height:1.1em; }
h5 { font-size:1em; color:#77B39D;  line-height:1.1em;}
h6 { font-size:1em; color:#77B39D;  line-height:1.1em;}
h1 a { text-decoration:none; color:#77B39D; }
p { line-height:1.5em; font-weight:300; } 
blockquote { font-style:italic; color:#77B39D;  }
li { color:#333; line-height:1.5em; font-weight:300;  }
a { color:#666; transition: all 0.2s ease-in-out; }a:hover { color:#77B39D; transition: all 0.2s ease-in-out; }
table { border-collapse:collapse;}td { border:1px solid #ccc; padding:10px; font-size:1em;  background:url(img/btn_bg_hover_green.png) #fff; }
a.btn { background: #95b29e; padding:10px 15px; color:#fff; border:none; text-decoration:none; font-size:1em; transition: all 0.2s ease-in-out; }
a.btn:hover { background:url(img/btn_bg_hover_green.png) #fff; color:#945325; transition: all 0.2s ease-in-out; }
#socializare { width:100%; margin-bottom:30px; float:left;}#IFG_Contact_map { float:left; width:100%;  }#IFG_Contact {  float:left; width:100%;  }


@media all and (max-width: 1024px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {#logo img {  content:url("img/small-logo-muzeu.png"); }#banner { display:none; }


#IFG_Top { width:100%; float:left; text-align:center;}

#IFG_Logo { width:90%; margin:0 5%; float:left; text-align:center; }
	#IFG_Logo img { width:100%;  }
#IFG_Cautare { width:100%; margin:0; float:left; }
	#searchform { text-align:center; width:100%; padding:0px 0px 20px 0px;}



#left { float:left; width:98%; margin:40px 1%; }	
#sidebar { float:left; width:98%; margin:40px 1%; }		

footer .copyright { width:100%; text-align:center; }	footer .infoghid { width:100%;  text-align:center; }	

  
  #cssmenu > ul { background: #77B39D;   max-height: 0;  overflow: hidden;    -webkit-transition: max-height 0.35s ease-out;    -moz-transition: max-height 0.35s ease-out;    -ms-transition: max-height 0.35s ease-out;    -o-transition: max-height 0.35s ease-out;    transition: max-height 0.35s ease-out;  }  
  #cssmenu > ul > li > ul {    width: 100%;    display: block;    }  
  #cssmenu.align-right ul li a {    text-align: left;  }  
  #cssmenu > ul > li > ul > li {    width: 100%;    display: block;  }  
  #cssmenu.align-right ul ul li a {    text-align: left;  }  
  #cssmenu > ul > li > ul > li > a {    width: 100%;    display: block;  }  
  #cssmenu ul li ul li a {    width: 100%;  }  
  #cssmenu.align-center > ul {    text-align: left;  }  
  #cssmenu.align-center > ul > li {    display: block;  }  
  #cssmenu > ul.open {    max-height: 3000px;    border-top: 1px solid rgba(255, 255, 255, 0.25);  } 
  #cssmenu ul {    width: 100%;  }  
  #cssmenu ul > li {    float: none;    width: 100%;  }  
  #cssmenu ul li a {   font-size:1.2em; font-weight:bold;   -webkit-box-sizing: border-box;    -moz-box-sizing: border-box;    box-sizing: border-box;    width: 100%;    padding: 20px 20px;  }  
  #cssmenu ul li a:hover { background: #016635; }   
  #cssmenu ul > li:after {    display: none;  }  
  #cssmenu ul li.has-sub > a:after,  #cssmenu ul li.has-sub > a:before,  #cssmenu ul li ul li.has-sub:after,  #cssmenu ul li ul li.has-sub:before {    display: none;  }  
  #cssmenu ul li ul,  #cssmenu ul li ul li ul,  #cssmenu ul li ul li:hover > ul,  #cssmenu.align-right ul li ul,  #cssmenu.align-right ul li ul li ul,  #cssmenu.align-right ul li ul li:hover > ul {    left: 0;    position: relative;    right: auto;   }  
  #cssmenu ul li ul li,  #cssmenu ul li:hover > ul > li {    max-height: 999px;    position: relative;    background: none;  }  #cssmenu ul li ul li a {  font-size:1.2em;   padding: 20px 20px 20px 35px;  }  
  #cssmenu ul li ul li a:hover { background: #016635; }  
  #cssmenu ul li ul ul li a {   padding: 20px 20px 20px 50px;   }  
  #cssmenu ul li ul ul li a:hover { background: #016635; }    
  #cssmenu #menu-button {    display: block;    -webkit-box-sizing: border-box;    -moz-box-sizing: border-box;    box-sizing: border-box;    width: 100%;    padding: 25px 20px;    text-transform: uppercase;    font-weight: 700;    font-size: 1em;      color: #ffffff;    cursor: pointer;  }  
  #cssmenu #menu-button:after {    display: block;    content: '';    position: absolute;    height: 3px;    width: 22px;    border-top: 2px solid #ffffff;    border-bottom: 2px solid #ffffff;    right: 20px;    top: 26px;  }  
  #cssmenu #menu-button:before {    display: block;    content: '';    position: absolute;    height: 3px;    width: 22px;    border-top: 2px solid #ffffff;    right: 20px;    top: 36px;  }  /* culoare hover menu principal */  
  #cssmenu > ul > li:hover > a,#cssmenu > ul > li.active > a {  color: #fff; background: #016635;  }
  
  
  
  
#IFG_Front_page { width: 100%; float: left; }

#IFG_Front_page_banner { width: 100%; float: left; background: url('img/front-page-banner.jpg') center fixed; background-size: cover; }
#IFG_Front_page_banner p { color:#000; font-size: 1.2em; text-shadow:2px 2px 8px #000; }
#IFG_Front_page_banner h1 { color:#000; font-size: 2em; text-shadow:2px 2px 8px #000; }
#IFG_Front_page_banner a { color:#000; font-size: 1.2em; text-shadow:2px 2px 8px #000; }
#IFG_Front_page_banner a:hover { color:#fdf905; font-size: 1.2em; text-shadow:2px 2px 8px #000; }

#IFG_Front_page_banner1 { width: 100%; float: left; background: #fff; }
#IFG_Front_page_banner1 p { color:#555; font-size: 1.2em; }
#IFG_Front_page_banner1 h2 { color:#77B39D; font-size: 2.5em; }
#IFG_Front_page_banner1 a { color:#77B39D;  font-size: 1.2em;  }
#IFG_Front_page_banner1 a:hover { color:#fdf905;  }
#IFG_Front_page_banner1 .left_div { width: 100%; float: left;}
#IFG_Front_page_banner1 .right_div { width: 100%; float: right;;}



#IFG_Front_page_banner2 { width: 100%; float: left;  }
#IFG_Front_page_banner2 p { color:#fff; font-size: 1.2em; }
#IFG_Front_page_banner2 h3 { color:#fff; font-size: 2.5em; }
#IFG_Front_page_banner2 a { color:#77B39D;  font-size: 1.2em;  }
#IFG_Front_page_banner2 a:hover { color:#fdf905;  }
#IFG_Front_page_banner2 .left_div { width: 100%; float: left;}
#IFG_Front_page_banner2 .right_div { width: 100%; float: right;}
  
 
  
  }
  
  
 /* ACTIVITATI */
/*  
.events-container {
  max-width: 100%;
  margin: 0 auto;
  padding: 80px 20px;
    background-color: rgba(173, 117, 120, 0.1);
}

.events-container .gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto;
}

.events-container .card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 10px 25px rgba(0,0,0,0.1);
  transition: 0.4s ease;
  
}

.events-card-img-wrapper {
  position: relative;
  height: 300px;
  overflow: hidden;
}

.events-card-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.events-card-img-wrapper::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.5);
  opacity: 0;
  transition: 0.4s ease;
  z-index: 1;
}

.events-container .card:hover .events-card-img-wrapper img {
  transform: scale(1.1);
}

.events-container .card:hover .events-card-img-wrapper::after {
  opacity: 1;
}

.events-container .card .content {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  text-align: center;
  color: #fff;
  z-index: 5;
  background: linear-gradient(to top, rgba(0,0,0,0.85), rgba(0,0,0,0));
  transition: 0.4s ease;
  
}



.events-container .card:hover .content {
   transform: translateY(60px);
}


.events-container .card .description {
  opacity: 0;
  transition: 0.4s ease;
}

.events-container .card:hover .description {
  opacity: 1;
}

.events-container .card .btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, 100%);
  opacity: 0;
  padding: 0.5rem 1.2rem;
  background: linear-gradient(135deg, #77B39D, #945325);
  color: #fff;
  border-radius: 8px;
  text-transform: uppercase;
  transition: 0.4s ease;
  z-index: 5;
}

.events-container .card:hover .btn {
  transform: translate(-50%, -50%);
  opacity: 1;
}
.section-title {
  font-size: 2em;
  color: #77B39D;
  margin-bottom: 0.5rem;
  text-align: center;
  
}
.sentence-p{line-height:1.5em; font-weight:300; color:#333; text-align: center; margin-bottom: 2rem; font-size: 1.5em;}

.events-container .gallery .card .content {
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  padding: .5rem;
  gap: .3rem;
  z-index: 3;
  text-align: center;
  
  
}

.events-container .gallery .card .content .title {
  font-weight: var(--font-bold);
  font-size: var(--text-md);
  color: #fff;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
  
}

/* END ACTIVITATI */

/* Pentru activitati category*/
/*  
.card-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 15px;
    margin: 20px auto;
    max-width: 1000px;
}

.card {
    border: 1px solid #ddd;
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 3px 6px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    transition: transform 0.2s ease;
    height: 100%; 
}

.card:hover {
    transform: translateY(-3px);
}

.card-image img {
    width: 100%;
    height: 140px;
    object-fit: cover;
}

.card-content {
    padding: 12px;
    display: flex;
    flex-direction: column;
    flex: 1; 
}

.card-content h3 {
    font-size: 1.5rem;
    margin: 0 0 6px 0;
}

.card-content p {
    font-size: 1rem;
    margin-bottom: 8px;
    flex-grow: 1; 
    overflow: hidden;
}

.read-more {
    display: inline-block;
    font-size: 0.9rem;
    font-weight: bold;
    color: #590707;
    text-decoration: none;
    margin-top: auto; 
}

.read-more:hover 

{
    color: #77B39D;
}

*/