/*
Theme Name: Actuator 
Author: Port 80 Services
Author URI: https://port80.services/
Description: Customisations of Modules theme for Actuator Motors
Template: modules
Version: 1.0.0
Text Domain: p80_modules

*/

/*global, typography*/

#page {
max-width:1400px;
margin: auto;
width:100%}


#content h1,#content h2, #content h3, #content h4 {
color: #1B3668;
text-transform: uppercase;
letter-spacing: .4px}

#content h1.page-title {
padding-top: 40px;
font-size: 46px}

.page-template-template-centered #main {
background: none}

#content .page-header {
background: none}

#content .mod-title {
max-width: 850px}

#content *.qbtn, #content  input[type="submit"] {
box-shadow: none!important;
font-size: 16px;
background: #F58221}

#content .modheader-intro {
margin-top: 30px}

#content h2.page-tagline {
max-width: 700px;
margin: 5px auto 0;
text-transform: none;	
font-size: 120%;
opacity: 0.85;
font-family:Lato;
color: #484848}

#content table th {
color:#fff;
background: #1B3668}

#content table {
padding: 0}

#content table th {
color:#fff;
padding: 15px 5px;
background: #1B3668}

#content table td {
padding: 15px 5px}

@media (max-width: 600px){
#content table td, #content table th {
padding:  2px;
font-size: 70%}
	
}

/*nav*/

#site-navigation li a {
font-size: 15px;
letter-spacing: .5px}

#site-navigation li.current-menu-item a, #site-navigation li.current-page-ancestor a,#site-navigation li:hover a {
color: #1B3668}

#site-navigation li.current-menu-item a::after, #site-navigation li.current-page-ancestor a::after {
color: #F58221;
opacity: 1;
position: absolute;
bottom: 8px;
left: 15px;
right: 0;
content: "";
border-top: 2px solid}

/* language */
#site-navigation li.language-link {
border-left: 1px solid #1B3668 }

#site-navigation li.language-link a {
font-size: 18px }

#colophon .menu li.language-link {
margin-top: 15px }

#colophon .menu li.language-link:before {
display: block;
content: '';
border-bottom: 1px solid #F58221;
margin-bottom: 10px;
width: 35px; }


/*footer*/
#colophon .bottom-footer {
display: none}

#colophon img.foot-logo {
filter: brightness(800%) saturate(0);
max-width: 200px;
margin-bottom: 40px;
display: block}

#colophon h1.widget-title {
font-size: 20px}

#colophon h1.widget-title::after {
display: block;
content: "";
margin-top: 10px;
border-bottom:  1px solid #F58221}

#colophon .widg-layout2  {
box-sizing: border-box;
padding: 10px 30px}

#colophon .widg-layout2 a {
font-size: 15px;
text-decoration: underline;}

#colophon .widg-layout2 a:hover {
text-decoration: none}


/*slider mod*/

#content .type-slider ul.quadro-slides{
height: 70vh}

#content .type-slider ul.quadro-slides li::after{
position: absolute;
content: "";
display: block;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: #000;
opacity: 0.25;
z-index: 1;}

#content .type-slider .slide-content {
transform: none;
margin:0;
position: static}

#content .type-slider .slide-content h1{
color:#fff;
font-size:46px}

#content .type-slider .slide-content p{
color:#fff;
line-height: normal;	
max-width: 500px;
text-shadow: 1px 1px 1px rgba(0,0,0,.2), 0 0 10px rgba(0,0,0,.45);
width:100%;	
font-size:24px}

#content .type-slider .inner-slide{
display: flex;
flex-wrap: wrap;
padding: 0 10%;	
box-sizing:border-box;
justify-content:flex-start;	
align-content: center}

#content .type-slider li.align-right .inner-slide{
display: flex;
justify-content:flex-end}

#content .type-slider .slide-content .qbtn{
font-size: 18px;
letter-spacing: .8px;
padding: 20px 40px}

#content .type-slider .flex-control-nav a {
opacity: 1;
border-color:#fff;}

#content .type-slider .flex-direction-nav a {
color: #fff!important}

/*services mod*/

#content .type-services ul.quadro-services {
display: flex;
justify-content: center;
flex-wrap: wrap}

#content .type-services ul.quadro-services li{
float: none;
margin: 0 10px 20px;
width:320px;
outline: 1px solid transparent;
padding-bottom: 30px;
transition: .6s ease;
background: #fff}

#content #post-40.type-services ul.quadro-services li:hover{
outline: 1px solid #1B3668}

#content .type-services .service-content {
opacity: .9}

#content .type-services .service-content p{
background: #1B3668;
color:#fff;
margin-bottom: 10px;
padding: 5px}


#content .type-services .service-title a{
color: #1B3668}

#content .type-services img{
height: 230px;
object-fit: cover}

/*insight mod*/

#content .type-insights .insight{
padding: 40px 0}

#content .type-insights .insight-text {
text-align: left}

/*canvas mod*/

.home #content .type-canvas {
padding-top: 40px}

/*contact form*/

#content div.wpcf7 {
max-width: 600px;
margin: 0}
    
#content .wpcf7 input:not([type="submit"]),#content .wpcf7 textarea {
background: #fdfdfd;
border: 1px solid transparent;
transition: .4s}

#content .wpcf7 input:focus,#content .wpcf7 textarea:focus {
border-color: #1B3668;
background: #fff}

/*Single blog posts*/

.single-post #content .single-wrapper, .single-post #content .entry-content, .single-post #content .content-area {
max-width:1000px}

.single-post #content .entry-header {
aspect-ratio: 4/3;
display: flex;
align-items: center}

.single-post #content .entry-header .byline{
display: none}

.single-post #content h2{
font-size:26px;	
margin-bottom:40px}

.single-post #content .wp-block-image.flt-rt {
margin: 20px 0}

@media (min-width: 1024px) {
.single-post #content .entry-header {
aspect-ratio: 16/5}
	
.single-post #content h2{
font-size:36px}
	
.single-post #content .wp-block-image.flt-rt {
width: 50%;	
margin: 20px 0 20px 20px;
float: right}
}