/*
Theme Name: BBM 2026
Author: Masahiko Sunami
Author URI: http://www.masahikosunami.com/
Description: Custom Theme for masahikosunami.com
Version: 3.0
License: Commercial
Tags: theme-options, responsive layout, translation-ready
Text Domain: bbm
*/

/*******************************************************************************************
  *
  * mobile-first responsive fluid layout:
  * 320 - 600: single column
  * 601 - 1023: no sidebar - up to 3 columns
  * 1024 - 1400: full size
  *
  *
  * Style Sheet TOC
  *
  *  1. basics
  *		1a. base responsive layout (header, footer, main content)
  *		1b. input and form styles
  *		1c. misc. repeatable elements
  *  2. wordpress elements
  *		2a. article layouts
  *		2b. article footer
  *		2c. comments
  *		2d. misc. article content styles
  *		2e. default widgets
  *		2f. custom widgets
  *  3. misc layout
  *     3a. mobile menu
  *		3b. modal
  *     3c. misc.
  *	 4. misc. media queries
  *  5. cross browser fixes
  *
  *
********************************************************************************************/

/*******************************************************************************************
  *
  * 1. Basics
  *
  * 1a. base responsive layout
  *
  *
********************************************************************************************/
html,
body {
	width: 100%;
	height: 100%;
}
body {
	background: #fff;
}
#wrapper {
	width: 100%;
	min-width: 320px;
	padding: 0;
	margin: 0 auto;
	overflow-x: hidden;
}
#container {
	position: relative;
	padding: 12px 0 0;
}
#top-band {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: #1E1432;
	border-bottom: 1px solid #ccc;
	height: 12px;
}
#main-header {
	margin: 0;
	padding 0;
}
.blog-title {
	display: block;
	margin: 0;
	padding: 0;
	text-indent: -5000px;
}
.blog-title a {
	display: block;
	text-indent: -5000px;
	cursor: pointer;
}

#main-container {
	margin-bottom: 12px;
	padding: 0 12px;
}


#main-nav ul {
	margin: 0;
	list-style: none;
	font-family: 'Magra', 'Noto Sans JP',"Helvetica Neue", Helvetica, Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}
#main-nav ul ul {
	display: none;
}
#main-nav li {
	vertical-align: middle;
	height: 30px;
	margin: 1px 0;
	font-weight: bold;
	font-size: 24px;
	line-height: 30px;
	color: #002a5c;
}

#main-nav .menu-item-48 a,
#main-nav .menu-item-409 a {
	color: #c80000;
	border-left-color: #c80000;
}
#main-nav .menu-item-48 a:hover,
#main-nav .menu-item-409 a:hover {
	color: #5a8cbe;
}
#main-nav .menu-item-408,
#main-nav .menu-item-409 {
	font-size: 22px;
}

#main-nav .current_page_item {
	font-size: 30px;
	line-height: 40px;
	height: 40px;
}
#main-nav a, #main-nav a:visited {
	border-left: 6px solid #002a5c;
	padding: 0 30px 0 6px;
	color: #002a5c;
}
#main-nav a:hover,
#main-nav .current_page_item a,
#main-nav .current_page_item a:visited {
	border-left: 6px solid #5a8cbe; /*#1982d1;*/
	color: #5a8cbe; /*#1982d1;*/
	text-decoration: none;
}

#main-footer {
	background-color: #fff;
	font-size: 10px;
	line-height: 1;
	color: #666;
}
#main-footer a {
	color: #666;
}
#footer-band {
	background-color: #1E1432;
	border-bottom: 1px solid #ccc;
	border-top: 1px solid #ccc;
	margin: 0;
	padding: 0;
	height: 35px;
	width: 100%;
}
#footer-menu {
	text-align: left;
	list-style: none;
}
#footer-menu ul {
	padding: 0;
	margin: 0;
}
#footer-menu li {
	display: inline;
}

#footer-menu li:last-child .nav-delimiter {
	display: none;
}


/********** small devices - single column, sidebar, menu at the end **********/

@media handheld, screen and (max-width: 480px) {
	.blog-title {
		width: 300px;
		height: 70px;
		margin: 7px 0;
		background: transparent url("images/sunami-logo-small.png") left top no-repeat;
		background-size: 300px 70px;
	}
	.blog-title a {
		width: 300px;
		height: 70px;
	}
	#sidebar {
		text-align: left;
		margin-bottom: 24px;
		padding: 24px 12px 12px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	#main-nav {
		margin-bottom: 24px;
		padding: 0 12px;
	}
	#site-info, #copyright {
		margin: 10px 12px;
	}
}

/********** Tablets portrait - single column, menu next to header on top, sidebar at the end **********/

