/*
Theme Name: SENDA
Version: 1.0
Description: WordPress theme for SENDA
Author: INSPIRE
Author URI: https://inspiredm.co.uk
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: senda

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.
*/

/*** General ***/
* { padding: 0px; margin: 0px; }
html, body { height: 100% }
html { scroll-behavior: smooth; }
body { font-family: 'Proxima Nova', sans-serif; font-size: 20px; color:#000; margin:0; font-weight:400; background: #f7f5f0; }
.inwrap { width: 100%; display: flex; flex-direction: column; min-height: 100%}
.contentwrap { width: 100%; float:left; min-height: 80vh }
.clear { clear: both; display: block; }
a, a:link, a:active, div a { text-decoration:none; }
a img {border:none }
@font-face { font-family: 'Proxima Nova'; src: url('fonts/proximanova-light.woff2') format('woff2'); font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: 'Proxima Nova'; src: url('fonts/proximanova-regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'Proxima Nova'; src: url('fonts/proximanova-semibold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'Proxima Nova'; src: url('fonts/proximanova-bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Proxima Nova'; src: url('fonts/proximanova-extrabold.woff2') format('woff2'); font-weight: 900; font-style: normal; font-display: swap; }

.alignleft { float: left }
.alignwide { width: 80%; margin: 0 auto }

/*** Header ***/
.header { margin: 0 auto; width:98%; float:left; position:relative; padding: 0 1%; background: linear-gradient(to right,  rgba(120,208,229,1) 0%,rgba(46,49,146,1) 100%); }
.header .logonavwrapper { display: flex; align-items: center; justify-content: space-between; width: 100% }
.header .logonavwrapper .logo { position: relative; z-index: 10000; transition: all 0.4s ease-in-out 0s }
.header .logonavwrapper .logo img { display:block; margin: 0 auto; text-align:center; width:100%; height:auto}
.header .description { font-size: 2.5em; font-weight: 300; text-transform: uppercase; margin: -1% 0 0 -.175%; color: #fff; z-index: 10}
.stick { position: fixed; top: 0; background: linear-gradient(to right,  rgba(120,208,229,1) 0%,rgba(46,49,146,1) 100%); width:98%; z-index: 1000; box-shadow: 0 5px 10px rgba(0,0,0,0.1)}
.stick .logo { width: 15% !important; max-width: 150px; transition: all 1s ease-in-out 0s}

/*** Intro Video Modal ***/
.introvideo button.kb-btn-global-custom { height: 150px; width: 150px; border: none; position: absolute; right: 0; bottom: 0; }
.introvideo button.kb-btn-global-custom::before { content: ""; position: absolute; inset: 0; background: url('images/video-intro.png') no-repeat center; background-size: cover; animation: spin 6s linear infinite; }
.introvideo button.kb-btn-global-custom::after { content: ""; position: absolute; inset: 0; background: url('images/play.svg') no-repeat center; background-size: 40px; left: 10px }

@keyframes spin {
  from { transform: rotate(360deg); }
  to   { transform: rotate(0deg); }
}

/*** Mobile Menu ***/
.mobile-toggle-wrapper { display: flex; align-items: center }
.menu-toggle-label span.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; white-space: nowrap; }
.mobile { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; overflow-y: auto; transition: transform 0.3s ease; transform: translateX(-100%); display: flex; justify-content: center; align-items: center; font-size: 1.5em; }
.mobile.active { transform: translateX(0); background: linear-gradient(to right,  rgba(120,208,229,1) 0%,rgba(46,49,146,1) 100%); }
.menu-toggle { display: none; }
.menu-toggle-label { position: fixed; right: 20px; width: 45px; height: 25px; cursor: pointer; z-index: 100000; }
.menu-toggle-label span { display: block; width: 100%; height: 2px; margin-bottom: 10px; background: #fff; transition: transform 0.3s, opacity 0.3s; }
.menu-toggle-label span:last-child { margin-bottom: 0; }
.menu-toggle:checked + .menu-toggle-label span:nth-child(2) { transform: translateY(12.5px) rotate(45deg); }
.menu-toggle:checked + .menu-toggle-label span:nth-child(3) { opacity: 0; }
.menu-toggle:checked + .menu-toggle-label span:nth-child(4) { transform: translateY(-12.5px) rotate(-45deg); }
ul#mobile-menu-list { list-style: none; font-size: 1.25em; text-align: center; text-transform: uppercase; font-weight: 600 }
ul#mobile-menu-list li { margin: 0.5em 0; }
ul#mobile-menu-list li a { color: #fff; transition: color 0.3s ease; font-weight: 300; letter-spacing: 5% }
ul#mobile-menu-list li a:hover { color: #fff; font-weight: 600 }

/*** Content Home ***/
.contenthome { width: 100%; margin: 0 auto; display: flex; flex-direction: column}

/*** Content ***/
.page { float:left; width:100%; }
.page .postHead { background: none; }
.postContent { margin: 0 auto; width: 80%; }
.postContent a { color: #3d3938; text-decoration:underline }
.postContent h1 { font-size: 2.5em; font-weight: 400; margin:0.5em 0 ; text-transform: uppercase; letter-spacing: 0.05em}
.postContent h2, .contenthome h2 { font-size: 2em; font-weight: 400; margin:0.5em 0 ; line-height: 130%; h}
.postContent h3, .contenthome h3 { font-size: 1.75em; font-weight: 400; margin: 1em 0; line-height:110%; }
.postContent h4, .contenthome h4 { font-size: 1.5em; font-weight: 400; margin: 1em 0; }
.postContent h5, .contenthome h5 { font-size: 1.2em; margin: 1em 0; line-height:135%; }
.postContent h6, .contenthome h6 { font-size: 1.1em; margin: 1em 0; line-height:130%; }
.postContent p, .contenthome p { font-size: 1em; margin: 1em 0 ; line-height:160%; }
.postContent p sup, .postContent p sub { font-size: 0.5em; }
.postContent ul { margin: 5px 0px 5px 0; }
.postContent ul li { line-height: 140%; padding: 0.25em 0; margin: 0 1em }
.postContent ul li.kb-query-item { margin: 0 }
.postContent ol li { padding:0.25em 0; line-height: 140%}
.postContent ol { margin: 5px 0px 5px 22px; }
blockquote { font-weight:normal; position: relative; margin: 1em 0; padding: 2em 0 }
blockquote::before { content: ""; background: url("images/Quotes_Red.svg") no-repeat 0 0 / contain; position: absolute; inset: 0 auto auto 0; width: 100px; height: 25px; margin-bottom: 1em }
blockquote::after { content: ""; background: url("images/Quotes_Blue.svg") no-repeat 0 0 / contain; position: absolute; inset: auto auto 0 0; width: 100px; height: 25px; }
blockquote p { font-size: 1.25em; }
blockquote cite { font-size: 1em; font-weight: 600; font-style: normal}
.postContent hr { width:100%; margin: 5px 0 15px; border-top: 1px solid #000; float:left; border-bottom:none; border-left:none; border-right:none }
.postContent img { max-width: 100%; height:auto }
.postContent table { width: 100%; border-collapse:collapse; margin: 0 0 1% }
.postContent table th { border: 1px solid rgba(61, 64, 91,1); background: rgba(61, 64, 91,0.3); padding: 0.5%; }
.postContent table td { vertical-align:top; padding: 0.5%; border: 1px solid rgba(61, 64, 91,1) }
.postContent a.post-edit-link { margin: 2% 0; clear:both}
.headerimage { width:100%; float:right; margin: 0 0 25vw; background-size: cover; background-position: center; background-repeat: no-repeat; height: 30vw; position: fixed; display: flex; align-items: center; justify-content: center}
.headerimage h1 { text-align: center; font-size: 6em; color: #fff; text-transform: uppercase; font-weight: 700}

/*** Specials ***/
.postContent .wp-caption { background: #f8f7eb; border: solid 1px #EBE9D7; text-align: center; padding-bottom: 4px; }
.postContent .wp-caption img { border: solid 5px #f8f7eb; }
.postContent .wp-caption p { margin: 0px; }
.alignfull { margin: 0 calc(50% - 50vw); max-width: 100vw; width: 100vw; }

/*** Comments ***/
p.segment-title{ padding:10px 0 0 }
#comments-wrap{ float:left;display:inline; width:100% }
.gravatar{ border: none; float: left; }
ol#comments{ margin: 0; }
ol#comments li{ margin-bottom: 10px; list-style:none; display:block;}
ol#comments li:after, p.comment-entry:after{ content: "."; display: block; clear: both; height: 0; visibility: hidden; }
.comment-wrap{ float: left; }
.comment-wrap p { margin: 0; }
.comment-meta { padding: 10px 10px 0 10px; }
.comment-text { padding: 10px 10px 10px 10px; font-size: 11px; }

/*** Newsroom ***/
.newsroom { display: flex; flex-wrap: wrap; gap: 2%; row-gap: 2em; padding: 0 10%; width: 80% }
.catpost { flex: 0 0 calc(33.3333% - 2%); box-sizing: border-box; }
.catpostimage { background-size: cover; background-position: center; background-repeat: no-repeat; width: 100%; height: 250px; }
.catpostimage a { display: block; width: 100%; height: 100%; }
.catpost h2 { font-size: 1.25em; font-weight: 400; margin: 1em 0; line-height:110%; }
.catpost h2 a { color: #2E3192 }
.catpost p { margin: 2em 0 0; display: inline-block; font-size: 0.8em; font-weight: 600; text-transform: uppercase }

/*** Navigation ***/
.blogNavigation { margin: 10px 0; font-size: 12px; float:left; }
.blogNavigation a { color: #fff; text-decoration:underline }
.blogNavigation .alignleft { width: 200px; float: left; }
.blogNavigation .alignright { width: 230px; float: right; text-align: right; }

/*** Kajabi Forms ***/
.page .kajabi-form--inline { padding-block: 0 }
.page #kajabi-form .kajabi-form__content { max-width: 1000px }
.page #kajabi-form fieldset input { width: 27.75%; float: left; margin: 0 1%; background: #fff }
.page #kajabi-form .kajabi-form__form-item { margin-block-end: 0}
.page button.kajabi-form__btn { transform: translateX(425px) translateY(10px); width: 150px; }
body.page-id-58 #kajabi-form fieldset input { width: 90%; border: 1px solid rgba(0,0,0,0.5); margin: 0.5em 0}
body.page-id-58 button.kajabi-form__btn { transform: none; }
body.page-id-58 .kajabi-form--inline { padding-inline: 0 }

/*** Footer ***/
.footer { width: 100%; height:auto; margin: 0 auto; clear:both; line-height:140%; float:left; background: #4877bb; color: #fff; padding: 0 0 1em 0 }
.footer .fleft, .footer .fright { width: 50%; float: left }
.footer .sidebarItem { margin: 2% 0; padding: 0 30px 0 0}
.footer .copyright { font-size: 0.75em; margin: 0 0 0 30px }

/*** Footer Navigation ***/
.footer ul#footer-menu { margin: 2% 0 10% ; width: 100%; display: flex; justify-content: flex-start; list-style: none; padding: 0 0 0 30px}
.footer ul#footer-menu li a { color: #fff; white-space: nowrap }
.footer ul#footer-menu li a::after { content: "|"; padding: 0 20px; }
.footer ul#footer-menu li:last-child a::after{ content: ""; }

/* -- Media Queries -- */

@media only screen and (min-width : 601px) and (max-width : 900px) {
.header .logo { margin: 1% 38% ; width:24%; }
.contenthome h2 { font-size: 1.5em; }
}

@media only screen and (max-width : 600px) {
.header .logo { width:40% !important; margin: 5% 2% !important }
.header .logo img, .headerhome .logo img { width:100%; margin: 1% 0 }
.headerimage h1 { font-size: 2em; }
.contenthome h2 { font-size: 1.5em; }
.contenthome h3 { font-size: 1.25em; }
.postContent { padding: 1% 5% }
.content, .sidebar { width: 100%; float:left }
.headimage { width:100%; margin: 0 0 1% 0 }
.kadence-blocks-gallery-item__caption { display: none }
.sidebarhome .sidebarItem { width:97%; text-align: center }
.footer .fright { width: 100%; text-align: center }
ul#mobile-menu-list { font-size: 0.9em }
.alignwide { width: 100%}
.page #kajabi-form fieldset input { width: 90%; float: inherit; margin: inherit }
.page button.kajabi-form__btn { transform: inherit; width: inherit; }
.page #kajabi-form .kajabi-form__form-item { margin-block-end: 10px }
.page #kajabi-form .kajabi-form__content { max-width: 350px }
.page .kajabi-form--inline { padding-inline: 0 }
}