Difference between revisions of "Team:LUBBOCK TTU/Notebook"

 
(116 intermediate revisions by the same user not shown)
Line 1: Line 1:
{{LUBBOCK_TTU}}
+
{{LUBBOCK_TTU/fontawesome/css/font-awesome-ie7.css}}
<!-- {{Template:Lubbock_TTU/LightBox}} -->
+
{{LUBBOCK_TTU/fontawesome/css/font-awesome-ie7.min.css}}
 +
{{LUBBOCK_TTU/fontawesome/css/font-awesome.css}}
 +
{{LUBBOCK_TTU/fontawesome/css/font-awesome.min.css}}
 +
{{LUBBOCK_TTU/navi}}
 +
{{LUBBOCK_TTU/linkcolors}}
  
 
<html>
 
<html>
<html lang="en">
+
<meta name="viewport" content="width=device-width, initial-scale=1">
<head>
+
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
  
<style>
+
<!-- Font Awesome -->
 +
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 +
<!-- End Font Awesome -->
 +
 
 +
<!-- Bootstrap Grid Basic --><!-- Collapsible Dates -->
 +
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 +
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 +
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 +
<!-- End Bootstrap Grid Basic --><!-- End Collapsible Dates -->
 +
 
 +
<!--DEFAULT WIKI SETTINGS-->
 +
<style> /* Clear the default wiki settings */
 
#home_logo, #sideMenu { display:none; }
 
#home_logo, #sideMenu { display:none; }
 
#sideMenu, #top_title, .patrollink  {display:none;}
 
#sideMenu, #top_title, .patrollink  {display:none;}
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
+
#content { width:100%; padding:0px;  margin-top:1px; margin-left:0px;}
 
body {background-color:white; }
 
body {background-color:white; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
 +
</style>
  
<!-- blog post CSS -->
+
<!-- FOOTER CSS -->
@import "compass/css3";
+
<style>
 +
/**
 +
* Demo Styles
 +
*/
  
/* sassy buttons normally */
+
html {
@import "compass";
+
  height: 100%;
//@import "blueprint/buttons";
+
  box-sizing: border-box;
 
+
$base-font-size: 14px;
+
$base-line-height: 23px;
+
@include establish-baseline;
+
 
+
* { box-sizing: border-box;}
+
 
+
body {
+
  background-image: url('');
+
  font-weight: 400;
+
  color: #333;
+
  margin-top: 2em;
+
 
+
 
}
 
}
  
.page {
+
*,
  width: 800px; /* for now */
+
*:before,
   margin: 0 auto;
+
*:after {
 +
   box-sizing: inherit;
 
}
 
}
  
.post {
+
body {
   background: #eee;
+
   position: relative;
   @include rhythm-borders(1px);
+
   margin: 0;
  padding-top: 0;
+
   <!--padding-bottom: 6rem;-->
   padding-bottom: 0;
+
   min-height: 100%;
   border: 1px solid #ccc;
+
  @include box-shadow(rgba(0, 0, 0, 0.2) 0 0 5px 0);
+
 
}
 
}
  
/* Metadata */
+
/**
.post-meta {
+
* Footer Styles
  @include adjust-font-size-to(14px);
+
*/
  text-align: right;
+
}
+
  
.post-meta ul {
+
.footer {
list-style: none;
+
  position: absolute;
 +
  right: 0;
 +
  bottom: -900;
 +
  left: 0;
 +
  padding: 1rem;
 +
  background-color: #fff;
 +
  text-align: center;
 
}
 
}
 +
</style>
 +
<!-- END FOOTER CSS -->
  