@media screen and (min-width: 481px) {
	#main-header {
		width: 90%;
		max-width: 640px;
		margin: 0 auto;
		padding: 20px 25px;
	}
	.blog-title {
		width: 180px;
		height: 150px;
		margin: 0;
		background: transparent url("images/sunami-logo.png") top left no-repeat;
		background-size: 180px 150px;
	}
	.blog-title a {
		width: 180px;
		height: 150px;
	}
	#main-container {
		width: 90%;
		max-width: 640px;
		margin: 0 auto 25px;
		padding: 0 25px;
	}
	#sidebar {
		text-align: left;
		margin-bottom: 24px;
		padding: 24px 25px 12px;
		border-top: 1px solid #ccc;
		border-bottom: 1px solid #ccc;
	}
	#main-nav {
		margin-bottom: 24px;
		padding: 0 25px;
	}
	#footer-menu {
		margin: 10px 5px 10px 15px;
		float: left;
	}
	#copyright {
		margin: 10px 15px 10px 5px;
		float: right;
		text-align: right;
	}
}

/********** Tablets landscape - header, menu, sidebar on left **********/

@media screen and (min-width: 961px) {
	#main-header {
		width: 300px;
		margin 0;
		padding: 25px;
		float: left;
	}
	#main-container {
		width: 640px;
		margin-left: 33%;
		padding: 120px 0 76px;
		min-height: 960px;
	}
	#sidebar {
		width: 30%;
		position: absolute;
		left: 0;
		top: 550px;
		text-align: right;
		border: none;
		padding: 0;
	}
	#sidebar > ul {
		width: 250px;
		position: absolute;
		top: 0;
		right: 0;
	}
	#main-nav {
		position: absolute;
		top: 250px;
		left: 10px;
		padding: 0;
	}
}


/********** Big screen **********/

@media screen and (min-width: 961px) and (min-height: 901px) {
	#top-band {
		left: 0;
		position: fixed;
		top: 0;
		width: 100%;
	}
	#main-header {
		position: fixed;
		left: 2%;
		top: 12px;
		width: 32%;
		min-width: 320px;
	}
	.blog-title {
		width: 240px;
		height: 200px;
		background-size: 240px 200px;
	}
	.blog-title a {
		width: 240px;
		height: 200px;
	}
	#main-container {
		margin-left: 35%;
	}
	#sidebar {
		width: 32%;
		min-width: 320px;
		position: fixed;
		left: 0;
		top: auto;
		bottom: 70px;
		text-align: right;
		margin: 0;
	}
	#sidebar > ul {
		top: auto;
		bottom: 0;
	}
	#main-nav {
		position: fixed;
		top: 33%;
	}
	#main-footer {
		position: fixed;
		width: 100%;
		bottom: 0;
		left: 0;
	}
}

@media screen and (min-width: 1025px) and (min-height: 901px) {
	#main-header {
		left: 5%;
	}
	#main-container {
		margin-left: 38%;
	}
}


/*******************************************************************************************
  *
  * 1b. input and form styles
  *
********************************************************************************************/

/* reset */
button,
input,
select,
textarea {
	font-size: 100%;
	margin: 0;
	max-width: 100%;
	vertical-align: baseline;
}
button,
input {
	line-height: normal;
}
button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button;
	cursor: pointer;
}
button[disabled],
input[disabled] {
	cursor: default;
}
input[type="checkbox"],
input[type="radio"] {
	padding: 0;
}
input[type="search"] {
	-webkit-appearance: textfield;
	padding-right: 2px; /* Don't cut off the webkit search cancel button */
	width: 270px;
}
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}
button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}
textarea {
	overflow: auto;
	vertical-align: top;
}

/* basic input styles */
button,
input,
select,
textarea {
	margin-bottom: 6px;
}

label,
input,
textarea,
select {
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.15;
	color: #535353;
}
::-webkit-input-placeholder {
	color: #535353;
}
:-moz-placeholder {
	color: #535353;
}
::-moz-placeholder {
	color: #535353;
}
:-ms-input-placeholder {
	color: #535353;
}
input[type="file"] {
	font-size: 16px;
	font-size: 1.6rem;
	line-height: 1;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="password"],
textarea,
select {
	border: 2px solid #d1d6e2;
	border-radius: 5px;
	width: 100%;
	-webkit-appearance: none;
}
input[type="text"],
input[type="email"],
input[type="url"],
input[type="number"],
input[type="tel"],
input[type="password"],
select {
	padding: 6px 0 6px 12px;
	padding: 0.6rem 0 0.6rem 1.2rem;
}
textarea {
	padding: 6px 0 0 12px;
	padding: 0.6rem 0 0 1.2rem;
}
select {
	padding: 6px 6px 6px 8px;
	padding: 0.6rem 0.6rem 0.6rem 0.8rem;
}
input[type="checkbox"],
input[type="radio"] {
	margin: 0 6px 0 0;
	margin: 0 0.6rem 0 0;
	padding: 2px 0 0;
	vertical-align: middle;
}


/* submit buttons and button style link
 * note: button link style is for span inside
 * this is for having button inside column */
