/*
Theme Name: Avada-Child-InformationGeography
Description: Child theme for Avada theme
Author: ThemeFusion
Author URI: https://theme-fusion.com
Template: Avada
Version: 1.0.0
Text Domain:  Avada
*/



/* --------------
TEXTS & FONTS
---------------*/

	/* Bespoke sizing for header */

		.h1textline1{
			font-size:41px;
			text-align:center;
			font-weight:400;
		}

		.h1textline2{
			font-size:42px;
			text-align:center;
			font-weight:400;
		}

		a .h1textline1, a .h1textline2{
			color:#000000!important;
		}
	
	/* Basic sizing */
		
		h1, h2.title-heading-left, h2{
			font-family:'Reem Kufi';
			text-transform:uppercase;
	
		}

		/* Used for page subtitles */	

		h3{
			font-family:'Reem Kufi'!important;
			text-transform:uppercase;
			font-size:21px!important;
			font-weight:400!important;
			margin-top:2em!important;
		}
		
		/* The top of the page has margin-bottom, so the margin-top is reduced for first item */

		h3:first-of-type{
			margin-top:1em!important;
		}

		p + h3:first-of-type{
			
			margin-top:2em!important;
		}

		
		/* Used for footnotes */
		
		h5{
			font-size:17px!important;
			font-family:'Reem Kufi'!important;
			font-weight:100!important;
		}
		
		
		/* Puts a line above footnotes */

		h5:first-of-type{
			margin-top:3em!important;
			border-top:1px solid #000000!important;
			padding-top:30px!important;
		}

		p, main li, main ul li, main ol li{
			font-family:'Roboto'!important;
			font-size:16px!important;
			text-align:justify;

		}

		/* Link colour */

		p a, h3 a, h4 a, main li a, main ul li a, main ol li a{
			color:#D2460F!important;

		}

	/* Specific overrides for when Theme Fusion ignores the above, or when specific styling is needed for certain classes */


		.fusion-page-title-bar h1{
			font-family:'Reem Kufi'!important;
			margin-top:50px!important;
		}
	
	
	
		#main .fusion-portfolio h2, #main .post h2, #wrapper #main .post h2, #wrapper #main .post-content .fusion-title h2, #wrapper #main .post-content .title h2, #wrapper .post-content h2, .fusion-modal h2, .fusion-widget-area h2, h2.entry-title{
			
			font-size:24px!important;
			color:#000000!important;
			font-family:'Reem Kufi'!important;
			
		}

		.fusion-title h2.title-heading-center, h2.title-align-center{

			margin-top:30px!important;
			font-family:'Reem Kufi'!important;
			text-transform:uppercase!important;
			color:#FFFFFF!important;
			line-height:25px!important;	
			font-size:24px!important;

		}

		.fusion-page-title-captions h1.entry-title{
			margin-top:50px!important;
			color:#000000!important;
		}
		
		
		

		h4.title-heading-center{
			color:#FFFFFF!important;
			font-size:17px!important;
			line-height:19px!important;
			text-align:left!important;
			font-family:'Roboto'!important;	
			font-weight:100!important;
		}
			

		h2.title-heading-left{
			font-size:36px!important;
			line-height:42px!important;
		}	
			
		h3.title-heading-left{
			font-size:24px!important;
			line-height:30px!important;
		}	

		.tfs-slider .slide-content-container .heading{
			margin:0px!important;
		}

		
		
/*-----------------
HEADER CSS
------------------*/


				#oii-brand{
					right: 0px;
					position: absolute;
				}

				.oii-brand-logo{
					display:inline-block;
					margin-right:0px;
					width:110px!important;
				}
				
				.oii-brand-logo a img{
					width:110px!important;
				}

				.oii-brand-logo:first-of-type{

					margin-right:11px;
				}


				#site-brand{
					margin-left:auto;
					margin-right:auto;
					display:block;
				}

				#site-brand-name{
					line-height:40px;
					top: 10px;
					position: relative;
				}

		