.post-meta li {
 
  display: inline-block;
 
  margin-left: 1em;
 
  color: #777;
 
}
 
  
.post-meta a {
+
<!-- TABS CSS -->
  color: #777;
+
<style>
  text-decoration: none;
+
  *, *:before, *:after {margin: 0; padding: 0; box-sizing: border-box;}
}
+
 +
  h1 {padding: 100px 0; font-weight: 400; text-align: center;}
 +
  <!--p {margin: 0 0 20px; line-height: 1.5;}-->
 +
 +
  .main {margin: 0 auto; min-width: 320px; max-width: 90%;}
 +
  .content {background: #; color: #;}
 +
  .content > div {display: none;}
 +
 +
  input {display: none;}
 +
  label {display: inline-block; padding: 15px 25px; font-weight: 600; text-align: center;}
 +
  label:hover {color: #ed5a6a; cursor: pointer;}
 +
  input:checked + label {background: #ed5a6a; color: #fff;}
 +
 +
  #tab1:checked ~ .content #content1,
 +
  #tab2:checked ~ .content #content2,
 +
  #tab3:checked ~ .content #content3,
 +
  #tab4:checked ~ .content #content4,
 +
  #tab5:checked ~ .content #content5,
 +
  #tab6:checked ~ .content #content6,
 +
  #tab7:checked ~ .content #content7,
 +
  #tab8:checked ~ .content #content8,
 +
  #tab9:checked ~ .content #content9 {
 +
    display: block;
 +
  }
 +
 +
  @media screen and (max-width: 400px) { label {padding: 15px 10px;} }
  
.post-meta a:hover {
+
hr { margin-top: 1px; margin-bottom: 15px }
color: #333;
+
}
+
<!-- end of blog post CSS -->
+
 
+
<!-- light box css -->
+
HTML  CSS  Result
+
EDIT ON
+
@import url(https://fonts.googleapis.com/css?family=Bungee+Shade);
+
    .img {
+
        border-radius: 2px;
+
        box-shadow: 0 0 5px #343436;
+
        filter:brightness(1.1);
+
        height: 150px;
+
        width: 200px;
+
    }
+
    .img:target {
+
        height: 450px;
+
        width: 500px;
+
    }
+
    .img:target+.close {
+
        display: block;
+
    }
+
    .img:target+.close+.expand{
+
        display: none;
+
    }
+
    .close {
+
        background-image: url(https://bit.ly/29QeT21);
+
        background-repeat: no-repeat;
+
        bottom: 418px;
+
        display: none;
+
        height: 32px;
+
        left: 462px;
+
        margin-top: -32px;
+
        position: relative;
+
        width: 32px;
+
    }
+
    .expand{
+
        bottom: 125px;
+
        margin-left: -32px;
+
        margin-right: 16px;
+
        pointer-events: none;
+
        position: relative;
+
    }
+
    #wrapper {
+
        margin: auto;
+
        padding: 10px;
+
        text-align: center;
+
        width: 500px;
+
    }
+
    body{
+
        background-image: linear-gradient(to bottom, #178FDD  68px,  antiquewhite 68px  );
+
        height: 1000px;
+
    }
+
    h2{
+
        color: #000;
+
        font-family: bungee shade, georgia;
+
        text-align: center;
+
        text-shadow: 0 0 2px #343436;
+
    }
+
<!-- end of light box css -->
+
  
 
</style>
 
</style>
 +
<!-- END TABS CSS -->
  
<meta charset="utf-8">
+
<!-- TEAM CSS -->
<meta name="viewport" content="width=device-width">
+
<style>
<style type="text/css">
+
html {
    /* CLIENT-SPECIFIC STYLES */
+
  box-sizing: border-box;
    #outlook a{padding:0;} /* Force Outlook to provide a "view in browser" message */
+
    .ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Hotmail to display emails at full width */
+
    .ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div {line-height: 100%;} /* Force Hotmail to display normal line spacing */
+
    body, table, td, a{-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%;} /* Prevent WebKit and Windows mobile changing default text sizes */
+
    table, td{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up */
+
    img{-ms-interpolation-mode:bicubic;} /* Allow smoother rendering of resized image in Internet Explorer */
+
 
+
    /* RESET STYLES */
+
    body{margin:0; padding:0;}
+
    img{border:0; height:auto; line-height:100%; outline:none; text-decoration:none;}
+
    table{border-collapse:collapse !important;}
+
    body{height:100% !important; margin:0; padding:0; width:100% !important;}
+
 
+
    /* iOS BLUE LINKS */
+
    .appleBody a {color:#68440a; text-decoration: none;}
+
    .appleFooter a {color:#999999; text-decoration: none;}
+
 
+
    /* MOBILE STYLES */
+
    @media screen and (max-width: 525px) {
+
 
+
        /* ALLOWS FOR FLUID TABLES */
+
        table[class="wrapper"]{
+
          width:100% !important;
+
        }
+
 
+
        /* ADJUSTS LAYOUT OF LOGO IMAGE */
+
        td[class="logo"]{
+
          text-align: left;
+
          padding: 20px 0 20px 0 !important;
+
        }
+
 
+
        td[class="logo"] img{
+
          margin:0 auto!important;
+
        }
+
 
+
        /* USE THESE CLASSES TO HIDE CONTENT ON MOBILE */
+
        td[class="mobile-hide"]{
+
          display:none;}
+
 
+
        img[class="mobile-hide"]{
+
          display: none !important;
+
        }
+
 
+
        img[class="img-max"]{
+
          max-width: 100% !important;
+
          height:auto !important;
+
        }
+
 
+
        /* FULL-WIDTH TABLES */
+
        table[class="responsive-table"]{
+
          width:100%!important;
+
        }
+
 
+
        /* UTILITY CLASSES FOR ADJUSTING PADDING ON MOBILE */
+
        td[class="padding"]{
+
          padding: 10px 5% 15px 5% !important;
+
        }
+
 
+
        td[class="padding-copy"]{
+
          padding: 10px 5% 10px 5% !important;
+
          text-align: center;
+
        }
+
 
+
        td[class="padding-meta"]{
+
          padding: 30px 5% 0px 5% !important;
+
          text-align: center;
+
        }
+
 
+
        td[class="no-pad"]{
+
          padding: 0 0 20px 0 !important;
+
        }
+
 
+
        td[class="no-padding"]{
+
          padding: 0 !important;
+
        }
+
 
+
        td[class="section-padding"]{
+
          padding: 50px 15px 50px 15px !important;
+
        }
+
 
+
        td[class="section-padding-bottom-image"]{
+
          padding: 50px 15px 0 15px !important;
+
        }
+
 
+
        /* ADJUST BUTTONS ON MOBILE */
+
        td[class="mobile-wrapper"]{
+
            padding: 10px 5% 15px 5% !important;
+
        }
+
 
+
        table[class="mobile-button-container"]{
+
            margin:0 auto;
+
            width:100% !important;
+
        }
+
 
+
        a[class="mobile-button"]{
+
            width:80% !important;
+
            padding: 15px !important;
+
            border: 0 !important;
+
            font-size: 16px !important;
+
        }
+
 
+
    }
+
 
+
<!-- lightbox css -->
+
.spacer
+
{
+
    height: 210px;
+
 
}
 
}
  
.pageWrapper
+
*, *:before, *:after {
{
+
  box-sizing: inherit;
    width: 100%;
+
    max-width: 960px;
+
    margin: auto;
+
    padding-right: 40px;
+
    padding-left: 40px;
+
 
}
 
}
/*
 
Lightbox
 
=============================================================*/
 
  
.lightboxRow
+
.column {
{
+
  float: left;
    position: relative;
+
  width: 33.3%;
 
+
  margin-bottom: 16px;
    /*border-top: 1px solid #cfcfcf;*/
+
  padding: 0 8px;
    border-bottom: 1px solid #cfcfcf;
+
 
}
 
}
  
.lightbox
+
@media (max-width: 650px) {
{
+
  .column {
 
     width: 100%;
 
     width: 100%;
    max-width: 674px;
 
    margin: auto;
 
}
 
 
.light
 
{
 
    float: left;
 
 
    box-sizing: border-box;
 
    margin: 4px 0;
 
    padding: 0 4px 0 4px;
 
}
 
 
label
 
{
 
    position: relative;
 
 
 
     display: block;
 
     display: block;
    overflow: hidden;
+
  }
 
+
    width: 100%;
+
    margin: 0;
+
    padding-top: 60%;
+
 
}
 
}
  
label img
+
.card {
{
+
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
    position: absolute;
+
    top: 0;
+
    left: 0;
+
 
+
    width: 100%;
+
 
}
 
}
  
.lightswitch
+
.container {
{
+
  padding: 0 16px;
    display: none;
+
 
}
 
}
  
.imglarge
+
.container::after, .row::after {
{
+
  content: "";
    position: absolute;
+
  clear: both;
    z-index: 1100;
+
  display: table;
    top: 50%;
+
    left: 50%;
+
 
+
    visibility: hidden;
+
 
+
    width: 100%;
+
    max-width: 900px;
+
 
+
    transition: visibility 0s .2s;
+
    transition-property: visibility;
+
    -webkit-transform: translate(-50%, -50%);
+
            transform: translate(-50%, -50%);
+
 
}
 
}
  
 
+
.title {
.innerFloat
+
  color: grey;
{
+
    position: relative;
+
 
}
 
}
  
.imglarge img
+
.button {
{
+
  border: none;
    position: relative;
+
  outline: 0;
    z-index: 1100;
+
  display: inline-block;
 +
  padding: 8px;
 +
  color: white;
 +
  background-color: #000;
 +
  text-align: center;
 +
  cursor: pointer;
 +
  width: 100%;
 
}
 
}
  
.lighboxbkgnd
+
.button:hover {
{
+
  background-color: #555;
    position: fixed;
+
   
+
    z-index: 1000;
+
    top: 0;
+
    left: 0;
+
    right:0;
+
    bottom:0;
+
 
+
    visibility: hidden;
+
 
+
    -webkit-transition: all .4s ease-in-out;
+
      -moz-transition: all .4s ease-in-out;
+
        -o-transition: all .4s ease-in-out;
+
            transition: all .4s ease-in-out;
+
    transition-property: opacity, visibility;
+
 
+
    opacity: 0;
+
    /*background-color: rgba(0, 0, 0, .5);*/
+
    background:    -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .9) 100%);
+
    /* FF3.6+ */
+
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, rgba(0, 0, 0, .65)), color-stop(100%, rgba(0, 0, 0, .9)));
+
    /* Chrome,Safari4+ */
+
    background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .9) 100%);
+
    /* Chrome10+,Safari65.1+ */
+
    background:      -o-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .9) 100%);
+
    /* Opera 12+ */
+
    background:    -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .9) 100%);
