Rotating Card
CEO
"I'm the new Sinatra, and since I made it here I can make it anywhere, yeah, they love me everywhere"
Web design, Adobe Photoshop, HTML5, CSS3, Corel and many others...
Followers
Following
Projects
Web Developer
"Lamborghini Mercy Your chick she so thirsty I'm in that two seat Lambo"
Product Manager
</> Get The Code:
<div class="container"> <div class="row"> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="/Portals/_default/Skins/University/Images/DnnImage02.jpg"/> </div> <div class="user"> <img class="img-circle" src="/Portals/_default/Skins/University/Images/caroimg2.jpg"/> </div> <div class="content"> <div class="main"> <h3 class="name">John Marvel</h3> <p class="profession">CEO</p> <p class="text-center">"I'm the new Sinatra, and since I made it here I can make it anywhere, yeah, they love me everywhere"</p> </div> <div class="footer"> <i class="fa fa-mail-forward"></i> Auto Rotation </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto">"To be or not to be, this is my awesome motto!"</h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Job Description</h4> <p class="text-center">Web design, Adobe Photoshop, HTML5, CSS3, Corel and many others...</p> <div class="stats-container"> <div class="stats"> <h4>235</h4> <p> Followers </p> </div> <div class="stats"> <h4>114</h4> <p> Following </p> </div> <div class="stats"> <h4>35</h4> <p> Projects </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="#" class="facebook"><i class="fa fa-facebook fa-fw"></i></a> <a href="#" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="#" class="twitter"><i class="fa fa-twitter fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> <!-- end col sm 3 --> <div class="col-md-4 col-sm-6"> <div class="card-container manual-flip"> <div class="card"> <div class="front"> <div class="cover"> <img src="/Portals/_default/Skins/University/Images/DnnImage08.jpg"/> </div> <div class="user"> <img class="img-circle" src="/Portals/_default/Skins/University/Images/caroimg3.jpg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Andrew Mike</h3> <p class="profession">Web Developer</p> <p class="text-center">"Lamborghini Mercy <br>Your chick she so thirsty <br>I'm in that two seat Lambo"</p> </div> <div class="footer"> <button class="btn btn-simple" onclick="rotateCard(this)"> <i class="fa fa-mail-forward"></i> Manual Rotation </button> </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto">"To be or not to be, this is my awesome motto!"</h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Job Description</h4> <p class="text-center">Web design, Adobe Photoshop, HTML5, CSS3, Corel and many others...</p> <div class="stats-container"> <div class="stats"> <h4>235</h4> <p> Followers </p> </div> <div class="stats"> <h4>114</h4> <p> Following </p> </div> <div class="stats"> <h4>35</h4> <p> Projects </p> </div> </div> </div> </div> <div class="footer"> <button class="btn btn-simple" rel="tooltip" title="Flip Card" onclick="rotateCard(this)"> <i class="fa fa-reply"></i> Back </button> <div class="social-links text-center"> <a href="#" class="facebook"><i class="fa fa-facebook fa-fw"></i></a> <a href="#" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="#" class="twitter"><i class="fa fa-twitter fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> <!-- end col sm 3 --> <div class="col-md-4 col-sm-6"> <div class="card-container"> <div class="card"> <div class="front"> <div class="cover"> <img src="/Portals/_default/Skins/University/Images/DnnImage05.jpg"/> </div> <div class="user"> <img class="img-circle" src="/Portals/_default/Skins/University/Images/caroimg1.jpg"/> </div> <div class="content"> <div class="main"> <h3 class="name">Inna Corman</h3> <p class="profession">Product Manager</p> <p class="text-center">"I'm the new Sinatra, and since I made it here I can make it anywhere, yeah, they love me everywhere"</p> </div> <div class="footer"> <div class="rating"> <i class="fa fa-mail-forward"></i> Auto Rotation </div> </div> </div> </div> <!-- end front panel --> <div class="back"> <div class="header"> <h5 class="motto">"To be or not to be, this is my awesome motto!"</h5> </div> <div class="content"> <div class="main"> <h4 class="text-center">Job Description</h4> <p class="text-center">Web design, Adobe Photoshop, HTML5, CSS3, Corel and many others...</p> <div class="stats-container"> <div class="stats"> <h4>235</h4> <p> Followers </p> </div> <div class="stats"> <h4>114</h4> <p> Following </p> </div> <div class="stats"> <h4>35</h4> <p> Projects </p> </div> </div> </div> </div> <div class="footer"> <div class="social-links text-center"> <a href="#" class="facebook"><i class="fa fa-facebook fa-fw"></i></a> <a href="#" class="google"><i class="fa fa-google-plus fa-fw"></i></a> <a href="#" class="twitter"><i class="fa fa-twitter fa-fw"></i></a> </div> </div> </div> <!-- end back panel --> </div> <!-- end card --> </div> <!-- end card-container --> </div> <!-- end col-sm-3 --> </div> <!-- end row --> </div>
89 11 153 rd st Apt# 4L Jamaica,Queens New York-11432
P: (123) 456.7895
500.600.6789
dnnvista@gmail.com