#accordions {}

/*--------------------------------------------------------------------------------*/

#accordions > .accordion {
	position: relative;
	display: block;
	
	background-image: linear-gradient(to bottom, #000, #000);
	
	cursor:
			url("../../images/icons/contact-cursor.svg") 50 50,
			pointer;
}

/*--------------------------------------------------------------------------------*/

#accordions > .accordion > .background {
    position: absolute; top: 0; left: 0;
	height: 100%; width: 100%;
}
#accordions > .accordion > .background > .img,
#accordions > .accordion > .background > video {
	position: relative;
    display: block; height: 100%; width: 100%;
	
    pointer-events: none;
}
#accordions > .accordion > .background > .img {
	background-attachment: fixed;
	background-position: center;
	background-size: cover;
}
#accordions > .accordion > .background > video {
	object-fit: cover;
    object-position: center;
}
#accordions > .accordion > .background:after {
	content: '';
	position: absolute; top: 0; left: 0;
	display: block; height: 100%; width: 100%;
	
	background-color: #000;
	
	opacity: .3;
}

/*--------------------------------------------------------------------------------*/

#accordions > .accordion > .content-wrapper {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding-top: 100px;
	padding-bottom: 100px;
	
	text-align: center;
	color: #FFF;
	
	isolation: isolate;
}
@media (min-width: 900px)	 { #accordions > .accordion > .content-wrapper { min-height: 550px; } }
@media (max-width: 899.99px) { #accordions > .accordion > .content-wrapper { min-height: 400px; } }

/*--------------------------------------------------------------------------------*/

#accordions > .accordion > .content-wrapper > .header { font-family: 'Stretch Pro'; }
#accordions > .accordion > .content-wrapper > .header > .title { margin-bottom: 25px; }
#accordions > .accordion > .content-wrapper > .header > .hook {
	max-width: 550px;
	margin: 0 auto;
}
@media (min-width: 900px) {
	#accordions > .accordion > .content-wrapper > .header > .title { font-size: 24px; }
	#accordions > .accordion > .content-wrapper > .header > .hook { font-size: 40px; }
}
@media (max-width: 899.99px) {
	#accordions > .accordion > .content-wrapper > .header > .title { font-size: 20px; }
	#accordions > .accordion > .content-wrapper > .header > .hook { font-size: 30px; }
}

/*--------------------------------------------------------------------------------*/

#accordions > .accordion > .content-wrapper > .content { margin-top: 50px; }
#accordions > .accordion > .content-wrapper > .content > .description {
	max-width: 600px;
	margin: 0 auto 50px;
	
	line-height: 20px;
	font-size: 14px;
	font-weight: 500;
}
#accordions > .accordion > .content-wrapper > .content > .items {
	display: flex; max-width: 800px;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	row-gap: 10px;
	column-gap: 15px;
	margin: 0 auto;
}
#accordions > .accordion > .content-wrapper > .content > .items:not(:last-child) { margin-bottom: 50px; }
#accordions > .accordion > .content-wrapper > .content > .items > .item {
    position: relative;
	display: block; width: auto;
    padding: 15px 30px;
    
	background-color: #FFF;
    border-radius: 100px;
    border: solid 1px rgba(0,0,0,.3);
	
	color: #000;
    
    isolation: isolate;
}
#accordions > .accordion > .content-wrapper > .content > .items > .item > .container {
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 15px;
}
#accordions > .accordion > .content-wrapper > .content > .items > .item > .container > .icon {
	height: 20px; width: 20px;
}
#accordions > .accordion > .content-wrapper > .content > .items > .item > .container > .icon:empty {
	background-image: url("../../images/logo.png");
	background-position: center;
	background-size: contain;
	background-repeat: no-repeat;
}
#accordions > .accordion > .content-wrapper > .content > .items > .item > .container > .icon > img {
	height: 100%; width: 100%;
	
	object-fit: contain;
	object-position: center;
}
#accordions > .accordion > .content-wrapper > .content > .items > .item > .container > .label {
	white-space: nowrap;
    font-size: 14px;
    font-weight: 700;
    font-style: italic;
}
#accordions > .accordion > .content-wrapper > .content > .norms {
	display: flex; max-width: 800px;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	row-gap: 10px;
	column-gap: 15px;
	margin: 0 auto;
}
#accordions > .accordion > .content-wrapper > .content > .norms > .norm {
	display: block; height: 100px; width: 100px;
}
#accordions > .accordion > .content-wrapper > .content > .norms > .norm > img {
	height: 100%; width: 100%;
	
	object-fit: contain;
	object-position: center;
}