/*
Theme Name: U3A Theme
Author: BarBendingDesigns
Author URI: https://www.barbendingdesigns.com
Details URI: https://barbendingdesigns.com/u3a-website/?bbd_ut_action=get_details&bbd_ut_slug=u3a-theme
Description: A WordPress theme for U3As (Universities of the Third Age). Optionally integrates with the U-MAS and MyU3A membership management systems.
Version: 4.0.14
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: bbd-u3a
*/

body {
	word-wrap: break-word;
	font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 15px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Exo 2', "Trebuchet MS", Arial, sans-serif;;
}

.hideme {
    display:none;
}

.show480 {
    display:none;
}

.show-xs {
    display: block;
}

.show-sm {
    display:none;
}

@media screen and (min-width:480px){
    .showtiny {
        display:none;
    }
    .show480 {
        display:block;
    }
}

@media screen and (min-width:768px){
    .show-xs,
    .nav > li > a.show-xs {
        display: none;
    }
    .show-sm {
        display: block;
    }
}

/* Alignment */
.alignleft {
	display: inline;
	float: left;
	margin-right: 1.5em;
}
.alignright {
	display: inline;
	float: right;
	margin-left: 1.5em;
}
.aligncenter {
	clear: both;
	display: block;
	margin: 0 auto;
}
.alignnone {
	clear:both;
}

/* Images and wp-captions should always fit and be responsive */
img {
	display: inline-block;
	height: auto;
	max-width: 100%;
}

/* fix for Chrome blurry downscaling */
.chrome img {
    image-rendering: -webkit-optimize-contrast; 
}

img[class*="wp-image-"] {
	margin-top: .25em;
	margin-bottom: 1em;
	box-shadow: 1px 1px 2px #777;
	border-radius: 2px;
	
	border: 5px solid #fff;
	padding: 5px;
}

.wp-block-gallery .blocks-gallery-image img, 
.wp-block-gallery .blocks-gallery-item img {
    padding: 0;
    border: 0;
}

.wp-caption {
	border: none;
	margin-bottom: 10px;
	max-width: 100%;
	border-radius: 2px;
	padding: 10px;
}
.wp-caption.aligncenter {
	margin-bottom: 10px;
}
.wp-caption img[class*="wp-image-"] {
	display: block;
	margin: 0;
	padding: 5px;
	background: #fff;
	box-shadow: 1px 1px 1px #777;
}
.wp-caption .wp-caption-text {
	text-align: center;
	margin-top: 10px;
}

.wp-block-image {
	vertical-align: text-top;
}

figure.wp-block-image {
	display: table;
	clear: both;
}

.wp-block-image a,
.wp-block-image figcaption {
    display: table-row;
}

/* WP Gallery */
.gallery,
.wp-block-gallery {
	margin-bottom: 1.5em;
	clear: both;
}
.gallery a img {
	border: none;
	height: auto;
	max-width: 90%;
}
.gallery dd {
	margin: 0;
}
.gallery-caption {
	display: block;
}

.u3a-gallery-disabled .gallery .gallery-item {
    display: inline-block;
    vertical-align: top;
    text-align: center;
    margin: 5px;
}

.u3a-gallery-disabled .gallery a img {
    max-width: 100%;
}

.u3a-gallery-disabled .gallery img {
    box-shadow: 1px 1px 2px #777;
    background: #fff;
}

/* Make sure embeds and iframes fit their containers */
embed,
iframe,
object {
	max-width: 100%;
}

/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
}
.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}

/* Content */
.main-content {
    background-color: #fff;
}

.main-content-inner {
	padding-bottom: 1.5em;
}
.hentry {
	margin: 0 0 1.5em;
}
.sticky {
	display: block;
}
.bypostauthor {
	display: block;
}

.entry-content .entry-content-thumbnail img {
    margin-bottom: 2em;
}

article .entry-content > h1,
article .entry-content > h2,
article .entry-content > h3,
article .entry-content > h4,
article .entry-content > h5,
article .entry-content > h6 {
    clear: both;
}

