/*
Theme Name: IONC
Author: Switchclick
Author URI: https://switchclick.com
Description: Custom Bootstrap Theme
Version: 1.13
*/

/*

Google Fonts
	font-family: 'Comfortaa', cursive;
	font-family: 'Open Sans', sans-serif;

Colors
	Blue #006574
	Green #9CBA67
*/

/* main */
html, body { width:100%; height:100%; }
body { margin:0; padding:0; }
body { font-size:1.25rem; }

/* clean */
.clean { color:inherit; background-color:transparent; border:1px solid transparent; }

/* links */
a { color:#006574; }
a:link { color:#006574;}
a:visited { color:#0e3167;}
a:hover { color:#1a67da;}
a:active { color:#1a67da; }
a.no-underline,
button.no-underline { text-decoration:none; }
/* undo bootstrap cascade */
a.btn-primary { color:#fff; }
a.quiet,
a.quiet:link,
a.quiet:visited,
a.quiet:active { color:#000; text-decoration:none; }
a.quiet:hover { color:#006574; text-decoration:underline; }

/* circle button */
.circle { border-radius:50%; width:3rem; height:3rem; transition:all 150ms ease-in-out; }
.circle.active { transform:rotate(180deg); }

/* fonts */
body { font-family:"Open Sans", sans-serif; }
h1, h2, h3, h4, h5, h6, .title { font-family: 'Comfortaa', cursive; }
.lh1 { line-height:1; }
h1 { margin-bottom:1.5rem; }

/* page title */
.h1-fancy { position:relative; margin-top:3rem; }
/* .h1-ramp { display:none; } */
/* .h1-fancy h1 {} */
/* @media only screen and (min-width:992px) */
/* { */
	/* position */
	.h1-fancy { overflow-x:hidden; margin-bottom:1rem; }
	.h1-ramp { display:block; position:absolute; top:0; bottom:0; left:0px; right:66%; padding:1rem; background-color:#f7f7f7; border-radius:5px; border-top-left-radius:0px; border-bottom-left-radius:0px; }
	.h1-fancy h1 { display:inline-block; position:relative; padding:1rem 3rem 0.5rem 0; margin:0; background-color:#f7f7f7; border-radius:5px; border-top-left-radius:0px; border-bottom-left-radius:0px; }
	.h1-ramp,
	.h1-fancy h1 { border-bottom:1px solid #dee2e6; }

	/* coloring */
	.h1-ramp,
	.h1-fancy h1 { background-color:#006574; color:#fff; border-bottom:1px solid #357b92; }
/* } */

/* sizing */
.tiny { font-size:50%; }
.small { font-size:80%; }
.mighty { font-size:125%; }
.big { font-size:150%; }
.large { font-size:200%; }
.epic { font-size:300%; }
.bold { font-weight:bold; }

/* colors */
body { color:#222; }
.grey { color:#999; }
.grey-bg { background-color:#999; color:#fff; }
.black { color:#000; }
.black-bg { background-color:#000; color:#fff; }
.blue { color:#006574; }
.blue-bg { background-color:#006574; color:#fff; }
.green { color:#9CBA67; }
.green-bg { background-color:#9CBA67; color:#fff; }
.white-fg { color:#fff !important; }
.white-bg { background-color:#fff; }
.menu-fg { color:#006574; }
.menu-bg { background-color:#e0f8ff; }
.bg-ionc { background-color:#006574; }
.bg-trans { background-color:transparent; border-color:transparent; }
.text-outline-white { text-shadow:0px 0px 5px #fff; }

/* opacity */
.dim { opacity:0.5; }
.shy { opacity:0.25; }

/* bootstrap button */
.btn-ionc { color:#fff !important; background-color:#006574; border-color:#006574; border-style:solid; }
.btn-outline-ionc { color:#006574 !important; background-color:#fff; border-color:#006574; border-style:solid; }
.btn-ionc2 { color:#fff !important; background-color:#006574; border-color:#006574; border-style:solid; }
.btn-outline-ionc2 { color:#006574 !important; background-color:#fff; border-color:#006574; border-style:solid; }

/* media */
img.fit { width:100%; height:auto; }
img.max-500 { max-width:500px; height:auto; }
img.shadow { box-shadow:0 .5rem 1rem rgba( 0, 0, 0, 0.15 ); }

/* paragraphs */
.wrap-hyphen { word-break:break-word; hyphens:auto; }
.wrap-justify { text-align:justify; text-justify:inter-word; }

/* shortcode: ionc_bookmark */
.ionc_bookmark { }
.ionc_bookmark_label { position:absolute; min-width:50px; min-height:50px; right:101%; top:-8px; display:flex; align-items:center; justify-content:center; border-radius:5px; color:#fff; background-color:#006574; font-weight:bold; }
.ionc_bookmark ~ p { margin-bottom:2rem; }

/* nav */
.nav { color:#006574; background-color:#f7f7f7; }
.nav a { color:#006574; text-decoration:none; }

/* subnav */
.subnav { position:relative; color:#006574; background-color:#ccdfe1; }
.subnav a { color:#006574; text-decoration:none; }
.subnav-link {}
.subnav-view { position:absolute; display:none; margin-left:2rem; top:90%; z-index:100; }
.subnav-show,
.subnav-view:hover { display:block; }

/* accnav */
/*
.accnav { position:relative; color:#ffffff; background-color:#006574; }
.accnav a { color:#ffffff; text-decoration:none; }
.accnav-link {}
.accnav-view { position:absolute; display:none; margin-left:2rem; top:90%; z-index:100; }
.accnav-show,
.accnav-view:hover { display:block; }
*/

/* devnav */
.devnav { position:relative; color:#333; background-color:#ccc; }
.devnav a { color:#333; text-decoration:none; }
.devnfo { color:#222; background-color:#ddd; }

/* linkbox */
.linkbox {}
.linkbox-image { background-color:#eee; }
.linkbox-title { font-weight:bold; }
.linkbox-title a { text-decoration:none; }
.linkbox-intro { opacity:0.75; }

/* blockquote */
blockquote { border-left:10px solid #006574; }
blockquote { color:#333; padding:1rem 2rem; margin-top:2rem; margin-bottom:2rem; }
blockquote .author { color:#999; text-align:right; font-size:80%; font-style:italic; }

/* baseline */
.baseline { font-size:0.75rem; color:#222; background-color:#eee; }
.baseline a { text-decoration:none; color:#222; }

/* main menu */
#main_menu {}
@media only screen and (max-width:991px)
{ /* xs-320px sm-576px md-768px lg-992px xl-1200px */
	#main_menu { display:none; }
}

/* mobile menu */
body.mobile_menu { overflow-y:hidden; }
#mobile_hamburger { display:inline-block; height:2rem; padding:0rem 2rem 1rem 3rem; vertical-align:middle; color:#006574; border:0; background-color:transparent; background-repeat:no-repeat; background-position:center; background-size:25px 25px; background-position:1rem center; background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2874, 168, 199, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); }
#mobile_hamburger:focus { outline:none; }
#mobile_menu { display:none; position:fixed; z-index:100000; padding:1rem; left:0; top:0; width:100%; height:100%; overflow:auto; background-color:#eee; background-color:rgba( 255, 255, 255, 0.9 ); }
body.mobile_menu #mobile_menu { display:block; }
#mobile_menu a { color:#000; text-decoration:none; }
#mobile_menu_close { position:absolute; top:1rem; right:1rem; }
.mobile_menu_icon { display:inline; }
@media only screen and (min-width:992px)
{ /* xs-320px sm-576px md-768px lg-992px xl-1200px */
	#mobile_hamburger { display:none; }
	#mobile_menu { display:none; }
}



/* .modal-menu-close { color: #aaaaaa; float: right; font-size: 28px; font-weight: bold; } */
/* .close:hover, */
/*
.close:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}
*/





/* hero */
.hero { position:relative; width:100%; }
.hero-image { width:100%; margin-bottom:1rem; background-repeat:no-repeat; background-size:1px; background-position:5000px 5000px; }
.hero-image img { display:inline-block; }
.hero-title { font-size:1.5rem; font-weight:bold; }
.hero-title-ramp { display:none; }
.hero-title-text { text-align:center; padding:1rem; color:#fff; background-color:#3d8c9c; border-radius:5px; }
@media only screen and (min-width:992px)
{
	.hero { height:500px; margin-bottom:3rem; }
	.hero-image { position:absolute; overflow:hidden; height:100%; background-size:cover; background-position:center center; }
	.hero-image img { display:none; }
	.hero-title { position:absolute; bottom:-2rem; left:0%; width:100%; overflow-x:hidden; }
	.hero-title-ramp { display:block; position:absolute; bottom:0; left:0px; right:60%; padding:1rem; background-color:#3d8c9c; }
	.hero-title-text { display:inline-block; position:relative; padding:1rem 3rem 1rem 0; text-align:left; border-top-left-radius:0px; border-bottom-left-radius:0px; }
}
.hero-title-ramp,
.hero-title-text { background-color:#006574; }

/* celebrate 40 years */
.celebrate-overlay { display:none; }
#confetti_canvas { display:none; }
/* #confetti_canvas { border:1px solid red; } */
@media only screen and (min-width:576px)
{
	.celebrate-overlay { display:block; position:absolute; top:0; left:0; right:0; }
	.celebrate-image { position:absolute; top:150px; }
	.celebrate-image { width:250px; right:0; }
	#confetti_canvas { display:block; position:absolute; top:0px; right:0; width:260px; height:390px; pointer-events:none; }
}
@media only screen and (min-width:768px)
{
	.celebrate-image { width:300px; }
	#confetti_canvas { width:310px; height:500px; }
}
@media only screen and (min-width:992px)
{
	.celebrate-image { right:50px; top:190px; }
	#confetti_canvas { width:420px; height:500px; }
}
@media only screen and (min-width:1200px)
{
	.celebrate-image { width:400px; }
	#confetti_canvas { width:512px; }
}




/* staff profile */
.staff { background-color:#eee; }
/* .staff-name {} */
/* .staff-designations { font-size:70%; } */
/* .staff-title { font-style:italic; } */
/* .staff-about { font-size:70%; } */

/* cta */
.cta { display:flex; align-content:space-between; background-color:#f7f7f7; border-top:1px solid #dee2e6; border-bottom:1px solid #dee2e6; }
.cta-blue { background-color:#006574; color:#fff; }
.cta-green { background-color:#006574; color:#fff; }
.cta-image {}
.cta-text { padding:5rem 0; }
.cta-title { font-weight:bold; margin-bottom:1rem; }
.cta-body {}
.cta-link { white-space:nowrap; }

/* document preview */
.docpreview { position:relative; display:inline-block; width:75px; height:100px; overflow:hidden; }
.docpreview img { position:relative; z-index:0; display:block; width:75px; height:100px; border:1px solid #006574; border-radius:0.25rem; }

.docpreview:after {
    content: '';
    position: absolute;
    bottom: -15%;
    left: 0;
    width: 100%;
    height: 40%;
    background-color: #006574;
    transform: skewY(-15deg);
    z-index: 1;
}




/* login --- */

body.login div#login h1 a { background-image: url( '/wp-content/themes/ionc/images/ionc-logo.png' ); padding-bottom: 30px; }



/* members --- */


/* posts --- */
.editorial:before { content:" "; display:block; border-top:1px solid #999; width:200px; margin:2em 0 1em; }
.editorial { font-style:italic; opacity:0.50; margin-bottom:1em; }