﻿body {
font-family:arial;
}
h1 {
color:#DC0055;
font-size: 120px;
letter-spacing:15px;
font-style:italic;
margin-top:-105px;
margin-left:50px;
}
#navigation {
margin-top:-40px;
}
#navigation li {
        list-style: none;
        display: block;
        float: left;
        margin: 1em;
		
}
#navigation li a {
        text-shadow: 0 2px 1px rgba(0,0,0,0.5);
        display: block;
        text-decoration: none;
        color: white;
        font-size: 1.6em;
        margin: 0 .5em;
}
#navigation li a:hover {
        margin-top: 2.5px;
		color:#00ff0f;
        text-shadow: 0px 0px 10px #00ff0f, -1px -1px #000;
		}
#navigation_container {
   margin: 0 auto;
   width: 1200px;
}
#navigation li.active a {
margin-top: 2.5px;
		color:#00ff0f;
        text-shadow: 0px 0px 10px #00ff0f, -1px -1px #000;
		}
.rectangle {
   background: #DB0058;
   height: 62px;
   position: relative;
   -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
   box-shadow: 0px 0px 4px rgba(0,0,0,0.55);
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   z-index: 500; /* the stack order: foreground */
   margin: 3em 0;
}
.l-triangle-top {
   border-color: #E1004C transparent transparent;
   border-style:solid;
   border-width:50px;
   height:0px;
   width:0px;
   position: relative;
   float: left;
   top: 1px;
   left: -50px;
}
 
.l-triangle-bottom {
   border-color: transparent transparent #E1004C;
   border-style:solid;
   border-width:50px;
   height:0px;
   width:0px;
   position: relative;
   float: left;
   top: -40px;
   left: -150px;
}
.r-triangle-top {
   border-color:  #E1004C transparent transparent;
   border-style:solid;
   border-width:50px;
   height:0px;
   width:0px;
   position: relative;
   float: right;
   right: -45px;
   top: -107px;
}
 
.r-triangle-bottom {
   border-color: transparent transparent #E1004C;
   border-style:solid;
   border-width:50px;
   height:0px;
   width:0px;
   position: relative;
   float: right;
   top: -149px;
   right: -145px;
}
.wrapper {
	margin-left: 23.7%;
	margin-top:-30px;	  
}
ol {
    margin: 0;
    padding: 0;	
}
 
ol.menu {
    height: 100px;
    float:left;
}
 
ol.menu li {
    list-style: none;
    float:left;
    height: 72px;
    text-align: center;
    background: -webkit-gradient(radial, 50% 100%, 10, 50% 50%, 90, from(rgba(31,169,244,1)), to(rgba(0,28,78, 1)) );
    background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(31,169,244,1) 0%, rgba(0,28,78, 1) 100%);
	margin-top:-50px;	
    }
 
ol li a {
    display: block;
    padding: 0 20px;
    border-left: 1px solid rgba(255,255,255,0.1);
    border-right: 1px solid rgba(0,0,0,0.1);
	border-width:1px;
	border-color:black;
    text-align: center;
    line-height: 72px;
    background : -webkit-gradient(linear, left top, left bottom, from(rgb(168,168,168)), to(rgb(69,69,69)));
    background : -moz-linear-gradient(top, rgb(168,168,168), rgb(69,69,69));
    -webkit-transition-property: background;
    -webkit-transition-duration: 700ms;
    -moz-transition-property: background;
    -moz-transition-duration: 700ms;
	color:black;
    }
 
ol li a:hover {
    background: transparent none;
	color:#DB0058;
}
 
ol li.active a{
    background: -webkit-gradient(radial, 50% 100%, 10, 50% 50%, 90, from(rgba(31,169,244,1)), to(rgba(0,28,78, 1)) );
    background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(31,169,244,1) 0%, rgba(0,28,78, 1) 100%);
    color:#DB0058;
	}
#center {
text-align:center;
width:1088px;
height:800px;
margin-left:250px;
margin-top:140px;
color:white;
font-size:32px;
}
#left {
text-align:left;
width:400px;
height:800px;
margin-top:-800px;
}
#right {
width:400px;
height:800px;
float:right;
margin-top:-800px;
}
#menu {
height:60px;
}
a {
color:pink;
}