input[type="button"],
input[type="reset"],
input[type="submit"],
button,
a.button > span,
.content a.button > span {
	display: inline-block;
	text-align: center;
	text-transform: uppercase;
	text-decoration: none;
	font-size: 20px;
	font-size: 2rem;
	line-height: 1.1;
	color: #fff;
	padding: 9px 40px;
	padding: 0.9rem 4rem;
	min-width: 200px;
	border: none;
	border-radius: 8px;
	background: #5a8cbe;
	text-shadow: 0 -1px rgba(0,0,0,0.3);
	margin: 0;
}
a.button {
	margin: 0 0 20px;
	margin: 0 0 2rem;
}
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
button:hover > span,
a.button:hover > span {
	color: #fff !important;
	background: #eb8a14;
}

/* private post password form */
.private-post-form label,
.private-post-form input {
	display: block;
	margin: 0 0 5px;
}


/***** form styles *****/

form {
	margin: 0 0 30px;
}
label {
	display: block;
	margin: 0 0 3px;
}
input + label,
.wpcf7-list-item-label {
	display: inline; /* for checkbox/radio */
	margin-right: 12px;
	vertical-align: middle;
}
form .checkbox,
form .radio {
	margin: 8px 0 10px;
}
form .checkbox.stack .list-item,
form .radio.stack .list-item,
form .checkbox.stack .wpcf7-list-item,
form .radio.stack .wpcf7-list-item {
	display: block;
}
form .submit,
form .infusion-submit {
	margin-top: 5px;
}

/* privacy message */
.privacy {
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.3;
	margin: 8px 0 30px;
}
form + .privacy {
	margin-top: -22px;
}
/* nolabel class label */
.nolabel label {
	position: absolute;
	left: -10000px;
	top: 0;
}
/* no borders for table in forms */
form table {
	border: none;
}
form th,
form td {
	border: none;
	padding: 3px 10px 3px 0;
}
form td p {
  margin: 0;
}

/* required */
form .required {
	color: red;
}

/* contact form notification - CAPTCHA and Akismet */
.screen-reader-response,
.wpcf7-response-output {
	margin: 0 0 20px;
	margin: 0 0 2rem;
	color: #c80000;
	font-weight: bold;
	font-style: italic;
}
.wpcf7-not-valid-tip {
	color: #c80000;
	font-style: italic;
}

@media (min-width:760px) {
	form.wpcf7-form > div,
	.webform-container form > div {
		display: table;
		width: 100%;
		border-spacing: 0;
		table-layout: fixed;
		border-collapse: collapse;
	}
	form.wpcf7-form label,
	.webform-container form label {
		display: table-cell;
		vertical-align: top;
		width: 10%;
		padding: 8px 2px 0 0;
		margin: 0;
		text-align: right;
	}
	form .radio > label,
	form .checkbox > label {
		padding-top: 4px;
	}
	form.wpcf7-form input + label,
	.webform-container form input + label {
		display: inline;
		vertical-align: middle;
		padding: 0;
	}
	.webform-container form input + label {
		margin-right: 12px;
	}
	form.wpcf7-form .captcha,
	.webform-container form .captcha {
		display: block;
		padding-left: 25%;
		margin: 8px 0;
	}
	form.wpcf7-form .captcha label,
	.webform-container form .captcha label {
		display: block;
		width: auto;
		text-align: left;
		padding: 0;
		margin: 0 0 8px;
	}
	form.wpcf7-form .submit,
	form.wpcf7-form .infusion-submit,
	.webform-container form .submit,
	.webform-container form .infusion-submit {
		display: block;
		padding-left: 25%;
	}
	form.wpcf7-form .privacy,
	.webform-container .privacy {
		display: block;
		padding-left: 25%;
	}
	.nolabel .submit,
	.nolabel .infusion-submit,
	.nolabel .privacy{
		padding: 0 !important;
	}
}


/*******************************************************************************************
  *
  * 1c. misc. repeatable elements
  *
********************************************************************************************/

