/*
Theme Name: Karimah Ashadu 
Theme URI: karimahashadu.com
Description: 
Version: 2.0
Author: Lee Boyce (V1) & Caine Förster (V2)
Author URI: http://leeboyce.co.uk
Author URI: https://bytesoncanvas.de
*/

/*
	
	--- Color References ---
	link blue: #39C;
	background: #XXXXXX;
	more colors: #XXXXXX;
	slider bg: #EAEAEA
	text: #989898
	dark text: #333333
	rules: #808080
*/

/* @license
 * MyFonts Webfont Build ID 2570312, 2013-05-31T19:11:25-0400
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Proxima Nova A Thin by Mark Simonson
 * URL: http://www.myfonts.com/fonts/marksimonson/proxima-nova/a-thin/
 * 
 * Webfont: Proxima Nova S Thin by Mark Simonson
 * URL: http://www.myfonts.com/fonts/marksimonson/proxima-nova/s-thin/
 * 
 * Webfont: Proxima Nova Thin by Mark Simonson
 * URL: http://www.myfonts.com/fonts/marksimonson/proxima-nova/thin/
 * 
 * 
 * License: http://www.myfonts.com/viewlicense?type=web&buildid=2570312
 * Webfonts copyright: Copyright (c) Mark Simonson, 2005. All rights reserved.
 * 
 * � 2013 MyFonts Inc
*/

/* @import must be at top of file, otherwise CSS will not work */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400&display=swap');

@import url("//hello.myfonts.net/count/273848");
@font-face {font-family: 'ProximaNovaA-Thin';src: url('./webfonts/273848_0_0.eot');src: url('./webfonts/273848_0_0.eot?#iefix') format('embedded-opentype'),url('./webfonts/273848_0_0.woff') format('woff'),url('./webfonts/273848_0_0.ttf') format('truetype');}
@font-face {font-family: 'ProximaNovaS-Thin';src: url('./webfonts/273848_1_0.eot');src: url('./webfonts/273848_1_0.eot?#iefix') format('embedded-opentype'),url('./webfonts/273848_1_0.woff') format('woff'),url('./webfonts/273848_1_0.ttf') format('truetype');}
@font-face {font-family: 'ProximaNovaT-Thin';src: url('./webfonts/273848_2_0.eot');src: url('./webfonts/273848_2_0.eot?#iefix') format('embedded-opentype'),url('./webfonts/273848_2_0.woff') format('woff'),url('./webfonts/273848_2_0.ttf') format('truetype');}

