/*
Theme Name: disassociated 2022
Author: John Lampard
Author URI: https://disassociated.com
Version: 9.0
 */

/* document stuff */

/* 1. correct the line height in all browsers.
 * 2. prevent adjustments of font size after orientation changes in iOS. */
html{
line-height:1.15;
-webkit-text-size-adjust:100%;
}

/* sections stuff */

/* remove the margin in all browsers. */
body{
margin:0;
}

/* render the `main` element consistently in IE. */
main{
display:block;
}

/* correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari. */
h1{
font-size:2em;
margin:0.67em 0;
}

/* grouping content stuff */

/* 1. add the correct box sizing in Firefox.
 * 2. show the overflow in Edge and IE. */
hr{
box-sizing:content-box;
height:0;
overflow:visible;
}

/* 1. correct the inheritance and scaling of font size in all browsers.
 * 2. correct the odd `em` font sizing in all browsers. */
pre{
font-family:monospace, monospace;
font-size:1em;
}

/* text-level semantics stuff */

/* remove the gray background on active links in IE 10. */
a{
background-color:transparent;
}

/* 1. remove the bottom border in Chrome 57-
 * 2. add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.*/
abbr[title] {
border-bottom:none; 
text-decoration:underline;
text-decoration:underline dotted 1px #1a1a1a;
text-underline-offset:4px;
}

/* add the correct font weight in Chrome, Edge, and Safari.*/
b,
strong{
font-weight:bolder;
}

/* 1. correct the inheritance and scaling of font size in all browsers.
 * 2. correct the odd `em` font sizing in all browsers. */
code,
kbd,
samp{
font-family:monospace, monospace;
font-size:1em;
}

/* add the correct font size in all browsers. */
small{
font-size:80%;
}

/* prevent `sub` and `sup` elements from affecting the line height in
 * all browsers. */
sub,
sup{
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline;
}

sub{
bottom:-0.25em;
}

sup{
top:-0.5em;
}

/* embedded content stuff*/

/* remove the border on images inside links in IE 10. */
img{
border-style:none;
}

/* this keeps images such as bookcovers etc no wider than 800px */
.responsive-img{ 
max-width:100%;
height:auto; 
} 

/* this centres images regardless of their width */
.picture{
display:flex;
justify-content:center;
margin: 0 0 20px 0;
}

/* forms reset sort of stuff */
/* 1. change the font styles in all browsers.
 * 2. remove the margin in Firefox and Safari. */
button,
input,
optgroup,
select,
textarea{
font-family:inherit;
font-size:100%;
line-height:1.15;
margin:0;
}

/* show the overflow in IE.
 * 1. show the overflow in Edge. */
button,
input{
overflow:visible;
}

/* remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox. */
button,
select{
text-transform:none;
}

/* correct the inability to style clickable types in iOS and Safari. */
button,
[type="button"],
[type="reset"],
[type="submit"]{
-webkit-appearance:button;
}

/* remove the inner border and padding in Firefox. */
button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner{
border-style:none;
padding:0;
}

/* restore the focus styles unset by the previous rule. */
button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring{
outline:1px dotted ButtonText;
}

/* correct the padding in Firefox. */
fieldset{
padding:0.35em 0.75em 0.625em;
}

/* 1. correct the text wrapping in Edge and IE.
 * 2. correct the color inheritance from `fieldset` elements in IE.
 * 3. remove the padding so developers are not caught out when they zero out
 *		`fieldset` elements in all browsers. */
legend{
box-sizing:border-box;
color:inherit;
display:table;
max-width:100%;
padding:0;
white-space:normal;
}

/* add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress{
vertical-align:baseline;
}

/* Remove the default vertical scrollbar in IE 10+. */
textarea{
overflow:auto;
}

/* 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10. */
[type="checkbox"],
[type="radio"]{
box-sizing:border-box;
padding:0;
}

/* correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button{
height:auto;
}

/* 1. correct the odd appearance in Chrome and Safari.
 * 2. correct the outline style in Safari.
 */
[type="search"]{
-webkit-appearance: textfield;
outline-offset:-2px;
}

/* remove the inner padding in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-decoration{
-webkit-appearance:none;
}

/* 1. correct the inability to style clickable types in iOS and Safari. */
/* 2. change font properties to `inherit` in Safari. */
::-webkit-file-upload-button{
-webkit-appearance:button;
font:inherit;
}

/* interactive stuff */

/* add the correct display in Edge, IE 10+, and Firefox. */
details{
display:block;
}