/* responsive video container */
.embed-code-container.type-video {
	max-width: 640px;
    margin-bottom: 20px;
    margin-bottom: 2rem;
}
.video-container {
	padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.video-container video,
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* slick slideshow - just in case */

.slick-arrow {
	display: block;
	position: absolute;
	min-width: 0;
	width: 50px;
	height: 50px;
	top: 50%;
	margin: -25px 0 0;
	background: #ddd;
	border-radius: 0;
	color: #000;
	padding: 0;
	text-align: left;
	text-indent: -1000000px;
}
.slick-prev {
	left: -70px;
}
.slick-next {
	right: -70px;
}
.slick-dots {
	text-align: center;
	list-style: none;
	margin: 0 auto;
	margin: 0 auto;
	padding: 0;
}
.content .slick-dots {
	list-style: none;
	margin: 0 auto;
	margin: 0 auto;
}
.slick-dots li {
	display: inline-block;
	margin: 0 10px;
	margin: 0 1rem;
	padding: 0;
}
.slick-dots button {
	display: block;
	min-width: 0;
	margin: 0;
	padding: 0;
	width: 10px;
	height: 10px;
	border: none;
	border-radius: 10px;
	background: #ddd;
	text-indent: -1000000px;
	box-shadow: inset 0 1px 1px rgba(0,0,0,0.2);
}
.slick-active button {
	background: #000;
	box-shadow: none;
	-webkit-transition: all .3s ease-in-out;
	-moz-transition: all .3s ease-in-out;
	-o-transition: all .3s ease-in-out;
	transition: all .3s ease-in-out;
}
.slick-dots button:hover {
	background: #000;
}

/*******************************************************************************************
  *
  * 2. wordpress elements
  *
  * 2a. article layouts
  *
********************************************************************************************/


.excerpts article {
	border-bottom: 4px double #ccc;
	margin-bottom: 60px;
}
.post-header {
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #ccc;
}
.post-title {
	margin-bottom: 10px;
	color: #002a5c;
	text-shadow: 1px 3px 1px #cccccc;
}
.post-title a {
	color: #002a5c;
}
.post-title a:hover {
	color: #5a8cbe;
	text-decoration: none;
}
.post-meta {
	font-family: Cambria, Georgia, serif;
	font-size: 13px;
	line-height: 17px;
	color: #666;
	font-style: italic;
}
.post-meta a {
	color: #666;
}
.post-thumbnail {
	width: 15%;
	margin: 0 15px 15px 0;
	float: left;
}
.post-nav {
	font-size: 12px;
	line-height: 18px;
	padding-top: 20px;
}




/*******************************************************************************************
  *
  * 2b. article footer
  *
********************************************************************************************/

/* footer meta */
.footer-meta {
	font-family: Cambria, Georgia, serif;
	font-size: 13px;
	line-height: 17px;
	color: #666;
	font-style: italic;
}
.footer-meta a {
	color: #666;
}

/* post/page navigation */
.page-links,
.nav-single,
#breadcrumbs {
	margin: 30px 0;
	margin: 3rem 0;
	padding: 0;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.3;
	clear: both;
}
#breadcrumbs + .nav-single {
	margin-top: -20px;
	margin-top: -2rem;
}
article + #breadcrumbs {
	padding-top: 30px;
	padding-top: 3rem;
	border-top: 1px solid #ccc;
}
.nav-next + .nav-previous {
	margin-top: 10px;
	margin-top: 1rem;
}

/* about author block */
.author-info {
	background: #fff;
	padding: 15px;
	margin: 0 0 20px;
	margin: 0 0 2rem;
	border-collapse: collapse;
}
.author-avatar {
	display: table-cell;
	width: 76px;
	height: 76px;
	vertical-align: middle;
}
.author-avatar img {
	display: block;
	padding: 0;
	margin: 0;
}
.author-description {
	padding: 0 0 0 15px;
	display: table-cell;
	vertical-align: top;
}
.author-description .author-name,
.author-description p {
	clear: none;
	margin: 0 0 6px 0;
	margin: 0 0 0.6rem 0;
}

@media (max-width:500px) {
	.author-info {
		padding: 10px 15px;
	}
	.author-avatar {
		display: block;
		float: left;
		margin: 0 10px 10px 0;
		width: 50px;
		height: 50px;
	}
	.author-description {
		display: block;
		padding: 0;
	}
}

/*******************************************************************************************
  *
  * 2c. comments
  *
********************************************************************************************/

#comments {
	clear:both;
    padding: 0;
    margin: 20px 0;
    margin: 2rem 0;
    padding-top: 10px;
    padding-top: 1rem;
    padding-bottom: 30px;
    padding-bottom: 3rem;
    border-bottom: 1px solid #ccc;
}
.comments-title {
	margin: 0 0 10px;
}
#comments .fb-like {
	margin: 0 0 5px 11px;
}
#comments .fb-comments,
#comments .wp-comments-container {
	background: #fff;
}
#comments input,
#comments textarea,
#respond,
#respond label {
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.3;
    margin: 0;
    min-width: 0;
    max-width: 100%;
}
#comments input[type="checkbox"] {
	margin: 5px;
	margin: 0.5rem;
}
#comments ol,
#comments ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
#comments .wp-comments-container > ol {
	border-top: 1px solid #ccc;
}
#comments li {
    border-top: 1px solid #e2e2e2;
    padding: 10px 0 0 10px;
    padding: 1rem 0 0 1rem;
    min-height: 70px;
}
#comments ol ol li {
	padding-left: 0;
}
#comments li.pingback {
	min-height: 0;
	padding: 10px 0;
	padding: 1rem 0;
}
#comments li.depth-1:first-child {
	border-top: none;
}
#comments li ol {
	padding: 0 0 0 20px;
	padding: 0 0 0 2rem;
}
#comments li .avatar {
    position:absolute;
    top:0;
    left:0;
    width:40px;
    height:40px;
}
#comments .comment-author,
#comments .comment-content,
#comments .comment-meta {
	padding: 0 28px 0 61px;
}
#comments .comment-author {
	margin-bottom: 5px;
	margin-bottom: 0.5rem;
}
#comments .comment-author cite {
	font-style: normal;
	font-weight: bold;
	color: #3B5998 !important;
}
#comments .comment a,
#respond .logged-in-as a {
    color: #3B5998;
    text-decoration:none;
}
#comments .comment a:active,
#comments .comment a:hover {
    color: #3B5998 !important;
    text-decoration: underline;
}
#comments .comment-meta {
	padding-bottom: 10px;
	padding-bottom: 1rem;
	color: #808080;
}
#comments-toggle,
#comment-nav-below {
    font-weight:bold;
	padding: 10px;
	padding: 1rem;
}
#comment-nav-below a {
	color: #3B5998;
}