/*-------------------
STYLE CHANGES TO ESSENTIAL GRID CSS
---------------------- */ 

	/* Changes EG allows by prepending class prefix .eg-geographics-
	
	This is mainly changing border-radius, font.
	
	*/

		.eg-geographics-wrapper .esg-entry-media,
		.eg-geographics-wrapper .esg-overlay,
		.eg-geographics-wrapper .esg-media-poster {

		   overflow:hidden;
		   border-radius:20px;
		   -webkit-border-radius:20px;
		   -moz-border-radius:20px;

		}

		.eg-geographics-element-3{
			font-family:'Reem Kufi'!important;
			font-weight:500!important;
		}

		.esg-bc .eg-geographics-element-10, .esg-bc .eg-geographics-element-10:hover{
			border-radius:15px!important;
		    -webkit-border-radius:15px;
		    -moz-border-radius:15px;			
			font-family:'Reem Kufi'!important;
			font-weight:500!important;
		}


	/* Cosmetic changes not offered by Essential Grid */	
		
		
		
		.esg-filter-wrapper{
			border-radius:20px;
			margin-bottom:20px;
			background-color:#000000!important;
			min-width:200px!important;
		}

		.esg-selected-filterbutton{
			font-family:'Reem Kufi'!important;
			text-transform:uppercase!important;
			color:#FFFFFF!important;
			font-weight:500!important;
			padding-bottom:10px!important;
			padding-top:20px!important;
			font-size:16px!important;
			
		}


		.esg-dropdown-wrapper{
			background-color:#000000!important;
			border-radius:20px!important;
			padding-top: 50px;
			top: 40%;
			z-index: -10;
			min-width:200px!important;
		}

		.esg-filterbutton{
			border-radius:20px!important;
			font-family:'Reem Kufi'!important;
			text-transform:uppercase!important;
			transition: background-color 0.5s ease!important;
			-webkit-transition: background-color 0.5s ease!important;
			border:0px!important;
			line-height:22px!important;
			padding-top: 12px!important;
			padding-bottom: 10px!important;
		}

		.esg-filterbutton:hover{
			background-color:#fcbba1!important;
		}

		.esg-navigationbutton{
			background-color:#000000!important;
			color:#AAAAAA!important;
			font-family:'Reem Kufi'!important;
			text-transform:uppercase!important;
			box-shadow:none!important;
		}

		.esg-navigationbutton i{
			color:#AAAAAA!important;
		}

		.esg-pagination .esg-navigationbutton:hover, .esg-navigationbutton i:hover{
			color:#fcbba1!important;
			background-color:#000000!important;
		}


		.esg-navigationbutton.selected{
			color:#FFFFFF!important;
		}

		.esg-filters{
			margin-top:20px!important;
			
		}
		
		esg-filterbutton[data-fid="1"]{
			display:none!important;
		}
		
		
		
		.esg-navigationbutton.esg-loadmore{
			border-radius:20px!important;
			color:#FFFFFF!important;
			border:none!important;
		}
		
