//	=================
//    	Imports
//	=================

@import '../../../base/color_variables';   	// Color Variables
@import '../../../base/fonticons';   			// Fonticons Variables
@import '../../../base/urls';   				// URLS Variables
@import '../../../base/utilities_variables';  // Utilities Variables


/*-----------------------------------*\
  $RESET
\*-----------------------------------*/
input {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	color: inherit;
}
select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	color: inherit;
}
button {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	color: inherit;
}
textarea {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	font: inherit;
	color: inherit;
}
/*-----------------------------------*\
  $OBJECTS
\*-----------------------------------*/
.butt {
	padding: .75rem;
	margin: .375rem;
	background-color: $color_none;
	border-radius: $br-4;
	border: $b-width-2 $solid $color_455;
	line-height: 1.375;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	font-weight: 700;
	color: $color_455;
	cursor: pointer;
	&:focus {
		outline: none;
	}
}
.input {
	padding: .75rem;
	margin: .375rem;
	background-color: $color_none;
	border-radius: $br-4;
	border: $b-width-1 $solid $color_456;
	border-radius: $br-4;
	&:focus {
		outline: none;
	}
}
.butt--primary {
	background-color: $color_455;
	color: $white;
}
.input--dropdown {
	background-image: $url_20;
	background-image: $url_21, none;
	background-repeat: no-repeat;
	background-size: 1.5rem 1rem;
	background-position: right center;
}
/*-----------------------------------*\
  $LAYOUT
\*-----------------------------------*/
.wrap {
	max-width: 100%;
	margin: $m-0 auto;
	text-align: $align-center;
}
.mega {
	font-size: 4rem;
}
#animationSandbox {
	display: block;
}
.island {
	padding: 1.5rem;
}
.isle {
	padding: .75rem;
}
.spit {
	padding: .375rem;
}
/*-----------------------------------*\
  $HEADER
\*-----------------------------------*/
.site__header {
	-webkit-animation: bounceInUp 1s;
}
.site__title {
	color: $color_455;
	background-image: linear-gradient(92deg,#f35626,#feab3a);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}
.site__content {
	-webkit-animation: bounceInUp 1s;
	-webkit-animation-delay: .1s;
	form {
		-webkit-animation: bounceInUp 1s;
		-webkit-animation-delay: .1s;
	}
}
@media screen and (max-width: 991px) {
	.island {
		padding: 0.5rem;
	}
	.mega {
		font-size: 2rem;
	}
	h2 {
		font-size: 18px;
	}
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
	.mega {
		font-size: 3rem;
	}
}