+
    /* IE10+ */
+
    background:        radial-gradient(ellipse at center, rgba(0, 0, 0, .65) 0%, rgba(0, 0, 0, .9) 100%);
+
    /* W3C */
+
 
+
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#80000000', endColorstr='#bf000000', GradientType=1);
+
    /* IE6-9 fallback on horizontal gradient */
+
 
}
 
}
 +
</style>
 +
<!-- END TEAM CSS -->
  
.leftArrow,
+
<body>
.rightArrow,
+
.offswitch,
+
.caption
+
{
+
    font-family: gotham_mediumregular;
+
  
    position: absolute;
+
<!-- SECTION 1 -->
    z-index: 1110;
+
<div style="background-color:#ffffff; overflow: auto;" class="clear_fix">
 +
<center>
 +
</br></br>
 +
<font face="Arial" size="6"></br><i class="fa fa-book" style="font-size:30px;color:black;"></i>&nbsp;&nbsp;Notebook</font></br></br>
 +
<div class="col-sm-12">
  
    display: block;
+
<div class="main">
  
    cursor: pointer !important;
+
  <input id="tab1" type="radio" name="tabs" checked>
    transition-property: opacity;
+
  <label for="tab1">March</label>
    text-decoration: none !important;
+
 +
  <input id="tab2" type="radio" name="tabs">
 +
  <label for="tab2">April</label>
 +
 +
  <input id="tab3" type="radio" name="tabs">
 +
  <label for="tab3">May</label>
 +
 +
  <input id="tab4" type="radio" name="tabs">
 +
  <label for="tab4">June</label>
  
    opacity: 0;
+
  <input id="tab5" type="radio" name="tabs">
    color: white;
+
  <label for="tab5">July</label>
    background-color: rgba(0, 0, 0, .5);
+
}
+
  
