#comp
{
    }
html {
background-size: 8px 8px;
}
body 
{
text-align: center;
color: #000000;
max-width: 100%;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#3f88c5+1,393e41+100 */
background: #c21500; /* Old browsers */
background: -moz-linear-gradient(top, #F3BD29 1%, #9E3134 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #F3BD29 1%,#9E3134 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #F3BD29 1%,#9E3134 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F3BD29', endColorstr='#9E3134',GradientType=0 ); /* IE6-9 */
font-family: 'Playfair Display', serif;
height: 100%;
margin: 0;
background-repeat: no-repeat;
background-attachment: fixed;
text-decoration: none;
}
#title
{
    font-family: 'Oswald', sans-serif;
	font-size: 72px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #000000;
	text-align: center;
	a{text-decoration:none}
	width: 100%;
}
h1
{
    font-family: 'Oswald', sans-serif;
	font-size: 72px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #000000;
	text-align: center;
	a{text-decoration:none}
	width: 100%;
}
#downtitle1
{
	font-family: "Arial Bold", Arial Bold, Gadget; 
	font-size: 35px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #000000;
	text-align: center;
	a{text-decoration:none}
	width: 100%;
}
#downtitle2
{
	font-family: "Arial Bold", Arial Bold, Gadget; 
	font-size: 25px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #000000;
	text-align: center;
	a{text-decoration:none}
	width: 100%;
}
#alpha
{
	font-family: Verdana;
	font-size: 72px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #F6F7EB;
    transform: scale(-1, 1);
    text-align: center
    ;
}
#box 
{
    padding:35px;
    font-family: 'Quattrocento', serif;
    color: black;
    vertical-align: middle;
} 
#box2 
{
    border: 5px orange ;
    width: 75%;
    margin-left:auto;
    margin-right:auto;
    padding:35px;
    background-color:rgba(134, 187, 216, 1); 
    opacity: 50;
    font-family: 'Playfair Display', serif;
    color: #E94F37;
    
} 
#title2
{
    font-family: 'Oswald', sans-serif;
	font-size: 36px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: black;
	text-align: center;
	font-weight: bold;
}
h3
{
    font-family: 'Oswald', sans-serif;
	font-size: 36px;
	font-style: normal;
	font-variant: normal;
	font-weight: 500;
	line-height: 26.4px;
	color: #F6F7EB;
	text-align: center;
	font-weight: bold;
}
#box2
{
    border: 5px orange ;
    width: 75%;
    margin-left:auto;
    margin-right:auto;
    padding:35px;
    background: white;
}
h2
{
color: #F6F7EB;
font-family: 'Quattrocento', serif;
font-weight: bold;
color: black;
}
#title3
{
color: #F6F7EB;
font-family: 'Quattrocento', serif;
font-weight: bold;
color: black;
font-size: 2em;
}
#box3 
{
    padding:35px;
    font-family: 'Quattrocento', serif;
    color: #F6F7EB;
    font-size: 20px;
} 
#container
{
  width: 600px;
}
#container div 
{
  float: left;
  height: 100px;
  width: 200px;
}
/* the menu */
nav ul {
    list-style-type: none;
    font-family: sans-serif;
    font-weight: bold;
    padding: 16px;
}
nav ul li {
    display: inline;
    padding-right: 8px;
    padding-left: 8px;
}
nav ul li:last-child {
    border-right: none;
}
nav ul li a {
    text-decoration: none;
    color: #111111;
}
nav li.selected{
    color: #606060;
}
nav ul li a:hover {
    text-decoration: underline;
}
#box4
{
  overflow: auto;    
}

#box4 span
{

   float: left;
   margin-top: 10px;
   margin-left: 10px;
}

#box4 img{
   float: left;        
}