/*--------------------------------------------------------------------------------------------------*/
/* GENERAL STYLES
/*--------------------------------------------------------------------------------------------------*/

	/* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) -- http://cssreset.com */ html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {	margin: 0;	padding: 0;	border: 0;	font-size: 100%; font: inherit;	vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {	display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none;}blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none;} table { border-collapse: collapse; border-spacing: 0; }

	/* apply a natural box layout model to all elements - http://paulirish.com/2012/box-sizing-border-box-ftw/ */
	* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

	/*--- TEXT ---*/
		
		/* Font stacks - some premade stacks you could use, by default we're using the sans stack in the 'base styling' section below */
		.serif { font-family: Baskerville, Palatino, "Palatino Linotype", "Hoefler Text", "Times New Roman", times, serif; }
		.monospace { font-family: 'courier new', courier, Consolas, Menlo, Monaco, 'Lucida Console', 'Liberation Mono', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', monospace; }
		.sans { font-family: 'Helvetica Neue', helvetica, sans-serif; }
		
		.ProximaNovaA-Thin { 
			font-family: ProximaNovaA-Thin;
			font-weight: normal;
			font-style: normal;
		}
		.ProximaNovaS-Thin { 
			font-family: ProximaNovaS-Thin;
			font-weight: normal;
			font-style: normal;
		}
		.ProximaNovaT-Thin { 
			font-family: ProximaNovaT-Thin;
			font-weight: normal;
			font-style: normal;
			letter-spacing: 4px;
		}

		.Montserrat{
			font-family: 'Montserrat', sans-serif;
		}
	/*--- CODE ---*/
		code { background-color: #2A410B !important; font-family: 'Andale Mono', 'Lucida Console', "courier new", courier, monospace; background-color: #069; color: #FFF; padding: .5em; -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
		pre code { line-height: 130%; display: block; padding: 1em; margin: 2em 0; overflow: auto; }
		pre { margin: 1em; }

	/*--- FORMS ---*/
		#search-form input[type='text'], #mce-FNAME, #mce-EMAIL { width: 308px; }
		input[type='text'], #mce-FNAME, #mce-EMAIL, #contact-form textarea { 
			background-color: #CBCBCB; 
			color: #fff; 
			font-family: 'ProximaNovaT-Thin';
			margin-bottom: 10px;
			border: 0;
			padding: 4px;
		}
		
		.button {
			display: block;
			padding: 0;
			margin-top: 10px;
			margin-bottom: 10px;
			font-family: 'ProximaNovaT-Thin';
			color: #989898;
			background: none; 
			border: none;
		}
		.button:hover { color: #000; }

        /*--- CONTACT FORM ---*/
            #contact-form input[type='text'], #contact-form textarea { width: 308px; font-size: 1em; }
            #contact-form #h-verify-nb-user { width: 14px; }
            #contact-form .human-verification { font-weight: bold; }
            #contact-form .human-verification label { font-weight: normal; font-style: italic; }
            #contact-form .response { padding: 9px 3px; font-size: 0.9em; color: #000000; }
            #contact-form ::-webkit-input-placeholder { color: #ffffff; }
            #contact-form :-moz-placeholder { color: #ffffff; opacity: 1; }
            #contact-form ::-moz-placeholder { color: #ffffff; opacity: 1; }
            #contact-form :-ms-input-placeholder { color: #ffffff; }

	/*--- LISTS ---*/
	
		/* .no-bullet: list without bullets */
		.no-bullet { list-style-type: none; margin-bottom: 2em; }
		.no-bullet li { margin-bottom: .5em; }

		/* .bullet-list: nicer formatting for a bulleted list */
		.bullet-list { margin: 1em 0 2em 0; line-height: 150%; }
		.bullet-list li { margin: 0 2em 1em 2em; list-style-type: square; }
		.bullet-list li ul { margin: .5em 0 1.5em 0; }
		.bullet-list li ul li { list-style-type: circle; margin: 0 2em .5em 2em; }

		/* .horiz-list: Used to put a list inline (horizontal) and get rid of the bullets */
		.horiz-list ul { float: left; list-style-type: none; }
		.horiz-list li { float: left; display: inline; }
		.horiz-list li a { display: block; float: left; width: auto;  }

		/* .link-list */
		.link-list li { list-style-type: none; }
		li.link-list a, ul.link-list li a { display: block; background: url(./images/icon_link_arrow.png) 0px 8px no-repeat; padding-left: 20px; margin-left: 20px;  }
	
		/* .pdf-list */
		.pdf-link { padding-left: 20px; margin-left: 5px; }
		.pdf-list li { list-style-type: none; }
		li.pdf-list a, ul.pdf-list li a { display: block; background: url(./images/icon_pdf_sm.png) 0 3px no-repeat; padding-left: 20px; margin-left: 20px; }
	
	/*--- UTILITY ---*/

		/* Clear Fixes - two methods, clear-fix is attached to the element you want to clear, .clear-all you can attach to a hr or br tag to clear the item before it as a last resort when you're in a hurry */
		.clear-fix:before,
		.clear-fix:after { content: ""; display: table; } 
		.clear-fix:after { clear: both; }

		.clear-all { visibility: hidden; clear: both; margin: 0 !important; padding: 0 !important; font-size: 0; height: 1px; }

		/* WordPress WYSIWYG alignment -- when you put in images that span the entire width of the content area remove the width and height */
		img.aligncenter { max-width: 100%; display: block; margin: 5px auto; }
	    img.alignright { padding: 4px; margin: 0 0 2px 7px; display: inline; }
	    img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
	    .alignright { float: right; }
		.alignleft { float: left; }
		
		/* Warnings */
		.sys { text-align: left }
		.warn {}
		
		::selection {
	background: #666666; /* Safari */
	color: #fff;
	}
::-moz-selection {
	background: #666666; /* Firefox */
	color: #fff;
}

	/*--- JQUERY RELATED --- */

		/* Show-Hide Content */
		.make-link { color: #06F !important; text-decoration: none; margin-bottom: .5em; } 
		.make-link:hover, .make-link:focus, .make-link:active { cursor: pointer; color: #C60; text-decoration: underline; }
		ul.hide { margin: 0 0 0 1em !important; padding: 0 !important; }

			/* Adds 'Plus-Minus' sign to header */
			.header-shown { background: url('./images/icon_link_plus_minus.png') no-repeat 0 -20px; height: 17px; }
			.header-hidden { background: url('./images/icon_link_plus_minus.png') no-repeat 0px 3px; height: -14px; }

		/* Indicators */
		.indicator { position: absolute; z-index: 100; text-align: right; left: 0; }
		.indicator a { width: 7em; background-color: #FF0; display: block; font-weight: bold; font-size: 12px !important; text-transform: uppercase; text-decoration: none; padding: .5em 1em; }
		.indicator a:link, .indicator a:visited { color: black; }
		.indicator a:hover, .indicator a:focus, .indicator a:active { color: black; background-color: #FFF; text-decoration: none; cursor: pointer; }
		#js-ind { top: 20em; }
	
		/* Hide these items when Javascript is active */
		.js #js-ind, .js .hide { display: none; }


/*--------------------------------------------------------------------------------------------------*/
/* GRID */
/*--------------------------------------------------------------------------------------------------*/
		body {
			min-width: 960px;
		}
		
		/* =Containers
		--------------------------------------------------------------------------------*/
		.c6
		{
			margin-left: auto;
			margin-right: auto;
			width: 954px;
		}
		
		/* =Grid >> Global
		--------------------------------------------------------------------------------*/
		.g0,
		.g1,
		.g2,
		.g3,
		.g4,
		.g5,
		.g6 {
			display: inline;
			float: left;
			margin-left: 5px;
			margin-right: 5px;
			margin-extra: 74px;
		}
		
		/* =Grid >> Children (Alpha ~ First, Omega ~ Last)
		--------------------------------------------------------------------------------*/
		.alpha {margin-left: 0;}
		.lambda {margin-extra: 0;}
		.omega {margin-right: 0;}
		
		/* =Grid >> 6 Columns
		--------------------------------------------------------------------------------*/
		.c6 .g0 {width: 74px;}
		.c6 .g1 {width: 149px;}
		.c6 .g2 {width: 308px;}
		.c6 .g3 {width: 467px;}
		.c6 .g4 {width: 626px;}
		.c6 .g5 {width: 785px;}
		.c6 .g6 {width: 944px;}

/*--------------------------------------------------------------------------------------------------*/
/* BASE STYLING */
/*--------------------------------------------------------------------------------------------------*/
	/*--- SITE WIDE ---*/
		html { background: #FFF; color: #989898; }
		body { background: #FFF; color: #989898; }
		body { font-size: 12px; font-weight: 100; line-height: 1.4;  font-family: 'Montserrat', sans-serif;}
		/* Headings */
		h1, h2, h3, h4, h5, h6 {  font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; }	
		h1 { font-size: 18px; letter-spacing: 4px;  color: #666666; line-height: 27px; }
		h2 { font-size: 12px; letter-spacing: 3px;  color: #666666; line-height: 17px; }
		/* Links */
		a:link, a:visited { color: #989898; text-decoration: none; }
		a:hover, a:active, a:focus, .current-menu-item a { color: #333333; text-decoration: none; }
		/* Hide these elements but keep them accessible */
		.access-hide { position: absolute; left: -999em; }
		/* page-wrapper */
		#page-wrapper { }
	/*--- HEADER ---*/	
		#head-wrapper { margin-top: 2em; height: 100px; text-align: center; }
		#site-header #site-title { margin-top: 65px;  }
		/* Nav */
		#nav-wrapper { margin-top: 2em; text-align: center; }
		#main-nav { height: 36px; }
		#main-nav .menu li { display: inline-block; margin-top: 10px; margin-bottom: 10px; height: 20px;} 		
		#main-nav .menu li:after { margin-left: 4px; content: "/"; margin-right: 3px;  }
		#main-nav .menu li:last-child:after { content: ""; margin-left: -3px;}
		#main-nav a { font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; text-decoration: none; text-transform: uppercase; display: inline-block; font-size: 12px; letter-spacing: 3px;  }
		/* Nav Links*/
		#main-nav a:link, #main-nav a:visited  { color: #989898; text-decoration:none; }
		#main-nav a:hover, #main-nav a:active, #main-nav a:focus { color: #333333; text-decoration: none; }
		/* DownStates*/
		#main-nav .current_page_item a { color: #333333 !important; cursor: default; }
		
	/*--- CONTENT AREA ---*/		
		#content { }
		#content em { font-style: italic; }
		/* Page Nav */
		#page-nav a { padding: 0; margin: 0; }
		/* Page */
		.page {}
		/* Posts */
		.post {}
		.post p { margin-bottom: 1.4em; }

	/*--- FOOTER ---*/
		#footer { clear: both; padding-bottom: 40px; padding-top: 28px; margin-bottom: 80px; font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; text-decoration: none; text-transform: uppercase; display: inline-block; font-size: 10px; letter-spacing: 2px;  text-align: center; }
		/* Credit */
		#footer #site-credits a { letter-spacing: 1px; }
	/*--- General ---*/
	.bort { border-top: 1px solid #EAEAEA; }
	.borb { border-bottom: 1px solid #EAEAEA; }
	.whitespace { border-bottom: 0px solid #EAEAEA; }
	.separator { height: 20px; line-height: 20px; margin-bottom: 20px; margin-top: 0px; }
	.greyit { color: #989898; }

/*--------------------------------------------------------------------------------------------------*/
/* Specific Page Styles */
/*--------------------------------------------------------------------------------------------------*/

	/*--- home ---*/
	#home {}

	/*--- about ---*/
	#about {}
	#about-content h1 { 
		text-align: center; 
		text-transform: uppercase;
		margin-top: 70px;
		padding-bottom: 50px;
		margin-bottom: 20px;
	}
	
	.as-title h2 {
		/*padding-left: 90px;*/
		text-align: center;
		text-transform: uppercase;
		position: relative;
	}
	
	.as-title h2 span {
		position: absolute;
		top: 0;
		left:0;
		width: 33px;
		height: 33px;
		display: block;
		background:none no-repeat left top;
		background-image:url('/wp-content/themes/karimah-ashadu-leeboyce/images/toggle-sprite-v.png');
	}
	
	.as-title h2:hover {
		/*cursor: pointer;*/
	}
	.as-title h2:hover span {
		background-position: 0 -33px;
	}

	.padtop { padding-top: 1.4em; }
	.entry p { margin-bottom: 1.4em; }
	.entry a { color: #000; }
	.entry { padding-bottom: 8px; }
	
	.slider-wrapper { background-color: #eaeaea; width: 100%; min-width: 100%; position: relative; height: 500px; margin-bottom: 0px;}
	.slides { display: block; height: 556px; width: 100%; }
	.slides li { display: block; float: left; position: relative; margin-top: 54px; margin-bottom: 54px; height: 448px; width: 706px; text-align: center; } 
	.slides li div { position: absolute; left: 50%; margin-left: -353px; width: 706px; text-align: center; height: 448px; }
	.slides li div.home-caption {
		position: absolute; 
		left: 50%; 
		margin-left: -150px; 
		margin-top:0;
		margin-bottom:0;
		margin-right:0; 
		bottom: 54px; 
		z-index: 100; 
		text-align: left; 
		width:300px; 
		padding:10px; 
		height: 84px; 
		background-color: transparent; 
		background-image: url('/wp-content/themes/karimah-ashadu-leeboyce/images/transp.png'); 
		background-repeat: repeat;  
		color: #666666; 
		display: table; 
		text-align: center;
	   -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  		filter: alpha(opacity=0);
  	   -moz-opacity: 0;
  	   -khtml-opacity: 0;
  		opacity: 0;
	}
	.slides li div.home-caption p {display:table-cell;vertical-align:top;}
		
	.slides li img { margin-left: auto; margin-right: auto; }
	
	.resizeimgs img { max-width: 706px; max-height: 448px; }
	
	
	#next-arrow, #prev-arrow {
		position: absolute; left: 50%; top: 229px; 
		width: 40px; height: 40px;
		background-color: transparent;
		background-image: url('/wp-content/themes/karimah-ashadu-leeboyce/images/KAleftright.png');
		background-repeat: no-repeat;
		text-indent: -999em;
 	}
 	
 	#next-arrow { margin-left: 435px; background-position: -40px 0;}
	#prev-arrow { margin-left: -475px; background-position: 0 0; }
	#next-arrow:hover { margin-left: 435px; background-position: -40px -43px;}
	#prev-arrow:hover { margin-left: -475px; background-position: 0 -43px; }
	
	#pagination { position: absolute; width: 100%; height:10px; text-align: center!important; bottom: 18px; } 
	#pagination a { display: inline-block; background-color: #666666; width: 10px; height: 10px; margin-left: 4px; margin-right: 4px;
  -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; text-indent: -999em; }
  	#pagination a.selected { background-color: #333333; }
  	
	/*--- contact ---*/
	.page-title { display: block; font-size: 18px; letter-spacing: 4px; text-align: center; color: #666666; line-height: 27px; text-transform: uppercase; padding-top: 50px; padding-bottom: 50px; margin-bottom: 18px; }
	.contact-section { height: 380px; }
	.home-col a { color: #000; }

	/*--- news/blog ---*/
	.news-post .entry h1, .news-post .entry h1 a { font-size: 12px; font-weight: 100; letter-spacing: normal; line-height: 1.4; font-family: 'Montserrat', sans-serif; color: #000000; padding-bottom: 17px; }

	.news-post .entry h1 a:hover { cursor: pointer; }

	.blog-post .entry h1, .blog-post .entry h1 a { font-size: 12px; font-weight: 100; letter-spacing: normal; line-height: 1.4; font-family: 'Montserrat', sans-serif; color: #000000; padding-bottom: 17px; }

	.blog-post .entry h1 a:hover { cursor: pointer; }
	
	.blog-post .read-more { display: block; padding-top: 17px; margin-top: 10px; padding-bottom: 10px; height: 17px; font-size: 17px;  }
	
	.news-post .post-date { text-align: center; text-transform: uppercase; margin-top: 40px; padding-bottom: 40px; margin-bottom: 0px; font-size: 18px; letter-spacing: 4px;  color: #666666; line-height: 18px; font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; }
	
	.news-post .entry { margin-top: 17px; }
	.blog-post .post-date { text-align: center; text-transform: uppercase; margin-top: 40px; padding-bottom: 40px; margin-bottom: 17px; font-size: 18px; letter-spacing: 4px;  color: #666666; line-height: 18px; font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; }
	
	.blog-post .entry h1 img { margin-bottom: 17px; }
	
	.blog-post-text a { color: #000; }
	
	.cat-tit { text-align: center; text-transform: uppercase; margin-top: 17px; margin-bottom: 17px; letter-spacing: 3px;  color: #666666; font-family: ProximaNovaT-Thin; font-weight: normal; font-style: normal; }
	
	.cat-tit a { display: block; margin-top: 30px; margin-bottom: 40px; height: 34px; }
	.view-post h1 { 
		text-align: center; 
		text-transform: uppercase;
		margin-top: 50px;
		padding-bottom: 30px;
		margin-bottom: 20px;
	}
	#home-content { margin-top: -17px; }
	#home-content p { margin-bottom: 1.4em; }
	
	.next-link { display: block; float:right; width: 40px; height: 40px;}
	.prev-link { display: block; float:left; width: 40px; height: 40px;}
	
	.next-link a, .prev-link a { 
		display: block;
		background-color: transparent;
		background-image: url('/wp-content/themes/karimah-ashadu-leeboyce/images/KAleftright.png');
		background-repeat: no-repeat;
		text-indent: -999em;
 	}
 	
 	.next-link a, .prev-link a { width: 40px; height: 40px; }
 	.next-link a { background-position: -40px 0; }
	.prev-link a { background-position: 0 0; }
	.next-link a:hover { background-position: -40px -43px;}
	.prev-link a:hover { background-position: 0 -43px; }
	
	#social-links {
		margin-left: 85px;
		margin-top: 7px;
	}

	#social-links li {
		display: block;
		float: left;
		width: 40px;
		height: 40px;
		background-color: transparent;
		background-image: url('/wp-content/themes/karimah-ashadu-leeboyce/images/KAicons.png');
		background-repeat: no-repeat;
		margin-left: 3px; 
		margin-right: 3px;
	}
	
	#social-links li a {
		display: block; 
		text-indent: -999em;
		width: 40px;
		height: 40px
	}
	
	#social-links li a:hover {
		background-position: -92px;	
	}
	
	.twitter { background-position:  -44px 0px; }
	.facebook { background-position: 0px 0px; }
	.tumblr { background-position: -94px 0px; }
	
	.twitter:hover { background-position: -44px -50px; }
	.facebook:hover { background-position: 0px -50px; }
	.tumblr:hover { background-position: -94px -50px; }
	
/*--------------------------------------------------------------------------------------------------*/
/* 100-480 media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 100px) and (max-width: 480px) {
	
	body:before { content: "100-480"; left: 1em; position: absolute; top: 1em; z-index: 999; }

} /* END: 100-480 media query */


/*--------------------------------------------------------------------------------------------------*/
/* 480-600 media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 480px) and (max-width: 600px) {
	
	body:before { /*content: "480-600"; left: 1em; position: absolute; top: 1em; z-index: 999;*/ }

} /* END: 480-600 media query */


/*--------------------------------------------------------------------------------------------------*/
/* 600-750 media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 600px) and (max-width: 750px) {

	body:before { /*content: "600-750"; left: 1em; position: absolute; top: 1em; z-index: 999;*/ }

} /* END: 600-750 media query */


/*--------------------------------------------------------------------------------------------------*/
/* 750-980 media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 750px) and (max-width: 980px) {

	body:before { /*content: "750-980"; left: 1em; position: absolute; top: 1em; z-index: 999;*/ }

} /* END: 750-980 media query */


/*--------------------------------------------------------------------------------------------------*/
/* 980-1200 media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 980px) and (max-width: 1200px) {

	body:before { /*content: "980-1200"; left: 1em; position: absolute; top: 1em; z-index: 999;*/ }

} /* END: 980-1200 media query */


/*--------------------------------------------------------------------------------------------------*/
/* 1200+ media query */
/*--------------------------------------------------------------------------------------------------*/

@media screen and (min-width: 1200px) {

	body:before { /*content: "1200 and up"; left: 1em; position: absolute; top: 1em; z-index: 999;*/ }

} /* END: 1200+ media query*/


/*--------------------------------------------------------------------------------------------------*/

.hidden {
	display: none;
}

#about-content h1 {
	float: none;
	display: block;
}

.about-section {
	position: relative;
}

.about-section .arrow {
	background-image: url('images/arrows_bottom_circle.png');
cursor: pointer;
	width: 39px;
	height: 39px;
	position: absolute;
	top: 0;
	left: 0;
z-index: 9;
}

/*--- accordian css ----*/
/* Style the buttons that are used to open and close the accordion panel */
.accordion {
  transition: 0.4s;
}
.about-section .accordion  .arrow {
      display: inline-block;
    position: unset;
    float: left;
 
}
.accordion h2 {
   display: inline-block;
    margin: 3% 0 0 15px;
    float: left;
    text-align: left;
}
.about-section .accordion.active .arrow {
	background-image: url('images/arrows_circle_direction_top.png');
}

/* Style the accordion panel. Note: hidden by default */
.panel {
  display: none;
  overflow: hidden;
}