.caption
+
  <input id="tab6" type="radio" name="tabs">
{
+
  <label for="tab6">August</label>
    width: 100%;
+
    padding: .9em .2em;
+
  
    cursor: initial !important;
+
  <input id="tab7" type="radio" name="tabs">
    text-align: center;
+
  <label for="tab7">September</label>
}
+
  
.leftArrow:hover,
+
  <input id="tab8" type="radio" name="tabs">
.rightArrow:hover,
+
  <label for="tab8">October</label>
.offswitch:hover
+
{
+
    color: white !important;
+
}
+
  
.leftArrow,
+
  <div class="content"> 
.rightArrow
+
  <div id="content1">
{
+
<!-- Tab 1 Content --><!-- MARCH -->
    font-size: 30px;
+
<hr>
 +
<div class="container">
 +
  <div class="panel-group" id="accordion">
 +
 +
  <div class="panel panel-default">
 +
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse1"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;03/14/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse1" class="panel-collapse collapse in">
 +
        <div class="panel-body"><p align="left"><font size="2">The iGEM Raiders team held a meeting to create a promotional flyer to be used for acquiring support and fundraising. Team members were assigned blurbs to write for the flyer covering topics including what iGEM is, what our project is, why iGEM should continue at Texas Tech, why it should be supported, and our prospective goals such as being published. Team member Kaitlyn was assigned the task of designing the flyer.</br></br>
 +
View our flyer <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8TmRMM0hYX0xtamc/view?usp=sharing" target="_blank">here.</a></br>View our meeting minutes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8cU9hb2UyaThQQzQ/view?usp=sharing" target="_blank">here.</a>
 +
</font></div>
 +
      </div>
 +
  </div>
  
     top: 50%;
+
     <div class="panel panel-default">
 +
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse2"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;03/19/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse2" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">The iGEM Raiders team met for the weekly meeting. Officer elections were held and the team discussed funding for team registration, bio-curriculum to be taught at ULabs, and delegated tasks to members.</br></br>Check out our members <a href="https://2017.igem.org/Team:LUBBOCK_TTU/Team" target="_blank">here!</a></br>View our meeting minutes <a href="https://docs.google.com/document/d/1_wOdYzKX_NBMjXe_rxJvGA8uklT6Nxf-wAGxD3naTZE/edit?usp=sharing" target="_blank">here.</a></p></font></div>
 +
      </div>
 +
    </div>
 +
 +
  <div class="panel panel-default">
 +
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;03/26/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse3" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">The iGEM Raiders team met for the weekly meeting. Strategy and talking points were discussed to prepare members for recruiting funding from potential donors. Additionally, fundraising, university sponsor, and outreach updates were discussed.</br></br>View our meeting minutes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8QldWdkQ0cGh0Wjg/view?usp=sharing" target="_blank">here.</a></font></p></div>
 +
      </div>
 +
    </div>
  
     padding: .35em .45em;
+
  <div class="panel panel-default">
 +
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse4"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;03/28/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse4" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">The iGEM Raiders team attended a dinner to get to know one another.</font></p></div>
 +
      </div>
 +
     </div>
  
    -webkit-transform: translateY(-50%);
+
  </div>
            transform: translateY(-50%);
+
</div>
}
+
<!-- End Tab 1 -->
 +
</br>
 +
  </div>
  
