Difference between revisions of "Team:Vilnius-Lithuania/Design"

m
 
(34 intermediate revisions by one other user not shown)
Line 71: Line 71:
 
     color: #f6cd61;
 
     color: #f6cd61;
 
     font-size:3rem;
 
     font-size:3rem;
     text-shadow: 0px 0px 10px #fbdd90;
+
     text-shadow: 0px 0px 10px #f6cd61;
 
}
 
}
 
h2,h3,h4,h5,h6{
 
h2,h3,h4,h5,h6{
Line 106: Line 106:
 
     padding-top: 20px;
 
     padding-top: 20px;
 
     font-weight: 500;
 
     font-weight: 500;
     background-color:#083c4c;
+
     background-color:#010C11;
 
     transition: all 0.7s ease;
 
     transition: all 0.7s ease;
 
}
 
}
Line 132: Line 132:
 
.menu-item{
 
.menu-item{
 
     padding: 16px 8px;
 
     padding: 16px 8px;
 +
transition: margin-left 0.25s ease;
 +
 
}
 
}
 
.menu-item-sub::after{
 
.menu-item-sub::after{
Line 146: Line 148:
 
     color:#bdbdbd;
 
     color:#bdbdbd;
 
     transition: all 0.25s ease;
 
     transition: all 0.25s ease;
 +
font-size: 22px;
 
}
 
}
 
.return{
 
.return{
Line 153: Line 156:
 
     text-decoration: none;
 
     text-decoration: none;
 
     color: #f6cd61;
 
     color: #f6cd61;
    padding-left:8px;
+
}
 +
.menu-item:hover{
 +
 
 +
margin-left:8px
 +
 
 
}
 
}
 
.menu-item:hover:after{
 
.menu-item:hover:after{
Line 174: Line 181:
 
}
 
}
 
.colight img{
 
.colight img{
     width:60%;
+
     width:80%;
 
}
 
}
 
.colight{
 
.colight{
Line 301: Line 308:
 
.page-menu{
 
.page-menu{
 
     position: fixed;
 
     position: fixed;
     top: 50%;
+
     top: 70%;
 
     transform: translateY(-50%);
 
     transform: translateY(-50%);
 
     text-align:center;
 
     text-align:center;
Line 315: Line 322:
 
  color: #bdbdbd;
 
  color: #bdbdbd;
 
font-family: 'intro';
 
font-family: 'intro';
 +
cursor:pointer;
 
}
 
}
 
.page-heading{
 
.page-heading{
Line 323: Line 331:
 
     font-family: 'bebas'!important;
 
     font-family: 'bebas'!important;
 
     color: #f6cd61;
 
     color: #f6cd61;
     font-size: 3rem;
+
     font-size: 4rem;
 
text-align:center;
 
text-align:center;
 +
}
 +
 +
 +
.cover{
 +
    position: relative;
 +
}
 +
.cover img{
 +
    object-fit:cover;
 +
    width:100%;
 +
    height:300px;
 +
}
 +
.cover span{
 +
    font-size:80px;
 +
    position:absolute;
 +
    bottom:32px;
 +
    right:32px;
 +
    color:white;
 +
    text-transform: uppercase;
 +
    font-family: 'bebas';
 +
    font-weight: 900;
 +
    max-width:500px;
 +
line-height: 1;
 +
text-align:right;
 
}
 
}
  
Line 374: Line 405:
 
.topnav {
 
.topnav {
 
     overflow: hidden;
 
     overflow: hidden;
     background-color: #083c4c;
+
     background-color: #010C11;
 
   }
 
   }
 
    
 
    
Line 397: Line 428:
 
   .topnav a.active {
 
   .topnav a.active {
 
     background-color: #f6cd61;
 
     background-color: #f6cd61;
     color: white;
+
     color: white!important;
 
   }
 
   }
 
    
 
    
Line 432: Line 463:
 
       color:black;
 
       color:black;
 
   }
 
   }
 +
.cover span{
 +
font-size:48px;
 +
}
 
    
 
    
 
}
 
}
Line 463: Line 497:
  
  
.laser{
 
    width:50%;
 
    height:1px;
 
    position:fixed;
 
    background-color: #f6cd61;
 
    top:50%;
 
    z-index:1;
 
    border-radius: 50%;
 
    transition: all 0.7s ease;
 
    /* border:2px solid #f6cd61; */
 
    opacity: 0.25;
 
    box-shadow: 0 0 1px 1px #f6cd61;
 
    -webkit-animation-name: laserAnimation;
 
    -webkit-animation-duration: 1800ms;
 
    animation-name: laserAnimation;
 
    animation-duration: 1800ms;
 
    animation-iteration-count: infinite;
 
 
 
}
 
 
@-webkit-keyframes laserAnimation {
 
    0%  {width: 0;left:0;}
 
    50%  {width: 50%;left: 50px;}
 
    100% {width: 0;left:0;}
 
  }
 
 
 
  @keyframes laserAnimation {
 
    0%  {width: 0;left:0;}
 
    50%  {width: 50%;left: 50%;}
 
    100% {width: 0;left:0;}
 
  }
 
  
 
   #overlay {
 
   #overlay {
