@charset "UTF-8";
/* CSS Document */


 @font-face {
    font-family: 'Gabriola';
    font-style: normal;
    font-weight: normal;
    src: local('Gabriola'), url('gabriola Font Download.woff') format('woff');
    }

    @font-face {
    font-family: 'Miama';
    font-style: normal;
    font-weight: normal;
    src: local('Miama'), url('Miama.woff') format('woff');
    }

body{height: 100%;}

.bg-container{
	background-color: #fff;
	height: 100%;
	width: 100%;
	background-image: linear-gradient(60deg, #ff6596, #60bef8, #d88cff);
	background-size: 500% 500%;
	animation: bgAnimatedGradient 15s infinite linear;
	background-attachment: fixed;
	
}

@keyframes bgAnimatedGradient{
	0%{
		background-position: 0 85%;
	}
	50%{background-position: 100% 20%}
	100%{background-position: 0% 85%;}
}

header{
	align-content: center;
	color: #000000;
	font-size: 7em;
	padding: .7em;
	font-family: 'Miama';
	
}


.intro-text p {background-color:#46A4DB; background:contain; word-wrap: normal; opacity: 57%;
	font-family: 'Gabriola';
	font-size: 3em;
	line-height: 50px;
		padding: 1em; 
	
	
}

.fare{
	background-color:#46A4DB; background:contain; word-wrap: normal; opacity: 57%;
	font-family: 'Gabriola';
	font-size: 3em;
	line-height: 50px;
		padding: 1em; 
}

.miles{
	background-color:#46A4DB; background:contain; word-wrap: normal; opacity: 57%;
	font-family: 'Gabriola';
	font-size: 3em;
	line-height: 50px;
		padding: 1em; 
}



form{
	
	font-family: 'Gabriola';
	line-height: 4em;
	padding: 5em;
	 border-radius: 1em;
}

input[type=submit]{background-color: #C49A6C; font-family: 'Gabriola';font-size: 2em; border-radius: 1em; box-sizing: border-box; border: 1 #6A6A6A; border-top: inset; opacity: 75%;}


input[type=text]{
	width: 50%; height: 4em; box-sizing: border-box; border: 2 #6A6A6A; border-top: inset; background-color: #91DDCA; border-color: aquamarine; border-radius: 1em; opacity: 50%; font-family:'Gabriola'; font-size: 1.3em; text-align: center;
}

textarea{
	width: 50%; height: 4em; box-sizing: border-box; border: 2 #6A6A6A; border-top: inset; background-color: #91DDCA; border-color: aquamarine; border-radius: 1em; opacity: 50%; font-family:'Gabriola'; font-size: 1.3em; text-align: center;
	
}

input[type=tel]{
	width: 50%; height: 4em; box-sizing: border-box; border: 2 #6A6A6A; border-top: inset; background-color: #91DDCA; border-color: aquamarine; border-radius: 1em; margin-bottom: 2em; opacity: 50%; font-size: 1.3em; text-align: center;
	
}


.findme{background-color: #C49A6C; font-family: 'Gabriola';font-size: 2em; border-radius: 1em; box-sizing: border-box; border: 1 #6A6A6A; border-top: inset; opacity: 75%; margin-top: 2em;
}

label{font-size: 3em; font-family:'Gabriola'}

.output p{font-size:3em; border:2; float:center; container:5em;}


button{background-color: #C49A6C; font-family: 'Gabriola';font-size: 3em; border-radius: 1em; box-sizing: border-box; border: 2 #6A6A6A; border-top: inset; opacity: 75%; 
}

button:hover {background-color: #42ADE3}

button:active {
  background-color: #484483;
  box-shadow: 0 5px #666;
  transform: translateY(4px);
}