.leftArrow {
+
  <div id="content2">
left:0;
+
<!-- Tab 2 Content --><!-- APRIL -->
}
+
<hr>
.rightArrow {
+
<div class="container">
right:0;
+
  <div class="panel-group" id="accordion">
}
+
  
.offswitch
+
  <div class="panel panel-default">
{
+
      <div class="panel-heading">
    font-size: 12px;
+
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse5"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;04/09/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse5" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 04/09/2017.</br></br>View our meeting notes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8TGFiUDZzYXd5YjA/view?usp=sharing" target="_blank">here.</a></font></a></div>
 +
      </div>
 +
    </div>
  
    top: 0;
+
  <div class="panel panel-default">
    right: 0;
+
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse6"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;04/23/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse6" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 04/23/2017.</br></br>View our meeting notes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8dVFESjdtZjNEbDQ/view?usp=sharing" target="_blank">here.</a></font></a></div>
 +
      </div>
 +
    </div>
  
    padding: .54em .95em;
+
  <div class="panel panel-default">
}
+
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse7"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;04/30/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse7" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 04/20/2017.</br></br>View our meeting minutes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8TWcwQ1dKbldqTU0/view?usp=sharing" target="_blank">here.</a></font></a></div>
 +
      </div>
 +
    </div>
  
.imglarge img
+
  </div>
{
+
</div>
    transition-property: opacity, scale;
+
<!-- End Tab 2 -->
    transform: scale(0);
+
</br>
 +
  </div>
  
    opacity: 0;
+
  <div id="content3">
}
+
<!-- Tab 3 Content -->
 +
<hr>
 +
<div class="container">
 +
  <div class="panel-group" id="accordion">
  
.leftArrow,
+
  <div class="panel panel-default">
.rightArrow,
+
      <div class="panel-heading">
.offswitch,
+
        <h4 class="panel-title">
.imglarge img
+
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse8"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;05/07/2017</font></a>
{
+
        </h4>
    -webkit-transition: all .7s ease-in-out;
+
      </div>
      -moz-transition: all .7s ease-in-out;
+
      <div id="collapse8" class="panel-collapse collapse">
        -o-transition: all .7s ease-in-out;
+
        <div class="panel-body"><p align="left"><font size="2">Description 05/07/2017.</br></br>View our meeting minutes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8SExTX0lhd0VwUEU/view?usp=sharing" target="_blank">here.</a></font></a></div>
            transition: all .7s ease-in-out;
+
      </div>
}
+
    </div>
/*
+
animate in
+
=============================================================*/
+
  
[type=radio]:checked ~ label ~ .imglarge
+
  </div>
{
+
</div>
    visibility: visible;
+
<!-- End Tab 3 -->
}
+
</br>
 +
  </div>
  
[type=radio]:checked ~ label ~ .imglarge img,
+
  <div id="content4">
:checked ~ label ~ .imglarge .offswitch,
+
<!-- Tab 4 Content -->
:checked ~ label ~ .imglarge .leftArrow,
+
<hr>
:checked ~ label ~ .imglarge .rightArrow,
+
<div class="container">
:checked ~ label ~ .imglarge .caption
+
  <div class="panel-group" id="accordion">
{
+
    transform: scale(1);
+
  
    opacity: 1;
+
  <div class="panel panel-default">
}
+
      <div class="panel-heading">
 +
        <h4 class="panel-title">
 +
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse9"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;06/13/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse9" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 06/13/2017.</br></br>View our meeting minutes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8TnpFTVh2cE9JWUU/view?usp=sharing" target="_blank">here.</a></font></a></div>
 +
      </div>
 +
    </div>
  
[type=checkbox]:checked ~ .lighboxbkgnd
+
  </div>
{
+
</div>
    visibility: visible;
+
<!-- End Tab 4 -->
 +
</br>
 +
  </div>
  
    opacity: 1;
+
  <div id="content5">
}
+
<!-- Tab 5 Content -->
/*
+
<hr>
animate out
+
<div class="container">
=============================================================*/
+
  <div class="panel-group" id="accordion">
  
[type=radio]:not(:checked) ~ label ~ .imglarge
+
  <div class="panel panel-default">
{
+
      <div class="panel-heading">
    visibility: hidden;
+
        <h4 class="panel-title">
}
+
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse10"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;07/15/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse10" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 07/15/2017.</br></br>View our meeting notes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8aXhKYVR0QUxtUkk/view?usp=sharing" target="_blank">here.</a></font></p></div>
 +
      </div>
 +
    </div>
  
[type=radio]:not(:checked) ~ label ~ .imglarge img,
+
  <div class="panel panel-default">
