Pro Fishing
  • Main
  • Fish Talk
  • Fishing Portal
    • Fishing Articles
  • Boating Portal
  • Kids Portal
  • Recipe Portal
  • Shellfish Portal
  • Travel Portal
  • Photos And Videos
  • News
  • Contact
  • Shark Tagging
  • Social Media
  • Privacy Policy
  • Tools
  • Main
  • Fish Talk
  • Fishing Portal
    • Fishing Articles
  • Boating Portal
  • Kids Portal
  • Recipe Portal
  • Shellfish Portal
  • Travel Portal
  • Photos And Videos
  • News
  • Contact
  • Shark Tagging
  • Social Media
  • Privacy Policy
  • Tools
Search by typing & pressing enter

YOUR CART


Tactran Connect
  
    One     Two     Three     Four       
      
            
  • 1
  •         
  • 2
  •         
  • 3
  •         
  • 4
  •       
    
    
.one:hover ~ .circle {   -webkit-transform: rotate(0deg);   -moz-transform: rotate(0deg);   -ms-transform: rotate(0deg);   -o-transform: rotate(0deg);   transform: rotate(0deg); }   .menu > .two:hover ~ .circle {   -webkit-transform: rotate(-90deg);   -moz-transform: rotate(-90deg);   -ms-transform: rotate(-90deg);   -o-transform: rotate(-90deg);   transform: rotate(-90deg); }   .menu > .three:hover ~ .circle {   -webkit-transform: rotate(-180deg);   -moz-transform: rotate(-180deg);   -ms-transform: rotate(-180deg);   -o-transform: rotate(-180deg);   transform: rotate(-180deg); }   .menu > .four:hover ~ .circle {   -webkit-transform: rotate(-270deg);   -moz-transform: rotate(-270deg);   -ms-transform: rotate(-270deg);   -o-transform: rotate(-270deg);   transform: rotate(-270deg); }>
  
    One     Two     Three     Four       
      
            
  • 1
  •         
  • 2
  •         
  • 3
  •         
  • 4
  •       
    
    
/*MAIN CIRCLE*/ .circle {   position: relative;   margin-top: 30px;   margin-bottom: 20px;   margin-left: 25px;   width: 300px;   height: 300px;   border-radius: 50%;   background: #093b62;     box-shadow: inset 0px 0px 30px rgba(0,0,0,0.3);   -webkit-box-shadow: inset 0px 0px 30px rgba(0,0,0,0.3);     -webkit-transition: all 0.5s ease;   -moz-transition: all 0.5s ease;   -ms-transition: all 0.5s ease;   -o-transition: all 0.5s ease;   transition: all 0.5s ease; } 2 3 4 5 6 7 8 9 10 11 12 .menu a {   margin-right: -4px;   padding: 10px 30px;   width: 50px;   color: #333;   text-decoration: none;   font: 15px/25px Helvetica, Arial, sans-serif; }   .menu a:hover {   background: #eee; } /*LITTLE CIRCLES*/ .circle li {   position: absolute;   width: 50px;   height: 50px;   border-radius: 50%;   background: white;   list-style: none;   text-align: center;   font: 20px/50px Helvetica, Arial, sans-serif; } 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 .circle li:nth-child(1) {   top: 15px;   left: 125px; }   .circle li:nth-child(2) {   top: 125px;   left: 235px;   -webkit-transform: rotate(90deg);   -moz-transform: rotate(90deg);   -ms-transform: rotate(90deg);   -o-transform: rotate(90deg);   transform: rotate(90deg); }   .circle li:nth-child(3) {   top: 235px;   left: 125px;   -webkit-transform: rotate(180deg);   -moz-transform: rotate(180deg);   -ms-transform: rotate(180deg);   -o-transform: rotate(180deg);   transform: rotate(180deg); }   .circle li:nth-child(4) {   top: 125px;   left: 15px;   -webkit-transform: rotate(270deg);   -moz-transform: rotate(270deg);   -ms-transform: rotate(270deg);   -o-transform: rotate(270deg);   transform: rotate(270deg); } 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 /*INNER CIRCLE*/ .wrapper:before {   content: "DS";   text-align: center;   font: 70px/135px Georgia, Times, serif;   color: #efefef;   position: absolute;   top: 140px;   left: 110px;   z-index: 10;   width: 130px;   height: 130px;   border-radius: 50%;   background: #fff;     -webkit-box-shadow: 3px 3px 10px rgba(0,0,0,0.3);   box-shadow: 3px 3px 10px rgba(0,0,0,0.3); } /*HOVER STATES*/ .menu > .one:hover ~ .circle {   -webkit-transform: rotate(0deg);   -moz-transform: rotate(0deg);   -ms-transform: rotate(0deg);   -o-transform: rotate(0deg);   transform: rotate(0deg); }   .menu > .two:hover ~ .circle {   -webkit-transform: rotate(-90deg);   -moz-transform: rotate(-90deg);   -ms-transform: rotate(-90deg);   -o-transform: rotate(-90deg);   transform: rotate(-90deg); }   .menu > .three:hover ~ .circle {   -webkit-transform: rotate(-180deg);   -moz-transform: rotate(-180deg);   -ms-transform: rotate(-180deg);   -o-transform: rotate(-180deg);   transform: rotate(-180deg); }   .menu > .four:hover ~ .circle {   -webkit-transform: rotate(-270deg);   -moz-transform: rotate(-270deg);   -ms-transform: rotate(-270deg);   -o-transform: rotate(-270deg);   transform: rotate(-270deg); }
Powered by Create your own unique website with customizable templates.