table.term-dates {
    max-width: 400px;
}

table .U3A-course-desc {
    padding: 5px 0px 10px;
    margin-bottom: 15px;
}

.widget .bbd-u3a-thumb-base,
.u3a-posts .bbd-u3a-thumb-base {
	display: none;
}

.U3A-contact-info-shortcode div {
	float: left; 
	padding: 0 15px; 
	min-width: 250px; 
}

.u3a-membership-system-link {
    font-weight: bold;
}

.entry-content li {
	margin-bottom: 0.5em;
}

.bbd-media-list blockquote {
	font-size: 15px;
}

@media screen and (min-width: 768px){
    table .U3A-course-meta .col-sm-4 {
        width: auto !important;
        min-width: 20%;
        max-width: 33.33333333%;
    }
    
    .U3A-contact-info-shortcode div {
    	max-width: 50%;
    }
}

.wpcf7-recaptcha {
	overflow: hidden;
}

/* Comments */

.comment-form {
    margin-bottom: 2em;
}

/* Clearing */
.clear {
	clear: both;
}

/* Navigation */
/* (Generic _tk navigation styles - not used) */

.dropdown-submenu{
    position:relative;
}
.dropdown-submenu>.dropdown-menu{
    top:0;
    left:100%;
    -webkit-border-radius:0 6px 6px 6px;
    -moz-border-radius:0 6px 6px 6px;
    border-radius:0 6px 6px 6px;
}
.dropdown-submenu:active>.dropdown-menu, 
.dropdown-submenu:hover>.dropdown-menu {
    display: block;
}
.dropdown-submenu>a:after{
    display:block;
    content:" ";
    float:right;
    width:0;
    height:0;
    border-color:transparent;
    border-style:solid;
    border-width:5px 0 5px 5px;
    border-left-color:#cccccc;
    margin-top:5px;
    margin-right:-10px;
}
.dropdown-submenu:active>a:after{
    border-left-color:#ffffff;
}
.dropdown-submenu.pull-left{
    float:none;
}
.dropdown-submenu.pull-left>.dropdown-menu{
    left:-100%;
    margin-left:10px;
    -webkit-border-radius:6px 0 6px 6px;
    -moz-border-radius:6px 0 6px 6px;
    border-radius:6px 0 6px 6px;
}

/* Navigation actually used */
#mobile-menu .sub-menu{
    display: none;
    list-style: none;
    padding-left: 10px;
}
#main-menu .sub-menu a,
#mobile-menu .sub-menu a {
    padding: 7px 15px;
    display: block;
    word-break: initial;
}
#mobile-menu .sub-menu a{
    color: #f9f9f9;
}
#main-menu .sub-menu a:hover,
#mobile-menu .sub-menu a:hover {
    text-decoration: none;
}

#mobile-menu .menu-item-has-children > a{
    width: calc(100% - 60px);
    display: inline-block;
}

#mobile-menu .menu-item-has-children > a.bbd-nav-toggle{
    width: 60px;
    padding: 8.5px 0;
    text-align: center;
    font-size: 1.5em;
    vertical-align: middle;
    float: right;
}

@media screen and (min-width: 768px){
    #mobile-menu > li > a {
        padding-top: 18px;
        padding-bottom: 18px;
    }
    #mobile-menu .menu-item-has-children > a.bbd-nav-toggle {
        padding-top: 16.5px;
        padding-bottom: 16.5px;
    }
    
}

.U3A-side-layout #main-menu {
    padding: 0 5px;
}
#main-menu li > a {
    padding: 20px;
}
#main-menu .menu-item-has-children > a {
    display: block;
}
#main-menu li.menu-item-has-children {
    min-width: 100px;
}
#main-menu .sub-menu {
    width: calc(100% + 40px);
    left: -20px;
    text-align:center;
    border-radius: 0 0 3px 3px;
    border-top: 0;
    padding: 5px 0 0;
    display: none;
    list-style: none;
}
#main-menu .sub-menu li:last-child > a {
    border-radius: 0 0 3px 3px;
}
#main-menu .sub-menu:before {
    content: "";
    display: block;
    position: absolute;
    z-index: 1000;
    top: -20px;
    left: 50%;
    margin-left: -10px;
    border: 10px solid transparent;
}