#respond {
    padding: 15px 10px 0;
    padding: 1.5rem 1rem 0;
    position: relative;
    border-top: 1px solid #ccc;
}
.commentlist #respond {
	border-top-color: #e2e2e2;
	padding: 10px 10px 10px 0;
    padding: 1rem 1rem 1rem 0;
	margin-left: 61px;
}
#comments-toggle,
#respond #reply-title {
	margin-bottom: 6px;
	color: #3B5998;
}
#comments-toggle {
	display: none;
	cursor: pointer;
	margin: 0;
	border-top: 1px solid #ccc;
}
#cancel-comment-reply-link {
    color: #3B5998;
    padding-left: 16px;
}
#respond p {
	margin: 5px 0;
}
#respond .comment-notes {
	font-size: 10px;
	font-style: italic;
}
#respond .required {
    color:#FF4B33;
    font-weight:bold;
}
#respond input[type="submit"] {
	min-width: 0;
	margin: 0;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1;
	padding: 7px 20px;
	padding: 0.7rem 2rem;
}
#respond .comment-form-author,
#respond .comment-form-email,
#respond .comment-form-url {
	padding: 2px 0;
	margin-top: 0;
	margin-bottom: 0;
}
#respond .comment-form-author label,
#respond .comment-form-email label,
#respond .comment-form-url label {
	display: inline-block;
	width: 50px;
	padding: 6px 5px 0 0;
}
#respond .comment-form-author input,
#respond .comment-form-email input,
#respond .comment-form-url input {
	display: inline-block;
	width: 300px;
	padding: 4px 6px;
	padding: 0.4rem 0.6rem;
	height: auto;
}
.comment-form-url {
	display: none;
}
.comment-form-comment {
	position: relative;
}
.comment-form-comment label {
    display: none;
    padding: 0 0 2px;
  	padding: 0 0 0.2rem;
}
.comment-form-comment textarea {
	width: 100%;
	padding: 6px;
	padding: 0.6rem;
}
#commentform .form-allowed-tags {
    color:#808080;
    font-size: 11px;
    font-size: 1.1rem;
    line-height: 1.2;
    font-style: italic;
    margin-right: 18px;
}
#commentform .form-allowed-tags code {
    color:#808080;
    font-size: 10px;
    font-size: 1rem;
    line-height: 12px;
    font-style: normal;
}
/* this toggles allowed tags. appended to comment form via jquery */
#commentform .allowed-tag-toggle  {
	display: block;
	height: 12px;
	width: 12px;
	position: absolute;
	right: 2px;
	bottom: -18px;
	background: transparent url("images/sprites.png") -50px -750px no-repeat;
	cursor: pointer;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    #commentform .allowed-tag-toggle {
	    background-size: 1000px 1200px;
	    background-position: -950px -1150px;
    }
}

#respond form .form-submit {
	margin-top: 15px;
	margin-top: 1.5rem;
	margin-right: 18px;
}
/*#respond form .comment-form-subscriptions label {
	margin: 6px 0 8px;
}*/
/*#respond form .comment-form-subscriptions input[type="checkbox"] {
	margin: 0 5px 0 0;
}*/
#respond form .comment-form-subscriptions a {
	color: #3b5998;
	text-decoration: underline;
}
.comment-closed {
	padding: 10px 0;
	padding: 1rem 0;
	margin: 0;
	color: #c80000;
	font-style: italic;
}

/* comment content typography -to match facebook */

#comments .comment-content p,
#comments .comment-content h1,
#comments .comment-content h2,
#comments .comment-content h3,
#comments .comment-content h4,
#comments .comment-content h5,
#comments .comment-content h6,
#comments .comment-content blockquote,
#comments .comment-content address {
	margin: 0 0 5px;
	margin: 0 0 0.5rem;
}
#comments-toggle,
#respond #reply-title {
	/* font-family: Helvetica Neue,Helvetica,Arial,sans-serif; */
	font-weight: bold;
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1;
}
#cancel-comment-reply-link {
	font-size: 12px;
	font-size: 1.2rem;
	font-weight: normal;
	
}
.nocomments,
#comments,
#comments .comment-content h1,
#comments .comment-content h2,
#comments .comment-content h3,
#comments .comment-content h4,
#comments .comment-content h5,
#comments .comment-content h6,
#comments .comment-content blockquote,
#comments .comment-content table,
#comments .comment-content dl,
#comments .comment-content ol,
#comments .comment-content ul,
#comments .comment-content address {
	/* font-family: Helvetica Neue,Helvetica,Arial,sans-serif; */
    font-size: 12px;
    font-size: 1.2rem;
    line-height: 1.28;
    color: #1a1a1a;
}

