|
|
| (221 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| | + | {{CSS/Main}} |
| | + | |
| | + | <html> |
| | | | |
| - | <!DOCTYPE html>
| |
| - | <!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
| |
| - | <!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
| |
| - | <!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
| |
| - | <!--[if (gte IE 9)|!(IE)]><!--><html lang="en"> <!--<![endif]-->
| |
| | <head> | | <head> |
| | | | |
| - | <!-- Basic Page Needs
| + | <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> |
| - | ================================================== --> | + | <meta name="description" content="Team ITESM - Guadalajara Wiki for the iGEM competition of 2014"> |
| - | <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
| + | <meta name="keywords" content="iGEM, Chitosan, 2014, ITESM Guadalajara, Wiki"> |
| - | <title>Ascend-Paralax Responsive Single page</title>
| + | <meta name="author" content="Irving Fernando Alvarez Vazquez, Oswaldo Avalos"> |
| - | <meta name="robots" content="index, follow" />
| + | <meta name="title" content="Team ITESM - Guadalajara Wiki"> |
| - | <meta name="keywords" content="" />
| + | |
| - | <meta name="description" content="" />
| + | |
| - | <meta name="author" content="" />
| + | |
| | | | |
| - | <!-- Mobile Specific Metas
| + | <!-- External scripts --> |
| - | ================================================== -->
| + | <link href='http://fonts.googleapis.com/css?family=Open+Sans:400,600' |
| - | <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
| + | rel='stylesheet' type='text/css'> |
| | + | <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script> |
| | + | <link href='http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:400,300,700' rel='stylesheet' type='text/css'> |
| | + | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css"> |
| | + | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script> |
| | | | |
| - | <!-- CSS
| + | <!-- Functionallity and behaviour JS --> |
| - | ================================================== -->
| + | <script> |
| - |
| + | |
| - | <link rel="stylesheet" href="style.css"/>
| + | |
| | | | |
| - | <link rel="stylesheet" type="text/css" href="css/main.css"> | + | $(document).ready(function(){ |
| | | | |
| - | <link rel="stylesheet" type="text/css" href="revolution/css/style.css" media="screen" /> <!-- SLIDER REVOLUTION 4.x CSS SETTINGS -->
| + | //Loading screen functionallity |
| - |
| + | $('.loading').animate( |
| - | <link rel="stylesheet" type="text/css" href="revolution/rs-plugin/css/settings.css" media="screen" /> <!-- SLIDER REVOLUTION 4.x CSS SETTINGS -->
| + | {opacity:0}, |
| | + | 500, |
| | + | function(){ |
| | + | $('.loading').attr("style", "display:none"); |
| | + | } |
| | + | ); |
| | | | |
| - |
| + | //Height responsiveness |
| | + | $(window).resize(function() { |
| | + | wheight = $(window).height(); |
| | + | $('.container').attr("style","height:"+(wheight)+"px;background-size:cover;"); |
| | + | $('.team-member-container').attr("style","height:"+wheight/2.7+"px;"); |
| | + | }); |
| | | | |
| - | </head>
| + | $(window).trigger('resize'); |
| | | | |
| - | <body>
| + | //Menu moveto container on item click functionallity |
| | + | $('.menu-item').on('click', function(){ |
| | + | $('.menu-item').removeClass('subselected'); |
| | + | $(this).addClass('subselected'); |
| | + | if($(this).attr("data")=="#top"){ |
| | + | $('html, body').animate({ |
| | + | scrollTop: 0 |
| | + | }, 1000); |
| | + | }else{ |
| | + | $('html, body').animate({ |
| | + | scrollTop: $($(this).attr("data")).offset().top-70 |
| | + | }, 1000); |
| | + | } |
| | + | }); |
| | | | |
| - | <div id="wrapper">
| + | //Hover of team members |
| - | <header class="header_wrap"> <!--Header-->
| + | $('.team-member-container').on('mouseenter', function(){ |
| - | <div class="container"> | + | $(this).children('.team-member-photo').attr("style", "background-image:url('"+$(this).attr("hover")+"');"); |
| - | <div class="row">
| + | $(this).on('mouseleave', function(){ |
| - | <div class="col-md-12">
| + | $(this).children('.team-member-photo').attr('style', "background-image:url('"+$(this).attr("data")+"');"); |
| - | <div class="header_left">
| + | }); |
| - | <a href="index.html"><img src="images/logo.png" alt="logo"></a>
| + | }); |
| - | </div>
| + | |
| | | | |
| - | <div class="serch_bar">
| + | }); |
| - | <i class="icon-search"></i>
| + | |
| - | </div>
| + | </script> |
| | | | |
| - | <div class="header_right">
| + | <style> |
| - | <nav class="menu main_menu" id="main-menu">
| + | body, |
| - | <div id="mobnav-btn"><span class="icon-menu-3"></span>Menu</div>
| + | html{ |
| - | <ul class="sf-menu nav main-menu" id="thumbs">
| + | margin: 0; |
| - | <li><a id="first_home" href="#top">Home</a></li>
| + | padding:0; |
| - | <li><a href="#service">Service</a></li>
| + | font-family: font-family: 'Yanone Kaffeesatz', sans-serif; |
| - | <li><a href="#portfolio">Portfolio</a></li>
| + | } |
| - | <li><a href="#about">About us</a></li>
| + | |
| - | <li><a href="#blog">Blog</a></li>
| + | |
| - | <li><a href="#pricing">Pricing table</a></li>
| + | |
| - | <li><a href="#contact">Contact</a></li>
| + | |
| - | <li class="more_menu"><a href="#">More</a>
| + | |
| - | <div class="mobnav-subarrow icon-arrow-down-4"></div>
| + | |
| - | <ul class="more_menu_potion">
| + | |
| - | <li><a href="shortcode.html" class="">Shortcode</a></li>
| + | |
| - | <li><a href="single-half-portfolio.html" class="">Portfolio (half width)</a></li>
| + | |
| - | <li><a href="single-full-portfolio.html" class="">Portfolio (full width)</a></li>
| + | |
| - | <li><a href="single-blog.html" class="">Blog single Post Page</a></li>
| + | |
| - | </ul>
| + | |
| - | </li>
| + | |
| - | </ul>
| + | |
| - | <div class="clear"></div>
| + | |
| - | </nav>
| + | |
| - | </div>
| + | |
| - | <div class="clear"></div>
| + | |
| - | </div>
| + | |
| - | </div><!-- /.row -->
| + | |
| - | </div><!--Container-->
| + | |
| - | <div class="clear"></div>
| + | |
| - | </header><!-- /.col --> <!--End Header--> | + | |
| - | <div class="slider_menu"> <!--Header-->
| + | |
| - | <div class="container">
| + | |
| - | <div class="row">
| + | |
| - | <div class="col-md-12">
| + | |
| - | <div class="header_left">
| + | |
| - | <a href="index.html"><img src="images/logo_1.png" alt="logo"></a>
| + | |
| - | </div>
| + | |
| | | | |
| - | <div class="serch_bar">
| + | /* REMOVE UNWANTED ELEMENTS AND STYLE OTHERS */ |
| - | <i class="icon-search"></i>
| + | .firstHeading{ |
| - | </div>
| + | display:none; |
| | + | } |
| | + | #top-section{ |
| | + | background:#48af5d; |
| | + | margin-left:0 !important; |
| | + | width:100%; |
| | + | left:0; |
| | + | } |
| | | | |
| - | <div class="header_right">
| |
| - | <nav class="menu main_menu" id="main-menu-2">
| |
| - | <div id="mobnav-btn-2"><span class="icon-menu-3"></span>Menu</div>
| |
| - | <ul class="sf-menu nav main-menu" id="thumbs-2">
| |
| - | <li><a href="#top">Home</a></li>
| |
| - | <li><a href="#service">Service</a></li>
| |
| - | <li><a href="#portfolio">Portfolio</a></li>
| |
| - | <li><a href="#about">About us</a></li>
| |
| - | <li><a href="#blog">Blog</a></li>
| |
| - | <li><a href="#pricing">Pricing table</a></li>
| |
| - | <li><a href="#contact">Contact</a></li>
| |
| - | <li class="more_menu"><a href="#">More</a>
| |
| - | <div class="mobnav-subarrow icon-arrow-down-4"></div>
| |
| - | <ul class="more_menu_potion">
| |
| - | <li><a href="shortcode.html" class="">Shortcode</a></li>
| |
| - | <li><a href="single-half-portfolio.html" class="">Portfolio (half width)</a></li>
| |
| - | <li><a href="single-full-portfolio.html" class="">Portfolio (full width)</a></li>
| |
| - | <li><a href="single-blog.html" class="">Blog single Post Page</a></li>
| |
| - | </ul>
| |
| - | </li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </nav>
| |
| - | </div>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div><!-- /.row -->
| |
| - | </div><!--Container-->
| |
| - | <div class="clear"></div>
| |
| - | </div><!-- /.col --> <!--End div Header-->
| |
| - | <div class="search_box">
| |
| - | <div class="container">
| |
| - | <div class="search_input">
| |
| - | <form action="#">
| |
| - | <input type="text" value="Search here .." class="search_input_item" name="subscrib" onblur="if (this.value == ''){this.value = 'Search here ..';}" onfocus="if (this.value == 'Search here ..'){this.value = '';}">
| |
| - | <input type="submit" class="search_submit">
| |
| - | </form>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class="slider_wrap" id="top"> | + | /* LOADING SCREEN */ |
| - | <div class="slider">
| + | .loading{ |
| - | <!-- START REVOLUTION SLIDER 3.1 rev5 fullwidth mode -->
| + | position:fixed; |
| | + | width:100%; |
| | + | height:100%; |
| | + | top:0; |
| | + | left:0; |
| | | | |
| - | <div class="tp-banner-container green">
| + | z-index:5; |
| - | <div class="tp-banner" >
| + | |
| - | <ul>
| + | |
| - | <!-- SLIDE 1 -->
| + | |
| - | <li data-transition="fade" data-slotamount="5" data-masterspeed="700" >
| + | |
| - | <!-- MAIN IMAGE -->
| + | |
| - | <img src="revolution/images/slider_4.jpg" alt="slidebg1" data-bgfit="cover" data-bgposition="center center" data-bgrepeat="no-repeat">
| + | |
| | | | |
| - | <!-- LAYERS -->
| + | background-color:#555; |
| - | <!-- LAYER NR. 1 -->
| + | color:#fff; |
| - | <div class="tp-caption sfb"
| + | text-align: center; |
| - | data-x="center"
| + | } |
| - | data-y="180"
| + | .loading p{ |
| - | data-speed="1000"
| + | position: relative; |
| - | data-start="700"
| + | width:100%; |
| - | data-easing="Power4.easeOut"
| + | height:10%; |
| - | data-endspeed="300"
| + | top:45%; |
| - | data-endeasing="Power1.easeIn"
| + | left:0; |
| - | data-captionhidden="off"
| + | } |
| - | style="font-weight: 700; font-size:50px; color: #fff; text-transform: uppercase; font-family:'Agency FB'">A Perfect Single Page Template
| + | |
| - | </div>
| + | |
| | | | |
| - | <!-- LAYER NR. 2 -->
| + | /* MENU STYLING */ |
| - | <div class="tp-caption sfb slider_conter_text"
| + | .menu{ |
| - | data-x="center"
| + | position:fixed; |
| - | data-y="217"
| + | width:100%; |
| - | data-speed="1000"
| + | height:56px; |
| - | data-start="700"
| + | top:14px; |
| - | data-easing="Power4.easeOut"
| + | background-color: #47a3da; |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off"
| + | |
| - | style="font-weight: 400; font-size:35px; line-height: 54px; color: #fff; text-transform: uppercase; font-family:'adele'; text-align:center;">Visually aesthetic & eye catchy design
| + | |
| - | </div>
| + | |
| - | <!-- LAYER NR. 3 -->
| + | |
| - | <div class="tp-caption sfb btn"
| + | |
| - | data-x="center"
| + | |
| - | data-y="294"
| + | |
| - | data-speed="1000"
| + | |
| - | data-start="700"
| + | |
| - | data-easing="Power4.easeOut"
| + | |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off" >
| + | |
| - | <a href="#" class="btn-white green">Purchase Now !</a>
| + | |
| - | <a href="#" class="btn-green white">Call to action</a>
| + | |
| - | </div>
| + | |
| - | </li>
| + | |
| - | <!-- SLIDE 2-->
| + | |
| - | <li data-transition="fade" data-slotamount="5" data-masterspeed="700" >
| + | |
| - | <!-- MAIN IMAGE -->
| + | |
| - | <img src="revolution/images/slider_5.jpg" alt="slidebg1" data-bgfit="cover" data-bgposition="center center" data-bgrepeat="no-repeat">
| + | |
| | | | |
| - | <!-- LAYERS -->
| + | z-index:4; |
| - | <!-- LAYER NR. 1 -->
| + | |
| - | <div class="tp-caption sfb"
| + | |
| - | data-x="center"
| + | |
| - | data-y="80"
| + | |
| - | data-speed="1000"
| + | |
| - | data-start="700"
| + | |
| - | data-easing="Power4.easeOut"
| + | |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off"
| + | |
| - | style="font-weight: 700; font-size:50px; color: #fff; text-transform: uppercase; font-family:'Agency FB'">We are Ascend
| + | |
| - | </div>
| + | |
| | | | |
| - | <!-- LAYER NR. 2 -->
| + | border-collapse: collapse; |
| - | <div class="tp-caption sfb slider_conter_text"
| + | text-align:center; |
| - | data-x="center"
| + | } |
| - | data-y="163"
| + | .menu tr td{ |
| - | data-speed="1000"
| + | text-align: center; |
| - | data-start="700"
| + | vertical-align: middle; |
| - | data-easing="Power4.easeOut"
| + | |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off"
| + | |
| - | style="font-weight: 400; font-size:30px; line-height: 38px; color: #fff; text-transform: uppercase; font-family:'proxima_nova'; text-align:center;">We design & build<br>retina ready responsive<br>themes with the latest flat design
| + | |
| - | </div>
| + | |
| - | <!-- LAYER NR. 3 -->
| + | |
| - | <div class="tp-caption sfb btn"
| + | |
| - | data-x="center"
| + | |
| - | data-y="315"
| + | |
| - | data-speed="1000"
| + | |
| - | data-start="700"
| + | |
| - | data-easing="Power4.easeOut"
| + | |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off" >
| + | |
| - | <a href="#" class="btn-white green">Purchase Now !</a>
| + | |
| - | </div>
| + | |
| - | </li>
| + | |
| - | <!-- SLIDE -->
| + | |
| - | <!-- SLIDE 3-->
| + | |
| - | <li data-transition="fade" data-slotamount="5" data-masterspeed="700" >
| + | |
| - | <!-- MAIN IMAGE -->
| + | |
| - | <img src="revolution/images/slider_6.jpg" alt="slidebg1" data-bgfit="cover" data-bgposition="center center" data-bgrepeat="no-repeat">
| + | |
| | | | |
| - | <!-- LAYERS -->
| + | font-weight: 700; |
| - | <!-- LAYER NR. 1 -->
| + | font-size:16px; |
| - | <div class="tp-caption sfb"
| + | color:#fff; |
| - | data-x="center"
| + | width:7%; |
| - | data-y="44"
| + | } |
| - | data-speed="1000"
| + | .menu tr td.menu-item:hover{ |
| - | data-start="700"
| + | background-color:#258ecd; |
| - | data-easing="Power4.easeOut"
| + | cursor: pointer; |
| - | data-endspeed="300"
| + | } |
| - | data-endeasing="Power1.easeIn"
| + | .subselected{ |
| - | data-captionhidden="off"
| + | background-color: #258ecd; |
| - | ><img src="revolution/images/ascend.png" alt=""/>
| + | } |
| - | </div>
| + | |
| - | <!-- LAYER NR. 2 -->
| + | |
| - | <div class="tp-caption sfb uline"
| + | |
| - | data-x="center"
| + | |
| - | data-y="161"
| + | |
| - | data-speed="1000"
| + | |
| - | data-start="700"
| + | |
| - | data-easing="Power4.easeOut"
| + | |
| - | data-endspeed="300"
| + | |
| - | data-endeasing="Power1.easeIn"
| + | |
| - | data-captionhidden="off"
| + | |
| - | style="font-weight: 400; font-size:72px; line-height: 72px; color: #fff; text-transform: uppercase; font-family:'proxima_nova';">Ascend
| + | |
| - | </div>
| + | |
| | | | |
| - | <!-- LAYER NR. 3 -->
| + | /* CONTAINERS STYLING */ |
| - | <div class="tp-caption sfb slider_conter_text"
| + | .container{ |
| - | data-x="center"
| + | position:relative; |
| - | data-y="270"
| + | width:100%; |
| - | data-speed="1000"
| + | top:50px; |
| - | data-start="700"
| + | } |
| - | data-easing="Power4.easeOut"
| + | .container .subcontainer{ |
| - | data-endspeed="300"
| + | position:absolute; |
| - | data-endeasing="Power1.easeIn"
| + | width:95%; |
| - | data-captionhidden="off"
| + | height:90%; |
| - | style="font-weight: 400; font-size:36px; line-height: 46px; color: #fff; text-transform: uppercase; font-family:'adele'; text-align:center;">A Perfect single page template for<br>Any business & any devices
| + | top:5%; |
| - | </div>
| + | left:2.5%; |
| - | </li>
| + | } |
| - | <!-- SLIDE -->
| + | #top{ |
| - | </ul>
| + | background-size: cover; |
| - | <div class="tp-bannertimer"></div>
| + | background-image: url("http://i1191.photobucket.com/albums/z475/alex0892/Guadalajara%20Minerva/171120111899.jpg"); |
| - | </div>
| + | overflow:hidden; |
| - | </div>
| + | } |
| - | </div>
| + | |
| - | <div class="clear"></div>
| + | |
| - | </div> | + | |
| | | | |
| - | <section class="sercice_wrap content_pt content_pb" id="service"> | + | /* TEAM MEMBERS CARDS STYLING */ |
| - | <div class="container">
| + | .team-member-container{ |
| - | <div class="row content_pt content_pb">
| + | position:relative; |
| - | <div class="col-md-12 mb wow fadeInRightBig">
| + | width:14%; |
| - | <div class="main_heading text-center">
| + | margin-left:2.28%; |
| - | <h2>Services</h2>
| + | |
| | | | |
| - | <h3>What we do best. Carefully handcrafed digital goods.</h3>
| + | float:left; |
| - | </div>
| + | } |
| - | </div>
| + | .team-member-container:hover{ |
| | + | cursor:pointer; |
| | + | } |
| | + | .row2{ |
| | + | top:4%; |
| | + | } |
| | + | .team-member-container .team-member-photo{ |
| | + | position:relative; |
| | + | width:100%; |
| | + | height:85%; |
| | + | top:0; |
| | + | left:0; |
| | + | background-size: cover; |
| | + | } |
| | + | .team-member-container .team-member-footer{ |
| | + | position:relative; |
| | + | width:100%; |
| | + | height:15%; |
| | + | top:0; |
| | + | left:0; |
| | | | |
| - | <div class="col-md-12 content_pb" >
| + | border:none; |
| - | <div id="txmod_271" class="txtabs-wrap 0 services_filter text-center">
| + | border-collapse: collapse; |
| - |
| + | background-color: #47a3da; |
| - | <ul class="txtabs-nav top clearfix wow fadeInLeftBig">
| + | color:#fff; |
| - | <li class="first active">
| + | |
| - | <a data-toggle="tab" class="filter1 active" title="Website design" data-target="#txmod_271-0"></a>
| + | |
| - | </li>
| + | |
| - | <li class="">
| + | |
| - | <a data-toggle="tab" class="filter2" title="Nibh Euismod" data-target="#txmod_271-1"></a>
| + | |
| - | </li>
| + | |
| - | <li class="last">
| + | |
| - | <a data-toggle="tab" class="filter3" title="Tincidunt UT" data-target="#txmod_271-2"></a>
| + | |
| - | </li>
| + | |
| - | <li class="last">
| + | |
| - | <a data-toggle="tab" class="filter4" title="Erat Volutpat" data-target="#txmod_271-3"></a>
| + | |
| - | </li>
| + | |
| - | <li class="last">
| + | |
| - | <a data-toggle="tab" class="filter5" title="Dolore Magna" data-target="#txmod_271-4"></a>
| + | |
| - | </li>
| + | |
| - | </ul>
| + | |
| | | | |
| - | <div class="txtabs-content fadeInUp wow">
| + | text-align: center; |
| - | <div id="txmod_271-0" class="txtabs-pane active in fade-slide">
| + | vertical-align: middle; |
| - | <div class="col-md-3 mb services_box1">
| + | } |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_first icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Modern Design</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | body { |
| - | </div>
| + | padding-top: 110px; |
| - | </div>
| + | } |
| - | </div>
| + | |
| - | <div class="col-md-3 mb services_box1">
| + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_second icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Organized Layerd PSD</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | .center-block { |
| - | </div>
| + | display: block; |
| - | </div>
| + | margin-left: auto; |
| - | </div>
| + | margin-right: auto; |
| - | <div class="col-md-3 mb services_box1">
| + | } |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_third icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Fully Customizable</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class="col-md-3 mb services_box1">
| + | .navbar-fixed-top { |
| - | <div class="services_box text-center">
| + | background: #fff; |
| - | <div class="services_icon">
| + | filter: none !important; |
| - | <div class="icon_fourth icon_image"></div>
| + | box-shadow: 0 2px 15px rgba(0,0,0,0.25); |
| - | </div>
| + | -moz-box-shadow: 0 2px 15px rgba(0,0,0,0.25); |
| - | <div class="services_content">
| + | -webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.25); |
| - | <h2>Responsive</h2>
| + | border-bottom: 1px solid rgba(0,0,0,0.2); |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | } |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div> <!--Tabs1-->
| + | |
| | | | |
| - | <div id="txmod_271-1" class="txtabs-pane fade-slide">
| + | .faceBot{ |
| | + | background: #202020; |
| | + | } |
| | | | |
| - | <div class="col-md-3 mb services_box1">
| + | @font-face { |
| - | <div class="services_box text-center">
| + | font-family: 'Open Sans', Arial;; |
| - | <div class="services_icon">
| + | } |
| - | <div class="icon_first icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Modern Design</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | body |
| - | </div>
| + | { |
| - | </div>
| + | font-family: 'Open Sans', Arial; |
| - | </div>
| + | } |
| - | <div class="col-md-3 mb services_box1">
| + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_second icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Organized Layerd PSD</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | ul.nav a{ |
| - | </div>
| + | color: gray; |
| - | </div>
| + | background-color: transparent; |
| - | </div>
| + | height: 100%; |
| - | <div class="col-md-3 mb services_box1">
| + | position: relative; |
| - | <div class="services_box text-center">
| + | } |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_third icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Fully Customizable</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | ul.nav a:hover{ |
| - | </div>
| + | color: gray; |
| - | </div>
| + | background-color: transparent; |
| - | </div>
| + | height: 100%; |
| | + | position: relative; |
| | + | } |
| | | | |
| - | <div class="col-md-3 mb services_box1">
| + | h2 { |
| - | <div class="services_box text-center">
| + | color:green; |
| - | <div class="services_icon">
| + | } |
| - | <div class="icon_fourth icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Responsive</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | h4 { |
| - | </div>
| + | font-weight: bold; |
| - | </div>
| + | } |
| - | </div>
| + | |
| - | </div> <!--Tabs2-->
| + | |
| | | | |
| - | <div id="txmod_271-2" class="txtabs-pane fade-slide">
| + | .menu-item{ |
| - | <div class="col-md-3 mb services_box1">
| + | height: 75px; |
| - | <div class="services_box text-center">
| + | } |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_first icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Modern Design</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | li.menu-item{ |
| - | </div>
| + | background: transparent !important; |
| - | </div>
| + | } |
| - | </div>
| + | |
| - | <div class="col-md-3 mb services_box1">
| + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_second icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Organized Layerd PSD</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | .green-effect{ |
| - | </div>
| + | display: none; |
| - | </div>
| + | background-color: #4AAF51; |
| - | </div>
| + | opacity: 1; |
| - | <div class="col-md-3 mb services_box1">
| + | color: #FFF; |
| - | <div class="services_box text-center">
| + | transition-property: all; |
| - | <div class="services_icon">
| + | transition-duration: 0.3s; |
| - | <div class="icon_third icon_image"></div>
| + | transition-timing-function: ease-out; |
| - | </div>
| + | transition-delay: 0s; |
| - | <div class="services_content">
| + | border-color: #288D30; |
| - | <h2>Fully Customizable</h2>
| + | position: absolute; |
| | + | bottom: 0px; |
| | + | width: 100%; |
| | + | height: 2px; |
| | + | right: 0px; |
| | + | } |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | a:hover .green-effect{ |
| - | </div>
| + | display: inherit; |
| - | </div>
| + | } |
| - | </div>
| + | |
| | | | |
| - | <div class="col-md-3 mb services_box1">
| + | .invertir:hover { |
| - | <div class="services_box text-center">
| + | -webkit-filter: invert(100%); |
| - | <div class="services_icon">
| + | } |
| - | <div class="icon_fourth icon_image"></div>
| + | </style> |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Responsive</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div> <!--Tabs3-->
| |
| | | | |
| - | <div id="txmod_271-3" class="txtabs-pane fade-slide">
| |
| - | <div class="col-md-3 mb services_box1">
| |
| - | <div class="services_box text-center">
| |
| - | <div class="services_icon">
| |
| - | <div class="icon_first icon_image"></div>
| |
| - | </div>
| |
| - | <div class="services_content">
| |
| - | <h2>Modern Design</h2>
| |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | </head> |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | <div class="col-md-3 mb services_box1">
| + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_second icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Organized Layerd PSD</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | <body> |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | <div class="col-md-3 mb services_box1">
| + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class="services_icon">
| + | |
| - | <div class="icon_third icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content">
| + | |
| - | <h2>Fully Customizable</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class=" col- md- 3 mb services_box1"> | + | <div class="navbar navbar-fixed-top" style="margin-top:10px"> |
| - | <div class="services_box text-center">
| + | <nav class="navbar-inner"> |
| - | <div class=" services_icon"> | + | |
| - | <div class=" icon_fourth icon_image"></div> | + | <div class=" col-md-2"></div> |
| - | </div>
| + | <div class="col-md-3"><a href="https://2014.igem.org/Team:ITESM-Guadalajara"><img class="inicioLogo" src="https://static.igem.org/mediawiki/2014/5/55/BioPhrameIgem_logo.png" height="100" width="auto" ></a></div> |
| - | <div class=" services_content"> | + | <div class=" col-md-1"></ div> |
| - | <h2>Responsive</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | <div class="col-md-6" > |
| - | </div>
| + | <ul class="nav navbar-nav" style="margin-top:30px"> |
| - | </div>
| + | <li class="menu-item"> |
| - | </div>
| + | <a href="https://2014.igem.org/Team:ITESM-Guadalajara"> |
| - | </div> <!--Tabs4-->
| + | <span>Home</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li> |
| | + | <li class="menu-item"> |
| | + | <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Company"> |
| | + | <span>The Company</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li> |
| | + | <li class="menu-item"> |
| | + | <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Team"> |
| | + | <span>Team</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li> |
| | + | <li class="menu-item"> |
| | + | <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Contact"> |
| | + | <span>Contact</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li> |
| | + | <li class="menu-item"> |
| | + | <a href="https://2014.igem.org/Main_Page"> |
| | + | <span>iGEM 2014</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li><li class="menu-item"> |
| | + | <a href="https://2014.igem.org/Team:ITESM-Guadalajara/Notebook"> |
| | + | <span>Notebook</span> |
| | + | <span class="green-effect"></span> |
| | + | </a> |
| | + | </li> |
| | + | <li> |
| | + | <a href="http://www.facebook.com/biophrame"> |
| | + | <img src="https://static.igem.org/mediawiki/2014/3/30/BIOPHRAMEGDLFacebookF.png" height="20" width="auto" class="invertir img-rounded"> |
| | + | </a></li> |
| | + | </ul> |
| | + | </div> |
| | + | </nav> |
| | + | </div> |
| | | | |
| - | <div id=" txmod_271- 4" class=" txtabs- pane fade- slide"> | + | <div class="row"> |
| - | <div class="col-md-3 mb services_box1">
| + | </div> |
| - | <div class=" services_box text- center"> | + | <div> |
| - | <div class=" services_icon"> | + | <div id="carousel-example-generic" class="carousel slide" data-ride="carousel" style="width:100%"> |
| - | <div class=" icon_first icon_image"></div> | + | <!-- Indicators --> |
| - | </div>
| + | <ol class="carousel-indicators"> |
| - | <div class=" services_content"> | + | <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li> |
| - | <h2>Modern Design</h2>
| + | <li data-target="#carousel-example-generic" data-slide-to="1"></li> |
| | + | <li data-target="#carousel-example-generic" data-slide-to="2"></li> |
| | + | </ol> |
| | + | |
| | + | <!-- Wrapper for slides --> |
| | + | <div class=" carousel- inner"> |
| | + | <div class=" item active"> |
| | + | <img src="https://static.igem.org/mediawiki/2014/f/f8/BIOPHRAMEGDLminerva.jpg"> |
| | + | </div> |
| | + | |
| | + | <img src="https://static.igem.org/mediawiki/2014/7/7c/BIOPHRAMEGDLpuente.jpg"> |
| | + | </div> |
| | + | <div class="item"> |
| | + | <img src="https://static.igem.org/mediawiki/2014/9/9f/BIOPHRAMEGDLtec.jpg"> |
| | + | </div> |
| | + | </div> |
| | + | |
| | + | <!-- Controls --> |
| | + | <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"> |
| | + | <span class="glyphicon glyphicon-chevron-left img-rounded"></span> |
| | + | </a> |
| | + | <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"> |
| | + | <span class="glyphicon glyphicon-chevron-right img-rounded"></span> |
| | + | </a> |
| | + | </div> <!-- Carousel --> |
| | + | </div> |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | <div class="col-md-3 mb services_box1">
| |
| - | <div class="services_box text-center">
| |
| - | <div class="services_icon">
| |
| - | <div class="icon_second icon_image"></div>
| |
| - | </div>
| |
| - | <div class="services_content">
| |
| - | <h2>Organized Layerd PSD</h2>
| |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | <div class="row center-block"><div class="col-md-3 col-md-offset-3">< img src=" https://static.igem.org/mediawiki/2014/4/45/BioPhrame_logo.png"> </div> <div class=" col-md-3">< h1 class=" text-success"> iGEM Wiki</ h1></div> |
| - | </div>
| + | </div> |
| - | </div>
| + | |
| - | </div>
| + | |
| - | <div class="col-md-3 mb services_box1"> | + | |
| - | <div class="services_box text-center">
| + | |
| - | <div class=" services_icon"> | + | |
| - | <div class="icon_third icon_image"></div>
| + | |
| - | </div>
| + | |
| - | <div class="services_content"> | + | |
| - | <h2>Fully Customizable</h2>
| + | |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class="col-md-3 mb services_box1">
| |
| - | <div class="services_box text-center">
| |
| - | <div class="services_icon">
| |
| - | <div class="icon_fourth icon_image"></div>
| |
| - | </div>
| |
| - | <div class="services_content">
| |
| - | <h2>Responsive</h2>
| |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod.</p>
| + | <div class="col-md-6 col-md-offset-3 text-justify"> |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div> <!--Tabs5-->
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </section>
| + | |
| | | | |
| - | <section class="purchase_wrap parallax content_pt mb">
| |
| - | <div class="container">
| |
| - | <div class="row content_pt">
| |
| - | <div class="img_purchase_left wow fadeInLeftBig">
| |
| - | <img src="images/00_02.png" alt="Monitor"/>
| |
| - | </div>
| |
| | | | |
| - | <div class="img_purchase_right wow fadeInRightBig">
| |
| - | <h2>Ascend is a premium business and portfolio template with tons of style and aesthetic design.</h2>
| |
| | | | |
| - | <a href="#" class="button">Purchase now !</a>
| + | <p> |
| - | </div>
| + | Biophrame Technologies focuses in innovating, developing and improving technologies based on synthetic biology to create optimized and sustainable industrial processes which can guarantee quality products for our customers.</p> |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </section>
| + | |
| | | | |
| - | <section class="portfolio_wrap dfm_heading mt content_pt content_pb" id="portfolio">
| + | <p> |
| - | <div class="container content_pt content_pb">
| + | We believe the biotechnology we develop can help us not only to optimize time and resources, but to take care of the environment and improve the lives in our community, both regional and global. That is why raw material used in our processes is waste from other industrial process of other companies.</p> |
| - | <div class="row">
| + | |
| - | <div class="col-md-12 content_pt wow fadeIn">
| + | |
| - | <div class="main_heading text-center">
| + | |
| - | <h2>Portfolio</h2>
| + | |
| | | | |
| - | <h3>Carefully Hand-crafted Projects.</h3>
| + | <video width="100%" height="500px" controls> <source type="video/mp4" src="https://static.igem.org/mediawiki/2014/b/b7/BIOPHRAMEGDLpitch.mp4"></video> |
| - | </div>
| + | |
| - | </div>
| + | |
| | | | |
| - | <div class="col-md-12 text-center">
| + | <hr/> |
| - | <div class="filter_category">
| + | <h2>OUR PRODUCT</h2> |
| - | <ul class="option-set wow fadeInLeftBig">
| + | |
| - | <li><p data-filter="all" class="filter active">All</p></li>
| + | |
| - |
| + | |
| - | <li><p data-filter=".websites" class="filter">Website</p></li>
| + | |
| | | | |
| - | <li><p data-filter=".photography" class="filter">Photos</p></li>
| + | <center><img src="https://static.igem.org/mediawiki/2014/4/44/BIOPHRAMEbiokProducts.jpg" width="50%"></center> |
| - |
| + | |
| - | <li><p data-filter=".video" class="filter">Video</p></li>
| + | |
| - | </ul>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | <div class="clear"></div>
| + | |
| | | | |
| - | <div class="portfolio_image content_pb wow fadeInUp">
| + | <p> |
| - | <ul class="col-md-12 first gallery pro">
| + | Our main product is 'BioK' chitosan. Chitosan is a natural fiber product with multiple applications in pharmaceuticals, agrochemicals, water treatment, textile finishing, food, cosmetics, pulp and paper, photography and tissue engineering. BioK is the result of a biological production process based on genetically modified organisms which is productive, cost effective and waste reductive. In our process, chitin extracted from shrimp shells waste undergoes a process of demineralization, deproteinization and deacetilatyion by the action of two bacteria. The behavior of these bacteria is controlled by induced temperature changes, guaranteeing no chemical use in the process.</p> |
| - | <li class="photography bpi mix">
| + | |
| - | <div class="portfolio-mask">
| + | |
| - | <div class="portfolio-link">
| + | |
| - | <h1>Projects Title Here</h1>
| + | |
| - | <h2>Artwork</h2>
| + | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| + | |
| - | <a href="images/portfolio/pi-03.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| + | |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| + | |
| - | </div>
| + | |
| - | <img src="images/portfolio/pi-03.png" alt="" title=""/>
| + | |
| - | </div>
| + | |
| - | </li>
| + | |
| | | | |
| - | <li class="websites mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-01.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-01.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| - |
| |
| - | <li class="photography video mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-04.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-04.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| - |
| |
| - | <li class="photography mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-06.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-06.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| - |
| |
| - | <li class="websites video mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-07.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-07.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| - |
| |
| - | <li class="video mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-05.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-05.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| | | | |
| - | <li class="photography bpi mix">
| |
| - | <div class="portfolio-mask">
| |
| - | <div class="portfolio-link">
| |
| - | <h1>Projects Title Here</h1>
| |
| - | <h2>Artwork</h2>
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <a href="images/portfolio/pi-02.png" data-lightbox="example-set" data-title="Portfolio Image"><span class="icon-eye"></span></a>
| |
| - | <a href="single-half-portfolio.html"><span class="icon-link"></span></a>
| |
| - | </div>
| |
| - | <img src="images/portfolio/pi-02.png" alt="" title=""/>
| |
| - | </div>
| |
| - | </li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| | | | |
| - | <div class="col-md-12 text-center content_pt mt content_pb mb wow rotateIn">
| |
| - | <a href="#" class="button"><span class="icon-arrow-down-6"></span>Load more Work</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| | | | |
| - | <section class="fun_facts_wrap parallax mb">
| + | <video width="100%" height="500px" controls> <source type="video/mp4" src="https://static.igem.org/mediawiki/2014/f/f2/BIOPHRAMEGDLchitosanProcess.mp4"></video> |
| - | <div class="container">
| + | |
| - | <div class="row">
| + | |
| - | <div class="col-md-12 default_heading mb content_pb text-center wow fadeIn">
| + | |
| - | <h1>Fun facts</h1>
| + | |
| - | </div>
| + | |
| | | | |
| - | <div class="col-md-3 content_pt mb wow fadeInLeftBig">
| |
| - | <div class="fun_facts_item2 text-center">
| |
| - | <div class="fun_facts_img2">
| |
| - | <img src="images/i-04.png" alt="icon">
| |
| - | </div>
| |
| - | <div class="fun_facts_content2">
| |
| - | <h1>565</h1>
| |
| - | <p>Commercial Projects</p>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class="col-md-3 content_pt mb wow fadeInRight">
| + | <p> |
| - | <div class="fun_facts_item2 text-center">
| + | We are strategically located in Guadalajara, the second most populated city in Mexico and responsible of 7% of national gross domestic product. Our goal in the long term is to fulfil the Mexican demand of medium and high purity chitosan and to become the first Mexican exporter of high purity chitosan. We want to create dream jobs for young Mexican engineers and export our biotechnology worldwide.</p> |
| - | <div class="fun_facts_img2">
| + | |
| - | <img src="images/i-05.png" alt="icon">
| + | |
| - | </div>
| + | |
| - | <div class="fun_facts_content2">
| + | |
| - | <h1>780</h1>
| + | |
| - | <p>Satisfied Companies</p>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| | | | |
| - | <div class="col-md-3 content_pt mb wow fadeInLeft">
| + | </div></br> |
| - | <div class="fun_facts_item2 text-center">
| + | |
| - | <div class="fun_facts_img2">
| + | |
| - | <img src="images/i-06.png" alt="icon">
| + | |
| - | </div>
| + | |
| - | <div class="fun_facts_content2">
| + | |
| - | <h1>500</h1>
| + | |
| - | <p>Completed website</p>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| - | </div>
| + | |
| | | | |
| - | <div class="col-md- 3 content_pt mb wow fadeInRightBig"> | + | <div class="col-md-12 center-block"> |
| - | <div class=" fun_facts_item2 text- center"> | + | <div class="col-md-2 col-md-offset-3"><a href="http://www.itesm.mx/wps/wcm/connect/Campus/GDA/Guadalajara/" ><img src="https://static.igem.org/mediawiki/2014/9/93/BIOPHRAMEGDLLogo_tecnologicoDeMonterrey-300x168.jpg" data-toggle="tooltip" title="ITESM Guadalajara"></a></div> |
| - | <div class=" fun_facts_img2"> | + | <div class="col-md-2"><a href="https://2014.igem.org/Main_Page"> |
| - | <img src=" images/ i- 07. png" alt=" icon"> | + | <img src="https://static.igem.org/mediawiki/2014/b/b0/BIOPHRAMEGDLLogo_igem-300x168.jpg" data-toggle="tooltip" title="iGEM"></a></div> |
| - | </div>
| + | <div class="col-md-2"><a href="http://sergionc.com/web/"><img src="https://static.igem.org/mediawiki/2014/3/33/BIOPHRAMEGDLLogo_sergionc-300x168.jpg" data-toggle="tooltip" title="Sergionc Video Mapping"></a></div> |
| - | <div class=" fun_facts_content2"> | + | </div> |
| - | <h1>565</h1>
| + | <?php |
| - | <p>Wordpress Themes</p>
| + | echo "hola"; |
| - | </div>
| + | ?> |
| - | </div>
| + | <div class="col-md-12 faceBot"></br><div class="col-md-2 col-md-offset-3"><img src="https://static.igem.org/mediawiki/2014/e/ef/Biophrame_logo_footer_500x150.png" class="img-responsive"><small style="color:white">Biophrame Technologies is a biotech company and manufacturer specialized in the production of Chitosan.</small></div> |
| - | </div>
| + | <div class="col-md-2"> |
| - | </div>
| + | <iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fbiophrame&width&height=258&colorscheme=dark&show_faces=true&header=false&stream=false&show_border=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:258px;" allowTransparency="true"></iframe></div> |
| - | </div>
| + | </div> |
| - | </section>
| + | |
| | | | |
| - | <section class="about_wrap dfm_heading content_pt mt mb" id="about">
| |
| - | <div class="container">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 mb content_pt wow fadeIn">
| |
| - | <div class="main_heading text-center">
| |
| - | <h2>About Us</h2>
| |
| - | <h3><b> Ascend</b> packed with everything you need to build your website, that will empower your business.</h3>
| |
| - | </div>
| |
| - | </div>
| |
| | | | |
| - | <div class="col-md-6 mb wow fadeInLeftBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Who We Are</h1>
| |
| - | </div>
| |
| - | <div class="who_we_are">
| |
| - | <h2><b>Ascend </b> packed with everything you need to build your website, that will empower your business.</h2>
| |
| | | | |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
| + | </body> |
| | | | |
| - | <a href="#" class="button">Learn more</a>
| + | <script> |
| - |
| + | $('.carousel').carousel({ |
| - | </div>
| + | interval: 2000 |
| - | </div>
| + | }) |
| | + | </script> |
| | | | |
| - | <div class="col-md-6 mb wow fadeInRightBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Gallery</h1>
| |
| - | </div>
| |
| - | <div class="gallery_style gallery_style1">
| |
| - | <div id="gallery-style1" class="carousel slide" data-ride="carousel">
| |
| - | <!-- Wrapper for slides -->
| |
| - | <div class="carousel-inner">
| |
| - | <div class="item active">
| |
| - | <img src="images/gallery/00_02.png" alt="gallery ">
| |
| - | </div>
| |
| - | <div class="item">
| |
| - | <img src="images/gallery/00_01.png" alt="gallery ">
| |
| - | </div>
| |
| - |
| |
| - | <div class="item">
| |
| - | <img src="images/gallery/00_03.png" alt="gallery ">
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <!-- Controls -->
| |
| - | <a class="left carousel-control" href="#gallery-style1" data-slide="prev"></a>
| |
| - | <a class="right carousel-control" href="#gallery-style1" data-slide="next"></a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="col-wrap content_pb content_pt">
| |
| - | <div class="container content_pt">
| |
| - | <div class="row">
| |
| - | <div class="col-md-6 mb wow fadeInUp">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Why choose us</h1>
| |
| - | </div>
| |
| - | <div class="why_choose_us">
| |
| - | <div class="accordion">
| |
| - | <h3>Active Accordion</h3>
| |
| - | <div class="accordion_content">
| |
| - | <p>Consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Consectetuer adipiscing elit, sed diam nonummy diam nonummy nibh euismod tincidunt ut dolore magna</p>
| |
| - | </div>
| |
| - |
| |
| - | <h3>Simple Accprdion</h3>
| |
| - | <div class="accordion_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetuer elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam.</p>
| |
| - | </div>
| |
| - |
| |
| - | <h3>Simple Accprdion</h3>
| |
| - | <div class="accordion_content">
| |
| - | <p>Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut dolore magna aliquam erat volutpat.Dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut dolore magna aliquam erat volutpat.</p>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-6 mb wow fadeInUp">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Skill</h1>
| |
| - | </div>
| |
| - | <div class="skill_section">
| |
| - | <div class="skillset themeapt-progress-bar-container themeapt_animate_when_almost_visible">
| |
| - | <div class="skill_set_item themeapt-progress-bar">
| |
| - | <h3>Illustration</h3>
| |
| - | <div class="progress-bar">
| |
| - | <div class="progress-bar-heading small_arrow_box " style="margin-left: 75%;">80%</div>
| |
| - | <div class="bar-outer">
| |
| - | <div class="progress-bar-content" data-percentage="80" style="width: 80%; background: #eba236;"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="skill_set_item themeapt-progress-bar">
| |
| - | <h3>Photoshop</h3>
| |
| - | <div class="progress-bar">
| |
| - | <div class="progress-bar-heading small_arrow_box " style="margin-left: 75%;">80%</div>
| |
| - | <div class="bar-outer">
| |
| - | <div class="progress-bar-content" data-percentage="80" style="width: 80%; background: #0069ad;"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="skill_set_item themeapt-progress-bar">
| |
| - | <h3>HTML 5</h3>
| |
| - | <div class="progress-bar">
| |
| - | <div class="progress-bar-heading small_arrow_box " style="margin-left: 85%;">90%</div>
| |
| - | <div class="bar-outer">
| |
| - | <div class="progress-bar-content" data-percentage="90" style="width: 90%; background: #00738c;"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="skill_set_item themeapt-progress-bar">
| |
| - | <h3>CSS3</h3>
| |
| - | <div class="progress-bar">
| |
| - | <div class="progress-bar-heading small_arrow_box " style="margin-left: 65%;">70%</div>
| |
| - | <div class="bar-outer">
| |
| - | <div class="progress-bar-content" data-percentage="70" style="width: 70%; background: #82b6b6;"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="team_wrap parallax content_pt">
| |
| - | <div class="container">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 default_heading mb content_pb content_pt text-center wow fadeInDown">
| |
| - | <h1>Our core team</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-4 mb wow fadeInLeftBig">
| |
| - | <div class="team_section">
| |
| - | <div class="member_icon">
| |
| - | <img src="images/team/00_01.png" alt="Team Member">
| |
| - | </div>
| |
| - |
| |
| - | <div class="member_information">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | <p>Shortbio Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <ul>
| |
| - | <li><a href="#" class="icon-facebook-4"></a></li>
| |
| - | <li><a href="#" class="icon-linkedin"></a></li>
| |
| - | <li><a href="#" class="icon-twitter"></a></li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-4 mb wow fadeInUpBig">
| |
| - | <div class="team_section">
| |
| - | <div class="member_icon">
| |
| - | <img src="images/team/00_02.png" alt="Team Member">
| |
| - | </div>
| |
| - |
| |
| - | <div class="member_information">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | <p>Shortbio Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <ul>
| |
| - | <li><a href="#" class="icon-facebook-4"></a></li>
| |
| - | <li><a href="#" class="icon-linkedin"></a></li>
| |
| - | <li><a href="#" class="icon-twitter"></a></li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-4 mb fadeInRightBig wow">
| |
| - | <div class="team_section">
| |
| - | <div class="member_icon">
| |
| - | <img src="images/team/00_03.png" alt="Team Member">
| |
| - | </div>
| |
| - |
| |
| - | <div class="member_information">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | <p>Shortbio Consectetuer adipiscing elit, sed diam nonummy.</p>
| |
| - | <ul>
| |
| - | <li><a href="#" class="icon-facebook-4"></a></li>
| |
| - | <li><a href="#" class="icon-linkedin"></a></li>
| |
| - | <li><a href="#" class="icon-twitter"></a></li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="blog_wrap dfm_heading content_pt content_pb mb mt" id="blog">
| |
| - | <div class="container">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 mb content_pt wow fadeInDown">
| |
| - | <div class="main_heading text-center">
| |
| - | <h2>Blog</h2>
| |
| - | <h3><b> Ascend</b> packed with everything you need to build your website, that will empower your business.</h3>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | <div id="blog_section">
| |
| - | <div class="prm_blog masonry">
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-02.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">This is just a single post</a>
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_image">
| |
| - | <img src="images/blog/bi-1.png" alt="blog image">
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="prm_blog masonry">
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-01.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">post blog Text post sit consectetur adipisicing elit, sed</a>
| |
| - |
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="prm_blog masonry" >
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-03.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">This is just a video post</a>
| |
| - |
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_image">
| |
| - | <div class="videoWrapper">
| |
| - | <iframe width="560" height="349" src="https://www.youtube.com/embed/hapUTViTlAQ?feature=player_detailpage&wmode=opaque"></iframe>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="prm_blog masonry">
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-12.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">Post with slider image</a>
| |
| - |
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_image">
| |
| - | <img src="images/blog/bi-2.png" alt="blog image">
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="prm_blog masonry">
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-02.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">This is just a video post</a>
| |
| - |
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_image">
| |
| - | <img src="images/blog/bi-1.png" alt="blog image">
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="prm_blog masonry">
| |
| - | <div class="blog_header">
| |
| - | <div class="prm_blog_icon text-center">
| |
| - | <img class="wow bounceIn" src="images/i-01.png" alt="Blog Icon">
| |
| - | </div>
| |
| - |
| |
| - | <div class="social_blog">
| |
| - | <div class="follower share-icon"></div>
| |
| - | <div class="follow-list">
| |
| - | <ul class="follow_arrow">
| |
| - | <li><a href="#" class="facebook"></a></li>
| |
| - | <li><a href="#" class="twitter"></a></li>
| |
| - | <li><a href="#" class="stumbleupon"></a></li>
| |
| - | <li><a href="#" class="linkedin"></a></li>
| |
| - | <li><a href="#" class="google-plus"></a></li>
| |
| - | </ul>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_header_content text-center">
| |
| - | <a href="#" class="blog_header_content_heading">Link post amet, do eiusmod</a>
| |
| - |
| |
| - | <span>By John doe</span> <span>/</span><span>14 March 2014 </span><span>/</span>
| |
| - | <a href="#" class="likes_icon_wrap"><span class="blog_header_content_icon likes_icon"></span><span class="likes_text">25 Likes</span></a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="blog_content">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute</p>
| |
| - | <a href="single-blog.html" class="blog_button">Read More</a>
| |
| - | <a href="#" class="blog_comments"><span class="icon-chat"></span>12 comments</a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - |
| |
| - | <div class="clear"></div>
| |
| - |
| |
| - | <div class="col-md-12 text-center content_pt content_pb wow rotateIn">
| |
| - | <a class="button" href="#"><span class="icon-arrow-down-6"></span>Load more Blog</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - |
| |
| - | <section class="pricing_table_wrap parallax content_pt content_pb" id="pricing">
| |
| - | <div class="container">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 text-center pricing_table_heading mb content_pb wow fadeInDown">
| |
| - | <h1>Pricing Table</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb wow fadeInLeftBig">
| |
| - | <div class="pricing_table">
| |
| - | <div class="pricing_table_head text-center">
| |
| - | <h1>Basic</h1>
| |
| - |
| |
| - | <span class="montg">Per month</span>
| |
| - | <span class="rate">$90</span>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_content">
| |
| - | <ul>
| |
| - | <li>Free Setup</li>
| |
| - | <li>10 GB Storage</li>
| |
| - | <li>Unlmited Users</li>
| |
| - | <li>20 GB Bandwith</li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_button text-center">
| |
| - | <a href="#" class="button">Purchase now</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb wow fadeInUpBig">
| |
| - | <div class="pricing_table">
| |
| - | <div class="pricing_table_head text-center">
| |
| - | <h1>standard</h1>
| |
| - |
| |
| - | <span class="montg">Per month</span>
| |
| - | <span class="rate">$200</span>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_content">
| |
| - | <ul>
| |
| - | <li>Free Setup</li>
| |
| - | <li>10 GB Storage</li>
| |
| - | <li>Unlmited Users</li>
| |
| - | <li>20 GB Bandwith</li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_button text-center">
| |
| - | <a href="#" class="button">Purchase now</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb wow fadeInUpBig">
| |
| - | <div class="pricing_table">
| |
| - | <div class="pricing_table_head text-center">
| |
| - | <h1>Advanced</h1>
| |
| - |
| |
| - | <span class="montg">Per month</span>
| |
| - | <span class="rate">$320</span>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_content">
| |
| - | <ul>
| |
| - | <li>Free Setup</li>
| |
| - | <li>10 GB Storage</li>
| |
| - | <li>Unlmited Users</li>
| |
| - | <li>20 GB Bandwith</li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_button text-center">
| |
| - | <a href="#" class="button">Purchase now</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb wow fadeInRightBig">
| |
| - | <div class="pricing_table">
| |
| - | <div class="pricing_table_head text-center">
| |
| - | <h1>Premium</h1>
| |
| - |
| |
| - | <span class="montg">Per month</span>
| |
| - | <span class="rate">$450</span>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_content">
| |
| - | <ul>
| |
| - | <li>Free Setup</li>
| |
| - | <li>10 GB Storage</li>
| |
| - | <li>Unlmited Users</li>
| |
| - | <li>20 GB Bandwith</li>
| |
| - | </ul>
| |
| - | </div>
| |
| - |
| |
| - | <div class="pricing_table_button text-center">
| |
| - | <a href="#" class="button">Purchase now</a>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="content_pt content_pb">
| |
| - | <div class="container content_pt content_pb">
| |
| - | <div class="row">
| |
| - | <div class="col-md-6 mb wow fadeInLeftBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Newsletter</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="subscribe_newsletter content_heading">
| |
| - | <h1>Subscribe to our Newsletter</h1>
| |
| - |
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure</p>
| |
| - |
| |
| - | <input type="text" onfocus="if (this.value == 'Enter your mail address here'){this.value = '';}" onblur="if (this.value == ''){this.value = 'Enter your mail address here';}" class="contact_form_box" name="contact_name" value="Enter your mail address here">
| |
| - |
| |
| - | <a href="#" class="button">Subscribe</a>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-6 md wow fadeInRightBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Testimonial</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="testimonial content_heading">
| |
| - | <h1>What client’s say about us</h1>
| |
| - |
| |
| - | <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
| |
| - | <!-- Indicators -->
| |
| - | <ol class="carousel-indicators">
| |
| - | <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
| |
| - | <li data-target="#carousel-example-generic" data-slide-to="1"></li>
| |
| - | <li data-target="#carousel-example-generic" data-slide-to="2"></li>
| |
| - | </ol>
| |
| - |
| |
| - | <!-- Wrapper for slides -->
| |
| - | <div class="carousel-inner">
| |
| - | <div class="item active">
| |
| - | <div class="testimonial_content">
| |
| - | <div class="testimonial_head">
| |
| - | <div class="testimonial_image">
| |
| - | <img src="images/testimonial/ti-01.png" alt="">
| |
| - | </div>
| |
| - | <div class="testimonial_person">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="testimonial_content">
| |
| - | <span class="testimonial_arrow_left"></span>
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</p>
| |
| - | <span class="testimonial_arrow_right"></span>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="item">
| |
| - | <div class="testimonial_content">
| |
| - | <div class="testimonial_head">
| |
| - | <div class="testimonial_image">
| |
| - | <img src="images/testimonial/ti-01.png" alt="">
| |
| - | </div>
| |
| - | <div class="testimonial_person">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="testimonial_content">
| |
| - | <span class="testimonial_arrow_left"></span>
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</p>
| |
| - | <span class="testimonial_arrow_right"></span>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="item">
| |
| - | <div class="testimonial_content">
| |
| - | <div class="testimonial_head">
| |
| - | <div class="testimonial_image">
| |
| - | <img src="images/testimonial/ti-01.png" alt="">
| |
| - | </div>
| |
| - | <div class="testimonial_person">
| |
| - | <h1>John Doe</h1>
| |
| - | <h2>Founder</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="testimonial_content">
| |
| - | <span class="testimonial_arrow_left"></span>
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation</p>
| |
| - | <span class="testimonial_arrow_right"></span>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="client_wrap parallax">
| |
| - | <div class="container">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 text-center pricing_table_heading mb content_pb wow bounceIn">
| |
| - | <h1>Our clients</h1>
| |
| - | </div>
| |
| - | <div class="col-md-12 content_pt mt">
| |
| - | <div class="client_slider">
| |
| - | <ul>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client1"></a>
| |
| - | </li>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client2"></a>
| |
| - | </li>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client3"></a>
| |
| - | </li>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client4"></a>
| |
| - | </li>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client5"></a>
| |
| - | </li>
| |
| - | <li class="wow fadeIn">
| |
| - | <a href="#" class="client_logo client6"></a>
| |
| - | </li>
| |
| - | </ul>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <section class="col-wrap content_pt content_pb">
| |
| - | <div class="container content_pt content_pb">
| |
| - | <div class="row">
| |
| - | <div class="col-md-6 mb wow fadeInLeftBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>Follow us</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="follow_us">
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim a d minim veniam, quis nostrud </p>
| |
| - |
| |
| - | <ul>
| |
| - | <li>
| |
| - | <a href="#" class="twitter"></a>
| |
| - | </li>
| |
| - |
| |
| - | <li>
| |
| - | <a href="#" class="facebook"></a>
| |
| - | </li>
| |
| - |
| |
| - | <li>
| |
| - | <a href="#" class="dribbble"></a>
| |
| - | </li>
| |
| - |
| |
| - | <li>
| |
| - | <a href="#" class="envato"></a>
| |
| - | </li>
| |
| - |
| |
| - | <li>
| |
| - | <a href="#" class="pinterest"></a>
| |
| - | </li>
| |
| - | </ul>
| |
| - |
| |
| - | </div>
| |
| - | <div class="clear"></div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-6 md wow fadeInRightBig">
| |
| - | <div class="mini_heading">
| |
| - | <h1>latest tweets</h1>
| |
| - | </div>
| |
| - |
| |
| - | <div class="tweet_wrap">
| |
| - | <div class="tweet_style1_arrow">
| |
| - | <span><a href="#tweet_slider2" data-slide="prev" class="tweet_style1_arrow_left"></a></span>
| |
| - | <span><a href="#tweet_slider2" data-slide="next" class="tweet_style1_arrow_right"></a></span>
| |
| - | </div>
| |
| - |
| |
| - | <div id="tweet_slider2" class="carousel slide" data-ride="carousel">
| |
| - | <!-- Wrapper for slides -->
| |
| - | <div class="carousel-inner">
| |
| - | <div class="item active">
| |
| - | <div class="tweet_style1_content">
| |
| - | <span class="icon-twitter icon"></span><span>@twittername</span>
| |
| - | </div>
| |
| - | <div class="tweet_style1_content">
| |
| - | <p>Our Latest Multipurpose Responsive Wordpress Theme Blandes has been released today | check it our on ThemeForest
| |
| - | <a href="#">http://loremipsumtwitterlink</a></p>
| |
| - | <h2>2 months ago</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="item">
| |
| - | <div class="tweet_style1_content">
| |
| - | <span class="icon-twitter icon"></span><span>@twittername</span>
| |
| - | </div>
| |
| - | <div class="tweet_style1_content">
| |
| - | <p>Our Latest Multipurpose Responsive Wordpress Theme Blandes has been released today | check it our on ThemeForest
| |
| - | <a href="#">http://loremipsumtwitterlink</a></p>
| |
| - | <h2>2 months ago</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="item">
| |
| - | <div class="tweet_style1_content">
| |
| - | <span class="icon-twitter icon"></span><span>@twittername</span>
| |
| - | </div>
| |
| - | <div class="tweet_style1_content">
| |
| - | <p>Our Latest Multipurpose Responsive Wordpress Theme Blandes has been released today | check it our on ThemeForest
| |
| - | <a href="#">http://loremipsumtwitterlink</a></p>
| |
| - | <h2>2 months ago</h2>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </section>
| |
| - |
| |
| - | <footer class="footer_wrap" id="contact">
| |
| - | <div class="container content_pt">
| |
| - | <div class="row">
| |
| - | <div class="col-md-12 mb content_pt wow fadeIn">
| |
| - | <div class="main_heading text-center">
| |
| - | <h2>Contact us</h2>
| |
| - |
| |
| - | <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim a d minim veniam, quis nostrud uex ea commodo consequat. Duis aute irure dolor in r.eprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia </p>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-12 content_pt content_pb">
| |
| - | <div class="contact_form">
| |
| - | <form action="#" method="post" id="contactfrm">
| |
| - | <div class="col-md-6 fadeInLeft wow">
| |
| - | <input type="text" value="Your Name" id="contact_name" name="contact_name" onblur="if (this.value == ''){this.value = 'Your Name';}" onfocus="if (this.value == 'Your Name'){this.value = '';}" />
| |
| - | <input type="text" value="Your Email" id="contact_email" name="contact_email" onblur="if (this.value == ''){this.value = 'Your Email';}" onfocus="if (this.value == 'Your Email'){this.value = '';}" />
| |
| - | <input type="text" value="Subject" id="contact_subject" name="contact_subject" onblur="if (this.value == ''){this.value = 'Subject';}" onfocus="if (this.value == 'Subject'){this.value = '';}" />
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-6 wow fadeInRight">
| |
| - | <textarea onblur="if(this.value=='')this.value=this.defaultValue;" onfocus="if(this.value==this.defaultValue)this.value='';" name="contact_message" id="contact_message">Type Message</textarea>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-12 text-center fadeIn">
| |
| - | <a href="#" class="button"><span></span>Send Now !</a>
| |
| - | </div>
| |
| - | <div class="col-md-12 text-center" id="contact_form_message_box"></div>
| |
| - | </form>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb content_pb text-left wow fadeInLeftBig">
| |
| - | <div class="contact_address">
| |
| - | <span class="text text_address">Address : Street 123, New York</span>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb content_pb text-center wow fadeInRight">
| |
| - | <div class="contact_address">
| |
| - | <span class="text text_fax">Fax : 756-432-210</span>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb content_pb text-center wow fadeInLeft">
| |
| - | <div class="contact_address">
| |
| - | <span class="text text_phone">Phone / Mobile : 123 -456 -789</span>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div class="col-md-3 mb content_pb text-right wow fadeInRightBig">
| |
| - | <div class="contact_address icon">
| |
| - | <span class="text text_mail">Mail :<a href="mailto:someone@example.com">Support@themename.com</a></span>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - | </div>
| |
| - |
| |
| - | <div id='map_canvas' style="pointer-events:none;"></div>
| |
| - |
| |
| - | <div class="copyright text-center wow fadeInRight">
| |
| - | <p>2014 All Rights Reserved, designed by <a href="#">Themeapt</a> 2014</p>
| |
| - | </div>
| |
| - | </footer>
| |
| - |
| |
| - | <div style="display: block;" id="back-top">
| |
| - | <a href="#" class="w-toplink" style="opacity: 1;"></a>
| |
| - | </div>
| |
| - |
| |
| - | <div class="loader">
| |
| - | <div class="spinner"></div>
| |
| - | </div>
| |
| - |
| |
| - | </div><!-- end wrapper -->
| |
| - |
| |
| - | <!-- Javascript Files -->
| |
| - |
| |
| - | <script type="text/javascript" src="js/main.js"></script>
| |
| - |
| |
| - | <script type="text/javascript" src="revolution/rs-plugin/js/jquery.themepunch.plugins.min.js"></script> <!-- SLIDER REVOLUTION 4.x SCRIPTS -->
| |
| - |
| |
| - | <script type="text/javascript" src="revolution/rs-plugin/js/jquery.themepunch.revolution.js"></script> <!-- SLIDER REVOLUTION 4.x SCRIPTS -->
| |
| - |
| |
| - | <script type='text/javascript' src="http://maps.google.com/maps/api/js?sensor=false&.js"></script> <!--Google Map-->
| |
| - |
| |
| - | <script type="text/javascript" src="js/jquery.custom.js"></script> <!--Custom JS-->
| |
| - |
| |
| - | </body>
| |
| | </html> | | </html> |
"