/*-----------------------
CHANGES TO THEME FUSION
------------------------*/


	/* These changes are mainly colour, margin, font, border options that aren't offered by Theme Fusion */

		.ilightbox-title{
			font-family: 'Reem Kufi'!important;
			text-transform:uppercase!important;
			font-size:20px!important;
			text-align: center!important;
			margin-top: 20px!important;
		}
	
	
		#mobile-menu-menu-1 ul li a{
			background-color:#000000!important;
			color:#FFFFFF!important;
			
		}


		#sliders-container-bar-below{
			display:block;
			width:100%;
			height:40px;
			background-color:black;
			
		}

		.fusion-mobile-menu-sep, .fusion-secondary-main-menu{
			border-bottom:0px!important;
		}



		a.flex-active{
			background-color:white!important;
		}

		.slide-content-container{
			margin: 0 auto!important;
			display:block!important;
			padding-left:0px!important;
			padding-right:0px!important;
			max-width: 550px;
			margin-right: calc(50% - 550px)!important;
			margin-left: 50%!important;

		}
		.fusion-page-title-secondary{
			display:none!important;
		}

		.tfs-button-1{
			padding-bottom: 30px;
		}


		.fusion-title-sc-wrapper{
			font-family: 'Reem Kufi'!important;

		}

		.fusion-title-sc-wrapper{
			max-width:80%;
			width:80%;
			margin-left:10%;
			margin-right:10%;
		}

		.slide-content{
			background-color:rgba(0,0,0,0.6)!important;
			border-radius:20px!important;
			
		}


		.fusion-main-menu, .menu-item, .menu-text{
			
			font-family:'Reem Kufi';
			text-transform:uppercase;
		}


		.fusion-title-sc-wrapper{
			max-width:70%!important;
			padding-top:12px!important;
			padding-bottom:12px!important;
		}

		.tfs-slider .slide-content-container h2{

			color:#FFFFFF!important;
		}

		.fusion-button{
			background-color:#FFFFFF!important;
			border-radius:20px!important;
			font-family: 'Reem Kufi'!important;
			margin-bottom:30px!important;
		}


		.fusion-button:hover{
			background-color:#fcbba1!important;

		}

		.fusion-button-text{
			color:#000000!important;
			margin-top:10px!important;
		}


		.fusion-header-content-3-wrapper{
			display:none!important;
		}

		.search-page-search-form.search-page-search-form-top h2, .search-page-search-form.search-page-search-form-top p{
			display:none!important;
		}
		
		
		.featured-image-2_page, .featured-image-3_page, .featured-image-4_page, .featured-image-5_page{
			display:none!important;
		}
		
		.fusion-carousel-item-wrapper img{
			border-radius:15px!important;
			
		}
		
		.fusion-comments, .fusion-rollover-link, .fusion-rollover-gallery, .fusion-rollover-content .fusion-rollover-sep, .related-posts .title-sep-container{
			display:none!important;
		}
		
		.fusion-rollover, .fusion-image-wrapper .fusion-rollover{
			border-radius:15px!important;
		
			
		}
		
		h4.fusion-rollover-title a{
			font-family:'Reem Kufi'!important;
			text-transform:uppercase!important;
			color:#FFFFFF!important;
			line-height:15px!important;
		}
		
		.related-posts h3.title-heading-left{
			text-align:center!important;
			width:100%!important;
		}
		
		.fusion-meta-info{
			margin-top:80px!important;
			
		}

		
/*---------------------------------
CHANGES TO INTERACTIVE GRAPHICS
-----------------------------------*/		
iframe #svgcontainer{
    margin-left: auto!important;
    display: block!important;
    margin-right: auto!important;
	
}
		
		
/* --------------------------------
OWN CODE - USED IN SINGLE.PHP
-----------------------------------*/

.thumbnail{
	width:300px!important;
	display:inline-block!important;
	float:left!important;
	margin-bottom:40px!important;
	margin-right:30px!important;
	position:relative!important;

}


.mid-page-thumbnail{
	width: 50%!important;
	min-width:400px!important;
    margin-bottom: 40px!important;
    margin-left: auto;
    margin-right: auto;
	position: relative;
}


.mid-page-thumbnail img{
	border-radius:20px!important;
}


.mid-page-thumbnail-container{
	width: 100%;
    display: inline-block;
    height: auto;
    position: relative;
	margin-bottom:30px;
	margin-top:30px;
}

.mid-page-thumbnail-container a{
	
}


.mainGraphic{
	width:100%;
	height:400px!important;
	position: relative;
	margin-bottom: 100px;
}

.mainGraphic a{
	width:100%;
	height:100%;
}

.thumbnail img{
border-radius: 20px;
max-height:300px!important;
}

#content{
	margin-top:20px!important;
	margin-bottom:20px!important;
}
		
		
.hover-cover{
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    border-radius: 20px;
	transition: opacity .5s ease-out;
    -moz-transition: opacity .5s ease-out;
    -webkit-transition: opacity .5s ease-out;
    -o-transition: opacity .5s ease-out;
	background-color:#000000;
	opacity:0;
}

.hover-cover:hover{
	
	opacity:0.7;
}


.hover-text-container{
	width:100%;
	height:100%;
	position:relative;
}

.hover-text{
	color:#FFFFFF;
	font-size:16px;
	text-align:center;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	
}

