/* ================================================================ 
This copyright notice must be kept untouched in the stylesheet at 
all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/cssplay-round-and-round.html
Copyright (c) Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */
.quicklinks {position:fixed; width:70px; height:70px; bottom:0; left:50%;  margin-left:-135px;
             -moz-transition: -moz-transform 0.5s ease-in-out;
                            -ms-transition: -ms-transform 0.5s ease-in-out;
                            -o-transition: -o-transform 0.5s ease-in-out;
                            -webkit-transition: -webkit-transform 0.5s ease-in-out;
                            transition: transform 0.5s ease-in-out;
             }
ul.quicklinks_circles {list-style:none; width:70px; height:70px; position:absolute; bottom:0; z-index:200;}
ul.quicklinks_circles > li {width:70px; height:70px; position:absolute; bottom:0; left:0; right:0;
                            -moz-transition: -moz-transform 0.5s ease-in-out;
                            -ms-transition: -ms-transform 0.5s ease-in-out;
                            -o-transition: -o-transform 0.5s ease-in-out;
                            -webkit-transition: -webkit-transform 0.5s ease-in-out;
                            transition: transform 0.5s ease-in-out;
}

.quicklinks a img 
{
    width:70px;
    height:70px; 
    border: none;        
}

.menu {position:fixed; width:130px; height:130px; bottom:5px; left:50%; margin-left:-65px;}
ul.menu_circles {padding:0; margin:0; list-style:none; width:130px; height:130px; position:absolute; bottom:5px;}
ul.menu_circles > li {width:130px; height:130px; position:absolute; left:0; right:0; bottom:5px;
-moz-transition: -moz-transform 0.5s ease-in-out;
-ms-transition: -ms-transform 0.5s ease-in-out;
-o-transition: -o-transform 0.5s ease-in-out;
-webkit-transition: -webkit-transform 0.5s ease-in-out;
transition: transform 0.5s ease-in-out;
}

.menu a img 
{
    width:100px;
    height:100px; 
    border: none; 
    margin-bottom:-100px;
    margin-left:12px;
    position:relative;
}

.socialinks {position:fixed; width:70px; height:70px; bottom:0; left:50%;  margin-left:65px;
             -moz-transition: -moz-transform 0.5s ease-in-out;
                            -ms-transition: -ms-transform 0.5s ease-in-out;
                            -o-transition: -o-transform 0.5s ease-in-out;
                            -webkit-transition: -webkit-transform 0.5s ease-in-out;
                            transition: transform 0.5s ease-in-out;
             }
ul.socialinks_circles {list-style:none; width:70px; height:70px; position:absolute; bottom:0; z-index:200;}
ul.socialinks_circles > li {width:70px; height:70px; position:absolute; bottom:0; left:0; right:0;
                            -moz-transition: -moz-transform 0.5s ease-in-out;
                            -ms-transition: -ms-transform 0.5s ease-in-out;
                            -o-transition: -o-transform 0.5s ease-in-out;
                            -webkit-transition: -webkit-transform 0.5s ease-in-out;
                            transition: transform 0.5s ease-in-out;
}
.socialinks a img 
{
    width:70px;
    height:70px;     
    border: none;    
}

.menu:hover ~ .quicklinks {
    -moz-transform:translatex(-90px);
    -ms-transform:translatex(-90px);
    -o-transform:translatex(-90px);
    -webkit-transform:translatex(-90px);
    transform:translatex(-90px);
}

.menu:hover ~ .socialinks {
    -moz-transform:translatex(90px);
    -ms-transform:translatex(90px);
    -o-transform:translatex(90px);
    -webkit-transform:translatex(90px);
    transform:translatex(90px);
}

ul.quicklinks_circles:hover li.q1 
{
    -moz-transform: translatex(-70px) ;
    -ms-transform: translatex(-70px) ;
    -o-transform: translatex(-70px) ;
    -webkit-transform: translatex(-70px) ;
    transform: translatex(-70px) ;
}

ul.quicklinks_circles:hover li.q2 
{
    -moz-transform: translatex(-130px) ;
    -ms-transform: translatex(-130px) ;
    -o-transform: translatex(-130px) ;
    -webkit-transform: translatex(-130px) ;
    transform: translatex(-130px) ;
}

ul.quicklinks_circles:hover li.q3 
{
    -moz-transform: translatex(-190px) ;
    -ms-transform: translatex(-190px) ;
    -o-transform: translatex(-190px) ;
    -webkit-transform: translatex(-190px) ;
    transform: translatex(-190px) ;
}