/* Menu */

	#wrapper {
		-moz-transition: opacity 0.45s ease;
		-webkit-transition: opacity 0.45s ease;
		-ms-transition: opacity 0.45s ease;
		transition: opacity 0.45s ease;
		opacity: 1;
	}

	#menu {
		-moz-transform: translateX(22em);
		-webkit-transform: translateX(22em);
		-ms-transform: translateX(22em);
		transform: translateX(22em);
		-moz-transition: -moz-transform 0.45s ease, visibility 0.45s;
		-webkit-transition: -webkit-transform 0.45s ease, visibility 0.45s;
		-ms-transition: -ms-transform 0.45s ease, visibility 0.45s;
		transition: transform 0.45s ease, visibility 0.45s;
		position: fixed;
		top: 0;
		right: 0;
		width: 22em;
		max-width: 80%;
		height: 100%;
		-webkit-overflow-scrolling: touch;
		background: #585858;
		color: #ffffff;
		cursor: default;
		visibility: hidden;
		z-index: 10002;
	}

		#menu > .inner {
			-moz-transition: opacity 0.45s ease;
			-webkit-transition: opacity 0.45s ease;
			-ms-transition: opacity 0.45s ease;
			transition: opacity 0.45s ease;
			-webkit-overflow-scrolling: touch;
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			padding: 2.75em;
			opacity: 0;
			overflow-y: auto;
		}

			#menu > .inner > ul {
				list-style: none;
				margin: 0 0 1em 0;
				padding: 0;
			}

				#menu > .inner > ul > li {
					padding: 0;
					border-top: solid 1px rgba(255, 255, 255, 0.15);
				}

					#menu > .inner > ul > li a {
						display: block;
						padding: 1em 0;
						line-height: 1.5;
						border: 0;
						color: inherit;
					}

					#menu > .inner > ul > li:first-child {
						border-top: 0;
						margin-top: -1em;
					}

		#menu > .close {
			-moz-transition: opacity 0.45s ease, -moz-transform 0.45s ease;
			-webkit-transition: opacity 0.45s ease, -webkit-transform 0.45s ease;
			-ms-transition: opacity 0.45s ease, -ms-transform 0.45s ease;
			transition: opacity 0.45s ease, transform 0.45s ease;
			-moz-transform: scale(0.25) rotate(180deg);
			-webkit-transform: scale(0.25) rotate(180deg);
			-ms-transform: scale(0.25) rotate(180deg);
			transform: scale(0.25) rotate(180deg);
			-webkit-tap-highlight-color: transparent;
			display: block;
			position: absolute;
			top: 2em;
			left: -6em;
			width: 6em;
			text-indent: 6em;
			height: 3em;
			border: 0;
			font-size: 1em;
			opacity: 0;
			overflow: hidden;
			padding: 0;
			white-space: nowrap;
		}

			#menu > .close:before, #menu > .close:after {
				-moz-transition: opacity 0.2s ease;
				-webkit-transition: opacity 0.2s ease;
				-ms-transition: opacity 0.2s ease;
				transition: opacity 0.2s ease;
				content: '';
				display: block;
				position: absolute;
				top: 0;
				left: 0;
				width: 100%;
				height: 100%;
				background-position: center;
				background-repeat: no-repeat;
				background-size: 2em 2em;
			}

			#menu > .close:before {
				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 8px%3B stroke: %23f2849e%3B %7D%3C/style%3E%3Cline x1='15' y1='15' x2='85' y2='85' /%3E%3Cline x1='85' y1='15' x2='15' y2='85' /%3E%3C/svg%3E");
				opacity: 0;
			}

			#menu > .close:after {
				background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cstyle%3Eline %7B stroke-width: 8px%3B stroke: %23585858%3B %7D%3C/style%3E%3Cline x1='15' y1='15' x2='85' y2='85' /%3E%3Cline x1='85' y1='15' x2='15' y2='85' /%3E%3C/svg%3E");
				opacity: 1;
			}

			#menu > .close:hover:before {
				opacity: 1;
			}

			#menu > .close:hover:after {
				opacity: 0;
			}

		@media screen and (max-width: 736px) {

			#menu {
				-moz-transform: translateX(16.5em);
				-webkit-transform: translateX(16.5em);
				-ms-transform: translateX(16.5em);
				transform: translateX(16.5em);
				width: 16.5em;
			}

				#menu > .inner {
					padding: 2.75em 1.5em;
				}

				#menu > .close {
					top: 0.5em;
					left: -4.25em;
					width: 4.25em;
					text-indent: 4.25em;
				}

					#menu > .close:before, #menu > .close:after {
						background-size: 1.5em 1.5em;
					}

		}

	body.is-menu-visible #wrapper {
		pointer-events: none;
		cursor: default;
		opacity: 0.25;
	}

	body.is-menu-visible #menu {
		-moz-transform: translateX(0);
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0);
		visibility: visible;
	}

		body.is-menu-visible #menu > * {
			opacity: 1;
		}

		body.is-menu-visible #menu .close {
			-moz-transform: scale(1.0) rotate(0deg);
			-webkit-transform: scale(1.0) rotate(0deg);
			-ms-transform: scale(1.0) rotate(0deg);
			transform: scale(1.0) rotate(0deg);
			opacity: 1;
		}

&#xf012;
{
ff6900