/* add the correct display in all browsers. */
summary{
display:list-item;
}

/* misc useful stuff */

/* add the correct display in IE 10+. */
template{
display:none;
}

/* add the correct display in IE 10. */
[hidden]{
display:none;
}

/* box sizing stuff */

/* Inherit box-sizing to more easily change it's value on a component level.
@link http://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
*,
*::before,
*::after{
box-sizing:inherit;
}

html{
box-sizing:border-box;
}

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

figure{
margin:1em 0;
}

table{
margin:0 0 1.5em;
width:100%;
}

/* comments stuff ... refer dis 2022 stylesheet copy dated 6/5/2022 */
.comment-content a{
word-wrap:break-word;
}

.bypostauthor{
display:block;
}

html,
body,
div{
margin:0;
padding:0;
font-family:'Noto Sans', sans-serif;
}
 
#header{
background:#ffffff;
}
 
#main{
background:#ffffff;    
}

#footer{
background:#ffffff;    
}

/* structure stuff */
 
.wrap{
max-width:1200px;
margin:0 auto;
padding:1em;
}
 
#identity{
text-align:center;
}

#primary{
max-width:800px;
margin:0 auto;
}

#footery{
max-width:800px;
margin:0 auto;
}

#foot-content{
text-align:center;
}

/* used to increase size of h1 tag on 404 page */
.four-oh-four{
font-size:6rem;
}

/* header text stuff */
/* H1 styles used for dis title in header, H2 used for POST titles, prevents SEO tag clash */
#identity h1{
font-size:1.1rem;
color:#1a1a1a;
font-weight:400;
margin:10px 0 18px 0;
letter-spacing:1px;
}
/* H1 styles used for dis title in header, H2 used for POST titles, prevents SEO tag clash */
#identity h1 a:link, h1 a:visited{
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
}

#identity h1 a:hover{
text-decoration:none;
background:transparent;
color:#999;
font-weight:normal;
}

#identity h1 a:active{
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
}

/* font awesome! */
.glyphs{
font-size:2rem;
margin-bottom:15px;
}

a#twitter-rollover:link{
font-size:inherit;
color:#1da1f2;
}

a#twitter-rollover:active{
font-size:inherit;
color:#1da1f2;
}

a#twitter-rollover:visited{
font-size:inherit;
color:#1da1f2;
}

a#twitter-rollover:hover{
font-size:inherit;
color:#8dcff4;
}

a#rss-rollover:link{
font-size:inherit;
color:#ee802f;
}

a#rss-rollover:active{
font-size:inherit;
color:#ee802f;
}

a#rss-rollover:visited{
font-size:inherit;
color:#ee802f;
}

a#rss-rollover:hover{
font-size:inherit;
color:#f9cd8a;
}

a#mastodon-rollover:link{
font-size:inherit;
color:#2b90d9;
}

a#mastodon-rollover:active{
font-size:inherit;
color:#2b90d9;
}

a#mastodon-rollover:visited{
font-size:inherit;
color:#2b90d9;
}

a#mastodon-rollover:hover{
font-size:inherit;
color:#3fbbef;
}

a#bmac-rollover:link{
font-size:inherit;
color:#ffdd00;
}

a#bmac-rollover:active{
font-size:inherit;
color:#ffdd00;
}

a#bmac-rollover:visited{
font-size:inherit;
color:#ffdd00;
}

a#bmac-rollover:hover{
font-size:inherit;
color:#fff99d;
}

/* font awesome glyphs NOT IN USE ATM */
a#fb-rollover:link{
font-size:inherit;
color:#4267b2;
}

a#fb-rollover:active{
font-size:inherit;
color:#4267b2;
}

a#fb-rollover:visited{
font-size:inherit;
color:#4267b2;
}

a#fb-rollover:hover{
font-size:inherit;
color:#666;
}

a#gr-rollover:link{
font-size:inherit;
color:#9de4c9;
}

a#gr-rollover:active{
font-size:inherit;
color:#9de4c9;
}

a#gr-rollover:visited{
font-size:inherit;
color:#9de4c9;
}

a#gr-rollover:hover{
font-size:inherit;
color:#666;
}

.navbar a:link{ 
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-size:1rem;
font-weight:normal;
padding:0 10px 0 10px;
}

.navbar a:visited{ 
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-size:1rem;
font-weight:normal;
padding:0 10px 0 10px;
}