#comments .comment-content h1,
#comments .comment-content h2,
#comments .comment-content h3,
#comments .comment-content h4,
#comments .comment-content h5,
#comments .comment-content h6 {
	font-weight: bold;
}
#comments .comment-content blockquote {
	margin: 0 0 8px 10px;
	margin: 0 0 0.8rem 1rem;
	font-style: italic;
}
#comments .comment-content blockquote p {
	color: #888888;
}
#comments .comment-content blockquote cite {
	display: inline-block;
	text-align: left;
	margin: 0 0 0 10px;
	margin: 0 0 0 1rem;
}
#comments .comment-content table,
#comments .comment-content dl,
#comments .comment-content ol,
#comments .comment-content ul {
	padding: 0;
	margin: 0 0 10px 15px;
	margin: 0 0 1rem 1.5rem;
}
#comments .comment-content th,
#comments .comment-content td {
	padding: 3px 5px;
	padding: 0.3rem 0.5rem;
}
#comments .comment-content dt,
#comments .comment-content dd {
	margin: 0 0 5px;
	margin: 0 0 0.5rem;
}
#comments .comment-content ul {
	list-style: disc;
}
#comments .comment-content ol {
	list-style: decimal;
}
#comments .comment-content ol ol {
	list-style: upper-alpha;
}
#comments .comment-content ol ol ol {
	list-style: lower-roman;
}
#comments .comment-content ol ol ol ol {
	list-style: lower-alpha;
}
#comments .comment-content ol ol,
#comments .comment-content ol ul,
#comments .comment-content ul ul,
#comments .comment-content ul ol {
	margin: 0;
}
#comments .comment-content li {
	min-height: 0;
	padding: 0;
	border: none;
	margin: 0 0 0 10px;
	margin: 0 0 0 1rem;
}
#comments .comment-content pre,
#comments .comment-content code,
#comments .comment-content tt,
#comments .comment-content kbd {
	font-size: 10px;
	font-size: 1rem;
}
#comments .pingback,
#comments .pingback a {
	color: #3B5998;
}

/* js collapses comments if more than 7 */
#comments .comment-hidden,
#comments-toggle  {
	display: none;
}
#comments.collapsed #comments-toggle {
	display: block;
}

@media (max-width:759px) {
	#comments li .avatar {
		width: 20px;
		height: 20px;
	}
	#comments .comment-author,
	#comments .comment-content,
	#comments .comment-meta {
		padding-right: 10px;
		padding-right: 1rem;
		padding-left: 28px;
	}
	#comments li {
		min-height: 20px;
	}
	#comments li ol {
		padding-left: 10px;
	}
	.commentlist #respond {
		margin-left: 0;
	}
}


/*******************************************************************************************
  *
  * 2d. misc. article related styles
  *
********************************************************************************************/

/* archive heading */
#archive-header .title {
  color: #666;
	font-size: 20px;
	font-size: 2rem;
	margin-bottom: 40px;
	margin-bottom 4rem;
	padding-bottom: 5px;
	border-bottom: 4px double #ccc;
}

/* excerpts */
.excerpt > p {
	margin-bottom: 20px;
	margin-bottom: 2rem;
}
.excerpt .excerpt-link {
	font-size: 14px;
	font-size: 1.4rem;
}

/* edit link */
.edit-link {
	font-size: 13px;
	line-height: 1;
	display: block;
	position: absolute;
	right: 5px;
	bottom: -15px;
}
.edit-link a {
	font-style: italic;
	color: red !important;
	text-decoration: underline;
}

/* bottom page nav */
#nav-below {
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1;
	margin: 30px 0;
	margin: 3rem 0;
	text-align: center;
}
#nav-below .nav-previous,
#nav-below .nav-next {
	display: inline;
	margin: 0 20px;
	margin: 0 2rem;
}

/* wp-page navi */
.wp-pagenavi {
	text-align: center;
}
.wp-pagenavi > * {
	display: inline-block;
	margin: 0 10px 0 0;
	vertical-align: middle;
}
.wp-pagenavi .pages {
	margin-right: 20px;
	margin-right: 2rem;
}
.wp-pagenavi a,
.wp-pagenavi .current {
	background: #fff;
	width: 30px;
	width: 3rem;
	height: 30px;
	height: 3rem;
	border-radius: 20px;
	padding-top: 8px;
	padding-top: 0.8rem;
}
.wp-pagenavi a.previouspostslink,
.wp-pagenavi a.nextpostslink {
	/* brackets line up differently */
	padding-top: 7px;
	padding-top: 0.7rem;
}
.wp-pagenavi .current {
	color: #aaa;
}

