/*
 Theme Name:   study circle - Child
 Theme URI: https://gracethemes.com/themes/free-education-wordpress-theme/ Description:  Study Circle Child Theme
 Author: Grace Themes / ServeIT Clinic
 Author URI: https://gracethemes.com/
 Template:     study-circle
 Version:      1.7.0
 License:      GNU General Public License v3.0
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Description: Study Circle is a free WordPress theme. This child theme was created by the ServeIT Clinic to preserve CSS if original theme is updated. Original demo Link: https://gracethemes.com/demo/studycircle/
 Tags:         light, dark, two-columns, right-sidebar, responsive-layout, accessibility-ready
 Text Domain:  study-circle-child
*/


/*********************************************************
	FLEXBOX - used for responsive web design

*********************************************************/
/* HOME PAGE ICONS */
.flex-container {
	display:flex;
	flex-flow:row wrap;
	justify-content:space-around;
	
}

.flex-container img {
	height:300px;
	width:265px;
}

.flex-container figure {
	width:325px !important;
	padding-bottom:1.0em;
}

.flex-container h2 { text-align:center; }

/***********************************************
	OUTREACH PAGES

***********************************************/


.top_panel_fixed .top_panel_wrap .logo_fixed {
   display:none;
}

.top_panel_fixed .top_panel_wrap .logo_main {
   display:block;
}

.outReachContact, .centerParagraph {
	text-align: center;
}

.indentBullets {
	margin-left: 1.5em;  
}

.imageSizing{
    width: 25%;
	height: 25%;
	padding: 10px;
}

#custom-logo img {
max-height: 169.8px !important;
max-width: 100px !important;
}

#alejandro {
max-width: 100%;
background: url("http://www.bloomingtonsymphonydevsitefall2017.iuserveit.org/wp-content/uploads/2017/09/alejandro-e1506998734928.jpg");
}

/*****************************************************
	MEDIA QUERIES - FOR MOBILE RESPONSIVENESS
	essentially, when the website is on the following widths, we want to alter content to change size to match the screen widths.

*****************************************************/

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 576px) {

}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 768px) {
	.imageSizing {
	    width: 75%;
		height: 75%;
		padding: 10px;
	}
}

/*****************************************************
	about page + logo

*****************************************************/

/*
.logo a img { 
display: none;
}

.logo a { 
display: block; width: 200px; height: 48px; background: 			url(http://www.bloomingtonsymphonydevsitefall2017.iuserveit.org/wp-content/uploads/2017/10/logo_bso.png) center center no-repeat transparent; background-size: cover;
}
*/

.logo {
	margin-top:-6px;
}

a.genericon.genericon {
	font-size:24px;
}

#alejandro {
	max-width: 100%;
	max-height: 100%;
	padding: 25px;
	position: relative;
	background:	url("https://i1.wp.com/www.bloomingtonsymphonydevsitefall2017.iuserveit.org/wp-content/uploads/2017/09/alejandro-e1506998734928.jpg");
	background-repeat:no-repeat;
	background-size:cover;
}

.alejandro_text {
	max-width: 80%;
	padding: 3%;
	margin: 3%;
	background-color: rgba(0,0,0,0.7);
	position: relative;
	top: 0;
	z-index:10;
}

#musician {
	max-width: 100%;
	max-height: 40%;
	padding: 5%;
	position: static;
	background-color: rgba(255,255,255,1);
}


.button {
	-webkit-transition-duration: 0.4s; 
    transition-duration: 0.4s;
    background-color: #98ce00;
    color: white;
    border: 2px solid #98ce00;
	z-index:2;
}
.button:hover {
    background-color: rgba(0,0,0,0); 
    color: #98ce00;
	border: 2px solid #98ce00;
}

#mission {
	width: 100%;
	height: 100%;
	position: relative;
}

#page {
     max-width: none;
}

body {
	padding: 0;
}

#concerts-events {
	margin-top: 4%;
	max-width: 100%;
	max-height: 100px;
	padding: 3%;
	padding-bottom:40%;
	position: relative;
	
}

.bottom{
  position: absolute;
	padding-top: 5%;	
}

#news {
	width: 100%;
	height: 100%;
	position: relative;
}

/*********************************

HOME PAGE

*********************************/

/* Hides the carousel options on the big home page image */
a[class^="nivo"] {
	display:none;
}

.nivo-directionNav, .nivo-controlNav {
	display:none;
}

/* Hides the bullet points on the upcoming events list */
.ecs-event-list {
	list-style:none;
}

/* The buttons on homepage (ones in three boxes and recent news). Changes color from gray to the site's green. These are editing Wordpress plugins. */
.news-more-link, .ReadMore {
	background-color:#98ce00;
}
.ReadMore:hover {
	background-color:#3e3e3e !important;
}
/* Edits the gray boxes with the image thumbnails on them */
div.pagecontent {
	height:200px;
} 



/*********************************

MISCELLANEOUS - used for small changes that aren't located in the above sections

*********************************/