#primary-image{
			height: 100%;
			width: 100%!important;
			float:none!important;
			margin-left: auto;
			margin-right: auto!important;
			display: block!important;
			margin-bottom:70px!important;
			border-radius:20px!important;
}
	
	.image-button{
		position: absolute;
		font-family: 'Reem Kufi';
		bottom: 10px;
		background-color: #FFFFFF;
		width: 125px;
		padding-left: 20px;
		padding-right: 20px;
		margin-left: auto;
		margin-right: auto;
		display: block;
		height: auto;
		padding-top: 10px;
		padding-bottom: 7px;
		border-radius: 20px;
		font-size: 14px;
		text-align: center;
		color:#000000;
		
	}	
	
	.click-notice{
		text-align:center;
		position:absolute;
		width:100%;
		bottom:-35px;
		font-size:14px;
		color:#000000!important;
	}


	body#project-team img{
		border-radius:150px!important;
	}

	body#project-team h3{
		margin-bottom:0px!important;
	}
	
/*---------------------------------
INDIVIDUAL PAGE CSS
----------------------------------*/

body#related-blogs #wrapper .post-content .oii-related-blog a h2{
	color:#D2460F!important;
	margin-bottom:10px!important;
	line-height: 24px!important;
}


.oii-related-blog{
	margin-bottom:80px;
}

p.oii-date{
margin-bottom:0px!important;
}

		
/* --------------------------------
RESPONSIVE ALTERATIONS TO THE ABOVE
-----------------------------------*/
			
		
			

		@media screen and (max-width: 1200px) and (min-width: 811px){
			
			#site-brand{
				margin-left:0px;
			}
			
			.fusion-logo-right .fusion-logo{
				text-align:left;
			}


			.slide-content-container{

				max-width: 400px!important;
				margin-right: 0!important;
				margin-left: 0!important;
				right:36px!important;
			}
		}
		
		
		

		@media screen and (max-width:810px) and (min-width: 651px){
		
			#oii-brand{
				right: 0px;
				top: 20px!important;
			}
			
			#site-brand{
				margin-left:0px;
			}
			
			.fusion-logo-right .fusion-logo{
				text-align:left;
			}

			.slide-content-container{
				max-width: 400px!important;
				margin-right: 0!important;
				margin-left: 0!important;
				right:36px!important;
			}
			
			.esg-container{
				padding: 20px 5% 0px 5%!important;
			}
			
			.thumbnail{
			width:220px!important;
	
			}
			
			
			
			
			
			

		}
		
		

		@media screen and (max-width: 650px){
			
			#oii-brand{
				margin: auto;
				display: block;
				width: 233px;
				position:relative;
			}
			
			.fusion-logo-right .fusion-logo{
				text-align:center;
			}
			
			.h1textline1{
				font-size:32px;
			}
			
			.h1textline2{
				font-size:33px;
			}
			
			#site-brand-name{
				line-height:35px;
			}
			
			.slide-content-container{
				margin: 0 auto!important;
				display:block!important;
				padding-left:0px!important;
				padding-right:0px!important;
				max-width: 90%;
				margin-right: 5%;
				margin-left: 5%!important;

			}
			
			#sliders-container{
				display:none!important;
			}
			
			a .thumbnail{
				float:none!important;
				margin-left: auto;
				margin-right: auto!important;
				display: block!important;
			}
			
			.fusion-page-title-bar .fusion-page-title-row h1{
					font-size:20px!important;
					line-height:22px!important;
					margin-top:20px!important;
				
			}
			
			p, main li, main ul li, main ol li{
				font-size:14px!important;
			}
			
			
			#main{
				padding-top:0px!important;
			}
			
			.post-content h3{
				font-family:'Reem Kufi'!important;
				text-transform:uppercase;
				font-size:17px!important;
				font-weight:400!important;
				margin-top:0px!important;
			}
			
			#main .fusion-portfolio h2, #main .post h2, #wrapper #main .post h2, #wrapper #main .post-content .fusion-title h2, #wrapper #main .post-content .title h2, #wrapper .post-content h2, .fusion-modal h2, .fusion-widget-area h2, h2.entry-title{

				line-height:23px!important;	
				font-size:22px!important;

			}
				
			#esg-grid-1-1{
				padding-top:0px!important;
				
			}
			
			.oii-brand-logo{
				display:inline-block;
				margin-right:0px;
				width:80px!important;
			}
				
			.oii-brand-logo a img{
				width:80px!important;
			}

			.oii-brand-logo:first-of-type{
				margin-right:8px;
			}
			
			
		}
		
		

		@media screen and (max-width: 550px){
			
			.esg-container{
				padding: 20px 5% 0px 5%!important;
			}

		
		}