
/*-------gray-box-sseioon--------*/

.gray-box-row {
	position: relative;
	display: block;
	width: 100%;
}
.gray-box-row > .row {
	--bs-gutter-x: 20px;
	--bs-gutter-y: 20px;
}
.gray-box {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	background-color: var(--sk-light);
	padding: 50px 50px 15px;
	align-items: center;
	text-align: center;
}
.gray-box p {
	max-width: 368px;
	margin-left: auto;
	margin-right: auto;
}
.gray-box-logo {
	position: relative;
	display: flex;
	margin-bottom: 15px;
}
.gray-box-logo img {
	max-height: 75px;
	width: auto;
}
.input-form-outer {
	position: relative;
	display: flex;
	width: 100%;
	max-width: 368px;
	margin-left: auto;
	margin-right: auto;
}
.input-form-outer input {
	position: relative;
	display: flex;
	background-color: var(--sk-white);
    border: 1px solid #d8d8d8;
    border-radius: 0;
    display: block;
    flex-grow: 1;
    flex-shrink: 1;
    line-height: 1;
    padding: 11px 20px;
    color: var(--sk-text);
    font-size: 16px;
    height: auto;
    max-width: unset;
    font-weight: 400;
    width: 100%;
}
.input-form-outer button {
	align-items: center;
    aspect-ratio: 1 / 1;
    background-color: var(--sk-orange);
    display: flex;
    flex-grow: 0;
    flex-shrink: 0;
    height: calc(40px + 1em);
    justify-content: center;
    margin-top: 0;
    position: relative;
    cursor: pointer;
    gap: 1rem;
    padding: .75rem 1.2rem;
    transition-duration: 0.4s;
    transition-property: color, background-color;
    transition-timing-function: ease-in-out;
    padding: 0;
    border: none;
    outline: none;
    box-shadow: none;
}
.input-form-outer button:hover {
	background-color: var(--sk-orange-hover);
}

@media (max-width: 991px) {
	.gray-box {
	    padding: 50px 30px 15px;
	}
}