/*
Theme Name:     OffSec Child Theme
Theme URI:      http://www.offsec.com/
Description:    OffSec child theme so I can customize functions.php
Author:         DigiP
Author URI:     http://www.offsec.com/
Template:       OffSec
Version:        1.0
*/

/* Place all your CSS modifications below */

html {
scroll-behavior: smooth;
}

#meta :target {
line-height:305px;
margin-bottom:-305px !important;
display:inline-block;
margin-top:-250px;
position:relative;
}

#meta .toc {
	min-height: auto !important;
}

#faqs {
scroll-snap-type: mandatory;
scroll-snap-type: y mandatory;
scroll-behavior: smooth;
}

#faqs .is-active {
background-color: #F2F2F2;
scroll-behavior: smooth;
min-height: 250px;
scroll-snap-stop: always;
scroll-snap-align: center;
scroll-padding: 0px;
display:block;
}

#faqs .is-active .accordion-content, #faqs .is-active > .accordion-title {
margin-top:20px;
padding:50px 30px 30px 30px;
display:block;
}

#faqs .is-active > .accordion-title {
position:relative;
top: 30px;
}

#faqs, .accordion-item, .accordion-item .is-active {
transition: all 2s ease;
}

/* overrides for OneTrust css */
#optanon,#optanon *,#optanon div,#optanon span,#optanon ul,#optanon li,#optanon a,#optanon p,.optanon-alert-box-wrapper *{ 
font-family: 'Open Sans', Arial, sans-serif !important;
}

.optanon-alert-box-wrapper {
background: #f2f2f2 !important;
}

/* Tweak button styling - DigiP 01/15/2021 */
.button {
border-radius: 22px;
padding: 14px 21px;
text-transform: none;
}

.button.hollow {
border-width: 2px;
}
.button.hollow:hover {
background: #a90c1c;
color: #fff;
border: solid #ae091a 2px;
}

::selection {
background: #a90c1c;
color: #fff;
}

::-moz-selection {
background: #a90c1c;
color: #fff;
}

.button.hollow.white {
 border: 2px solid #fff;
    color: #fff;
}

.button.hollow.oscp {
 border: 2px solid #e85f00;
	color: #e85f00;
}

.button.hollow.oscp:hover {
	background: #e85f00;
	border: 2px solid #fff;
	color: #fff;
}

	p, ul li, ol li {
		font-size:16px;
	}

@media only screen and (max-width: 1681px) {

	p, ul li, ol li {
		font-size:15px;
	}
	
	.h1, h1 {
		font-size:45px;
	}
	
	h2, .h2 {
		font-size:35px;
	}
	
	h3 {
		font-size: 26px;
	}
	
	.button.small, .button.hollow.small {
		font-size:15px;
	}
}


@media print, screen and (min-width: 64em) {
	.grid-padding-x > .cell {
		padding-right: 1.25rem;
		padding-left: 1.25rem;
	}
}

@media print, screen and (min-width: 45em) {
	.grid-padding-x > .cell {
		padding-right: 1.0125rem;
		padding-left: 1.0125rem;
	}
}

h1, .h1 {
	font-weight:700;
}

.h4, .h5, .h6 {
	text-transform: none;
}

.top-bar, .sticky-container {
width: 100% !important;	
}

[data-sticky] {
  width: 100% !important;	
}

thead, tbody, tfoot {
	border: none;
}


.alert-box.info {
    background-color: #a90c1c;
    border-color: #a90f1c;
    color: #eee;

}

.alert-box.radius {
    border-radius: 3px;
}

.alert-box {
    border-style: solid;
    border-width: 1px;
	display:table;
    font-size: 0.72222rem;
    font-weight: normal;
    margin-bottom: 1.11111rem;
    padding: 0.77778rem 1.33333rem 0.77778rem 0.77778rem;
    position: relative;
    transition: opacity 300ms ease-out;
    background-color: #008CBA;
    border-color: #0078a0;
    color: #FFFFFF;
}


.menu.super-menu a {
text-transform: none;
letter-spacing: 0.017em
}

/*
body::-webkit-scrollbar { 
	width: 14px;
	border-radius: 10px;
}
body::-webkit-scrollbar-track {
background: #a7a7a7;
background: #e2e2e2;
border-radius: 10px;
background-clip: content-box; 
border: 4px solid transparent;
}

body::-webkit-scrollbar-thumb {
background: #920615;
border-radius: 10px;
box-shadow: inset 0 0 3px rgba(0,0,0,0.5); 
min-height:100px;
}

body::-webkit-scrollbar-thumb:hover {
background: #a90c1c;
}
*/

/* black topbar vs red */
.top-bar, .top-bar ul {
    background-color: #A90C1C;
	background-color: #000;
}



/* black scroll bar */
body::-webkit-scrollbar { 
	width: 16px;
	border-radius: 2px;
}


body::-webkit-scrollbar-track {
background: #a7a7a7;
background: #e2e2e2;
border-radius: 6px;
background-clip: content-box; 
border: 4px solid transparent;
width: 16px;
}



body::-webkit-scrollbar-thumb {
width: 14px;
background: #000;
border-radius: 6px;
box-shadow: inset 0 0 3px rgba(0,0,0,0.5);
min-height:100px;
}

body::-webkit-scrollbar-thumb:hover {
background: #111;
}

/*
body::-webkit-scrollbar, body::-webkit-scrollbar-track, body::-webkit-scrollbar-thumb { 
visibility: hidden;
transition: all 0.5s;
}

body::-webkit-scrollbar:hover, body::-webkit-scrollbar-track:hover, body::-webkit-scrollbar-thumb:hover { 
visibility: visible;
transition: all 0.5s;
}
*/


.listing {
text-align: center; font-size:14px; color: #444;
}

blockquote.small-quote, blockquote.small-quote p {
	margin-bottom: initial;
	font-size:1.1rem;
	font-weight: 400;
	color: #444;
}
.content-block.quote .medium, .content-block.quote blockquote.medium-quote p, .content-block.quote-slider-container .medium, .content-block.quote-slider-container blockquote.medium-quote p {
	font-size:1.2rem;
	color: #444;
}

blockquote.small-quote, .content-block.quote .medium, content-block.quote blockquote.medium-quote, .content-block.quote-slider-container .medium, .content-block.quote-slider-container blockquote.medium-quote {
margin: 25px auto 40px auto;
color: #444;
}

blockquote {
position: relative;
border-left: solid #ccc 1px !important; 
max-width:800px; 
margin: 25px auto 40px auto;
padding: 40px;
background: #fafafa;
border-radius: 33px;
box-shadow: 5px 3px 2px #ddd;
color: #444;
}

blockquote p {
font-size:1.2rem;
line-height: normal;
color: #444;
font-weight: 600;
font-style: oblique;
margin-bottom: initial;
text-align:center;
}

blockquote::before {
content: "";
width: 33px;
height: 33px;
position: absolute;
background: #fafafa;
right: 15%;
bottom: -14px;
transform: rotate(45deg);
box-shadow: 5px 3px 2px #ddd;
border-bottom-right-radius: 8px;
}

blockquote cite {
font-size:14px;
font-style: normal;
clear: both;
text-align: right;
padding: 10px;
color: #555;
}

.footer {
margin-top: 0px !important;
}

.border-shadow {
border-radius: 6px; border: solid #000 2px; box-shadow: 2px 2px 0px #000;
}