.navbar a:hover{ 
text-decoration:underline;
text-underline-offset:4px; /* adds some spacing below the hyperlink */	
background:transparent;
color:#1a1a1a;
font-size:1rem;
font-weight:normal;
padding:0 10px 0 10px;
}

.navbar a:active{ 
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-size:1rem;
font-weight:normal;
padding:0 10px 0 10px;
}

/* as 2/9/22 H2 should be post title tag... H1 should be for dis title text in header */
#content h2{
font-size:2rem; 
line-height:3rem;
color:#1a1a1a;
font-weight:700;
margin:35px 0 25px 0;  
letter-spacing:0px;
text-align:center;
}

#content h2 a:link, h2 a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
border-bottom:solid 1px #ccc;
}

#content h2 a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
border-bottom:solid 1px #000;
}

#content h2 a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
}

/* H2 tag styles for smaller screens NOTE: this must be below standard style to work */
@media (max-width:750px){
#content h2{
font-size:1.5rem; /* was 1.5 */
line-height:2.2rem;
color:#1a1a1a;
font-weight:700;
margin:35px 0 25px 0;  
letter-spacing:0px;
text-align:center;
}
}

/* h2 used on tag result and search result page as a section heading (eg, list of posts tagged whatever), not for titles of posts on said page, which are h3 in this case */
/* as 2/9/22 H2 should be post title tag... H1 should be for dis title text in header */
#content1 h2{
/* content1 set so this style is ignored ... can delete later once all other changes are ok, 2/9/22 */
font-size:1.5rem; 
line-height:3rem;
color:#1a1a1a;
font-weight:700;
margin:35px 0 25px 0;  
letter-spacing:0px;
text-align:center;
}

/* H3 used for sub headings eg DF guide to indie publishers post */
/* NOTE: H3 was once used for headings on tags and search results pages */
#content h3{
font-size:1.5rem; 
line-height:2rem;
color:#1a1a1a;
font-weight:700;
margin:35px 0 25px 0; 
letter-spacing:0px;
text-align:center;
}

#content h3 a:link, h3 a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
border-bottom:solid 1px #ccc;
}

#content h3 a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
border-bottom:solid 1px #000;
}

#content h3 a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:700;
}

/* H3 tag styles for smaller screens NOTE: this must be below standard style to work */
@media (max-width:750px){
#content h3{
font-size:1.2rem; /* was 1.5 */
line-height:2rem;
color:#1a1a1a;
font-weight:700;
margin:35px 0 25px 0;  
letter-spacing:0px;
text-align:center;
}
}

#content h4{
/* font-size: not set, user default */
color:#1a1a1a;
font-weight:normal;
margin:-15px 0 25px 0; 
letter-spacing:0px;
text-align:center;
}

#content h5{
/* H5 used for day date on posts */
/* font-size: not set, user default */
color:#1a1a1a;
font-weight:400;
margin:-15px 0 25px 0; 
letter-spacing:0px;
text-align:center;
}

#content h5 a:link, h5 a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

#content h5 a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #000;
}

#content h5 a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

/* NO H6 styles assigned yet */

#content p{
text-align:left;
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:15px 0 30px 0;
padding:0;
border:0;
}

#content p a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

#content p a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #999;
}

#content p a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #1a1a1a;
}

#content p a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

blockquote{
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:15px 40px 15px 30px;
padding:0 10px 0 10px;
border-left:3px solid #333;
}

/* styles for lists in posts */
#content ul{
list-style-image: url('https://www.disassociated.com/images/index/point_style_star.gif');
margin:-30px 0 -15px 0;
padding:30px 40px 30px 45px;
}

#content li{
color:#666;
margin:5px 0 5px 0;
font-size:1.05em;
line-height: 1.5em;
}

#content li a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

#content li a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #999;
}

#content li a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #000;
}

#content li a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

/* styles for FOOTNOTES - EG Oscar nom process - in posts */
.footnote{
border-top:1px dotted #333;
margin:70px 0 0 0;	
padding-top:30px;
}

li.plain-list-style{
list-style:none;
color:#666;
margin:5px 0 5px 0;
font-size:1.05em;
line-height: 1.5em;
}
/* CLOSE styles for FOOTNOTES */

/* styles for comment lists */
#post-comments ul{
/* list-style-image: url('https://www.disassociated.com/images/index/point_style_star.gif'); */
margin:-30px 0 -15px 0;
padding:30px 40px 30px 45px;
}

#post-comments li{
color:#666;
margin:5px 0 5px 0;
font-size:1.05em;
line-height: 1.5em;
}

#post-comments li a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
border-bottom:solid 1px #ccc;
}

#post-comments li a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
border-bottom:solid 1px #999;
}

#post-comments li a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
border-bottom:solid 1px #000;
}

#post-comments li a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
}

/* nesting div, yes, YET another damn div, keeps two tag-page divs below in the right place */
.tag-page-nav{
width:100%;
margin:0 0 20px 0;
border:0;
}

.tag-page-right{
display:inline-block;
width:49%;
text-align:right;
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:0;
padding:0;
border:0;
}

.tag-page-left{
display:inline-block;
width:49%;
text-align:left;
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:0;
padding:0;
border:0;
}

/* styles for post-share, share to TW, FB, etc */

#content p.post-stuff{
text-align:center;
font-size:0.9rem;
color:#666;
margin:0 5px 40px 0;
padding:0;
border:0;
}

#content p.post-stuff a:link{
text-decoration:none;
background:transparent;
color:#000;
font-weight:400;
border-bottom:solid 1px #ccc;
}

#content p.post-stuff a:visited{
text-decoration:none;
background:transparent;
color:#000;
font-weight:400;
border-bottom:solid 1px #999;
}

#content p.post-stuff a:hover{
text-decoration:none;
background:transparent;
color:#000;
font-weight:400;
border-bottom:solid 1px #000;
}

#content p.post-stuff a:active{
text-decoration:none;
background:transparent;
color:#000;
font-weight:400;
}

/* styles for tags, title, text etc */
#content p.tag-header{
text-align:center;
font-size:0.9rem;
margin:0 auto;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

#content p.tag{
text-align:center;
font-size:0.9rem;
color:#666;
margin:0 5px 100px 0;
padding:0;
border:0;
}

#content p.tag a:link{
text-decoration:none;
background:transparent;
color:#666;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#content p.tag a:visited{
text-decoration:none;
background:transparent;
color:#666;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#content p.tag a:hover, p.tag a:active{
text-decoration:none;
background:transparent;
color:#666;
font-weight:normal;
margin:0;
padding:0;
border:0;
border-bottom:solid 1px #000;
}

/* styles for tags text etc */
#content p.tag-header111{
text-align:center;
font-size:0.8rem;
margin:0 auto;
padding:0;
border:0;
width:55px;
color:#fff;
background:#999;
border-radius:3px;
-moz-border-radius:3px;
-webkit-border-radius:3px;
-webkit-appearance:none;
box-sizing:border-box;
}

/* nesting div, yes, YET another damn div, keeps two tag-page divs below in the right place */
.tag-page-nav{
width:100%;
margin:0 0 20px 0;
border:0;
}

.tag-page-right{
display:inline-block;
width:49%;
text-align:right;
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:0;
padding:0;
border:0px solid black;
}

.tag-page-left{
display:inline-block;
width:49%;
text-align:left;
font-size:1.05rem;
line-height:1.6rem;
color:#666;
margin:0;
padding:0;
border:0px solid black;
}

.tag-page-nav a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

.tag-page-nav a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #999;
}

.tag-page-nav a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #000;
}

.tag-page-nav a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

/* numeric pagination styles */
.numpage{
text-align:center;
margin:30px 0 30px 0;
}

.page-numbers{
font-size:1.05rem;
margin:0 15px 0 15px;
}

.numpage a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

.numpage a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #999;
}

.numpage a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #000;
}

.numpage a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

/* container div for last-next-post */
.last-next-post{
position:relative;
line-height:1.5rem;	/* set line height for hyperlink if it spans two lines */
margin:1em 0;
padding:3em 0;
}

/* div "inner" for last-next-post container div */
.last-next-post div{
width:46%;
display:inline-block;
vertical-align:top;
}

/* div for previous posts */
.last-next-post .previous{
margin-right:6%;
margin-bottom:0;
}

/* div for next/no newer posts */
.last-next-post .next{
text-align:right;
}

/* div "inner" for 'previous' div */
.last-next-post:before{
content:"";
position:absolute;
top:0;
height:1px;
background:#ffffff;
}

/* div "inner" for 'next' div */
.last-next-post:after{
content:"";
position:absolute;
bottom:0;
height:1px;
background:#ffffff;
}

/* styles for the spans */
.last-next-post span{
display:block;
margin-bottom:8px;
border:0;
font-size:0.7em;
color:#666;
}

/* adds some margin below prev/next links */
.last-next-post .previous{
margin-bottom:1.5em;
}

/* hyperlinks styles for last-next-post */
.last-next-post a:link{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #ccc;
}