[type=radio]:not(:checked) ~ label ~ .imglarge .lighboxbkgnd
+
      <div class="panel-heading">
{
+
        <h4 class="panel-title">
     visibility: hidden;
+
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse11"><font size="3"><i class="fa fa-clock-o" aria-hidden="true"></i>&nbsp;07/22/2017</font></a>
 +
        </h4>
 +
      </div>
 +
      <div id="collapse11" class="panel-collapse collapse">
 +
        <div class="panel-body"><p align="left"><font size="2">Description 07/22/2017.</br></br>View our meeting notes <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8SEZBRHBiQmJ1MjA/view?usp=sharing" target="_blank">here.</a></font></a></div>
 +
      </div>
 +
     </div>
  
    -webkit-transition: all .2s ease-in-out;
+
  </div>
      -moz-transition: all .2s ease-in-out;
+
        -o-transition: all .2s ease-in-out;
+
            transition: all .2s ease-in-out;
+
 
+
    opacity: 0;
+
 
+
    scale: 0;
+
}
+
 
+
 
+
/*============================================================
+
Desktop Styles
+
============================================================*/
+
 
+
@media only screen and (min-width: 641px)
+
{
+
    .imglarge img
+
    {
+
        width: 900px;
+
    }
+
    .leftArrow
+
    {
+
        -webkit-transform: translateX(120%);
+
            transform: translateX(120%);
+
      margin-left: -8%;
+
           
+
    }
+
    .rightArrow
+
    {
+
        -webkit-transform: translateX(120%);
+
            transform: translateX(120%);
+
            margin-right: -8%;
+
    }
+
 
+
    .light
+
    {
+
        width: 33.3%;
+
    }
+
}
+
 
+
 
+
/*============================================================
+
Mobile Styles
+
============================================================*/
+
 
+
@media only screen and (max-width: 640px)
+
{
+
    .light
+
    {
+
        width: 50%;
+
    }
+
 
+
    .imglarge img
+
    {
+
        width: 100%;
+
    }
+
  .leftArrow
+
    {
+
        -webkit-transform: translateX(0);
+
            transform: translateX(0);
+
            margin-left:0;
+
    }
+
    .rightArrow
+
    {
+
        -webkit-transform: translateX(0);
+
            transform: translateX(0);
+
            margin-left:0;
+
    }
+
    .imglarge
+
    {
+
        width: 100%;
+
    }
+
}
+
</style>
+
 
+
<div class="column full_size">
+
<h1>Notebook</h1>
+
 
</div>
 
</div>
 +
<!-- End Tab 5 -->
 +
</br>
 +
  </div>
  
<div class="clear"></div>
+
  <div id="content6">
 
+
<!-- Tab 6 Content -->
<!-- blog posts -->
+
<font size="2">August</font>
 +
<!-- End Tab 6 -->
 
</br>
 
</br>
<div class="page">
+
  </div>
  <article class="post" itemscope="itemscope" itemtype="http://schema.org/BlogPosting">
+
    <meta content="en" itemprop="inLanguage" />
+
        <h2 itemprop="headline"><a href="#"></br>Title 1</a></h2>
+
    <div class="abstract" itemprop="description">
+
<p>The iGEM Raiders team held a meeting to create a promotional flyer to be used for acquiring support and fundraising. Team members were assigned blurbs to write for the flyer covering topics including what iGEM is, what our project is, why iGEM should continue at Texas Tech, why it should be supported, and our prospective goals such as being published. Team member Kaitlyn was assigned the task of designing the flyer. View our flyer <a href="https://drive.google.com/file/d/0ByB5tqbv6EB8TmRMM0hYX0xtamc/view?usp=sharing" target="_blank">here.</a></p>
+
    </div>
+
    <footer class="post-meta">
+
      <ul>
+
        <li>
+
          <i class="fa fa-clock-o" aria-hidden="true"></i>
+
          <time datetime="03-14-2017" itemprop="datePublished">03-14-2017</time>
+
        </li>
+
      </ul>
+
    </footer>
+
  </article>
+
</div>
+
  
 +
  <div id="content7">
 +
<!-- Tab 7 Content -->
 +
<font size="2">September</font>
 +
<!-- End Tab 7 -->
 
</br>
 
</br>
<div class="page">
+
  </div>
  <article class="post" itemscope="itemscope" itemtype="http://schema.org/BlogPosting">
+
    <meta content="en" itemprop="inLanguage" />
+
        <h2 itemprop="headline"><a href="#"></br>Title 2</a></h2>
+
    <div class="abstract" itemprop="description">
+
<p>The iGEM Raiders team met for the weekly meeting. Officer elections were held and the team discussed funding for team registration, bio-curriculum to be taught at ULabs, and delegated tasks to members. Check our our members <a href="https://2017.igem.org/Team:LUBBOCK_TTU/Team" target="_blank">here!</a></p>
+
    </div>
+
    <footer class="post-meta">
+
      <ul>
+
        <li>
+
          <i class="fa fa-clock-o" aria-hidden="true"></i>
+
          <time datetime="03-19-2017" itemprop="datePublished">03-19-2017</time>
+
        </li>
+
      </ul>
+
    </footer>
