Advertisement
cornford-michael

ui-48

Oct 2nd, 2017
630
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 14.38 KB | None | 0 0
  1. <!-- UI - X Starts -->
  2.         <div class="ui-48">
  3.             <div class="container">
  4.                 <div class="row">
  5.                     <div class="col-md-3 col-sm-6 col-xs-12">
  6.                         <!-- Item Starts -->
  7.                         <div class="ui-item">
  8.                             <!-- Company Name -->
  9.                             <h2><a href="#">New York Library</a></h2>
  10.                             <hr/>  
  11.                             <!-- Company Logo -->
  12.                             <a href="#"><img src="img/ui-48/1.png" alt="" class="img-responsive" /></a>
  13.                             <!-- Report Starts -->
  14.                             <div class="ui-report">
  15.                                 <div class="container-fluid">
  16.                                     <div class="row">
  17.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  18.                                             <!-- Report Item -->
  19.                                             <div class="r-item bor-right">
  20.                                                 <!-- Big Heading -->
  21.                                                 <h3 class="lblue">$12,000</h3>
  22.                                                 <!-- Heading -->
  23.                                                 <h4>Lorem</h4>
  24.                                             </div>
  25.                                         </div>
  26.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  27.                                             <!-- Report Item -->
  28.                                             <div class="r-item">
  29.                                                 <!-- Big Heading -->
  30.                                                 <h3 class="lblue">25%</h3>
  31.                                                 <!-- Heading -->
  32.                                                 <h4>Lipsum</h4>
  33.                                             </div>
  34.                                         </div>
  35.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  36.                                             <!-- Report Item -->
  37.                                             <div class="r-item bor-right bor-bottom">
  38.                                                 <!-- Big Heading -->
  39.                                                 <h3 class="lblue">$10,000</h3>
  40.                                                 <!-- Heading -->
  41.                                                 <h4>Contrary</h4>
  42.                                             </div>
  43.                                         </div>
  44.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  45.                                             <!-- Report Item -->
  46.                                             <div class="r-item bor-bottom">
  47.                                                 <!-- Big Heading -->
  48.                                                 <h3 class="lblue">78%</h3>
  49.                                                 <!-- Heading -->
  50.                                                 <h4>Hamphey</h4>
  51.                                             </div>
  52.                                         </div>
  53.                                     </div>
  54.                                 </div>
  55.                             </div>
  56.                             <!-- Report Ends -->   
  57.                             <!-- Contact Starts -->
  58.                             <div class="ui-contact text-left">
  59.                                 <!-- Heading -->
  60.                                 <h4>Contact</h4>
  61.                                 <!-- Details -->
  62.                                 <div class="ui-details clearfix">
  63.                                     <!-- Address -->
  64.                                     <!-- Icon -->
  65.                                     <i class="fa fa-home"></i>
  66.                                     <!-- Content -->
  67.                                     <span>
  68.                                         #46/4, Hosapalya, Muneshwara Nagar,
  69.                                         Bengaluru, Karnataka - 560068
  70.                                     </span>
  71.                                 </div>
  72.                                 <!-- Details -->
  73.                                 <div class="ui-details clearfix">
  74.                                     <!-- Phone -->
  75.                                     <!-- Icon -->
  76.                                     <i class="fa fa-phone"></i>
  77.                                     <!-- Content -->
  78.                                     <span>080 4120 1512</span>
  79.                                 </div>
  80.                                 <!-- Details -->   
  81.                                 <div class="ui-details clearfix">
  82.                                     <!-- Email -->
  83.                                     <!-- Icon -->
  84.                                     <i class="fa fa-envelope"></i>
  85.                                     <!-- Content -->
  86.                                     <span><a href="#">lorem@yahoo.com</a></span>
  87.                                 </div> 
  88.                                 <!-- Details -->
  89.                                 <div class="ui-details clearfix">
  90.                                     <!-- Website -->
  91.                                     <!-- Icon -->
  92.                                     <i class="fa fa-globe"></i>
  93.                                     <!-- Content -->
  94.                                     <span><a href="#">newyorklibrary.com</a></span>
  95.                                 </div> 
  96.                             </div>
  97.                             <!-- Contact Ends -->
  98.                             <!-- Social Icon Starts -->
  99.                             <div class="ui-social text-left">
  100.                                 <!-- Facebook -->
  101.                                 <a href="#"><i class="fa fa-facebook facebook"></i></a>
  102.                                 <!-- Twitter -->
  103.                                 <a href="#"><i class="fa fa-twitter twitter"></i></a>
  104.                                 <!-- LinkedIn -->
  105.                                 <a href="#"><i class="fa fa-linkedin linkedin"></i></a>
  106.                                 <!-- Google - Plus -->
  107.                                 <a href="#"><i class="fa fa-google-plus google-plus"></i></a>
  108.                                 <a href="#"><i class="fa fa-skype skype"></i></a>
  109.                             </div>
  110.                             <!-- Social Icon Ends -->
  111.                         </div>
  112.                         <!-- Item Ends -->
  113.                     </div>
  114.                    
  115.                     <div class="col-md-3 col-sm-6 col-xs-12">
  116.                         <!-- Item Starts -->
  117.                         <div class="ui-item">
  118.                             <!-- Company Name -->
  119.                             <h2><a href="#">Capricon</a></h2>
  120.                             <hr/>  
  121.                             <!-- Company Logo -->
  122.                             <a href="#"><img src="img/ui-48/2.png" alt="" class="img-responsive" /></a>
  123.                             <!-- Report Starts -->
  124.                             <div class="ui-report">
  125.                                 <div class="container-fluid">
  126.                                     <div class="row">
  127.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  128.                                             <!-- Report Item -->
  129.                                             <div class="r-item bor-right">
  130.                                                 <!-- Big Heading -->
  131.                                                 <h3 class="lblue">$2,000</h3>
  132.                                                 <!-- Heading -->
  133.                                                 <h4>dolorem</h4>
  134.                                             </div>
  135.                                         </div>
  136.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  137.                                             <!-- Report Item -->
  138.                                             <div class="r-item">
  139.                                                 <!-- Big Heading -->
  140.                                                 <h3 class="lblue">0.25%</h3>
  141.                                                 <!-- Heading -->
  142.                                                 <h4>nostrud</h4>
  143.                                             </div>
  144.                                         </div>
  145.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  146.                                             <!-- Report Item -->
  147.                                             <div class="r-item bor-right bor-bottom">
  148.                                                 <!-- Big Heading -->
  149.                                                 <h3 class="lblue">$1,000</h3>
  150.                                                 <!-- Heading -->
  151.                                                 <h4>commodo</h4>
  152.                                             </div>
  153.                                         </div>
  154.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  155.                                             <!-- Report Item -->
  156.                                             <div class="r-item bor-bottom">
  157.                                                 <!-- Big Heading -->
  158.                                                 <h3 class="lblue">8%</h3>
  159.                                                 <!-- Heading -->
  160.                                                 <h4>deserunt</h4>
  161.                                             </div>
  162.                                         </div>
  163.                                     </div>
  164.                                 </div>
  165.                             </div>
  166.                             <!-- Report Ends -->   
  167.                             <!-- Contact Starts -->
  168.                             <div class="ui-contact text-left">
  169.                                 <!-- Heading -->
  170.                                 <h4>Contact</h4>
  171.                                 <!-- Details -->
  172.                                 <div class="ui-details clearfix">
  173.                                     <!-- Address -->
  174.                                     <!-- Icon -->
  175.                                     <i class="fa fa-home"></i>
  176.                                     <!-- Content -->
  177.                                     <span>
  178.                                         #23 Epip Zone, Whitefield,
  179.                                         opp. ITPL Tech park,
  180.                                         Bengaluru, Karnataka - 560068
  181.                                     </span>
  182.                                 </div>
  183.                                 <!-- Details -->
  184.                                 <div class="ui-details clearfix">
  185.                                     <!-- Phone -->
  186.                                     <!-- Icon -->
  187.                                     <i class="fa fa-phone"></i>
  188.                                     <!-- Content -->
  189.                                     <span>080 4331 1555</span>
  190.                                 </div>
  191.                                 <!-- Details -->   
  192.                                 <div class="ui-details clearfix">
  193.                                     <!-- Email -->
  194.                                     <!-- Icon -->
  195.                                     <i class="fa fa-envelope"></i>
  196.                                     <!-- Content -->
  197.                                     <span><a href="#">hamphy@yahoo.com</a></span>
  198.                                 </div> 
  199.                                 <!-- Details -->
  200.                                 <div class="ui-details clearfix">
  201.                                     <!-- Website -->
  202.                                     <!-- Icon -->
  203.                                     <i class="fa fa-globe"></i>
  204.                                     <!-- Content -->
  205.                                     <span><a href="#">capricon.com</a></span>
  206.                                 </div> 
  207.                             </div>
  208.                             <!-- Contact Ends -->
  209.                             <!-- Social Icon Starts -->
  210.                             <div class="ui-social text-left">
  211.                                 <!-- Facebook -->
  212.                                 <a href="#"><i class="fa fa-facebook facebook"></i></a>
  213.                                 <!-- Twitter -->
  214.                                 <a href="#"><i class="fa fa-twitter twitter"></i></a>
  215.                                 <!-- LinkedIn -->
  216.                                 <a href="#"><i class="fa fa-linkedin linkedin"></i></a>
  217.                                 <!-- Google - Plus -->
  218.                                 <a href="#"><i class="fa fa-google-plus google-plus"></i></a>
  219.                                 <a href="#"><i class="fa fa-skype skype"></i></a>
  220.                             </div>
  221.                             <!-- Social Icon Ends -->
  222.                         </div>
  223.                         <!-- Item Ends -->
  224.                     </div>
  225.                    
  226.                     <div class="col-md-3 col-sm-6 col-xs-12">
  227.                         <!-- Item Starts -->
  228.                         <div class="ui-item">
  229.                             <!-- Company Name -->
  230.                             <h2><a href="#">MacoRooms</a></h2>
  231.                             <hr/>  
  232.                             <!-- Company Logo -->
  233.                             <a href="#"><img src="img/ui-48/3.png" alt="" class="img-responsive" /></a>
  234.                             <!-- Report Starts -->
  235.                             <div class="ui-report">
  236.                                 <div class="container-fluid">
  237.                                     <div class="row">
  238.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  239.                                             <!-- Report Item -->
  240.                                             <div class="r-item bor-right">
  241.                                                 <!-- Big Heading -->
  242.                                                 <h3 class="lblue">$6,000</h3>
  243.                                                 <!-- Heading -->
  244.                                                 <h4>inventore</h4>
  245.                                             </div>
  246.                                         </div>
  247.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  248.                                             <!-- Report Item -->
  249.                                             <div class="r-item">
  250.                                                 <!-- Big Heading -->
  251.                                                 <h3 class="lblue">20%</h3>
  252.                                                 <!-- Heading -->
  253.                                                 <h4>veritatis</h4>
  254.                                             </div>
  255.                                         </div>
  256.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  257.                                             <!-- Report Item -->
  258.                                             <div class="r-item bor-right bor-bottom">
  259.                                                 <!-- Big Heading -->
  260.                                                 <h3 class="lblue">$8,000</h3>
  261.                                                 <!-- Heading -->
  262.                                                 <h4>voluptate</h4>
  263.                                             </div>
  264.                                         </div>
  265.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  266.                                             <!-- Report Item -->
  267.                                             <div class="r-item bor-bottom">
  268.                                                 <!-- Big Heading -->
  269.                                                 <h3 class="lblue">89%</h3>
  270.                                                 <!-- Heading -->
  271.                                                 <h4>tempora</h4>
  272.                                             </div>
  273.                                         </div>
  274.                                     </div>
  275.                                 </div>
  276.                             </div>
  277.                             <!-- Report Ends -->   
  278.                             <!-- Contact Starts -->
  279.                             <div class="ui-contact text-left">
  280.                                 <!-- Heading -->
  281.                                 <h4>Contact</h4>
  282.                                 <!-- Details -->
  283.                                 <div class="ui-details clearfix">
  284.                                     <!-- Address -->
  285.                                     <!-- Icon -->
  286.                                     <i class="fa fa-home"></i>
  287.                                     <!-- Content -->
  288.                                     <span>
  289.                                         #56-A, Wipro Gate No. 5,
  290.                                         Electronic City Phase1, Bengaluru, Karnataka - 560100
  291.                                     </span>
  292.                                 </div>
  293.                                 <!-- Details -->
  294.                                 <div class="ui-details clearfix">
  295.                                     <!-- Phone -->
  296.                                     <!-- Icon -->
  297.                                     <i class="fa fa-phone"></i>
  298.                                     <!-- Content -->
  299.                                     <span>080 4040 9090</span>
  300.                                 </div>
  301.                                 <!-- Details -->   
  302.                                 <div class="ui-details clearfix">
  303.                                     <!-- Email -->
  304.                                     <!-- Icon -->
  305.                                     <i class="fa fa-envelope"></i>
  306.                                     <!-- Content -->
  307.                                     <span><a href="#">lipsum@yahoo.com</a></span>
  308.                                 </div> 
  309.                                 <!-- Details -->
  310.                                 <div class="ui-details clearfix">
  311.                                     <!-- Website -->
  312.                                     <!-- Icon -->
  313.                                     <i class="fa fa-globe"></i>
  314.                                     <!-- Content -->
  315.                                     <span><a href="#">macorooms.com</a></span>
  316.                                 </div> 
  317.                             </div>
  318.                             <!-- Contact Ends -->
  319.                             <!-- Social Icon Starts -->
  320.                             <div class="ui-social text-left">
  321.                                 <!-- Facebook -->
  322.                                 <a href="#"><i class="fa fa-facebook facebook"></i></a>
  323.                                 <!-- Twitter -->
  324.                                 <a href="#"><i class="fa fa-twitter twitter"></i></a>
  325.                                 <!-- LinkedIn -->
  326.                                 <a href="#"><i class="fa fa-linkedin linkedin"></i></a>
  327.                                 <!-- Google - Plus -->
  328.                                 <a href="#"><i class="fa fa-google-plus google-plus"></i></a>
  329.                                 <a href="#"><i class="fa fa-skype skype"></i></a>
  330.                             </div>
  331.                             <!-- Social Icon Ends -->
  332.                         </div>
  333.                         <!-- Item Ends -->
  334.                     </div>
  335.                    
  336.                     <div class="col-md-3 col-sm-6 col-xs-12">
  337.                         <!-- Item Starts -->
  338.                         <div class="ui-item">
  339.                             <!-- Company Name -->
  340.                             <h2><a href="#">GoGreen</a></h2>
  341.                             <hr/>  
  342.                             <!-- Company Logo -->
  343.                             <a href="#"><img src="img/ui-48/5.png" alt="" class="img-responsive" /></a>
  344.                             <!-- Report Starts -->
  345.                             <div class="ui-report">
  346.                                 <div class="container-fluid">
  347.                                     <div class="row">
  348.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  349.                                             <!-- Report Item -->
  350.                                             <div class="r-item bor-right">
  351.                                                 <!-- Big Heading -->
  352.                                                 <h3 class="lblue">$32,000</h3>
  353.                                                 <!-- Heading -->
  354.                                                 <h4>perspiciatis</h4>
  355.                                             </div>
  356.                                         </div>
  357.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  358.                                             <!-- Report Item -->
  359.                                             <div class="r-item">
  360.                                                 <!-- Big Heading -->
  361.                                                 <h3 class="lblue">45%</h3>
  362.                                                 <!-- Heading -->
  363.                                                 <h4>beatae</h4>
  364.                                             </div>
  365.                                         </div>
  366.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  367.                                             <!-- Report Item -->
  368.                                             <div class="r-item bor-right bor-bottom">
  369.                                                 <!-- Big Heading -->
  370.                                                 <h3 class="lblue">$60,000</h3>
  371.                                                 <!-- Heading -->
  372.                                                 <h4>pleasure</h4>
  373.                                             </div>
  374.                                         </div>
  375.                                         <div class="col-md-6 col-sm-6 col-xs-6 col-pad">
  376.                                             <!-- Report Item -->
  377.                                             <div class="r-item bor-bottom">
  378.                                                 <!-- Big Heading -->
  379.                                                 <h3 class="lblue">28%</h3>
  380.                                                 <!-- Heading -->
  381.                                                 <h4>pursue</h4>
  382.                                             </div>
  383.                                         </div>
  384.                                     </div>
  385.                                 </div>
  386.                             </div>
  387.                             <!-- Report Ends -->   
  388.                             <!-- Contact Starts -->
  389.                             <div class="ui-contact text-left">
  390.                                 <!-- Heading -->
  391.                                 <h4>Contact</h4>
  392.                                 <!-- Details -->
  393.                                 <div class="ui-details clearfix">
  394.                                     <!-- Address -->
  395.                                     <!-- Icon -->
  396.                                     <i class="fa fa-home"></i>
  397.                                     <!-- Content -->
  398.                                     <span>
  399.                                         #54B/55A, Hosur Main Road, Electronics City Phase 1,
  400.                                         Bengaluru, Karnataka - 560013
  401.                                     </span>
  402.                                 </div>
  403.                                 <!-- Details -->
  404.                                 <div class="ui-details clearfix">
  405.                                     <!-- Phone -->
  406.                                     <!-- Icon -->
  407.                                     <i class="fa fa-phone"></i>
  408.                                     <!-- Content -->
  409.                                     <span>080 4423 2323</span>
  410.                                 </div>
  411.                                 <!-- Details -->   
  412.                                 <div class="ui-details clearfix">
  413.                                     <!-- Email -->
  414.                                     <!-- Icon -->
  415.                                     <i class="fa fa-envelope"></i>
  416.                                     <!-- Content -->
  417.                                     <span><a href="#">contrary@yahoo.com</a></span>
  418.                                 </div> 
  419.                                 <!-- Details -->
  420.                                 <div class="ui-details clearfix">
  421.                                     <!-- Website -->
  422.                                     <!-- Icon -->
  423.                                     <i class="fa fa-globe"></i>
  424.                                     <!-- Content -->
  425.                                     <span><a href="#">gogreen.com</a></span>
  426.                                 </div> 
  427.                             </div>
  428.                             <!-- Contact Ends -->
  429.                             <!-- Social Icon Starts -->
  430.                             <div class="ui-social text-left">
  431.                                 <!-- Facebook -->
  432.                                 <a href="#"><i class="fa fa-facebook facebook"></i></a>
  433.                                 <!-- Twitter -->
  434.                                 <a href="#"><i class="fa fa-twitter twitter"></i></a>
  435.                                 <!-- LinkedIn -->
  436.                                 <a href="#"><i class="fa fa-linkedin linkedin"></i></a>
  437.                                 <!-- Google - Plus -->
  438.                                 <a href="#"><i class="fa fa-google-plus google-plus"></i></a>
  439.                                 <!-- Skype -->
  440.                                 <a href="#"><i class="fa fa-skype skype"></i></a>
  441.                             </div>
  442.                             <!-- Social Icon Ends -->
  443.                         </div>
  444.                         <!-- Item Ends -->
  445.                     </div>
  446.                 </div>
  447.             </div>
  448.         </div>
  449.         <!-- UI - X Starts -->
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement