/*
Theme Name: TreadReader
Theme URI: https://antidesign.com.br
Author: AntiDesign
Author URI: https://antidesign.com.br
Version: 1.1
License: http://www.opensource.org/licenses/mit-license.php.
Tags: Responsive, grid, mobile, framework, bare-bones, white, minimal

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.
*/

/* Table of Contents
==================================================
    #Base 960 Grid
    #Tablet (Portrait)
    #Mobile (Portrait)
    #Mobile (Landscape)
    #Clearing */

:root{
	--tread-reader-white:#ffffff;
	--tread-reader-gray:#e8e8e8;
	--tread-reader-black:#414141;
	--tread-reader-blue:#0067a3;
	--tread-reader-orange:#ff9300;
}

.mansory {
	display:flex;
	flex-wrap:wrap;
	gap: 20px 20px;
	justify-content: space-between;
}
.newsarticle {
	width:calc( 33% - 20px );
}
.wpcf7-list-item {
	padding: 0 15px 0 0;
}
.wpcf7-list-item-label {
	font-size:1.5em;
	line-height:2.25em;
}
@media only screen and (max-width: 800px) {
	.newsarticle {
		width:100%;
	}
}

#header{
	z-index:11 !important;
}

#region-popup{
	position: fixed;
    z-index: 12;
    top: 0;
	width: 100vw;
	height: 100vh;
	overflow-y: scroll;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: rgba(255,255,255,0.9);
}

#region-popup .region-modal{
	width:83%;
	max-width: 760px;
	display: flex;
	flex-flow: column;
	align-items: center;
	row-gap:1.5rem;
	padding:2rem;
	background-color: var(--tread-reader-white);
	box-shadow: -3px 5px 15px rgba(0, 0, 0, 0.3);
}

#region-popup .region-modal .logo-wrap{
	min-width: 200px;
	width: 200px;
	height:auto;
}

#region-popup #region-text{
	font-size: 1.125rem;
	max-width: 420px;
	margin:0;
}
#region-popup #accept-region{
	display: flex;
	height: 70px;
	justify-content: center;
	align-items: center;
	background-color: var(--tread-reader-blue);
	color: var(--tread-reader-white);
	border:3px solid var(--tread-reader-blue);
	padding:0 2rem;
	cursor:pointer;
}

#region-popup #accept-region:hover,
#region-popup #accept-region:focus{
	background-color: transparent;
	color: var(--tread-reader-blue);
}

#region-popup #region-list{
	list-style: none;
	border:1px solid var(--tread-reader-black);
	padding:0;
	margin:0;
}

#region-popup #region-list.toggled-on > li:first-child{
	border-bottom: 1px solid var(--tread-reader-black);
}

#region-popup #region-list li{
	margin:0;
	cursor:pointer;
}

#region-popup #region-list li a{
	padding:1rem 1.5rem;
	display: block;
}

#region-popup #region-list li:hover,
#region-popup #region-list li:focus{
	background-color: var(--tread-reader-blue);
}

#region-popup #region-list li:hover p,
#region-popup #region-list li:focus p,
#region-popup #region-list li:hover a,
#region-popup #region-list li:focus a,
#region-popup #region-list li:hover .dropdown-symbol,
#region-popup #region-list li:focus .dropdown-symbol{
	color: var(--tread-reader-white);
}

#region-popup #region-list > li:first-child{
	display: flex;
	flex-flow:row;
	align-items: center;
	column-gap: 0.5rem;
	padding:1rem 1.5rem;
}
#region-popup #region-list > li:first-child p{
	margin:0;
}

#region-popup #region-list .dropdown-toggle{
	border:none;
	background: transparent;
}

#region-popup #region-list > li:first-child:focus {
    outline: 2px solid #000;
}

#region-popup #region-list > li:not(:first-child) a:focus{
	outline: 2px solid blue;
}

.manuals-page .page-content{
	display: grid;
	grid-template-columns: 8.3% 83.4% 8.3%;
	grid-template-rows: auto auto;
	padding-top: 0;
}

.manuals-page .page-content > .container{
	grid-column: 2 / 3;
	grid-row: 1 / 2;
}
.manuals-page .manuals-wrapper{
	grid-column: 2 / 3;
	grid-row: 2 / 3;
	-moz-box-shadow: 0 4px 50px 0 rgb(0 0 0 / .3);
	-webkit-box-shadow: 0 4px 50px 0 rgb(0 0 0 / .3);
	box-shadow: 0 4px 50px 0 rgb(0 0 0 / .3);
	width:100%;
	max-width: 1260px;
	justify-self: center;
}

.manuals-page .manuals-wrapper ul{
	list-style: none;
	padding:0;
}

.manuals-page .manuals-wrapper button{
	border-radius: 0;
}

.manuals-page .manuals-wrapper .media-navigation{
	background-color: var(--tread-reader-blue);
}

.manuals-page .manuals-wrapper .media-navigation ul{
	display: flex;
	flex-flow: column;
	margin: 0;
}

@media screen and (min-width:800px){
	.manuals-page .manuals-wrapper .media-navigation ul{
		flex-flow:row;
	}
}

.manuals-page .manuals-wrapper .media-navigation li{
	display: flex;
	margin:0;
}

.manuals-page .manuals-wrapper .media-navigation li button{
	flex:1;
	text-align: left;
	background-color: var(--tread-reader-blue);
	color: var(--tread-reader-white);
	border:0;
	padding:1.5rem;
	transition: background-color 0.3s;
}

.manuals-page .manuals-wrapper .media-navigation li button.selected,
.manuals-page .manuals-wrapper .media-navigation li button:hover,
.manuals-page .manuals-wrapper .media-navigation li button:active,
.manuals-page .manuals-wrapper .media-navigation li button:focus{
	background-color: var(--tread-reader-orange);
}

.manuals-page .manuals-wrapper .subcat-nav{
	background-color: var(--tread-reader-gray);
	padding:0.5rem 1rem;
}

.manuals-page .manuals-wrapper .subcat-nav ul{
	display: flex;
	flex-flow: column;
	margin-bottom: 0;
}

@media screen and (min-width:800px){
	.manuals-page .manuals-wrapper .subcat-nav ul{
		flex-flow:row;
	}
}

.manuals-page .manuals-wrapper .subcat-nav li{
	display: flex;
	margin-bottom: 0;
}

.manuals-page .manuals-wrapper .subcat-nav button{
	flex:1;
	background-color: transparent;
	border:0;
	padding:1rem;
	transition: background-color 0.3s;
	text-align: left;
}


.manuals-page .manuals-wrapper .subcat-nav button.selected,
.manuals-page .manuals-wrapper .subcat-nav button:hover,
.manuals-page .manuals-wrapper .subcat-nav button:active,
.manuals-page .manuals-wrapper .subcat-nav button:focus{
	background-color: var(--tread-reader-black);
	color:var(--tread-reader-white);
}

.manuals-page .media-display{
	transition: height 0.3s ease-out;
	padding:2rem 10%;
}

@media screen and (min-width:1200px){
	.manuals-page .media-display{
		padding:3.5rem 10%;
	}
}

.manuals-page .media-display > ul{
	margin:0;
}

.manuals-page .media-display > ul li{
	display:flex;
	flex-flow: row;
	align-items: center;
	justify-content: space-between;
	padding:1rem;
	margin:0;
	column-gap: 1rem;
}
.manuals-page .media-display > ul li:nth-child(odd){
	background-color: #eeeeee;
}
.manuals-page .media-display > ul .manual-name{
	overflow-wrap: anywhere;
}

.manuals-page .media-display > ul li a{
	background-color: var(--tread-reader-blue);
	
	padding:0.5rem;
	cursor: pointer;
}

.manuals-page .media-display > ul li a:hover,
.manuals-page .media-display > ul li a:active,
.manuals-page .media-display > ul li a:focus{
	background-color: var(--tread-reader-orange);
}

.manuals-page .media-display > ul li button{
	border:0;
	background-color: transparent;
	color:var(--tread-reader-white);
}