Line 737: Line 739:
 
<div class="topnav d-sm-block d-md-none" id="Topnav">
 
<div class="topnav d-sm-block d-md-none" id="Topnav">
 
         <a href="#home" class="active">MENU</a>
 
         <a href="#home" class="active">MENU</a>
         <a href="#">Home</a>
+
         <a href="https://2019.igem.org/Team:Vilnius-Lithuania">Home</a>
 
         <a href="#">Project</a>
 
         <a href="#">Project</a>
             <a href="#" class="sub">Inspiration & Description</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Description" class="sub">Inspiration & Description</a>
             <a href="#" class="sub">Design & Results</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Design" class="sub">Design & Results</a>
             <a href="#" class="sub">Demonstration</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Transcriptional_Regulation" class="sub">Transcriptional regulation</a>
             <a href="#" class="sub">Parts</a>
+
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Plasmid_Copy_Number_Control" class="sub">Plasmid copy number control</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradation_Rate_Control" class="sub">Degradation rate control</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Demonstrate" class="sub">Demonstration</a>
 +
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Parts" class="sub">Parts</a>
 
         <a href="#">Modeling</a>
 
         <a href="#">Modeling</a>
         <a href="#">Software</a>
+
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Model" class="sub">Overview</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradation_Rate_Control_Model" class="sub">Degradation rate control</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Plasmid_Copy_Number_Control_Model" class="sub">Plasmid copy number control</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Transcriptional_Regulation_CarH" class="sub">Transcriptional regulation_CarH</a>
 +
            <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradataion_Rate_Control_BpHP1" class="sub">Degradation rate control_BpHP1</a>
 +
         <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Software">Software</a>
 
         <a href="#">Human Practices</a>
 
         <a href="#">Human Practices</a>
             <a href="#" class="sub">HP</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Human_Practices" class="sub">Human Practices</a>
             <a href="#" class="sub">HP model</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Public_Engagement" class="sub">Education & Public Engagment</a>
             <a href="#" class="sub">Integrated</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Collaborations" class="sub">Collaboration</a>
            <a href="#" class="sub">Collaboration</a>
+
 
         <a href="#">Team</a>
 
         <a href="#">Team</a>
             <a href="#">Members</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Team" class="sub">Members</a>
             <a href="#">Attributions</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Attributions" class="sub">Attributions</a>
             <a href="#">Sponsors</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Sponsors" class="sub">Sponsors</a>
 
         <a href="#">Notebook</a>
 
         <a href="#">Notebook</a>
             <a href="#">Lab journal</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Notebook" class="sub">Lab journal</a>
             <a href="#">Protocols</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Protocols" class="sub">Protocols</a>
             <a href="#">Safety</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Safety" class="sub">Safety</a>
 
         <a href="javascript:void(0);" class="icon" onclick="extendMobileMenu()">
 
         <a href="javascript:void(0);" class="icon" onclick="extendMobileMenu()">
 
             &#9776;
 
             &#9776;
Line 763: Line 772:
 
     </div>
 
     </div>
 
<div class="sidenav show-sidenav">
 
<div class="sidenav show-sidenav">
<div class="colight"><img src="https://2019.igem.org/wiki/images/6/68/T--Vilnius-Lithuania--colight.png"></div>
+
<div class="colight"><a href="https://2019.igem.org/Team:Vilnius-Lithuania"><img src="https://2019.igem.org/wiki/images/6/68/T--Vilnius-Lithuania--colight.png"></a></div>
  
 
<div class="menu-container">
 
<div class="menu-container">
Line 769: Line 778:
  
 
         <ul class="menu sub-menu-project sub-menu">
 
         <ul class="menu sub-menu-project sub-menu">
                 <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                 <li class="menu-item" style="position: relative;opacity:1">
                     <a href="#" class="return return-project" onclick="returnMenu('project')">Main menu</a>
+
                     <a href="#" class="return return-project" onclick="returnMenu('project')">Back to Main Menu</a>
 
                 </li>
 
                 </li>
                 <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                 <li class="menu-item" style="position: relative;opacity:1">
                     <a href="#">Inspiration & Description</a>