/* youtube embeds - 500px max algnment does not affect */
.wp-block-embed-youtube  {
	max-width: 500px;
}
.wp-block-embed-youtube figcaption {
	max-width: 500px;
	text-align: center;
}

/* site map list */
.sitemap-list li a {
  color: #000;
}

/* shortcode blog excerpts */
.cat-excerpts {
  border-top: 1px solid #ccc;
  margin-bottom: 15px;
}
.cat-excerpt {
  display: flex;
  padding: 15px 0 10px 0;
  border-bottom: 1px solid #ccc;
}
.cat-excerpt .thumbnail {
  width: 15%;
  min-width: 70px;
  padding: 0 15px 15px 0;
}
.cat-excerpt .excerpt {
  /* width: 85%; */
  padding-bottom: 15px;
}
.cat-excerpt  h4.excerpt-title {
  font-size: 18px;
  font-size: 1.8rem;
  line-height: 1.5;
  margin: 0;
}
.cat-excerpt h4.excerpt-title a {
  color: #002a5c;
}
.cat-excerpt,
.cat-excerpt p {
  font-size: 15px;
  font-size: 1.5rem;
  line-height: 1.3;
  margin: 0;
}
.excerpt-meta {
  font-family: Cambria, Georgia, serif;
	font-size: 12px;
	font-size: 1.2rem;
	line-height: 1.5;
	color: #666;
	font-style: italic;
}
h3.special {
  margin-top: 60px;
  margin-top: 6rem;
  padding-top: 15px;
  border-top: 4px double #ccc;
}

/*******************************************************************************************
  *
  * 2e. default widgets
  *
********************************************************************************************/

/* general */
#sidebar .widget {
	background: #fff;
	list-style: none;
	padding: 0;
	margin: 0 0 12px;
	margin: 0 0 1.2rem;
	color: #666;
	font-family: Cambria, Georgia, serif;
	clear: both;
	font-size: 15px;
	font-size: 1.5rem;
	line-height: 1.3;
}
#sidebar .widget-title {
	font-family: Cambria, Georgia, serif;
	margin-bottom: 8px;
	margin-bottom: 0.8rem;
	font-size: 17px;
	font-size: 1.7rem;
	line-height: 1;
	font-style: italic;
	color: #666;
}
#sidebar .widget a {
	color: #666;
}
#sidebar .widget a:hover {
	color: #5a8cbe; /*#1982d1;*/
}
#sidebar .widget li {
	margin: 0;
}
.widget ul {
	list-style: none;
	position: relative;
	margin: 0;
}
.widget p,
.widget h1,
.widget h2,
.widget h3,
.widget h4,
.widget h5,
.widget h6 {
	line-height: 1.1;
	margin: 0;
}

/* search form */
.widget_search form {
	padding: 0;
	margin: 0;
	position: relative;
	max-width: 170px;
}
.widget_search input[type="text"] {
	width: 100%;
	margin: 0;
	padding-left: 30px;
	padding-right: 6px;
}
/* must be 30x30 for sprites */
.widget_search input[type="submit"] {
	display: block;
	position: absolute;
	top: 50%;
	left: 5px;
	min-width: 0;
	min-height: 0;
	width: 22px;
	height: 22px;
	border: none;
	background: transparent url("images/sprites.png") -900px -50px no-repeat;
	text-indent: -5000px;
	margin: -11px 0 0;
	padding: 0;
	box-shadow: none;
	border-radius: 0;
}

/* tag cloud */
.tagcloud {
	line-height: 1.1;
}

@media screen and (min-width: 961px) {
	.widget_search form {
		margin: 0 0 0 auto;
	}
	.widget_search input[type="text"] {
		text-align: right;
	}
}


/*******************************************************************************************
  *
  * 2f. custom widgets
  *
********************************************************************************************/

/* Recent Post Excerpt */
#sidebar .widget_recentpostsexcerpt_widget {
	margin: 0;
}
#sidebar .widget_recentpostsexcerpt_widget ul li {
	margin: 0 0 12px;
	margin: 0 0 1.2rem;
}

/* category widget links */
#sidebar .widget_categories a {
	padding-left: 4px;
}
#sidebar .widget_categories a:hover {
	text-decoration: none;
	border-left: solid 6px #1982d1;
}

/* custom widgets with thumbnail */
.widget .thumbnail-list,
.widget .custom-recent-comments {
	border-collapse: collapse;
}
.widget .thumbnail-list li a {
	display: block;
	width: 100%;
	position: relative;
}
.widget .thumbnail-list .thumbnail-post-img,
.widget .custom-recent-comments .avatar {
	width: 50px;
	height: 50px;
	position: absolute;
	left: 0;
	top: 0;
}
.widget .thumbnail-list .thumbnail-post-img img,
.widget .custom-recent-comments .avatar img {
	display: block;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
}
.widget .thumbnail-list .thumbnail-post-title,
.widget .custom-recent-comments .comment {
	display: table-cell;
	vertical-align: middle;
	height: 50px;
	padding-left: 65px;
}


