/*
Copyright 2017 Amazon.com, Inc. or its affiliates. All Rights Reserved.

Licensed under the Apache License, Version 2.0 (the "License"). You may not use this file except in compliance with the License. A copy of the License is located at

    http://aws.amazon.com/apache2.0/

or in the "license" file accompanying this file. This file is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
*/

/*

  Set CSS specific to the extension configuration view in this file.

*/

@import "accordion.css";

body {
	margin: 0;
}

.main {
	font: 12px arial, sans-serif;
	background-color: #030109;
	position: relative;
	margin: 0;
	height: 693px;
	overflow: hidden;
}

div {
	margin: 0px;
}

a {
		font-size: 18px;
		/* letter-spacing: 7px; */
}

.icon {
	width: 95%;
}

.sidebar {
	position: relative;
	display: inline-block;
	float: left;

	width: 7.5%;
	height: 100%;

	padding: 0.5rem 0;
	box-sizing: border-box;

	border-right: 1px solid rgba(255, 255, 255, 0.6);
	text-align: center;
}

.title-wrapper {
	position: absolute;
	top: 30%;
	left: 50%;
	transform: translate(-50%, 0);
}

.sidebar-title {
	transform-origin: center;
	transform: rotate(90deg);
	text-transform: uppercase;
	white-space: nowrap;

	color: #ECECEC;
	font-size: 24px;
	font-weight: 300;
	letter-spacing: 5px;
	line-height: 32px;
}

.sidebar-splash {
	position: absolute;
	bottom: 0%;
	left: 0;

	height: 397px;
	width: 233px;
}

.copy {
	width: 92%;
	height: 100%;
	position: relative;
	overflow-y: scroll;
	float: right;
}

.left, .right {
	display: inline-block;
	width: 50%;
	box-sizing: border-box;
	padding: 1.5rem 3rem 1.5rem 1.5rem;
}

.left {
	float: left;
}

.right {
	float: right;
}

.page-title {
	position: relative;
	/* padding-left: 1.5rem; */
	padding: 2rem 0 2rem 1.5rem;

	font-size: 42px;
	font-weight: 300;
	letter-spacing: 3px;
	line-height: 56px;
}

.page-title:after {
	content: '';
	position: absolute;
	bottom: 0;
	left: 1.5rem;
	/* box-sizing: border-box; */
	/* height: 0.19%; */
	width: 10.55%;
	border-top: 1px solid #979797;
}

.section-title {
	margin-bottom: 1.5rem;

	text-transform: uppercase;
	font-size: 24px;
	font-weight: 300;
	letter-spacing: 5px;
	line-height: 32px;
}

p {
	margin-bottom: 5rem;
	text-align: justify;

	font-family: "Helvetica Neue", sans-serif;
	font-size: 16px;
	font-weight: 300;
	letter-spacing: 1px;
	line-height: 24px;
}

.ui.accordion .title.question:not(.ui) {
	padding: 0.5em 0 0.5em 2rem;
	position: relative;
	text-transform: uppercase;

	color: #FFF;
	font-family: Exo;
	font-size: 18px;
	font-weight: 500;
	letter-spacing: 3px;
	line-height: 24px;
}

.ui.accordion .title.question:not(.ui) .icon {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(30%, -50%);
	transform-origin: center;
}

.ui.accordion .active.title.question:not(.ui) .icon {
	transform: translate(30%, -50%) rotate(90deg);
}

.ui.accordion .content.answer {
	padding: 0.5em 3em 1em;

	color: #FFF;
	text-align: justify;
	font-family: "Helvetica Neue", sans-serif;
	font-size: 16px;
	font-weight: 300;
	letter-spacing: 1px;
	line-height: 24px;
}

.config-path {
	position: absolute;
	bottom: 0px;
	right: 0px;
	transform: translate(0, 75%);

	height: 162px;
	width: 367px;

	opacity: 0.7;
	box-sizing: border-box;
	pointer-events: none;
}

.config-path.two {
	transform: translate(-16%, 50%) scale(1.3, 1.5);
	opacity: 0.5;
}

@media screen and (max-width: 1440px) {
	.left,
	.right {
		float: none;
		width: 100%;
	}
}

@media screen and (max-width: 1024px) {
	.config-path, .config-path.two {
		opacity: 0;
	}
}