+
                     <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Description">Inspiration & Description</a>
 
                 </li>
 
                 </li>
                 <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                 <li class="menu-item" style="position: relative;opacity:1">
                     <a href="#">Design & Results</a>
+
                     <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Design">Design & Results</a>
 
                 </li>
 
                 </li>
                 <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                 <li class="menu-item" style="position: relative;opacity:1;padding-left:24px">
                     <a href="#">Demonstration</a>
+
                     <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Transcriptional_Regulation">Transcriptional regulation</a>
 
                 </li>
 
                 </li>
                 <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                 <li class="menu-item" style="position: relative;opacity:1;padding-left:24px">
                     <a href="#">Parts</a>
+
                    <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Plasmid_Copy_Number_Control">Plasmid copy number control</a>
 +
                </li>
 +
                <li class="menu-item" style="position: relative;opacity:1;padding-left:24px">
 +
                     <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradation_Rate_Control">Degradation rate control</a>
 +
                </li>
 +
                <li class="menu-item" style="position: relative;opacity:1">
 +
                    <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Demonstrate">Demonstration</a>
 +
                </li>
 +
                <li class="menu-item" style="position: relative;opacity:1">
 +
                    <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Parts">Parts</a>
 
                 </li>
 
                 </li>
 
             </ul>
 
             </ul>
             <ul class="menu sub-menu-modeling sub-menu">
+
             <ul class="menu sub-menu-modeling sub-menu" style="visibility:hidden">
 +
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
 +
                        <a href="#" class="return" onclick="returnMenu('modeling')">Back to Main Menu</a>
 +
                    </li>
 +
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
 +
                      <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Model">Overview</a>
 +
                    </li>
 +
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
 +
                      <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradation_Rate_Control_Model">Degradation rate control</a>
 +
                    </li>
 +
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
 +
                      <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Plasmid_Copy_Number_Control_Model">Plasmid copy number control</a>
 +
                    </li>
 +
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
 +
                      <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Transcriptional_Regulation_CarH">Transcriptional regulation_CarH</a>
 +
                    </li>
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
                        <a href="#" class="return" onclick="returnMenu('modeling')">Main menu</a>
+
                      <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Degradataion_Rate_Control_BpHP1">Degradation rate control_BpHP1 </a>
 
                     </li>
 
                     </li>
  
 
                 </ul>
 
                 </ul>
                 <ul class="menu sub-menu-software sub-menu">
+
                 <ul class="menu sub-menu-software sub-menu" style="visibility:hidden">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
                             <a href="#" class="return" onclick="returnMenu('software')">Main menu</a>
+
                             <a href="#" class="return" onclick="returnMenu('software')">Back to Main Menu</a>
 
                         </li>
 
                         </li>
 
                     </ul>
 
                     </ul>
             <ul class="menu sub-menu-hp sub-menu">
+
             <ul class="menu sub-menu-hp sub-menu" style="visibility:hidden">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
                         <a href="#" class="return" onclick="returnMenu('hp')">Main menu</a>
+
                         <a href="#" class="return" onclick="returnMenu('hp')">Back to Main Menu</a>
 
                     </li>
 
                     </li>
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
                         <a href="#">HP</a>
+
                         <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Human_Practices">Human Practices</a>
 
                     </li>
 
                     </li>
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
                         <a href="#">HP model</a>
+
                         <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Public_Engagement">Education & Public Engagement</a>
 
                     </li>
 
                     </li>
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                     <li class="menu-item" style="position: relative;left:200px;opacity:0">
                         <a href="#">Integrated</a>
+
                         <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Collaborations">Collaboration</a>
                    </li>
+
                    <li class="menu-item" style="position: relative;left:200px;opacity:0">
+
                        <a href="#">Collaboration</a>
+
 
                     </li>
 
                     </li>
 
                 </ul>
 
                 </ul>
                 <ul class="menu sub-menu-team sub-menu">
+
                 <ul class="menu sub-menu-team sub-menu" style="visibility:hidden">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
                             <a href="#" class="return" onclick="returnMenu('team')">Main menu</a>
+
                             <a href="#" class="return" onclick="returnMenu('team')">Back to Main Menu</a>
 
                         </li>
 
                         </li>
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
                             <a href="#">Members</a>
+
                             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Team">Members</a>
 
                         </li>
 
                         </li>
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
                             <a href="#">Attributions</a>
+
                             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Attributions">Attributions</a>
 
                         </li>
 
                         </li>
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                         <li class="menu-item" style="position: relative;left:200px;opacity:0">
                             <a href="#">Sponsors</a>