ul.quicklinks_circles:hover li.q4 
{
    -moz-transform: translatex(-250px) ;
    -ms-transform: translatex(-250px) ;
    -o-transform: translatex(-250px) ;
    -webkit-transform: translatex(-250px) ;
    transform: translatex(-250px) ;
}

ul.quicklinks_circles:hover li.q5 
{
    -moz-transform: translatex(-310px) ;
    -ms-transform: translatex(-310px) ;
    -o-transform: translatex(-310px) ;
    -webkit-transform: translatex(-310px) ;
    transform: translatex(-310px) ;
}
ul.quicklinks_circles:hover li.q6 
{
    -moz-transform: translatex(-370px) ;
    -ms-transform: translatex(-370px) ;
    -o-transform: translatex(-370px) ;
    -webkit-transform: translatex(-370px) ;
    transform: translatex(-370px) ;
}
ul.menu_circles:hover li.m1 {/*Know Us*/    
    -moz-transform:rotate(360deg) translatex(-100px) translatey(40px);
    -ms-transform:rotate(360deg) translatex(-100px) translatey(40px);
    -o-transform:rotate(360deg) translatex(-100px) translatey(40px);
    -webkit-transform:rotate(360deg) translatex(-100px) translatey(40px);
    transform:rotate(360deg) translatex(-100px) translatey(40px);    
    
}

ul.menu_circles:hover li.m2 {/*Join Us*/
    -moz-transform:rotate(360deg) translatex(-95px) translatey(-59px);
    -ms-transform:rotate(360deg) translatex(-95px) translatey(-59px);
    -o-transform:rotate(360deg) translatex(-95px) translatey(-59px);
    -webkit-transform:rotate(360deg) translatex(-95px) translatey(-59px);
    transform:rotate(360deg) translatex(-95px) translatey(-59px);
}

ul.menu_circles:hover li.m3 {/*I'm New*/
    -moz-transform:rotate(360deg) translatey(-112px);
    -ms-transform:rotate(360deg) translatey(-110px);
    -o-transform:rotate(360deg) translatey(-110px);
    -webkit-transform:rotate(360deg) translatey(-112px);
    transform:rotate(360deg) translatey(-110px);
}

ul.menu_circles:hover li.m4 {/*Contact Us*/
    -moz-transform:rotate(360deg) translatex(98px) translatey(-60px);
    -ms-transform:rotate(360deg) translatex(98px) translatey(-60px);
    -o-transform:rotate(360deg) translatex(98px) translatey(-60px);
    -webkit-transform:rotate(360deg) translatex(98px) translatey(-60px);
    transform:rotate(360deg) translatex(98px) translatey(-60px);
}

ul.menu_circles:hover li.m5 { /*Resources*/
    -moz-transform:rotate(360deg) translatex(100px) translatey(40px);
    -ms-transform:rotate(360deg) translatex(100px) translatey(40px);
    -o-transform:rotate(360deg) translatex(100px) translatey(40px);
    -webkit-transform:rotate(360deg) translatex(103px) translatey(40px);
    transform:rotate(360deg) translatex(100px) translatey(40px);    
}

ul.socialinks_circles:hover li.s1 
{
    -moz-transform: translatex(70px) ;
    -ms-transform: translatex(70px) ;
    -o-transform: translatex(70px) ;
    -webkit-transform: translatex(70px) ;
    transform: translatex(70px) ;
}

ul.socialinks_circles:hover li.s2 
{
    -moz-transform: translatex(130px) ;
    -ms-transform: translatex(130px) ;
    -o-transform: translatex(130px) ;
    -webkit-transform: translatex(130px) ;
    transform: translatex(130px) ;
}

ul.socialinks_circles:hover li.s3 
{
    -moz-transform: translatex(190px) ;
    -ms-transform: translatex(190px) ;
    -o-transform: translatex(190px) ;
    -webkit-transform: translatex(190px) ;
    transform: translatex(190px) ;
}

/* Not in use
.spinner {			
	-webkit-animation-name: spinnerRotate;
	-webkit-animation-duration: 5s;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-timing-function: linear;
}

@-webkit-keyframes spinnerRotate {
	from {
		-webkit-transform:rotate(0deg);
	}
	to {
		-webkit-transform:rotate(360deg);
	}
}
*/