/* tab widget: in-effect class added if it's active */
.widget_custom_tab_widget,
#sidebar .widget_custom_tab_widget {
	padding: 0;
	background: transparent;
}

.widget_custom_tab_widget.in-effect {
}
.widget_custom_tab_widget.in-effect .tabs .tab-title {
	cursor: pointer;
	display: inline-block;
	margin: 0 4px 0 0;
	line-height: 1;
	border-radius: 4px 4px 0 0;
}
.widget_custom_tab_widget.in-effect .tabs .selected {
	cursor: default;
}
.widget_custom_tab_widget.in-effect .widget-inside {
	padding: 10px 0 0;
	padding: 1rem 0 0;
	border-radius: 0 4px 4px 4px;
}



/*******************************************************************************************
  *
  * 3. main layout
  *
  * 3a. layout - mobile menu (not used)
  *
********************************************************************************************/

#mobile-menu {
	display: none;
}


/*******************************************************************************************
  *
  * 3b. layout - modal (just in case) : override remodal.css
  *
********************************************************************************************/


.remodal-overlay {
	background: rgba(43, 46, 56, 0.9);
}
.remodal-wrapper {
	padding: 15px 15px 0;
}
.remodal {
	background: transparent;
	padding: 10px;
}

/* this is a <button>*/
.remodal-close {
	position: absolute;
	top: 0;
	left: auto;
	right: 0;
	min-width: 0;
	width: 34px;
	height: 34px;
	margin: 0;
	padding: 0;
	color: #95979c;
	background: #ddd;
	border: solid 2px #fff;
	border-radius: 50px;
	z-index: 2000;
	-webkit-transition: all 0.2s;
	transition: all 0.2s;
}
.remodal-close:hover {
	color: #ddd;
	background: #fff;
}

.remodal-close:before {
	font-family: Arial, "Helvetica CY", "Nimbus Sans L", sans-serif !important;
	font-size: 30px;
	line-height: 30px;
	position: absolute;
	top: 0;
	left: 0;
	width: 30px;
	content: "\00d7";
}


/* modal content */
.modal-content {
	background: #fff;
	border-radius: 10px;
	padding: 35px 45px;
	-webkit-box-shadow: 0px 0px 8px #171a24;
    box-shadow: 0px 0px 8px #171a24;
    text-align: left;
}


@media (max-width:759px) {
	.modal-content {
		padding: 20px;
	}
}


/*** fallback style for no javascript ***/
.js-disabled .remodal,
.js-disabled [data-remodal-id] {
    visibility: visible;
}
.js-disabled .remodal {
	opacity: 1;
	display: block;
	height: 100%;
	margin: 0 auto;
	text-align: center;
}
.js-disabled .remodal:after {
	display: inline-block;
    height: 100%;
    margin-left: -0.05em;
    content: "";
    vertical-align: middle;
}
.js-disabled .modal-content {
	display: inline-block;
	vertical-align: middle;
}


/*******************************************************************************************
  *
  * 3c. layout - misc.
  *
********************************************************************************************/


/*** breadcrumbs ***

#breadcrumbs {
	margin-bottom: 30px;
	margin-bottom: 3rem;
	font-size: 13px;
	font-size: 1.3rem;
	line-height: 1;
}
#breadcrumbs,
#breadcrumbs a {
	color: #aaa;
}

/*** 404 page ***/
.page-404 h1.heading {
	font-size: 40px;
	font-size: 14rem;
}
.page-404 .fun404 {
	margin-top: 50px;
}
@media screen and (min-width: 961px) and (min-height: 901px) {
	.page-404 .fun404 {
		position: fixed;
		bottom: 80px;
		right: 25px;
	}
}

/*******************************************************************************************
  *
  * 4. misc. media queries
  *
  *
********************************************************************************************/

@media (max-width:500px) {
	
}
@media (max-width:759px) {
	.no-mobile, .only-tablet, .only-pc {
		display: none;
	}
}
@media (min-width:760px) {
	
}
@media (min-width:760px) and (max-width:1023px) {
	.no-tablet, .only-mobile, .only-pc {
		display: none;
	}
}
@media (max-width:1023px) {
	
}
@media (min-width:1024px) {
	.no-pc, .only-mobile, .only-tablet {
		display: none;
	}
}
@media (min-width:1250px) {
	
}
@media print {
	aside,
	#main-nav,
	#secondary-nav,
	#social-links,
	#footer-links,
	#footer-menu {
		display: none;
	}
	.container,
	.column-container,
	.narrow-container {
		max-width: none;
	}
}


/*******************************************************************************************
  *
  * 5. cross browser fixes
  *
********************************************************************************************/
/* IE8 - not actively supported */
