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

/*Desktop/Global*/
.slicknav_menu{display: none}

#menu li{display: inline}

#menu{
text-align: center;
padding-bottom: 10px
}

#menu li a{
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	color: mediumpurple;
	font-weight: 100;
	text-transform: uppercase;
	font-size: 17px;
	text-decoration: none}

#menu li a:hover{
	color: dimgray
}
header{
	background-color: white
}
body{
	font-family:"Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 20px;
	background-color:#EDEDED;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto}

.profile_photo{
	float: right;
	border-radius: 3px;
	margin-left: 10px
}
.profile_photo:hover{
	transform: rotate(360deg);
	transition-duration: 2s
}
.first_box{
	background-color: white;
	padding: 20px;
	border-radius: 3px
}
.second_box{
	background-color: white;
	padding: 20px;
	border-radius: 3px
}
.grid{
	background-color: white;
	padding: 10px 10px 250% 10px;
	border-radius: 3px
}
.cell{
	float: left;
	width: 31.3%;
	padding: 1%
}
.cell img{
	width: 100%;
	height: auto;
	display: block
}
.cell:hover{
	transform: scale(1.03);
	box-shadow: 1px 1px 1px 1px lightgrey
}
h1{
	color:mediumpurple;
	font-weight: 100;
	font-size: 30px;
	}

h2{
	color: mediumpurple;
	font-weight: 100;
	font-size: 20px}
h3{
	color: mediumpurple;
	font-weight: 300;
	font-size: 30px;
	padding-left: 10px
}
h4{
	color:gray;
	font-size: 50px;
	text-align: center;
	font-weight: 100;
	padding-top: 10px;
}
h6{
	color: mediumpurple;
	font-weight: 100;
	font-size: 18px;
	font-style: italic;
}
p{
	font-weight: 100
}
ul{
	font-weight: 100
}

.download_button{
	text-decoration: none;
	background-color: #CAAAE8;
	color: white;
	font-weight: 200;
	padding: 5px 10px;
	font-size: 15px;
	border-radius: 3px;
	float: left
}
.download_button:hover{
	transform: scale(1.1);
	box-shadow: 1px 1px 1px 1px lightgrey;
	text-decoration: none;
	color: white
}
.btn-sm{
	font-family: "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed", Helvetica, Arial, "sans-serif";
	font-weight: 200;
	background-color: #CAAAE8;
	color: white
	
}
.insta{
	width: 30px;
	height: auto;
	margin-left: 20px
}
.insta:hover{
	transform: scale(1.05);
	box-shadow: 1px 1px 1px 1px lightgrey;
	border-radius: 10px
}
.to_top_button{
	float: right;
	text-decoration: none;
	color: #CAAAE8
}
.to_top_button:hover{
	transform: scale(1.1);
	text-decoration: none;
	color: mediumpurple
}
.logo{
	float: right;
	height: 50px
}
.logo:hover{
	transform: scale(1.03);
	box-shadow: 1px 1px 1px 1px lightgrey
}
.carousel-control-next-icon{
	background-image: url(../images/right.png);
	width: 70px;
	height: 100px
}
.carousel-control-prev-icon{
	background-image: url(../images/left.png);
	width: 70px;
	height: 100px
}
.embed-responsive{
	border-radius: 3px
}
#grid{
	display: none
}
/*iPad or Tablet*/

@media(max-width: 768px){
	#menu li{display: block;
	text-align: right}
	#grid{
		display: block
	}
	.second_box{
		display: none
	}
	#show_hide{
		display: none
	}
}

/*iPhone or Mobile*/

@media(max-width: 400px){
	#menu{display: none}
	.slicknav_menu{display:block}
	.profile_photo{width: 130px}
	.cell{
		float: left;
		width: 46%;
		padding: 1%
	}
	h4{
		font-size: 30px;
	}
	.grid{
		padding: 10px 10px 350% 10px
	}
}