.last-next-post a:visited{
font-size:inherit;
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #999;
}

.last-next-post a:hover{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
border-bottom:solid 1px #000;
}

.last-next-post a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:400;
}

/* sets font sizes, link styles, etc in footer */
#footery p.dis-tag{
text-align:center;
font-size:0.8rem;
color:#1a1a1a;
font-weight:400;
margin:0 0 5px 0;
letter-spacing:1px;
}

#footery p.dis-tag a:link, p.dis-tag a:visited{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#1a1a1a;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#footery p.dis-tag a:hover, a:active{
font-size:inherit;	
text-decoration:none;
background:transparent;
color:#ccc;
font-weight:normal;
margin:0;
padding:0;
border:0;
}

#footery p.colophon{
text-align:center;
font-size:0.7rem;
color:#666;
margin:0 0 5px 0;
padding:0;
border:0;
}

/* video clip RESIZE styles... assumes user has very recent browser that supports this method */
/* works on aspect ratio of 16:9 (56.25) clips at 800 wide 450 high */
.video.resizer {
position:relative;
padding-bottom:56.25%;
height:0;
overflow:hidden;
}

.video.resizer iframe, .video.resizer object, .video.resizer embed {
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
margin:0;
}

/* styles for ALL HTML type FORMS, contact, search, comments */

button,
input[type="button"],
input[type="reset"],
input[type="submit"]{
background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%);
/* background-color:#666666; */
color:white;
padding:12px 20px;
border:none;
border-radius:4px;
cursor:pointer;
}

button:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover{
border-color: #ccc #bbb #aaa;
background:#999999;
}

button:active,
button:focus,
input[type="button"]:active,
input[type="button"]:focus,
input[type="reset"]:active,
input[type="reset"]:focus,
input[type="submit"]:active,
input[type="submit"]:focus{
border-color: #aaa #bbb #bbb;
}

input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
input[type="range"],
input[type="date"],
input[type="month"],
input[type="week"],
input[type="time"],
input[type="datetime"],
input[type="datetime-local"],
input[type="color"],
textarea{
width:100%; 
padding:12px;  
border:1px solid #ccc; 
background-color:#ededed;
border-radius:4px; 
box-sizing:border-box; 
margin-top:5px; 
margin-bottom:5px;
resize:vertical;
}

input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
input[type="tel"]:focus,
input[type="range"]:focus,
input[type="date"]:focus,
input[type="month"]:focus,
input[type="week"]:focus,
input[type="time"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="color"]:focus,
textarea:focus{
color:#111;
}

select{
border:1px solid #ccc;
}

textarea{
width:100%;
}

/* special search form style... adds some space below search button */
#search-container{
margin:0 0 35px 0;
padding:0;
border:0;
}

/* changes default lite grey placeholder text in HTML forms */
::placeholder{ 
/* Chrome, Firefox, Opera, Safari 10.1+ */
color:#333333;
opacity:1; /* Firefox */
}

:-ms-input-placeholder{ 
/* Internet Explorer 10-11 */
color:#333333;
}

::-ms-input-placeholder{ 
/* Microsoft Edge */
color:#333333;
}

/* mailchimp newsletter styles */
.mcbrandinglogo{
margin:30px 0 70px -10px;
}

#mce-EMAIL{
max-width:600px;	
}

/* accessibility stuff */

/* text meant only for screen readers ... */
.screen-reader-text{
border:0;
clip:rect(1px, 1px, 1px, 1px);
clip-path:inset(50%);
height:1px;
margin:-1px;
overflow:hidden;
padding:0;
position:absolute !important;
width:1px;
word-wrap:normal !important;
}

.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;
clip-path:none;
color:#21759b;
display:block;
font-size:0.875rem;
font-weight:700;
height:auto;
left:5px;
line-height:normal;
padding:15px 23px 14px;
text-decoration:none;
top:5px;
width:auto;
z-index:100000;
}

/* do not show the outline on the skip link target. */
#primary[tabindex="-1"]:focus{
outline:0;
}

/* alignments stuff */
.alignleft{

/*rtl:ignore*/
float:left;

/*rtl:ignore*/
margin-right:1.5em;
margin-bottom:1.5em;
}

.alignright{

/*rtl:ignore*/
float:right;

/*rtl:ignore*/
margin-left:1.5em;
margin-bottom:1.5em;
}

.aligncenter{
clear:both;
display:block;
margin-left:auto;
margin-right:auto;
margin-bottom:1.5em;
}