+
  </article>
+
</div>
+
  
 +
  <div id="content8">
 +
<!-- Tab 8 Content -->
 +
<font size="2">October</font>
 +
<!-- End Tab 8 -->
 
</br>
 
</br>
<div class="page">
+
  </div>
  <article class="post" itemscope="itemscope" itemtype="http://schema.org/BlogPosting">
+
    <meta content="en" itemprop="inLanguage" />
+
        <h2 itemprop="headline"><a href="#"></br>Title 3</a></h2>
+
    <div class="abstract" itemprop="description">
+
<!--<img src="https://static.igem.org/mediawiki/2017/2/27/Lubbock_TTU_032617_1.jpeg" align="left" width="300" hspace="15">-->
+
<p align="left">The iGEM Raiders team met for the weekly meeting. Strategy and talking points were discussed to prepare members for recruiting funding from potential donors. Additionally, fundraising, university sponsor, and outreach updates were discussed.</p>
+
  
<div class="pageWrapper">
+
  </div> <!-- end class content -->
    <!--<div class="spacer"> </div>-->
+
</div> <!-- end class main -->
    <!--Lightbox-->
+
    <div class="row centerContent lightboxRow">
+
        <form class="lightbox" name="lightbox">
+
            <!--background-->
+
            <input type="checkbox" id="check1" name="lightbox" class="lightswitch">
+
            <div class="lighboxbkgnd"></div>
+
            <!--image 1-->
+
            <div class="light">
+
                <input type="radio" id="switch1" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch1">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Lobby-0872=2.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge1" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch6.checked=true">&lt;&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch2.checked=true">&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Lobby-0872=2.jpg">
+
                        <div class="caption">A three-tiered lobby with marble staircase, hand-painted <em>tromp l’oeil</em> mural, Murano glass chandelier, and portrait of Maria Theresa evoke the décor of Vienna’s Schönbrunn Palace. </div>
+
                        <a class="offswitch" onclick="document.lightbox.switch1.checked=false; document.lightbox.check1.checked=false">X</a>
+
                    </div>
+
                </div>
+
            </div>
+
            <!--image 2-->
+
            <div class="light">
+
                <input type="radio" id="switch2" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch2">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Lounge-0757=2.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge1" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch1.checked=true">&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch3.checked=true">&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Lounge-0757=2.jpg">
+
                        <div class="caption">The Hapsburg Salon features five murals depicting the 18th-century Austrian countryside, hand-painted by specially commissioned Croxford and Saunders artists.</div>
+
                        <a class="offswitch" onclick="document.lightbox.switch2.checked=false; document.lightbox.check1.checked=false">X</a>
+
                    </div>
+
                </div>
+
            </div>
+
            <!--image 3-->
+
            <div class="light">
+
                <input type="radio" id="switch3" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch3">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-restaurant-0664=2.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge1" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch2.checked=true">&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch4.checked=true">&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-restaurant-0664=2.jpg">
+
                        <div class="caption">The Baroque restaurant provides a dining experience fit for royalty, with gilded coronets, custom-made furniture, and gold, brown, and blue-accented window coverings and carpet.</div>
+
                        <a class="offswitch" onclick="document.lightbox.switch3.checked=false; document.lightbox.check1.checked=false">X</a>
+
                    </div>
+
                </div>
+
            </div>
+
            <!--image 4-->
+
            <div class="light">
+
                <input type="radio" id="switch4" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch4">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Suite407-0578=2.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge1" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch3.checked=true">&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch5.checked=true">&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Suite407-0578=2.jpg">
+
                        <div class="caption">Guests staying in the ship’s 10 sumptuous suites or the splendid Royal Suite can indulge in extra-special pampering, including butler service and an in-suite wellness treatment.</div>
+
                        <a class="offswitch" onclick="document.lightbox.switch4.checked=false; document.lightbox.check1.checked=false">X</a>
+
                    </div>
+
                </div>
+
            </div>
+
            <!--image 5-->
+
            <div class="light">
+
                <input type="radio" id="switch5" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch5">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Suite412-0731=2.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge1" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch4.checked=true">&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch6.checked=true">&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Suite412-0731=2.jpg">
+
                        <div class="caption">The luxurious Baroque-style décor of the <em>S.S. Maria Theresa’s</em> elegant suites includes modern conveniences such as keypad-controlled lighting and drop-down televisions.</div>
+
                        <a class="offswitch" onclick="document.lightbox.switch5.checked=false; document.lightbox.check1.checked=false">X</a>
+
                    </div>
+
                </div>
+
            </div>
+
            <!--image 6-->
+
            <div class="light">
+
                <input type="radio" id="switch6" name="lightbox" class="lightswitch" onclick="document.lightbox.check1.checked=true">
+
                <label for="switch6">
+
                    <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Cat3-Stateroom303-0475=3.jpg" class="img-responsive">
+
                </label>