+
                             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Sponsors">Sponsors</a>
 
                         </li>
 
                         </li>
 
                     </ul>
 
                     </ul>
  
                     <ul class="menu sub-menu-notebook sub-menu">
+
                     <ul class="menu sub-menu-notebook sub-menu" style="visibility:hidden">
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
                                 <a href="#" class="return" onclick="returnMenu('notebook')">Main menu</a>
+
                                 <a href="#" class="return" onclick="returnMenu('notebook')">Back to Main Menu</a>
 
                             </li>
 
                             </li>
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
                                 <a href="#">Lab journal</a>
+
                                 <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Notebook">Lab journal</a>
 
                             </li>
 
                             </li>
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
                                 <a href="#">Protocols</a>
+
                                 <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Protocols">Protocols</a>
 
                             </li>
 
                             </li>
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
 
                             <li class="menu-item" style="position: relative;left:200px;opacity:0">
                                 <a href="#">Safety</a>
+
                                 <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Safety">Safety</a>
 
                             </li>
 
                             </li>
 
                         </ul>
 
                         </ul>
     <ul class="menu menu-main">
+
     <ul class="menu menu-main" style="visibility:hidden">
         <li class="menu-item" style="position: relative">
+
         <li class="menu-item" style="position: relative;left:200px;opacity:0">
             <a href="#">Home</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania">Home</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('project')" style="position: relative">
+
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('project')" style="position: relative;left:200px;opacity:0">
 
             <a href="#">Project</a>
 
             <a href="#">Project</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('modeling')" style="position: relative">
+
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('modeling')" style="position: relative;left:-200px;opacity:0">
 
             <a href="#">Modeling</a>
 
             <a href="#">Modeling</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('software')" style="position: relative">
+
         <li class="menu-item" style="position: relative;left:-200px;opacity:0">
             <a href="#">Software</a>
+
             <a href="https://2019.igem.org/Team:Vilnius-Lithuania/Software">Software</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('hp')" style="position: relative">
+
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('hp')" style="position: relative;left:-200px;opacity:0">
 
             <a href="#">Human Practices</a>
 
             <a href="#">Human Practices</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('team')" style="position: relative">
+
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('team')" style="position: relative;left:-200px;opacity:0">
 
             <a href="#">Team</a>
 
             <a href="#">Team</a>
 
         </li>
 
         </li>
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('notebook')" style="position: relative">
+
         <li class="menu-item menu-item-sub" onclick="expandSubMenu('notebook')" style="position: relative;left:-200px;opacity:0">
 
             <a href="#">Notebook</a>
 
             <a href="#">Notebook</a>
 
         </li>
 
         </li>
Line 867: Line 897:
 
</div>
 
</div>
 
</div>
 
</div>
 
+
<div class="cover">
 +
    <img src="https://2019.igem.org/wiki/images/d/da/T--Vilnius-Lithuania--cover19.jpg">
 +
    <span>Design & results</span>
 +
</div>
 
     <div class="main-page">
 
     <div class="main-page">
 
         <div class="row">
 
         <div class="row">
             <div class="col-md-10 col-sm-12">
+
             <div class="col-md-12 col-sm-12">
                <h1 class="page-title">Design</h1>
+
     
                <br>
+
 
                 <div class="content-block">
 
                 <div class="content-block">
                     <h4 class="page-heading" data-nav-id="1" id="page-heading-1">First heading</h4>
+
                     <!--TEKSTAS-->
 +
                    <h4 class="page-heading">First heading</h4>
 
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur congue magna magna, ac gravida
 
                     <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur congue magna magna, ac gravida
 
                         urna lacinia in. Duis eleifend suscipit nisi non maximus. Orci varius natoque penatibus et magnis
 
                         urna lacinia in. Duis eleifend suscipit nisi non maximus. Orci varius natoque penatibus et magnis
Line 881: Line 914:
 
                         et congue ante elementum at. Mauris ante odio, porttitor vel varius malesuada, porta ac neque.</p>
 
                         et congue ante elementum at. Mauris ante odio, porttitor vel varius malesuada, porta ac neque.</p>
 
                  
 
                  
                 <br>
+
                  
                <h4 class="page-heading" data-nav-id="2" id="page-heading-2">Second heading</h4>
+
                <p>Aliquam vel augue placerat, venenatis nulla sit amet, pulvinar felis. Etiam in pretium leo. Maecenas
+
                    ac elit ut tellus hendrerit porta. Nam iaculis ipsum eget enim fermentum lobortis. Suspendisse
