@import "../../_base.scss"

.section {
	width: 100%;
	font-size: $font-size;
		
	&.active {
		ul {
			height: 0;
			opacity: 0;
		}

		svg {
			transform: rotate(180deg);
		}
	}

	.header {
		height: 2%;
		width: 98%;
		display: flex;
		flex-direction: row;
		align-items: center;
		cursor: pointer;
		margin: 0;
		margin-left: 1%;
		padding-top: 1%;
		font-weight: bold;
	}

	ul {
		height: 100%;
		margin: 0;
		overflow: hidden;
		opacity: 1;
		transition: 0.4s ease;
	}

	li {
		list-style-type: none;
		cursor: pointer;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
			
		img {
			height: $icon-size;
			aspect-ratio: 1;
		}
		
		p {
			margin: 0;
		}
	}

	svg {
		transition: 0.4s ease;
	}

	.contact {
		list-style-type: none;
		margin: 0 auto;
		text-align: left;
		cursor: pointer
	}
}