
    html {
    font-size: 62.5%;
    font-family: verdana, sans-serif;  
    font-weight:normal;
    color: rgba(250,250,250,1);
    text-align:left;
    text-decoration: none;
    }

    body{
    font-size: 1.2rem; 
    margin:0;
    padding:0px; 
    height:100%; 
    width:100%;
    background: rgba(50,50,175,1.0);
    background-image: -o-linear-gradient(left, rgba(0,0,100,1.0) 0%, rgba(0,0,100,1.0) 80px, rgba(100,100,250,1.0) calc(50% - 10px), rgba(100,100,250,1.0) 50%, rgba(100,100,250,1.0) calc(50% + 10px), rgba(0,0,100,1.0) calc(100% - 80px), rgba(0,0,100,1.0) 100%);
    background-image: -moz-linear-gradient(left, rgba(0,0,100,1.0) 0%, rgba(0,0,100,1.0) 80px, rgba(100,100,250,1.0) calc(50% - 10px), rgba(100,100,250,1.0) 50%, rgba(100,100,250,1.0) calc(50% + 10px), rgba(0,0,100,1.0) calc(100% - 80px), rgba(0,0,100,1.0) 100%);
    background-image: -webkit-linear-gradient(left, rgba(0,0,100,1.0) 0%, rgba(0,0,100,1.0) 80px, rgba(100,100,250,1.0) calc(50% - 10px), rgba(100,100,250,1.0) 50%, rgba(100,100,250,1.0) calc(50% + 10px), rgba(0,0,100,1.0) calc(100% - 80px), rgba(0,0,100,1.0) 100%);
    background-image: -ms-linear-gradient(left, rgba(0,0,100,1.0) 0%, rgba(0,0,100,1.0) 80px, rgba(100,100,250,1.0) calc(50% - 10px), rgba(100,100,250,1.0) 50%, rgba(100,100,250,1.0) calc(50% + 10px), rgba(0,0,100,1.0) calc(100% - 80px), rgba(0,0,100,1.0) 100%);
    background-image: linear-gradient(to right, rgba(0,0,100,1.0) 0%, rgba(0,0,100,1.0) 80px, rgba(100,100,250,1.0) calc(50% - 10px), rgba(100,100,250,1.0) 50%, rgba(100,100,250,1.0) calc(50% + 10px), rgba(0,0,100,1.0) calc(100% - 80px), rgba(0,0,100,1.0) 100%);
    background-size: 100% 100%;
    background-repeat: no-repeat; 
    background-attachment: fixed; 
    background-position: 0px 0px;
    overflow-y: hidden;
    overflow-x: hidden;
    }

    .intro{
    position:absolute;
    box-sizing:border-box;
    width:calc(100% - 140px);
    height:0px;
    max-height:0px;
    left:20px;
    top:20px;
    background: rgba(255,0,0,1.0);
    border-top: 2px solid rgba(245,245,245,0);
    border-left: 2px solid rgba(245,245,245,0);
    border-bottom: 2px solid rgba(60,60,60,0);
    border-right: 2px solid rgba(60,60,60,0);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	color: #808080;
	/* z-index: -10; */
	/* visibility: hidden; */
    }
    
    .intro:focus {
    position:absolute;
    box-sizing: border-box;
    width:calc(100% - 140px);
    height:calc(100% - 40px);
    max-height:calc(100% - 40px);
    left:20px;
    top:20px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	/* z-index: 10; */
	/* visibility: visible; */
    }

    .intro::before {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:80px;
    height:80px;
    left:calc(100% + 20px);
    top:90px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/navigationblack.png"), rgba(180,180,180,1);
    background-image: -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	/* z-index: 10; */
	/* visibility: visible; */
    }

    .intro::after {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:60px;
    height:60px;
    left:calc(100% + 30px);
    top:100px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/introblack.png"), rgba(180,180,180,1);
    background-image: url("img/introblack.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introblack.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introblack.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introblack.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introblack.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
	/* z-index: 10; */
	/* visibility: visible; */
    }  

    .intro:hover::after {
    background: url("img/introwhite.png"), rgba(180,180,180,1);
    background-image: url("img/introwhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
	/* z-index: 10; */
	/* visibility: visible; */
    }

    .intro:focus::after {
    border-bottom: 2px solid rgba(245,245,245,1);
    border-right: 2px solid rgba(245,245,245,1);
    border-top: 2px solid rgba(60,60,60,1);
    border-left: 2px solid rgba(60,60,60,1);
    background: url("img/introwhite.png"), rgba(180,180,180,1);
    background-image: url("img/introwhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/introwhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
	/* z-index: 10; */
	/* visibility: visible; */
    } 


    .photos{
    position:absolute;
    box-sizing:border-box;
    width:calc(100% - 140px);
    height:0px;
    max-height:0px;
    left:20px;
    top:20px;
    background: rgba(0,255,0,1.0);
    border-top: 2px solid rgba(245,245,245,0);
    border-left: 2px solid rgba(245,245,245,0);
    border-bottom: 2px solid rgba(60,60,60,0);
    border-right: 2px solid rgba(60,60,60,0);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	color: #808080;
    }
    
    .photos:focus {
    position:absolute;
    box-sizing: border-box;
    width:calc(100% - 140px);
    height:calc(100% - 40px);
    max-height:calc(100% - 40px);
    left:20px;
    top:20px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
    }

    .photos::before {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:80px;
    height:80px;
    left:calc(100% + 20px);
    top:180px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/navigationblack.png"), rgba(180,180,180,1);
    background-image: -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }

    .photos::after {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:60px;
    height:60px;
    left:calc(100% + 30px);
    top:190px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/photosblack.png"), rgba(180,180,180,1);
    background-image: url("img/photosblack.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photosblack.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photosblack.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photosblack.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photosblack.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }  

    .photos:hover::after {
    background: url("img/photoswhite.png"), rgba(180,180,180,1);
    background-image: url("img/photoswhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    }

    .photos:focus::after {
    border-bottom: 2px solid rgba(245,245,245,1);
    border-right: 2px solid rgba(245,245,245,1);
    border-top: 2px solid rgba(60,60,60,1);
    border-left: 2px solid rgba(60,60,60,1);
    background: url("img/photoswhite.png"), rgba(180,180,180,1);
    background-image: url("img/photoswhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/photoswhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }  

    .video{
    position:absolute;
    box-sizing:border-box;
    width:calc(100% - 140px);
    height:0px;
    max-height:0px;
    left:20px;
    top:20px;
    background: rgba(0,0,255,1.0);
    border-top: 2px solid rgba(245,245,245,0);
    border-left: 2px solid rgba(245,245,245,0);
    border-bottom: 2px solid rgba(60,60,60,0);
    border-right: 2px solid rgba(60,60,60,0);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	color: #808080;
    }
    
    .video:focus {
    position:absolute;
    box-sizing: border-box;
    width:calc(100% - 140px);
    height:calc(100% - 40px);
    max-height:calc(100% - 40px);
    left:20px;
    top:20px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
    }

    .video::before {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:80px;
    height:80px;
    left:calc(100% + 20px);
    top:270px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/navigationblack.png"), rgba(180,180,180,1);
    background-image: -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }

    .video::after {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:60px;
    height:60px;
    left:calc(100% + 30px);
    top:280px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/videoblack.png"), rgba(180,180,180,1);
    background-image: url("img/videoblack.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videoblack.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videoblack.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videoblack.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videoblack.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }  

    .video:hover::after {
    background: url("img/videowhite.png"), rgba(180,180,180,1);
    background-image: url("img/videowhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    }

    .video:focus::after {
    border-bottom: 2px solid rgba(245,245,245,1);
    border-right: 2px solid rgba(245,245,245,1);
    border-top: 2px solid rgba(60,60,60,1);
    border-left: 2px solid rgba(60,60,60,1);
    background: url("img/videowhite.png"), rgba(180,180,180,1);
    background-image: url("img/videowhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/videowhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    } 

    .maps{
    position:absolute;
    box-sizing:border-box;
    width:calc(100% - 140px);
    height:0px;
    max-height:0px;
    left:20px;
    top:20px;
    background: rgba(255,255,0,1.0);
    border-top: 2px solid rgba(245,245,245,0);
    border-left: 2px solid rgba(245,245,245,0);
    border-bottom: 2px solid rgba(60,60,60,0);
    border-right: 2px solid rgba(60,60,60,0);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	color: #808080;
    }
    
    .maps:focus {
    position:absolute;
    box-sizing: border-box;
    width:calc(100% - 140px);
    height:calc(100% - 40px);
    max-height:calc(100% - 40px);
    left:20px;
    top:20px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
    }

    .maps::before {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:80px;
    height:80px;
    left:calc(100% + 20px);
    top:360px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/navigationblack.png"), rgba(180,180,180,1);
    background-image: -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }

    .maps::after {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:60px;
    height:60px;
    left:calc(100% + 30px);
    top:370px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/mapsblack.png"), rgba(180,180,180,1);
    background-image: url("img/mapsblack.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapsblack.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapsblack.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapsblack.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapsblack.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }  

    .maps:hover::after {
    background: url("img/mapswhite.png"), rgba(180,180,180,1);
    background-image: url("img/mapswhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    }

    .maps:focus::after {
    border-bottom: 2px solid rgba(245,245,245,1);
    border-right: 2px solid rgba(245,245,245,1);
    border-top: 2px solid rgba(60,60,60,1);
    border-left: 2px solid rgba(60,60,60,1);
    background: url("img/mapswhite.png"), rgba(180,180,180,1);
    background-image: url("img/mapswhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/mapswhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }


    .social{
    position:absolute;
    box-sizing:border-box;
    width:calc(100% - 140px);
    height:0px;
    max-height:0px;
    left:20px;
    top:20px;
    border-top: 2px solid rgba(245,245,245,0);
    border-left: 2px solid rgba(245,245,245,0);
    border-bottom: 2px solid rgba(60,60,60,0);
    border-right: 2px solid rgba(60,60,60,0);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
	color: #808080;
    }
    
    .social:focus {
    position:absolute;
    box-sizing: border-box;
    width:calc(100% - 140px);
    height:calc(100% - 40px);
    max-height:calc(100% - 40px);
    left:20px;
    top:20px;
    background: rgba(255,0,255,1.0);
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear;
    }

    .social::before {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:80px;
    height:80px;
    left:calc(100% + 20px);
    top:450px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/navigationblack.png"), rgba(180,180,180,1);
    background-image: -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }

    .social::after {
    content:"";
    cursor:hand;
    position:absolute;
    box-sizing: border-box;
    width:60px;
    height:60px;
    left:calc(100% + 30px);
    top:460px;
    border-top: 2px solid rgba(245,245,245,1);
    border-left: 2px solid rgba(245,245,245,1);
    border-bottom: 2px solid rgba(60,60,60,1);
    border-right: 2px solid rgba(60,60,60,1);
    background: url("img/socialblack.png"), rgba(180,180,180,1);
    background-image: url("img/socialblack.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialblack.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialblack.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialblack.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialblack.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }  

    .social:hover::after {
    background: url("img/socialwhite.png"), rgba(180,180,180,1);
    background-image: url("img/socialwhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    }

    .social:focus::after {
    border-bottom: 2px solid rgba(245,245,245,1);
    border-right: 2px solid rgba(245,245,245,1);
    border-top: 2px solid rgba(60,60,60,1);
    border-left: 2px solid rgba(60,60,60,1);
    background: url("img/socialwhite.png"), rgba(180,180,180,1);
    background-image: url("img/socialwhite.png"), -o-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -moz-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1.0) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -webkit-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), -ms-linear-gradient(right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    background-image: url("img/socialwhite.png"), linear-gradient(to right bottom, rgba(230,230,230,1.0) 0%, rgba(130,130,130,1) 50%, rgba(230,230,230,1.0) 100%);
    -webkit-transition: all 500ms linear;
    -moz-transition: all 500ms linear;
    -o-transition: all 500ms linear;
    transition: all 500ms linear; 
    }