+
                    potenti. Duis gravida rutrum enim. Aenean dictum ipsum a turpis tempus pulvinar. Vivamus auctor
+
                    magna vel velit malesuada volutpat. Fusce suscipit lectus quis sem accumsan fermentum. Proin vitae
+
                    eros in purus dictum laoreet non id nulla. Sed laoreet et diam volutpat convallis.</p>
+
                <br>
+
                <h4 class="page-heading" data-nav-id="3" id="page-heading-3">Third heading</h4>
+
                <p>Vestibulum lacus mi, convallis at nulla quis, varius rutrum eros. Morbi semper, augue sodales
+
                    efficitur facilisis, ante turpis sagittis erat, vitae placerat justo dolor eu enim. Cras eget dui
+
                    libero. In hac habitasse platea dictumst. In hac habitasse platea dictumst. Cras sapien tortor,
+
                    ultricies eu egestas vel, sodales eget odio. Aliquam ac augue ligula. Phasellus dapibus dolor in
+
                    fringilla sodales. Mauris quis ante sed risus scelerisque euismod. In placerat ut massa ornare
+
                    feugiat. Quisque consectetur lorem eget pellentesque lacinia. In a ante gravida, porttitor augue
+
                    eget, fermentum lorem.</p>
+
                <br>
+
                <h4 class="page-heading" data-nav-id="4" id="page-heading-4">Fourth heading</h4>
+
                <p>Curabitur commodo nunc non pharetra volutpat. Donec luctus nibh nec massa vulputate posuere. Donec
+
                    sed mauris quis lacus lacinia vestibulum. Proin at risus congue, egestas lorem et, sagittis libero.
+
                    Sed at tincidunt libero. Quisque commodo elit sed ipsum gravida vestibulum. Cras maximus enim lorem.
+
                    Morbi sagittis fermentum tempus.</p>
+
                <br>
+
                <h4 class="page-heading" data-nav-id="5" id="page-heading-5">Fifth heading</h4>
+
                <p>Fusce bibendum turpis mollis suscipit sodales. Praesent elit quam, interdum ac scelerisque non,
+
                    imperdiet a ex. Praesent porta sed mi et ultrices. Phasellus porta lacinia iaculis. Nunc eu lectus
+
                    ac nunc rhoncus consequat. Etiam ac ligula ut magna hendrerit pulvinar. Maecenas aliquet eros odio,
+
                    sed volutpat mauris fringilla vel. Quisque in erat at mi placerat fringilla quis id dolor.</p>
+
                <br>
+
                <h4 class="page-heading" data-nav-id="6" id="page-heading-6">Typography</h4>
+
 
+
                <br>
+
 
+
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur congue magna magna, ac gravida
+
                    urna lacinia in. Duis eleifend suscipit nisi non maximus. Orci varius natoque penatibus et magnis
+
                    dis parturient montes, nascetur ridiculus mus. Integer sed arcu tortor. Sed ut mi ac quam luctus
+
                    iaculis id vitae magna. Praesent ultricies lacus id pharetra viverra. Nulla lobortis bibendum augue,
+
                    et congue ante elementum at. Mauris ante odio, porttitor vel varius malesuada, porta ac neque.</p>
+
                </div>
+
                <br>
+
 
+
 
+
 
+
                <br>
+
                <br>
+
 
+
 
+
            </div>
+
            <div class="col-2 d-none d-sm-none d-md-block">
+
                <div class="page-menu">
+
                    <h6 class="page-menu-link" id="link_1" onclick="scrollToHeading(1)">First heading</h6>
+
                    <h6 class="page-menu-link" id="link_2" onclick="scrollToHeading(2)">Second heading</h6>
+
                    <h6 class="page-menu-link" id="link_3" onclick="scrollToHeading(3)">Third heading</h6>
+
                    <h6 class="page-menu-link" id="link_4" onclick="scrollToHeading(4)">Fourth heading</h6>
+
                    <h6 class="page-menu-link" id="link_5" onclick="scrollToHeading(5)">Fifth heading</h6>
+
                    <h6 class="page-menu-link" id="link_6" onclick="scrollToHeading(6)">Typography</h6>
+
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>

Latest revision as of 22:11, 13 October 2019

Design & results

First heading

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur congue magna magna, ac gravida urna lacinia in. Duis eleifend suscipit nisi non maximus. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Integer sed arcu tortor. Sed ut mi ac quam luctus iaculis id vitae magna. Praesent ultricies lacus id pharetra viverra. Nulla lobortis bibendum augue, et congue ante elementum at. Mauris ante odio, porttitor vel varius malesuada, porta ac neque.