#main-menu li.menu-item-has-children > a:after {
    content: ' \25bc';
}
#main-menu li.menu-item-has-children:hover .sub-menu {
    position: absolute;
    display: inline-block;
    z-index: 100;
}

/* Here some needed widget styles
 * Most widgets are adapted in the file bootstrap-wp.js */
.widget { 
    margin-bottom: 2em; 
}
.widget_nav_menu ul.sub-menu li, 
.widget_pages ul.children li { 
    padding-left: 15px; 
}

/* U3A Sponsors widget images */

.u3a-sponsor img {
    background: #fff;
    border-radius: 4px;
    padding: 4px;
    max-height: 150px;
}

/* Hiding the search widget's button in widgets. but if you want it back, delete this */
.widget_search .search-form input[type="submit"] { 
    display: none; 
}

/* Make sure select elements fit in widgets */
.widget select {
	max-width: 100%;
}

/* Nested comments are threaded and nested, with minimal styling
 .comment .children { margin-left: 1.5em; }

/**
* Some WP Theme Repository requirements
*/

.sticky {
}

.gallery-caption {

}

.bypostauthor {

}

.entry-meta {
	clear: both;
	font-style: italic;
	color: #888;
}

/*

 == Infinite Scrolling by Jetpack ==
 Enable this feature by decommenting the lines below and make sure you use the same classes on the right place in your html..

/* Globally hidden elements when Infinite Scroll is supported and in use.
 * Older / Newer Posts Navigation (the pagination, must always be hidden), Theme Footer only when set to scrolling.. */

/*
.infinite-scroll .page-links,
.infinite-scroll.neverending .site-footer {
	display: none;
}
*/

/* When Infinite Scroll has reached its end we need to re-display elements that were hidden (via .neverending) before */

/*
.infinity-end.neverending .site-footer {
	display: block;
}
*/

/* styles for pagination */
.u3a-pagination ul {
    width: 100%;
    text-align: center;
    justify-content: space-between;
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    padding: 1em 0;
}

/* U3A-posts shortcode output */
ul.u3a-posts {
    padding-left: 0;
    list-style: none;
    overflow: auto;
}
ul.u3a-posts li {
    margin-bottom: .5em;
    overflow: auto;
}

.u3a-posts .wp-post-image {
    box-shadow: 1px 1px 1px #777;
    margin-bottom: 2px;
}

/* U3A-map shortcode output */
.u3a-map {
    border-radius: 2px;
    box-shadow: 1px 1px 1px #777;
}

.U3A-newstyle .u3a-map {
	border: 2px solid #fff;
	box-shadow: 1px 1px 2px #777;
	margin-bottom: 1em;
}

/* Switch-chevron icon (open/closed icon) */
i.switch-chevron:before, 
.angular-collapse-in i.switch-chevron:before {
    content: "\e080";
}

[aria-expanded="true"] i.switch-chevron:before, 
.angular-collapse i.switch-chevron:before {
    content: "\e114";
}


/* Admin bar */
#wpadminbar {
    position: fixed;
}

.admin-bar .goog-te-banner-frame {
	top: 32px !important;
}

#wp-admin-bar-search {
    color: #eee;
    background: #222;
    border: 0;
}

#wp-admin-bar-search .adminbar-input {
    background: #999;
    color: #222;
    border: 0;
    padding: 0 2px;
}

#wp-admin-bar-search .adminbar-button {
    background: #222;
    border: 0;
    padding:0;
    margin: 0 2px;
}

@media screen and (max-width: 782px){
	.admin-bar .goog-te-banner-frame {
		top: 46px !important;
	}
}