+
                <div id="imglarge6" class="imglarge">
+
                    <div class="innerFloat">
+
                        <a class="leftArrow" onclick="document.lightbox.switch5.checked=true">&lt;</a>
+
                        <a class="rightArrow" onclick="document.lightbox.switch1.checked=true">&gt;&gt;</a>
+
                        <img alt="" src="http://static.uniworld.com/images/MiscImage/US-English/UW-MT-Cat3-Stateroom303-0475=3.jpg">
+
                        <div class="caption">Every riverview stateroom features a handcrafted Savoir of England bed, flatscreen TV with infotainment center, and spacious marble bathroom with luxurious amenities.</div>
+
                        <a class="offswitch" onclick="document.lightbox.switch6.checked=false; document.lightbox.check1.checked=false">X</a>
+
                        <div class="innerFloat">
+
                        </div>
+
                    </div>
+
                    <div class="clearfix"></div>
+
        </form>
+
              <div class="clearfix"></div>
+
        </div>
+
          <div class="clearfix"></div>
+
        </div>
+
       
+
    </div>
+
  <div class="spacer"> </div>
+
</div>
+
  
<!--<p><b>Tip:</b> Click any image to enlarge.</b></p>-->
 
    </div>
 
    <footer class="post-meta">
 
      <ul>
 
        <li>
 
          <i class="fa fa-clock-o" aria-hidden="true"></i>
 
          <time datetime="03-26-2017" itemprop="datePublished">03-26-2017</time>
 
        </li>
 
      </ul>
 
    </footer>
 
  </article>
 
 
</div>
 
</div>
 +
</center>
 +
</div>
 +
<!-- END SECTION 1 -->
  
</br>
+
<!-- SECTION 2 -->
<div class="page">
+
<div style="background-color:#f7f7f7; overflow: auto;" class="clear_fix">
  <article class="post" itemscope="itemscope" itemtype="http://schema.org/BlogPosting">
+
<center></br></br>
    <meta content="en" itemprop="inLanguage" />
+
<font face="Arial" size="5">&mdash; What should this page have? &mdash;</font></center>
        <h2 itemprop="headline"><a href="#"></br>Title 4</a></h2>
+
<div class="col-sm-1"></div>
    <div class="abstract" itemprop="description">
+
<div class="col-sm-10"><font size="4">
<p>The iGEM Raiders team attended a dinner to get to know one another.</p>
+
</br><ul>
    </div>
+
<li>Chronological notes of what your team is doing.</li>
    <footer class="post-meta">
+
<li> Brief descriptions of daily important events.</li>
      <ul>
+
<li>Pictures of your progress. </li>
        <li>
+
<li>Mention who participated in what task.</li>
          <i class="fa fa-clock-o" aria-hidden="true"></i>
+
</ul>
          <time datetime="03-28-2017" itemprop="datePublished">03-28-2017</time>
+
</font></br></br></div>
        </li>
+
<div class="col-sm-1"></div>
      </ul>
+
    </footer>
+
  </article>
+
 
</div>
 
</div>
<!-- end of blog posts -->
+
<!-- END SECTION 2 -->
  
 
</body>
 
</body>
 +
 +
<!-- FOOTER -->
 +
<div class="footer"><center><font face="Arial" size="3" color="black">&copy; 2017 Lubbock_TTU</font></center></div>
 +
<!-- END FOOTER -->
  
 
</html>
 
</html>

Latest revision as of 04:43, 1 November 2017




  Notebook



The iGEM Raiders team held a meeting to create a promotional flyer to be used for acquiring support and fundraising. Team members were assigned blurbs to write for the flyer covering topics including what iGEM is, what our project is, why iGEM should continue at Texas Tech, why it should be supported, and our prospective goals such as being published. Team member Kaitlyn was assigned the task of designing the flyer.

View our flyer here.
View our meeting minutes here.

The iGEM Raiders team met for the weekly meeting. Officer elections were held and the team discussed funding for team registration, bio-curriculum to be taught at ULabs, and delegated tasks to members.

Check out our members here!
View our meeting minutes here.

The iGEM Raiders team met for the weekly meeting. Strategy and talking points were discussed to prepare members for recruiting funding from potential donors. Additionally, fundraising, university sponsor, and outreach updates were discussed.

View our meeting minutes here.

The iGEM Raiders team attended a dinner to get to know one another.



Description 04/09/2017.

View our meeting notes here.

Description 04/23/2017.

View our meeting notes here.

Description 04/20/2017.

View our meeting minutes here.



Description 05/07/2017.

View our meeting minutes here.



Description 06/13/2017.

View our meeting minutes here.



Description 07/15/2017.

View our meeting notes here.

Description 07/22/2017.

View our meeting notes here.


August
September
October


— What should this page have? —

  • Chronological notes of what your team is doing.
  • Brief descriptions of daily important events.
  • Pictures of your progress.
  • Mention who participated in what task.