@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro');

* {
	margin: 0;
	padding: 0;
	border: none;
}

body{
	/*background-image: url("../images/new bg 2024.png");
	background-size: auto;
	background-attachment: fixed;*/
	background-image: url("../images/plain bg.png");
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	text-align:center;
	margin:auto;
	padding:0;

}
header#homepage{
	/*background-image: url("../images/SharedMemoriesCollection850.jpg");*/
	background-image: url("../images/items.png");
	background-attachment: local;
	width: 850px;
	height: 610px;
	text-align: center;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: local;
	margin: auto;
	padding:0;
	
}

.fade-in-bottom {
	-webkit-animation: fade-in-bottom 1.2s ease-in-out both;
	        animation: fade-in-bottom 1.2s ease-in-out both;
}
/* ----------------------------------------------
 * Generated by Animista on 2024-5-15 14:46:43
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-in-bottom
 * ----------------------------------------
 */
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
.fade-in-bottom2 {
	-webkit-animation: fade-in-bottom 1.2s ease-in-out 1.1s both;
	        animation: fade-in-bottom 1.2s ease-in-out 1.1s both;
}
/* ----------------------------------------------
 * Generated by Animista on 2024-5-15 14:50:50
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation fade-in-bottom
 * ----------------------------------------
 */
@keyframes fade-in-bottom2 {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}





header {
	/*background-color: rgb(255,255,255);*/
	width: 850px;
	margin-left: auto;
	margin-right: auto;
	margin-bottom: auto;
	padding: 0;
}



.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.center#smlogo {
	padding-top: 40px;
	display:inline;
	
}

.center#fmlogo {
	padding-top: 50px;
	padding-bottom: 30px;
	display:inline;
	margin-left:212px;
}


#wrapper {
	width: 850px;
	margin: auto;
	padding-bottom: 60px;
	padding-left: 0;
	padding-right: 0;
	font-family: "Source Sans Pro", "Franklin Gothic",  sans-serif;
}


h1 {
	padding-bottom: 20px;
	padding-top: 0px;
}

h2 {
	padding-top: 20px;
	padding-bottom: 20px;
}
h1, h2 {
	text-align: center;
}



.homepagebutton {
	width: 170px;
	padding-top: 59px;
	padding-bottom: 59px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 50%;
    background:#78a5df; /*-webkit-linear-gradient(135deg,#4172b0,#8ba8ce,#ffffff,#8ba8ce,#4172b0)*/
    border: none;
    color: #000000;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
    display: block;
    font-size: 25px;
    margin: 4px 2px;
	margin-bottom: 15px;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
/*-webkit-box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc; 
box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc*/;
}

.homepagebutton1 {
	width: 170px;
	padding-top: 59px;
	padding-bottom: 59px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 50%;
    background:black;
    border: none;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
    display: block;
    font-size: 25px;
    margin: 4px 2px;
	margin-bottom: 15px;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
/*-webkit-box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc; 
box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc;*/
}

.homepagebutton:hover {
	background: white;
	color: black;
-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
}

.homepagebutton1:hover {
	background: white; /*-webkit-linear-gradient(135deg,#4172b0,#8ba8ce,#ffffff,#8ba8ce,#4172b0);*/
	color: black;
-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
}


.homepagebutton4 {
	width: 170px;
	padding-top: 75px;
	padding-bottom: 75px;
	padding-left: 5px;
	padding-right: 5px;
	border-radius: 50%;
    background: -webkit-linear-gradient(135deg,#000000,#615f5f,#ffffff,#615f5f,#000000);
    border: none;
    color: #000000;
    text-align: center;
    text-decoration: none;
    font-weight: 900;
    display: block;
    font-size: 25px;
    margin: 4px 2px;
	margin-bottom: 15px;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
-webkit-box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc; 
box-shadow: 0px 10px 13px -7px #7ea7cc, -10px 20px 21px 5px #96b2cc;
}

.button {
	width: 50%;
	margin-left: 205px;
	margin-top: 10px;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
    background: -webkit-linear-gradient(90deg,#000000,#615f5f,#ffffff,#615f5f,#000000);
    border: none;
    color: rgb(255,255,255);
    text-decoration: none;
    display: block;
    font-size: 25px;
	margin-bottom: 15px;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
	border-radius: 10px;
}

.button:hover {
	background-color: rgb(203,206,210);
	color: rgb(0,46,93);

}

#button1 {
	float: left;
	width: 182px;
	height: 250px;
	padding-left: 0px;

}
#button2 {
	float: left;
	width: 182px;
	height: 250px;
	padding-left: 40px;

}
#button3 {
	float: left;
	width: 182px;
	height: 250px;
	padding-left: 40px;

}
#button4 {
	float: left;
	width: 182px;
	height: 250px;
	padding-left: 40px;

}
.homebutton {
	float: right;
	width: 150px;
	padding-top: 75px;
}



footer {
	color: black;
	clear: both;
	text-align: center;
	font-family:  "Source Sans Pro", "Franklin Gothic", sans-serif;
	font-weight: bolder;
	letter-spacing: .05em;
	display: block;
	width: 500px;
	margin: auto;
	padding-bottom: 20px;
}

footer a {
	color:black;
}

footer a:hover {
  background:#78a5df;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
	-webkit-transition-duration: 0.4s;
	transition-duration: 0.4s;
}

dl {
	text-align: center;
	list-style-type: none;
	font-size: 25px;
}