Difference between revisions of "Team:Carnegie Mellon/CSS"

 
(45 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
{{:Team:Carnegie_Mellon/navbar}}
 
<html>
 
<html>
<style type="text/css">
+
<head>
#cboxOverlay{background:#000;}
+
<style src = "" type = "text/css">
#colorbox{outline:0;}
+
    #cboxTopLeft{width:10px; height:10px; background:#555;}
+
    #cboxTopRight{width:10px; height:10px; background:#555;}
+
    #cboxBottomLeft{width:10px; height:10px; background:#555;}
+
    #cboxBottomRight{width:10px; height:10px; background:#555;}
+
    #cboxMiddleLeft{width:10px; background:#555;}
+
    #cboxMiddleRight{width:10px; background:#555;}
+
    #cboxTopCenter{height:10px; background:#555;}
+
    #cboxBottomCenter{height:10px; background:#555;}
+
    #cboxContent{background:#555; overflow:hidden;}
+
        .cboxIframe{background:#555;}
+
        #cboxError{padding:50px; border:1px solid #ccc;}
+
        #cboxLoadedContent{margin-bottom:28px;}
+
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
+
        #cboxCurrent{position: absolute;
+
bottom:0px;
+
left:58px;
+
color: #FFF;
+
font-size: 12px;}
+
        #cboxLoadingOverlay{background:url(../images/loading_background.png) no-repeat center center;}
+
        #cboxLoadingGraphic{background:url(../images/loading.gif) no-repeat center center;}
+
  
        /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
+
/* To do:
        #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
+
add rest of bios
       
+
center the quotes
        /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
+
work on the colors */
        #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
+
  
        #cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
+
/*Tried to make the content border-color:width the whole page... Not the stupid box*/
        #cboxPrevious{position: absolute;
+
body {
bottom: 0;
+
  border: 0px;
left: 0;
+
  background: white;
background: url(../images/left-a.png) no-repeat 0px -1px;
+
width: 16px;
+
height: 16px;
+
text-indent: -9999px;
+
outline:none;}
+
      /*--  #cboxPrevious:hover{background-position:-75px -25px;}--*/
+
        #cboxNext{position: absolute;
+
bottom: 0;
+
left: 27px;
+
background: url(../images/right-a.png) no-repeat 1px -1px;
+
width: 16px;
+
height: 16px;
+
text-indent: -9999px;
+
outline:none;}
+
      /*--  #cboxNext:hover{background-position:-50px -25px;}--*/
+
        #cboxClose{position: absolute;
+
bottom: 0;
+
right: 0;
+
background: url(../images/close.png) no-repeat;
+
width: 10px;
+
height: 10px;
+
text-indent: -9999px;
+
outline:none;}
+
/*--#cboxClose:hover{background-position:-25px -25px;}--*/
+
.cboxIE #cboxTopLeft,
+
.cboxIE #cboxTopCenter,
+
.cboxIE #cboxTopRight,
+
.cboxIE #cboxBottomLeft,
+
.cboxIE #cboxBottomCenter,
+
.cboxIE #cboxBottomRight,
+
.cboxIE #cboxMiddleLeft,
+
.cboxIE #cboxMiddleRight {
+
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);
+
}
+
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
+
#cboxOverlay{position:fixed; width:100%; height:100%;}
+
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
+
#cboxContent{position:relative;}
+
#cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
+
#cboxTitle{margin:0;}
+
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
+
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
+
.cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
+
.cboxIframe{width:100%; height:100%; display:block; border:0;}
+
#colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
+
/* Elastislide Style */
+
/*--.es-carousel-wrapper{
+
background: #101010;
+
padding:10px 27px;
+
-moz-border-radius: 10px;
+
-webkit-border-radius: 10px;
+
border-radius: 10px;
+
position:relative;
+
-moz-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
+
-webkit-box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
+
box-shadow:0px 1px 3px rgba(0, 0, 0, 0.9);
+
position:relative;
+
margin-bottom:20px;
+
}--*/
+
.es-carousel-wrapper{
+
position: relative;
+
padding: 0px 30px;
+
background: #000;
+
}
+
.es-carousel{
+
overflow: hidden;
+
background: #000;
+
+
}
+
.es-carousel ul{
+
display:none;
+
}
+
.es-carousel ul li{
+
height:100%;
+
float:left;
+
display:block;
+
padding-right: 33px;
+
}
+
.es-carousel ul li a{
+
display:block;
+
border-style:solid;
+
border-color:#222;
+
opacity:0.8;
+
width:100px;
+
-webkit-touch-callout:none;
+
/* option */
+
-webkit-transition: all 0.2s ease-in-out;
+
-moz-transition: all 0.2s ease-in-out;
+
-o-transition: all 0.2s ease-in-out;
+
-ms-transition: all 0.2s ease-in-out;
+
transition: all 0.2s ease-in-out;
+
}
+
.es-carousel ul li.selected a{
+
border-color:#fff;
+
opacity:1.0;
+
}
+
.es-carousel ul li a img{
+
display:block;
+
border:none;
+
max-height:100%;
+
max-width:100%;
+
}
+
.es-nav span{
+
position:absolute;
+
top:50%;
+
left:8px;
+
background:transparent url(../images/nav_thumbs.png) no-repeat top left;
+
width:14px;
+
height:26px;
+
margin-top:-13px;
+
text-indent:-9000px;
+
cursor:pointer;
+
opacity:0.8;
+
}
+
.es-nav span.es-nav-next{
+
right:8px;
+
left:auto;
+
background-position:top right;
+
}
+
.es-nav span:hover{
+
opacity:1.0;
+
 
}
 
}
  
.es-carousel ul{
 
display:block;
 
}
 
  
 +
#content{
 +
background: white;
 +
border: 0px;
 +
float: center;
 +
                                width: 85%;
 +
margin-left:auto;
 +
                                margin-right:auto;
 +
padding-top: 0px;
 +
}
  
 +
.boxy {
 +
    background-color:white;
 +
    opacity: 0.8;
 +
    width: 99%;
 +
    margin-top: 20px;
 +
    padding: 10px;
 +
    position: relative;
 +
}
  
  
  
  
.rg-image-wrapper{
+
.container {
position:relative;
+
  text-align: center;
padding:20px 30px 70px;
+
background:#424147;
+
+
min-height:20px;
+
 
}
 
}
.rg-image{
+
.pic {
position:relative;
+
    width: 25%;
text-align:center;
+
    border: 4px solid #818273;
+
    padding: 2px;
 +
    margin: 2px 7px 7px 7px;
 
}
 
}
/*--.rg-image img{
+
 
max-height:100%;
+
.name {
max-width:100%;
+
    font-size: 24px;
}--*/
+
    color: #818273;
#rg-gallery{
+
position:relative;
+
 
}
 
}
.rg-thumbs{
 
position: absolute;
 
bottom: -49px;
 
z-index: 9999;
 
width: 100%;
 
}
 
.rg-image-nav a{
 
position: absolute;
 
top:35%;
 
left: 0px;
 
background: #000 url(../images/img-sprite.png) no-repeat -18px -15px;
 
width: 46px;
 
height: 100px;
 
text-indent: -9000px;
 
cursor: pointer;
 
  
outline: none;
+
.picdom{ 
 +
background: url(https://static.igem.org/mediawiki/2015/1/12/Bio_Pic_Dom200.png) no-repeat;
 +
        width: 175px;
 +
border: 4px solid #3da989;  /* previous border color: #818273 */
 +
        margin: 0px 0px 0px 20px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}
  
 +
.text{
 +
width:165px;
 +
height:160px;
 +
background: white;
 +
opacity:0;
 +
}
 +
 +
.picdom:hover .text {
 +
opacity:0.6;
 +
text-align:center;
 +
color:#000000;
 +
font-size:20px;
 +
font-weight:700;
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 
}
 
}
.rg-image-nav a.rg-image-nav-next{
+
 
right:0px;
+
.picmichelle:hover .text {  
left:auto;
+
opacity:0.6;  
background-position:-55px -15px;
+
text-align:center;  
+
color:#000000;
 +
font-size:20px;
 +
font-weight:700;  
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 
}
 
}
.rg-image-nav a:hover{
+
.picmichelle{ 
+
background: url(https://static.igem.org/mediawiki/2015/1/1f/Bio_Pic_Michelle.JPG) no-repeat;
 +
        width: 175px;
 +
border: 4px solid #818273;
 +
        margin: 2px 7px 7px 7px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}
 +
 
 +
.picdonna { 
 +
background: url(https://static.igem.org/mediawiki/2015/c/c0/Bio_Pic_Donna200.jpg) no-repeat;
 +
        width: 175px;
 +
border: 4px solid #818273;
 +
        margin: 0px 0px 0px 20px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}
 +
 
 +
.picdonna:hover .text {  
 +
opacity:0.6;
 +
text-align:center;
 +
color:#000000;
 +
font-size:20px;
 +
font-weight:700;
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 
}
 
}
  
/*--.es-nav-prev span {
+
.picniteesh{
position: absolute;
+
background: url(https://static.igem.org/mediawiki/2015/1/10/Bio_Pic_Niteesh200.JPG) no-repeat;  
width: 46px;
+
        width: 175px;
height: 100px;
+
border: 4px solid #818273;
text-indent: -9999px;
+
        margin: 2px 7px 7px 7px;
background: url(../images/img-sprite.png) no-repeat 0 0;
+
        style: float-left;
top: 50%;
+
        display: inline-block;
margin-top: -40px;
+
}  
z-index: 2;
+
 
cursor: pointer;
+
 
}
+
.picniteesh:hover .text {  
.es-nav span.es-nav-prev {
+
opacity:0.6;  
background-position: -15px -15px;
+
text-align:center;  
left: 0px;
+
color:#000000;  
}
+
font-size:20px;  
.es-nav-next span {
+
font-weight:700;  
position: absolute;
+
font-family:"Times New Roman", Times, serif; padding:5px;  
width: 46px;
+
height: 100px;
+
text-indent: -9999px;
+
background: url(../images/img-sprite.png) no-repeat 0 0;
+
top: 50%;
+
margin-top: -40px;
+
z-index: 2;
+
cursor: pointer;
+
}
+
.es-nav span.es-nav-next {
+
background-position: -55px -15px;
+
right: 0px;
+
}--*/
+
.rg-caption {
+
text-align:center;
+
margin-top:15px;
+
position:relative;
+
}
+
.rg-caption p{
+
font-size:11px;
+
letter-spacing:2px;
+
font-family: 'Trebuchet MS', 'Myriad Pro', Arial, sans-serif;
+
line-height:16px;
+
padding:0 15px;
+
text-transform:uppercase;
+
}
+
.rg-view{
+
height:30px;
+
}
+
.rg-view a{
+
display:block;
+
float:right;
+
width:16px;
+
height:16px;
+
margin-right:3px;
+
+
border:3px solid #000;
+
opacity:0.8;
+
}
+
.rg-view a:hover{
+
opacity:1.0;
+
}
+
.rg-view a.rg-view-full{
+
background-position:0px 0px;
+
}
+
.rg-view a.rg-view-selected{
+
background-color:#FFEA00;
+
border-color:#000;
+
}
+
.rg-view a.rg-view-thumbs{
+
background-position:0px -16px;
+
}
+
.rg-loading{
+
width:46px;
+
height:46px;
+
position:absolute;
+
top:50%;
+
left:50%;
+
background:#000 url(../images/ajax-loader.gif) no-repeat center center;
+
margin:-23px 0px 0px -23px;
+
z-index:100;
+
-moz-border-radius: 10px;
+
-webkit-border-radius: 10px;
+
border-radius: 10px;
+
opacity:0.7;
+
 
}
 
}
  
/* Magnific Popup CSS */
+
.picwei{
.mfp-bg {
+
background: url(https://static.igem.org/mediawiki/2015/8/84/Bio_Pic_Wei200.jpg) no-repeat;  
  top: 0;
+
        width: 175px;
  left: 0;
+
border: 4px solid #818273;
  width: 100%;
+
        margin: 2px 7px 7px 7px;
  height: 100%;
+
        style: float-left;
  z-index: 1042;
+
        display: inline-block;
  overflow: hidden;
+
}  
  position: fixed;
+
  background: #0b0b0b;
+
  opacity: 0.9;
+
  filter: alpha(opacity=80); }
+
  
.mfp-wrap {
 
  top: 0;
 
  left: 0;
 
  width: 100%;
 
  height: 100%;
 
  z-index: 1043;
 
  position: fixed;
 
  outline: none !important;
 
  -webkit-backface-visibility: hidden; }
 
  
.mfp-container {
+
.picwei:hover .text {  
  text-align: center;
+
opacity:0.6;
  position: absolute;
+
text-align:center;  
  width: 100%;
+
color:#000000;  
  height: 100%;
+
font-size:20px;  
  left: 0;
+
font-weight:700;  
  top: 0;
+
font-family:"Times New Roman", Times, serif; padding:5px;  
  padding: 0 8px;
+
}
  -webkit-box-sizing: border-box;
+
  -moz-box-sizing: border-box;
+
  box-sizing: border-box; }
+
  
.mfp-container:before {
 
  content: '';
 
  display: inline-block;
 
  height: 100%;
 
  vertical-align: middle; }
 
  
.mfp-align-top .mfp-container:before {
+
.picwill { 
  display: none; }
+
background: url(https://static.igem.org/mediawiki/2015/7/7b/Bio_Pic_Will200.jpg) no-repeat;
 +
        width: 175px;
 +
border: 4px solid #818273;
 +
        margin: 0px 0px 0px 20px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}  
  
.mfp-content {
+
.picwill:hover .text {  
  position: relative;
+
opacity:0.6;  
  display: inline-block;
+
text-align:center;  
  vertical-align: middle;
+
color:#000000;  
  margin: 0 auto;
+
font-size:20px;  
  text-align: left;
+
font-weight:700;  
  z-index: 1045; }
+
font-family:"Times New Roman", Times, serif; padding:5px;
 +
}
  
.mfp-inline-holder .mfp-content,
+
.picjord { 
.mfp-ajax-holder .mfp-content {
+
background: url(https://static.igem.org/mediawiki/2015/a/a1/Bio_Pic_Jord200.jpg) no-repeat;
  width: 100%;
+
        width: 175px;
  cursor: auto; }
+
border: 4px solid #818273;
 +
        margin: 2px 7px 7px 7px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}  
  
.mfp-ajax-cur {
+
.picjord:hover .text {
  cursor: progress; }
+
opacity:0.6;
 +
text-align:center;
 +
color:#000000;
 +
font-size:20px;
 +
font-weight:700;  
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 +
}
  
.mfp-zoom-out-cur,
+
.picmax { 
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
+
background: url('https://static.igem.org/mediawiki/2015/7/78/Bio_Pic_Max200.jpg') no-repeat;
  cursor: -moz-zoom-out;
+
        width: 175px;
  cursor: -webkit-zoom-out;
+
border: 4px solid #818273;
  cursor: zoom-out; }
+
        margin: 0px 0px 0px 20px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}  
  
.mfp-zoom {
+
.picmax:hover .text {  
  cursor: pointer;
+
opacity:0.6;  
  cursor: -webkit-zoom-in;
+
text-align:center;  
  cursor: -moz-zoom-in;
+
color:#000000;
  cursor: zoom-in; }
+
font-size:20px;  
 +
font-weight:700;
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 +
}
  
.mfp-auto-cursor .mfp-content {
+
.picken { 
  cursor: auto; }
+
background: url(https://static.igem.org/mediawiki/2015/a/a1/Bio_Pic_Jord200.jpg) no-repeat;
 +
        width: 175px;
 +
border: 4px solid #818273;
 +
        margin: 2px 7px 7px 7px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}  
  
.mfp-close,
+
.picken:hover .text {
.mfp-arrow,
+
opacity:0.6;
.mfp-preloader,
+
text-align:center;
.mfp-counter {
+
color:#000000;
  -webkit-user-select: none;
+
font-size:20px;  
  -moz-user-select: none;
+
font-weight:700;  
  user-select: none; }
+
font-family:"Times New Roman", Times, serif; padding:5px;
 +
}
  
.mfp-loading.mfp-figure {
+
.picruchi { 
  display: none; }
+
background: url('https://static.igem.org/mediawiki/2015/d/d1/Bio_Pic_Ruchi.jpg') no-repeat;
 +
        width: 175px;
 +
border: 4px solid #818273;
 +
        margin: 0px 0px 0px 20px;
 +
        style: float-left;
 +
        display: inline-block;
 +
}  
  
.mfp-hide {
+
.picruchi:hover .text {  
  display: none !important; }
+
opacity:0.6;  
 +
text-align:center;
 +
color:#000000;
 +
font-size:20px;
 +
font-weight:700;
 +
font-family:"Times New Roman", Times, serif; padding:5px;
 +
}
 +
</head></style>
  
.mfp-preloader {
+
<body>
  color: #cccccc;
+
  position: absolute;
+
  top: 50%;
+
  width: auto;
+
  text-align: center;
+
  margin-top: -0.8em;
+
  left: 8px;
+
  right: 8px;
+
  z-index: 1044; }
+
  
.mfp-preloader a {
+
    <div class="jumbotron">
  color: #cccccc; }
+
      <div class="container">
 +
        <div class = "title">Meet the Team.</div>
 +
        <p>Biologists, engineers, enthusiastic people.</p>
 +
        <a href = "#">Students</a>
 +
        <a href = "#">Advisors</a>
 +
        <a href = "https://2015.igem.org/Team:Carnegie_Mellon/Attributions">Attributions</a>
 +
      </div>
 +
    </div>
  
.mfp-preloader a:hover {
+
<div class = "boxy">
  color: white; }
+
  
.mfp-s-ready .mfp-preloader {
+
<h1>Student Researchers</h1>
  display: none; }
+
    <p class = "name" style = "text-align: right; margin-right: 60px;"><b>Niteesh Sundaram</b></p>
 +
<div class="picniteesh">
 +
<div class="text"> "You miss 100% of the shots you don't take." -Wayne Gretzky </div> </div>
 +
<p style ="font-size: 15px; float:left; width: 75%; padding: 5px"> Niteesh grew up in Pittsburgh and is a rising master's student in Electrical and Computer Engineering. He graduated with a Bachelor's in Electrical and Computer Engineering from Carnegie Mellon in the spring of 2015. Niteesh's academic interests include computer hardware, embedded systems, programming, modeling of biological systems, biochemistry, pathology, and epidemiology. Outside the classroom Niteesh likes to watch Pittsburgh sports teams win, the occasional Netflix binge, pickup basketball, and going to the climbing wall and the gym. At Carnegie Mellon University, Niteesh is a teaching assistant in the Electrical and Computer Engineering department, a member of Model UN, and participates in a handful of clubs dedicated at exposing middle and high school aged children to math and science.
 +
</p>
 +
<br></br>
 +
<!-- -------------------------------Dominique's Bio -------------------------------- -->
 +
    <p class = "name"><b>Dominique Maccalla</b></p>
 +
<div class="picdom">
 +
<div class="text"> "I can do all things through Him who strengthens me." Philippians 4:13 </div>
 +
</div>
 +
<p style = "font-size: 15px; float:right; width: 75%; padding: 5px">Dominique is from New Haven, Connecticut and is a rising senior studying biomedical engineering and material science engineering. After graduation, she wants to work as a cosmetic chemist developing hair and skin products. Her interests include beauty, dance, and issues of social justice. In her free time, she loves to attend church, watch YouTube videos, and going for runs. She would spend the last $20 to her name getting her nails done, has been a competitive gymnast for most of her life, and is also deathly afraid of bees.
 +
    </p>
  
.mfp-s-error .mfp-content {
+
<br></br><br></br>
  display: none; }
+
<p class = "name" style = "text-align: right; margin-right: 60px;"><b>Michelle Yu</b></p>
 +
<div class="picmichelle">
 +
<div class="text"> "Be miserable. Or motivate yourself. Whatever has to be done, it's always your choice."  </div> </div>
  
button.mfp-close,
+
<p style ="font-size: 15px; float:left; width: 75%; padding: 5px">Michelle is a senior from New York majoring Biology with a double major in Psychology and a minor in Biomedical Engineering. She would like to eventually go to medical school and start her own clinic in a developing country. In her free time, she enjoys swimming, running, sleeping, writing, watching Netflix, and being a YouTube fanatic. Michelle likes to collects pennies from every place she’s traveled to. She had two differently shaped thumbs, and once when she was little, she was stung by a jellyfish in Maryland and a lifeguard peed on her leg to ease the pain.</p>
button.mfp-arrow {
+
  overflow: visible;
+
  cursor: pointer;
+
  background: transparent;
+
  border: 0;
+
  -webkit-appearance: none;
+
  display: block;
+
  padding: 0;
+
  z-index: 1046; }
+
  
button::-moz-focus-inner {
 
  padding: 0;
 
  border: 0; }
 
  
.mfp-close {
+
<br></br>
  width:30px;
+
  height:30px;
+
  line-height: 44px;
+
  position: absolute;
+
  right: 0;
+
  top: 0;
+
  text-decoration: none;
+
  text-align: center;
+
  opacity: 0.65;
+
  padding: 0 0 18px 10px;
+
  color: white;
+
  font-style: normal;
+
  font-size: 28px;
+
  font-family: Arial, Baskerville, monospace;
+
  outline:none;
+
}
+
  .mfp-close:hover, .mfp-close:focus {
+
    opacity: 1; }
+
  .mfp-close:active {
+
    top: 1px; }
+
  
.mfp-close-btn-in .mfp-close {
+
<p class = "name"><b>Donna Lee</b></p>
  color: #333333; }
+
<div class="picdonna">
 +
<div class="text"> "A man must be big enough to admit his mistakes, smart enough to profit from them, and strong enough to correct them"-- John C. Maxwell </div>
 +
</div>
 +
<p style = "font-size: 15px; float:right; width: 75%; padding: 5px">Donna is from Brooklyn, New York and studies biology with a double major in psychology. She hopes to go to med school and be a physician that interacts with people of all ages and from all backgrounds. Her interests include swimming, basketball, soccer, and volleyball. Sadly, she lacks the talent to actually play by any of these games’ rules. Some people compare Donna to a sloth. She hopes it’s because of their similar sleeping and lounging habits, and not because of any physical similarities. Donna also sleep walks, sleep talks, grinds her teeth, tosses and turns, and kicks people. She pasically exercises more when she’s asleep than when she’s awake. And of course, when someone likes sleeping, eating is probably that person's second most favorite thing. She loves cooking and trying new foods, despite all her random food allergies. Donna also likes listening to music and playing the piano. Despite being afraid of heights, she actually loves pra the thrills and sceneries that only accompany heights. She is proud to have been the first of her sisters to travel outside of the country.
 +
    </p>
  
.mfp-image-holder .mfp-close,
+
<br></br><br></br><br></br>
.mfp-iframe-holder .mfp-close {
+
<!-- -------------------------------Wei's Bio -------------------------------- -->
  color: white;
+
<p class = "name" style = "text-align: right; margin-right: 60px;"><b>Wei Mon Lu</b></p>
  right: -6px;
+
  text-align: right;
+
  padding-right: 6px;
+
  width: 100%;
+
  outline:none;
+
}
+
  
.mfp-counter {
+
<div class="picwei">
  position: absolute;
+
<div class="text"> "I go to seek a Great Perhaps." -- François Rabelais </div> </div>
  top: 0;
+
  right: 0;
+
  color: #cccccc;
+
  font-size: 12px;
+
  line-height: 18px; }
+
  
.mfp-arrow {
+
<p style ="font-size: 15px; float:left; width: 75%; padding: 5px">Wei is a Pittsburgh native studying Chemical Engineering with a double major in Biomedical Engineering. She aspires to either work in pharmaceuticals or consumable consumer goods (read: food). She is the vice president of the Society of Women Engineers, member of the Joint Funding Committee, a projectionist for AB Films, and is in her second year of being a Residential Advisor. She is a master cake decorator, hates running but still signs up for the Pittsburgh Marathon every year, and enjoys discussing and trying to remedy social inequality, race, poverty, and affordable access to quality education. She would rather spend her money on concert tickets than food, but still believes that she can definitively out-eat anyone in any kind of vegetarian-friendly eating competition. Wei is so uncoordinated that she almost fell down a waterfall once.</p>
  position: absolute;
+
  opacity: 0.65;
+
  margin: 0;
+
  top: 50%;
+
  margin-top: -55px;
+
  padding: 0;
+
  width: 90px;
+
  height: 110px;
+
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
+
  
.mfp-arrow:active {
 
  margin-top: -54px; }
 
  
.mfp-arrow:hover,
+
<br></br>
.mfp-arrow:focus {
+
  opacity: 1; }
+
  
.mfp-arrow:before, .mfp-arrow:after,
 
.mfp-arrow .mfp-b,
 
.mfp-arrow .mfp-a {
 
  content: '';
 
  display: block;
 
  width: 0;
 
  height: 0;
 
  position: absolute;
 
  left: 0;
 
  top: 0;
 
  margin-top: 35px;
 
  margin-left: 35px;
 
  border: medium inset transparent; }
 
.mfp-arrow:after,
 
.mfp-arrow .mfp-a {
 
  border-top-width: 13px;
 
  border-bottom-width: 13px;
 
  top: 8px; }
 
.mfp-arrow:before,
 
.mfp-arrow .mfp-b {
 
  border-top-width: 21px;
 
  border-bottom-width: 21px; }
 
  
.mfp-arrow-left {
+
<!-- -------------------------------Will's Bio -------------------------------- -->
  left: 0; }
+
<p class = "name"><b>William Casazza</b></p>
  .mfp-arrow-left:after,
+
  .mfp-arrow-left .mfp-a {
+
    border-right: 17px solid white;
+
    margin-left: 31px; }
+
  .mfp-arrow-left:before,
+
  .mfp-arrow-left .mfp-b {
+
    margin-left: 25px;
+
    border-right: 27px solid #3f3f3f; }
+
  
.mfp-arrow-right {
+
<div class="picwill">
  right: 0; }
+
<div class="text"> "Iron rusts from disuse; water loses its purity from stagnation... even so does inaction sap the vigor of the mind." - Leonardo da Vinci </div> </div>
  .mfp-arrow-right:after,
+
  .mfp-arrow-right .mfp-a {
+
    border-left: 17px solid white;
+
    margin-left: 39px; }
+
  .mfp-arrow-right:before,
+
  .mfp-arrow-right .mfp-b {
+
    border-left: 27px solid #3f3f3f; }
+
  
.mfp-iframe-holder {
+
<p style = "font-size: 15px; float: right; width: 75%; padding: 5px">Will is a rising junior from Barrington, Rhode Island, and is majoring in computational biology. His ultimate goal after graduation is to work in industry either developing diagnostic models/tools or working with synthetic biology and genetic engineering. Will’s interests include genetic engineering, parallel algorithms, epigenetic regulation, and probably some sort of math. In his free time, he likes to go long distance racing and long distance running, playing the upright bass, and listening to jazz. And, you know, just hanging out. He plays an impressive range of instruments including guitar, upright and electric bass, trombone, piano, ukulele, and melodica. He’s involved with the jazz scene at CMU and around Pittsburgh once playing in a large ensemble and occasionally gigs in small combos. He is secretly very interested in ethics and social issues. </p>
  padding-top: 40px;
+
  padding-bottom: 40px; }
+
  
.mfp-iframe-holder .mfp-content {
+
<br></br>
  line-height: 0;
+
<br></br>
  width: 100%;
+
<!-- -------------------------------Jordan's Bio -------------------------------- -->
  max-width: 900px; }
+
<p class = "name" style = "text-align: right; margin-right: 60px;"><b>Jordan Tick</b></p>
  
.mfp-iframe-scaler {
+
<div class="picjord">
  width: 100%;
+
<div class="text"> "Part of me suspects that I'm a loser, and the other part of me thinks I'm God Almighty" --John Lennon </div> </div>
  height: 0;
+
  overflow: hidden;
+
  padding-top: 56.25%; }
+
  
.mfp-iframe-scaler iframe {
+
<p style = "font-size: 15px; float: left; width: 75%; padding: 5px">Jordan is from Buffalo, New York and studies Computer Science and Electrical and Computer Engineering (and may pick up a minor, time permitting). After graduation, he wants to pursue a Masters in one of his majors before involving himself in augmented reality or signals processing. Academically, his interests are signal processing and graphics. Outside of the classroom, he enjoys listening to music, watching movies, playing video games, and is in Carnegie Mellon’s Archery, Parkour, and Taekwondo clubs. He’s studied French, Spanish, and Chinese and knows how to play the ukulele, piano, guitar, and trumpet. Previous research experience includes studying evolution by looking at the structural proteins of ribosomes. Jordan graduated a year early from high school and is the proud owner of three dogs.</p>
  position: absolute;
+
  display: block;
+
  top: 0;
+
  left: 0;
+
  width: 100%;
+
  height: 100%;
+
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+
  background: black; }
+
  
.mfp-iframe-holder .mfp-close {
+
<br></br><br></br>
  top: -40px; }
+
  
/* Main image in popup */
+
<!-- -------------------------------Max's Bio -------------------------------- -->
img.mfp-img {
+
<p class = "name"><b>Max Telmer</b></p>
  width: auto;
+
  max-width: 100%;
+
  height: auto;
+
  display: block;
+
  line-height: 0;
+
  -webkit-box-sizing: border-box;
+
  -moz-box-sizing: border-box;
+
  box-sizing: border-box;
+
  padding: 40px 0 40px;
+
  margin: 0 auto; }
+
  
/* The shadow behind the image */
+
<div class="picmax">
.mfp-figure:after {
+
<div class="text"> "Everybody falls down." </div> </div>
  content: '';
+
  position: absolute;
+
  left: 0;
+
  top: 40px;
+
  bottom: 40px;
+
  display: block;
+
  right: 0;
+
  width: auto;
+
  height: auto;
+
  z-index: -1;
+
  box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
+
  background: #444444; }
+
  
.mfp-figure {
+
<p style = "font-size: 15px; float: right; width: 75%; padding: 5px">Max grew up in Pittsburgh and now studies Material Science and Engineering. After graduation he wants to go into the world of manufacturing. His favourite sports team is FC Barcelona and he enjoys watching It’s Always Sunny in Philadelphia. In his free time, he enjoys sports, movies, and camping. His family is from Canada, he’s twenty years old, and he used to be a swimmer.</p>
  line-height: 0; }
+
  
.mfp-bottom-bar {
 
  margin-top: -36px;
 
  position: absolute;
 
  top: 100%;
 
  left: 0;
 
  width: 100%;
 
  cursor: auto; }
 
  
.mfp-title {
+
<!-- -------------------------------Ken's Bio -------------------------------- -->
  text-align: left;
+
<p class = "name" style = "text-align: right; margin-right: 60px;"><b>Kenneth Li</b></p>
  line-height: 18px;
+
  color: #f3f3f3;
+
  word-break: break-word;
+
  padding-right: 36px; }
+
  
.mfp-figure small {
+
<div class="picken">
  color: #bdbdbd;
+
<div class="text"> "Quote." --Quotee </div> </div>
  display: block;
+
  font-size: 12px;
+
  line-height: 14px; }
+
  
.mfp-image-holder .mfp-content {
+
<p style = "font-size: 15px; float: left; width: 75%; padding: 5px">Kenneth is from New Hyde Park, New York and is a rising senior studying Biology and Psychology. He is currently applying to dental schools and hopes to matriculate right after graduation. His academic interests include cell and molecular biology research, specifically within the topic of carcinogenesis, and he will be a teaching assistant for genetic and biochemistry lab courses. He is also a dedicated member of Global Public Health Brigades, which is an organization involved in building home infrastructure in under-developed countries to promote hygiene and healthy lifestyles. Ken enjoys playing tennis and swimming during his free time, and he loves watching Youtube videos and NBA games.</p>
  max-width: 100%; }
+
  
.mfp-gallery .mfp-image-holder .mfp-figure {
+
<br></br><br></br>
  cursor: pointer; }
+
/******** Plans List *******/
+
/* Styles for dialog window */
+
#small-dialog {
+
background: white;
+
padding: 20px 30px;
+
text-align: left;
+
max-width: 400px;
+
margin: 40px auto;
+
position: relative;
+
border-radius:2px;
+
-webkit-border-radius:2px;
+
-moz-border-radius:2px;
+
-o-border-radius:2px;
+
}
+
/**
+
  
/**
 
* Fade-zoom animation for first dialog
 
*/
 
  
/* start state */
+
<p class = "name"><b>Ruchi Asthana</b></p>
.my-mfp-zoom-in #small-dialog {
+
opacity: 0;
+
-webkit-transition: all 0.2s ease-in-out;
+
-moz-transition: all 0.2s ease-in-out;
+
-o-transition: all 0.2s ease-in-out;
+
transition: all 0.2s ease-in-out;
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
}
+
/* animate in */
+
.my-mfp-zoom-in.mfp-ready #small-dialog {
+
opacity: 1;
+
-webkit-transform: scale(1);
+
-moz-transform: scale(1);
+
-ms-transform: scale(1);
+
-o-transform: scale(1);
+
transform: scale(1);
+
}
+
/* animate out */
+
.my-mfp-zoom-in.mfp-removing #small-dialog{
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
opacity: 0;
+
}
+
/* Dark overlay, start state */
+
.my-mfp-zoom-in.mfp-bg {
+
opacity: 0;
+
-webkit-transition: opacity 0.3s ease-out;
+
-moz-transition: opacity 0.3s ease-out;
+
-o-transition: opacity 0.3s ease-out;
+
transition: opacity 0.3s ease-out;
+
}
+
/* animate in */
+
.my-mfp-zoom-in.mfp-ready.mfp-bg {
+
  opacity: 0.9;
+
}
+
/* animate out */
+
.my-mfp-zoom-in.mfp-removing.mfp-bg{
+
  opacity: 0;
+
}
+
.plans_table thead{
+
background: #ffea00;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
}
+
.plans_table thead th.plans-list{
+
padding:15px 0;
+
border: 1px solid #F0D82F;
+
}
+
.plans_table thead th.plans-list h3{
+
font-size: 1.4em;
+
color: #000;
+
display: block;
+
width: 100%;
+
margin: 0;
+
text-align: center;
+
}
+
.plans_table thead th.plans-list h4{
+
font-size: 1em;
+
color: #000;
+
display: block;
+
width: 100%;
+
margin: 0;
+
text-align: center;
+
}
+
.plans_table thead th.plans-list h4 small{
+
font-size:14px;
+
padding-left:2px;
+
}
+
.plans_table td.plan_list_title{
+
    font-size:0.85em;
+
text-align:left;
+
color:#222;
+
}
+
.plans_table tbody td{
+
padding:10px;
+
color:#8F8F8F;
+
font-size:0.8em;
+
border:1px solid #E6E6E6;
+
text-align:center;
+
}
+
.plans_table tfoot td.order_now button{
+
  display:block;
+
  font-size:0.85em;
+
  text-align:center;
+
  text-decoration:none;
+
  margin:0 auto;
+
  outline: 0;
+
-webkit-transition: all 0.5s ease-in-out;
+
-moz-transition: all 0.5s ease-in-out;
+
-o-transition: all 0.5s ease-in-out;
+
transition: all 0.5s ease-in-out;
+
  padding:8px 10px;
+
    -moz-border-radius:1px; -webkit-border-radius:1px; border-radius:1px;
+
    border:none;
+
    cursor:pointer;
+
    background:#000000;
+
color:#ffffff;
+
}
+
.plans_table tfoot td.order_now button:hover{
+
  background: #ffea00;
+
  color:#000;
+
}
+
.plans_table tfoot td{
+
text-align:center;
+
    padding:10px 0;
+
    border:1px solid #E6E6E6;
+
}
+
/**** End Plans List *********/
+
@media (max-width: 320px){
+
+
#small-dialog{
+
padding:20px 5px;
+
}
+
.mfp-close{
+
line-height:25px;
+
}
+
.plans_table{
+
margin-top:10px;
+
}
+
.plans_table thead th.plans-list h3{
+
font-size:1em;
+
}
+
.plans_table thead th.plans-list{
+
padding:10px 0;
+
}
+
.plans_table thead th.plans-list h4{
+
  font-size:1em;
+
}
+
.plans_table thead th.plans-list h4 small{
+
  font-size:10px;
+
}
+
.plans_table tfoot td.order_now button{
+
  font-size:0.7em;
+
  padding:8px;
+
}
+
}
+
/* start state1 */
+
.pop_up h2{
+
font-size: 1.5em;
+
color: #000;
+
margin-bottom: 4%;
+
text-transform: capitalize;
+
}
+
#small-dialog1{
+
background: white;
+
padding: 20px 30px;
+
text-align: left;
+
max-width: 400px;
+
margin: 40px auto;
+
position: relative;
+
border-radius:2px;
+
-webkit-border-radius:2px;
+
-moz-border-radius:2px;
+
-o-border-radius:2px;
+
}
+
.my-mfp-zoom-in #small-dialog1 {
+
opacity: 0;
+
-webkit-transition: all 0.2s ease-in-out;
+
-moz-transition: all 0.2s ease-in-out;
+
-o-transition: all 0.2s ease-in-out;
+
transition: all 0.2s ease-in-out;
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
}
+
/* animate in */
+
.my-mfp-zoom-in.mfp-ready #small-dialog1 {
+
opacity: 1;
+
-webkit-transform: scale(1);
+
-moz-transform: scale(1);
+
-ms-transform: scale(1);
+
-o-transform: scale(1);
+
transform: scale(1);
+
}
+
/* animate out */
+
.my-mfp-zoom-in.mfp-removing #small-dialog1{
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
opacity: 0;
+
}
+
/* start state2 */
+
.pop_up h2{
+
font-size: 1.5em;
+
color: #000;
+
margin-bottom: 4%;
+
text-transform: capitalize;
+
}
+
.pop_up p{
+
font-size: 13px;
+
color: #000;
+
line-height: 1.8em;
+
}
+
#small-dialog2{
+
background: white;
+
padding: 10px 15px;
+
text-align: left;
+
max-width: 400px;
+
margin: 40px auto;
+
position: relative;
+
border-radius:2px;
+
-webkit-border-radius:2px;
+
-moz-border-radius:2px;
+
-o-border-radius:2px;
+
}
+
.my-mfp-zoom-in #small-dialog2 {
+
opacity: 0;
+
-webkit-transition: all 0.2s ease-in-out;
+
-moz-transition: all 0.2s ease-in-out;
+
-o-transition: all 0.2s ease-in-out;
+
transition: all 0.2s ease-in-out;
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
}
+
/* animate in */
+
.my-mfp-zoom-in.mfp-ready #small-dialog2 {
+
opacity: 1;
+
-webkit-transform: scale(1);
+
-moz-transform: scale(1);
+
-ms-transform: scale(1);
+
-o-transform: scale(1);
+
transform: scale(1);
+
}
+
/* animate out */
+
.my-mfp-zoom-in.mfp-removing #small-dialog2{
+
-webkit-transform: scale(0.8);
+
-moz-transform: scale(0.8);
+
-ms-transform: scale(0.8);
+
-o-transform: scale(0.8);
+
transform: scale(0.8);
+
opacity: 0;
+
}
+
/*
+
Author: W3layout
+
Author URL: http://w3layouts.com
+
License: Creative Commons Attribution 3.0 Unported
+
License URL: http://creativecommons.org/licenses/by/3.0/
+
*/
+
/* reset */
+
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,dl,dt,dd,ol,nav ul,nav li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}
+
article, aside, details, figcaption, figure,footer, header, hgroup, menu, nav, section {display: block;}
+
ol,ul{list-style:none;margin:0;padding:0;}
+
blockquote,q{quotes:none;}
+
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
+
table{border-collapse:collapse;border-spacing:0;}
+
/* start editing from here */
+
a{text-decoration:none;}
+
.txt-rt{text-align:right;}/* text align right */
+
.txt-lt{text-align:left;}/* text align left */
+
.txt-center{text-align:center;}/* text align center */
+
.float-rt{float:right;}/* float right */
+
.float-lt{float:left;}/* float left */
+
.clear{clear:both;}/* clear float */
+
.pos-relative{position:relative;}/* Position Relative */
+
.pos-absolute{position:absolute;}/* Position Absolute */
+
.vertical-base{ vertical-align:baseline;}/* vertical align baseline */
+
.vertical-top{ vertical-align:top;}/* vertical align top */
+
.underline{ padding-bottom:5px; border-bottom: 1px solid #eee; margin:0 0 20px 0;}/* Add 5px bottom padding and a underline */
+
nav.vertical ul li{ display:block;}/* vertical menu */
+
nav.horizontal ul li{ display: inline-block;}/* horizontal menu */
+
img{max-width:100%;}
+
/*end reset*/
+
body{
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
background:#fff;
+
}
+
.wrap{
+
width:80%;
+
margin:0 auto;
+
-moz-transition:all .2s linear;
+
-webkit-transition:all .2s linear;
+
-o-transition:all .2s linear;
+
-ms-transition:all .2s linear;
+
}
+
.header{
+
background:#f6f6f6;
+
}
+
.logo {
+
float:left;
+
padding-top: 4px;
+
}
+
/*--menu--*/
+
.cssmenu{
+
float:right;
+
padding-top: 6px;
+
}
+
.cssmenu ul li {
+
display: inline-block;
+
}
+
.cssmenu ul li a {
+
color: #000;
+
display: block;
+
padding: 40px 15px;
+
letter-spacing: 1px;
+
font-size: 1.1em;
+
font-family: 'Karla', sans-serif;
+
text-transform: uppercase;
+
margin: 13px 10px;
+
}
+
.cssmenu li.active> a, .cssmenu li> a:hover {
+
color:#000;
+
background:#ffea00;
+
-webkit-transition: all 0.3s ease;
+
-moz-transition: all 0.3s ease;
+
-o-transition: all 0.3s ease;
+
transition: all 0.3s ease;
+
}
+
/**** Slider *****/
+
.index-banner{
+
background:url(../images/banner.jpg)no-repeat;
+
padding:10px 0;
+
}
+
.banner-wrap{
+
width: 80%;
+
margin: 0 auto;
+
}
+
.wmuSlider {
+
position: relative;
+
overflow: hidden;
+
padding-bottom: 50px;
+
}
+
.wmuSlider .wmuSliderWrapper article {
+
position: relative;
+
text-align: center;
+
}
+
.wmuSlider .wmuSliderWrapper article img {
+
max-width: 100%;
+
width: auto;
+
height: auto;
+
display:block;
+
margin:0 auto;
+
}
+
.wmuGallery .wmuGalleryImage {
+
position: relative;
+
text-align: center;
+
}
+
.wmuGallery .wmuGalleryImage img {
+
max-width: 100%;
+
width: auto;
+
height: auto;
+
}
+
/* Default Skin */
+
.wmuGallery .wmuGalleryImage {
+
margin-bottom: 10px;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
position: absolute;
+
width: 46px;
+
height: 100px;
+
text-indent: -9999px;
+
background:url(../images/img-sprite.png)no-repeat;
+
top:40%;
+
z-index: 2;
+
cursor: pointer;
+
}
+
.wmuSliderPrev {
+
background-position: -15px -20px;
+
left: 0px;
+
}
+
.wmuSliderNext {
+
background-position: -52px -10px;
+
right: 0px;
+
}
+
.btn {
+
margin: 30px 60px 0;
+
border: none;
+
font-family: inherit;
+
color:#fff;
+
background: none;
+
cursor: pointer;
+
padding:10px 30px;
+
display: inline-block;
+
border-bottom: 3px solid #ffea00;
+
letter-spacing: 1px;
+
outline: none;
+
float:right;
+
position: relative;
+
-webkit-transition: all 0.3s;
+
-moz-transition: all 0.3s;
+
transition: all 0.3s;
+
}
+
.btn1 {
+
margin:30px 0;
+
border: none;
+
font-family: inherit;
+
color:#fff;
+
background: none;
+
cursor: pointer;
+
padding:8px 20px;
+
display: inline-block;
+
border-bottom: 3px solid #ffea00;
+
letter-spacing: 1px;
+
outline: none;
+
position: relative;
+
-webkit-transition: all 0.3s;
+
-moz-transition: all 0.3s;
+
transition: all 0.3s;
+
}
+
.btn-8 {
+
display: block;
+
background: #000;
+
font-size:0.99em;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
-webkit-transform-style: preserve-3d;
+
-moz-transform-style: preserve-3d;
+
transform-style: preserve-3d;
+
}
+
.btn-8b:hover {
+
background:#222;
+
}
+
.btn-8 a{
+
color: #fff;
+
}
+
.slider-left{
+
float: left;
+
padding-top:6%;
+
width: 47.5%;
+
}
+
.slider-left h3{
+
font-size:4em;
+
color:#000;
+
background:#ffea00;
+
font-family: "Century Gothic";
+
text-transform:uppercase;
+
margin-bottom:10px;
+
width:70%;
+
font-weight:600;
+
float:none;
+
}
+
.slider-left h4{
+
font-size:4em;
+
color:#000;
+
background:#ffea00;
+
font-family: "Century Gothic";
+
text-transform:uppercase;
+
font-weight:600;
+
margin-bottom:10px;
+
width:100%;
+
}
+
.slider-right{
+
width:52.5%;
+
float:left;
+
}
+
p.top{
+
color:#fff;
+
font-size:1.7em;
+
line-height:1.5em;
+
font-family: "Century Gothic";
+
background:#414146;
+
text-align:left;
+
padding:0px 10px;
+
width:68%;
+
margin-bottom:1px;
+
}
+
p.middle{
+
color:#fff;
+
font-size:1.7em;
+
line-height:1.5em;
+
font-family: "Century Gothic";
+
background:#414146;
+
text-align:left;
+
padding:0px 10px;
+
width:64%;
+
margin-bottom:1px;
+
}
+
p.bottom{
+
color:#fff;
+
font-size:1.7em;
+
line-height:1.5em;
+
font-family: "Century Gothic";
+
background:#414146;
+
text-align:left;
+
padding:0px 10px;
+
width:56%;
+
}
+
.wmuSliderPagination {
+
z-index: 2;
+
position: absolute;
+
left:50%;
+
bottom: 10px;
+
}
+
.wmuSliderPagination li {
+
float: left;
+
margin: 0 2px 0 0;
+
list-style-type: none;
+
}
+
.wmuSliderPagination a {
+
display: block;
+
text-indent: -9999px;
+
width:24px;
+
height:24px;
+
background: url(../images/img-sprite.png)no-repeat -126px -15px;
+
}
+
.wmuSliderPagination a.wmuActive {
+
background: url(../images/img-sprite.png)no-repeat -156px -15px;
+
}
+
/*--content--*/
+
.main{
+
background:#f6f6f6;
+
}
+
.content-top{
+
padding:5% 0;
+
}
+
.content-top h3{
+
text-align:center;
+
font-size:2.5em;
+
color:#424147;
+
font-weight:600;
+
font-family: "Century Gothic";
+
text-transform: uppercase;
+
margin-bottom:15px;
+
}
+
.content-top h5{
+
text-align:center;
+
font-size:1.5em;
+
color: #424147;
+
font-weight:600;
+
font-family: "Century Gothic";
+
margin-bottom:60px;
+
}
+
.col_1_of_4{
+
display: block;
+
float:left;
+
margin:0% 0 0% 3.6%;
+
background: #ffea00;
+
cursor:pointer;
+
}
+
.span_1_of_4:hover {
+
background:#e1e6ec;
+
-webkit-transition: all 0.4s ease;
+
-moz-transition: all 0.4s ease;
+
-o-transition: all 0.4s ease;
+
transition: all 0.4s ease;
+
color: #FFF;
+
}
+
.col_1_of_4:first-child { margin-left: 0; }
+
.span_1_of_4 {
+
width: 22.3%;
+
}
+
.span_1_of_first {
+
width: 22.3%;
+
}
+
.span_1_of_first img{
+
display:block;
+
}
+
.span_1_of_4  p {
+
font-size:0.8125em;
+
color: #333;
+
line-height: 1.5em;
+
}
+
.desc{
+
background:#414146;
+
padding: 20px;
+
}
+
.desc h4{
+
color: #EEE;
+
font-size: 1.5em;
+
text-transform: uppercase;
+
}
+
.desc h4 span{
+
float:right;
+
font-size:12px;
+
text-transform:lowercase;
+
}
+
span.small{
+
color:#ffea00;
+
}
+
.grid1{
+
text-align:center;
+
padding: 26px 0px 10px 0px;
+
}
+
.grid1 img{
+
padding: 23px 0;
+
}
+
.grid1 h4{
+
color:#5C5401;
+
text-transform:uppercase;
+
font-size:1.5em;
+
}
+
.desc p{
+
color: #FFF;
+
font-size: 0.8999em;
+
line-height: 1.8em;
+
text-align: center;
+
}
+
/*--content-middle--*/
+
.content-middle{
+
padding-bottom:3%;
+
}
+
.content-middle h2{
+
font-size: 1.5em;
+
text-transform: uppercase;
+
text-align: center;
+
background:url(../images/bg-h2.png) repeat-x center;
+
margin-bottom:40px;
+
}
+
.content-middle h2 span{
+
background:#424147;
+
color:#ffea00;
+
padding:5px 40px;
+
}
+
.content-middle p{
+
text-align:center;
+
color:#424146;
+
font-size: 1.4em;
+
padding:1% 0;
+
}
+
#tiles {
+
  list-style-type: none;
+
  position: relative;
+
  margin: 0;
+
}
+
#tiles li {
+
  background-color: #ffffff;
+
}
+
#tiles li img {
+
  display: block;
+
  cursor: pointer;
+
}
+
#tiles ali:nth-child(3n) {
+
  height: 175px;
+
}
+
#tiles ali:nth-child(4n-3) {
+
  padding-bottom: 30px;
+
}
+
#tiles ali:nth-child(5n) {
+
  height: 250px;
+
}
+
/** General page styling **/
+
#main1 {
+
  padding: 30px 0 30px 0;
+
}
+
.content-bottom{
+
padding-bottom:5%;
+
}
+
.content-bottom h2{
+
font-size: 1.5em;
+
text-transform: uppercase;
+
text-align: center;
+
background:url(../images/bg-h2.png) repeat-x center;
+
margin-bottom:40px;
+
}
+
.content-bottom h2 span{
+
background:#424147;
+
color:#ffea00;
+
padding:5px 40px;
+
}
+
.content-bottom p{
+
text-align:center;
+
color:#424146;
+
font-size: 1.4em;
+
padding: 1% 0 3%;
+
}
+
/*--thumbs--*/
+
#jquery-script-menu {
+
position: fixed;
+
height: 90px;
+
width: 100%;
+
top: 0;
+
left: 0;
+
border-top: 5px solid #316594;
+
background: #fff;
+
-moz-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+
-webkit-box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+
box-shadow: 0 2px 3px 0px rgba(0, 0, 0, 0.16);
+
z-index: 999999;
+
padding: 10px 0;
+
}
+
.jquery-script-center {
+
width: 960px;
+
margin: 0 auto;
+
}
+
.jquery-script-center ul {
+
width: 212px;
+
float:left;
+
line-height:45px;
+
margin:0;
+
padding:0;
+
list-style:none;
+
}
+
.jquery-script-center a {
+
text-decoration:none;
+
}
+
.jquery-script-ads {
+
width: 728px;
+
height:90px;
+
float:right;
+
}
+
.jquery-script-clear {
+
clear:both;
+
height:0;
+
}
+
.clearout {
+
height: 20px;
+
clear: both;
+
}
+
#flexiselDemo1, #flexiselDemo2, #flexiselDemo3 {
+
display: none;
+
}
+
.nbs-flexisel-container {
+
position: relative;
+
max-width: 100%;
+
}
+
.nbs-flexisel-ul {
+
position: relative;
+
width: 9999px;
+
margin: 0px;
+
padding: 0px;
+
list-style-type: none;
+
text-align: center;
+
}
+
.nbs-flexisel-inner {
+
overflow: hidden;
+
width:80%;
+
margin: 0 auto;
+
}
+
.nbs-flexisel-item {
+
float: left;
+
margin: 0px;
+
padding: 0px;
+
cursor: pointer;
+
position: relative;
+
line-height: 0px;
+
}
+
.nbs-flexisel-item > img {
+
width:50%;
+
cursor: pointer;
+
positon: relative;
+
margin-top: 10px;
+
margin-bottom: 10px;
+
max-width: 100px;
+
max-height: 45px;
+
}
+
/*** Navigation ***/
+
.nbs-flexisel-nav-left, .nbs-flexisel-nav-right {
+
width: 46px;
+
height: 100px;
+
position: absolute;
+
cursor: pointer;
+
z-index: 100;
+
}
+
.nbs-flexisel-nav-left {
+
left: 0px;
+
background: url(../images/img-sprite.png) no-repeat -19px -21px;
+
}
+
.nbs-flexisel-nav-right {
+
right: 0px;
+
background: url(../images/img-sprite.png) no-repeat -55px -20px;
+
}
+
/*--footer--*/
+
/*  GRID OF THREE  ============================================================================= */
+
.col_1_of_3{
+
display: block;
+
float:left;
+
margin:0% 0 0% 4.6%;
+
}
+
.col_1_of_3:first-child { margin-left: 0; }
+
.span_1_of_3 {
+
width: 30.2%;
+
}
+
.span_1_of_3  h3{
+
color:#fff;
+
margin-bottom:30px;
+
font-size:1.5em;
+
line-height: 1.2;
+
font-weight : normal;
+
margin-top: 0px;
+
letter-spacing: -1px;
+
}
+
.span_1_of_3  h4{
+
color:#fff;
+
margin-bottom:20px;
+
font-size:1.5em;
+
line-height: 1.2;
+
font-weight : normal;
+
margin-top: 0px;
+
letter-spacing: -1px;
+
}
+
.span_1_of_3  p  {
+
font-size:0.8125em;
+
color: #fff;
+
line-height: 1.5em;
+
}
+
/***** Media Quries *****/
+
@media only screen and (max-width: 1024px) {
+
.wrap{
+
width:95%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
+
@media only screen and (max-width: 640px) and (min-width: 480px) {
+
.wrap{
+
width:95%;
+
}
+
.col_1_of_3{
+
margin: 1% 0 1% 0%;
+
}
+
.span_1_of_3 {
+
width:94%;
+
padding:3%; 
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
+
@media only screen and (max-width: 480px) {
+
   
+
    .wrap{
+
width:95%;
+
}
+
.col_1_of_3{
+
margin: 1% 0 1% 0%;
+
}
+
.span_1_of_3 {
+
width:92%;
+
padding:4%;
+
}
+
}
+
.footer-top{
+
background:#414146;
+
padding:2% 0;
+
}
+
.gallery li{
+
float: left;
+
width: 31.9%;
+
padding-right: 5px;
+
}
+
.gallery li img{
+
display:block;
+
}
+
.footer-list li{
+
padding-bottom: 20px;
+
}
+
.footer-list li img{
+
float:left;
+
margin-right:20px;
+
}
+
.footer-list li p{
+
width: 85.5%;
+
float: left;
+
padding: 0;
+
}
+
span.yellow a{
+
color: #FFEA00;
+
}
+
span.yellow a:hover{
+
color:#fff;
+
}
+
.social-icons ul li:first-child, ol li:first-child {
+
margin-top: 0px;
+
margin-left: 0;
+
}
+
.social-icons li {
+
background: none;
+
padding: 0px;
+
display: inline-block;
+
}
+
li.facebook a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -283px -14px;
+
}
+
li.facebook a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -283px -46px;
+
}
+
li.google a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -316px -14px;
+
}
+
li.google a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -316px -46px;
+
}
+
li.twitter a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -349px -14px;
+
}
+
li.twitter a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -349px -46px;
+
}
+
li.linkedin a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -382px -14px;
+
}
+
li.linkedin a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -382px -46px;
+
}
+
li.youtube a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -416px -14px;
+
}
+
li.youtube a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -416px -46px;
+
}
+
li.bloger a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -448px -14px;
+
}
+
li.bloger a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -448px -46px;
+
}
+
li.rss a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -482px -14px;
+
}
+
li.rss a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -482px -46px;
+
}
+
li.dribble a span {
+
height: 30px;
+
width: 30px;
+
display: block;
+
background: url(../images/img-sprite.png) no-repeat -515px -14px;
+
}
+
li.dribble a span:hover {
+
background: url(../images/img-sprite.png) no-repeat -515px -46px;
+
}
+
.social-icons h4{
+
color: #FFF;
+
margin-bottom:15px;
+
font-size: 1.4em;
+
line-height: 1.2;
+
font-weight: normal;
+
margin-top: 0px;
+
letter-spacing: -1px;
+
}
+
.follow{
+
padding-top:30px;
+
}
+
.follow h4{
+
color: #FFF;
+
margin-bottom: 15px;
+
font-size: 1.4em;
+
line-height: 1.2;
+
font-weight: normal;
+
margin-top: 0px;
+
letter-spacing: -1px;
+
}
+
.text{
+
border-bottom:1px solid #FFEA00;
+
color:#fff;
+
}
+
.text img{
+
float:right;
+
}
+
.footer-bottom{
+
background:#000;
+
padding:2% 0;
+
}
+
.copy {
+
float:left;
+
padding-top: 7px;
+
}
+
.copy p {
+
color: #fff;
+
font-size:0.89em;
+
}
+
p.copy a {
+
color:#FFEA00;
+
}
+
p.copy a:hover{
+
color:#fff;
+
}
+
.footer-nav{
+
float:right;
+
}
+
.footer-nav ul li {
+
display: inline-block;
+
}
+
.footer-nav ul li a {
+
color: #CCC;
+
display: block;
+
letter-spacing: 1px;
+
font-size: 0.89em;
+
text-transform: uppercase;
+
margin: 13px 10px;
+
}
+
.footer-nav ul li a:hover {
+
color:#fff;
+
}
+
.follow p {
+
font-size: 0.8125em;
+
color: #FFF;
+
line-height: 1.5em;
+
margin-bottom:20px;
+
}
+
.search {
+
border-bottom:2px solid #FFEA00;
+
color:#fff;
+
}
+
.search input[type="text"] {
+
outline: none;
+
padding: 2px 16px;
+
outline: none;
+
color: #FFF;
+
background: none;
+
border: none;
+
width: 90.5%;
+
line-height: 1.5em;
+
}
+
.search input[type="submit"] {
+
background:url('../images/email.png') no-repeat 0px 0px;
+
padding:4px 14px;
+
border: none;
+
cursor: pointer;
+
position: absolute;
+
line-height: 1.5em;
+
outline:none;
+
}
+
/*--portfolio--*/
+
.banner{
+
background:url(../images/banner.jpg)no-repeat;
+
padding:50px 0;
+
}
+
.banner h2{
+
color: #FFEA00;
+
background: #424146;
+
padding: 10px 60px 10px 20px;
+
font-size: 2em;
+
text-transform: uppercase;
+
font-weight: 600;
+
float: left;
+
}
+
/*---start-portfolio-----*/
+
.project-wrapper{
+
padding:50px 0 30px;
+
}
+
#info {
+
-webkit-border-radius:5px;
+
-moz-border-radius:5px;
+
border-radius:5px;
+
background:#fcf8e3;
+
border:1px solid  #fbeed5;
+
width:95%;
+
max-width:900px;
+
margin:0 auto 40px auto;
+
font-family:arial;
+
font-size:12px;
+
-webkit-box-sizing: border-box;
+
-moz-box-sizing: border-box;
+
-o-box-sizing: border-box;
+
}
+
#info .info-wrapper {
+
padding:10px;
+
-webkit-box-sizing: border-box;
+
-moz-box-sizing: border-box;
+
-o-box-sizing: border-box;
+
  
}
+
<div class="picruchi">
#info a {
+
<div class="text"> "Sometimes the questions are complicated, but the answers are simple." </div> </div>
color:#c09853;
+
text-decoration:none;
+
}
+
#info p {
+
margin:5px 0 0 0;
+
}
+
.container {
+
position: relative;
+
-webkit-transition: all 1s ease;
+
  -moz-transition: all 1s ease;
+
  -o-transition: all 1s ease;
+
  transition: all 1s ease;
+
}
+
#filters {
+
padding: 0% 10% 5% 10%;
+
list-style:none;
+
}
+
  #filters li {
+
float:left;
+
}
+
  #filters li span {
+
display: block;
+
padding: 10px 30px;
+
text-decoration: none;
+
color: #666;
+
cursor: pointer;
+
font-size: 1.5em;
+
}
+
#filters li span.active {
+
background:#ffea00;
+
color:#000;
+
}
+
#portfoliolist .portfolio {
+
-webkit-box-sizing: border-box;
+
-moz-box-sizing: border-box;
+
-o-box-sizing: border-box;
+
width: 31.3%;
+
margin:1%;
+
display:none;
+
float:left;
+
overflow:hidden;
+
}
+
  .portfolio-wrapper {
+
overflow:hidden;
+
position: relative !important;
+
background:#D5C301;
+
cursor:pointer;
+
}
+
  .portfolio img {
+
max-width:100%;
+
position: relative;
+
display:block;
+
transition: all 300ms!important;
+
-webkit-transition: all 300ms!important;
+
-moz-transition: all 300ms!important;
+
}
+
      .portfolio .text-category {
+
display:block;
+
font-size:9px;
+
font-size: 12px;
+
text-transform:uppercase;
+
color:#000;
+
}
+
/* #Tablet (Portrait) */
+
@media only screen and (min-width: 768px) and (max-width: 959px) {
+
.container {
+
}
+
}
+
/*  #Mobile (Portrait) - Note: Design for a width of 320px */
+
@media only screen and (max-width: 767px) {
+
.container {
+
width: 95%;
+
}
+
#ads {
+
display:none;
+
}
+
}
+
/* #Mobile (Landscape) - Note: Design for a width of 480px */
+
@media only screen and (min-width: 480px) and (max-width: 767px) {
+
.container {
+
width: 70%;
+
}
+
#ads {
+
display:none;
+
}
+
}
+
.wrapper{
+
padding: 0 1% 3% 1%;
+
}
+
.portfolio-top {
+
padding: 5% 0 0;
+
}
+
.portfolio-top h3 {
+
text-align: center;
+
font-size: 2.5em;
+
color: #424147;
+
font-weight: 600;
+
font-family: "Century Gothic";
+
text-transform: uppercase;
+
margin-bottom: 15px;
+
}
+
.portfolio-top h5 {
+
text-align: center;
+
font-size: 1.5em;
+
color: #424147;
+
font-weight: 600;
+
font-family: "Century Gothic";
+
margin-bottom: 60px;
+
}
+
.links{
+
padding:10px 20px;
+
}
+
.links h4{
+
padding-bottom: 10px;
+
float:left;
+
}
+
p.img{
+
float:right;
+
color:#fff;
+
font-size:0.99em;
+
display: -webkit-box;
+
padding-top: 3px;
+
}
+
.links h4 a{
+
color:#fff;
+
font-size:1.4em;
+
}
+
.links h4 a:hover{
+
color:#000;
+
}
+
.links ul li a {
+
font-size: 13px;
+
color: #FFF;
+
padding-left: 5px;
+
}
+
.links ul li a:hover {
+
text-decoration:underline;
+
}
+
.project-bottom{
+
padding:20px;
+
}
+
.project{
+
width:71.9%;
+
float: left;
+
margin-right:2.6%;
+
}
+
.proj-desc{
+
border-bottom: 1px solid #DBDBDB;
+
padding-bottom:30px;
+
margin-bottom:30px;
+
}
+
.proj-desc h4{
+
background:#424147;
+
color:#ffea00;
+
float:left;
+
font-size:1.4em;
+
padding:5px 10px;
+
margin-bottom:20px;
+
text-transform: uppercase;
+
}
+
.proj-desc p{
+
line-height: 1.8em;
+
font-size: 0.91em;
+
color:#424147;
+
}
+
.project-slider{
+
padding:0px 0 60px;
+
}
+
.related-desc h4 {
+
background: #424147;
+
color: #FFEA00;
+
float:left;
+
font-size: 1.4em;
+
padding: 5px 10px;
+
margin-bottom:30px;
+
}
+
.project-sidebar{
+
width: 25.5%;
+
float: left;
+
}
+
.project-list{
+
background:#424147;
+
padding: 30px;
+
margin-bottom:30px;
+
}
+
.project-list li, .project-list1 li{
+
margin-bottom:20px;
+
}
+
.project-list li img, .project-list1 li img {
+
float: left;
+
margin-right: 20px;
+
}
+
.project-list li p {
+
width: 84.5%;
+
float: left;
+
padding-top: 5px;
+
}
+
.project-list li p a{
+
color:#fff;
+
font-size:0.89em;
+
text-transform: uppercase;
+
}
+
.project-list li p a:hover{
+
color: #FFEA00;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4{
+
font-size:1.4em;
+
color:#ffea00;
+
margin-bottom: 30px;
+
text-transform: uppercase;
+
}
+
.project-list1 li p{
+
width: 64.5%;
+
float: left;
+
}
+
.project-list1 li p a{
+
padding: 0;
+
color: #FFF;
+
font-size: 0.8125em;
+
text-transform: uppercase;
+
}
+
.project-list1 li p a:hover{
+
color:#FFEA00;
+
}
+
.project-list1{
+
background:#424147;
+
padding: 30px;
+
margin-bottom:30px;
+
}
+
span.likes{
+
float:right;
+
font-size: 0.8125em;
+
color: #FFF;
+
padding-top: 18px;
+
}
+
span.likes img{
+
float: none;
+
margin-right: 0;
+
vertical-align: middle;
+
}
+
span.link a{
+
color:#fff;
+
margin-right: 10px;
+
}
+
span a:hover{
+
text-decoration:underline;
+
}
+
.project-list2 {
+
background: #424147;
+
padding: 30px;
+
}
+
.project-list2 li{
+
float: left;
+
background: #FFEA00;
+
padding:5px;
+
margin:2px;
+
}
+
.project-list2 li a{
+
color: #000;
+
text-transform: uppercase;
+
font-size: 0.89em;
+
}
+
.project-list2 li a:hover{
+
color:#7A732A;
+
}
+
/*--end portfolio--*/
+
/*--start blog--*/
+
.blog-left{
+
width:48.5%;
+
margin-right:2.6%;
+
float:left;
+
}
+
.blog-right{
+
width:48.5%;
+
float:left;
+
}
+
.blog-bg{
+
background:#ffea00;
+
margin-bottom: 20px;
+
}
+
.blog-img, .blog-img1{
+
margin-bottom:20px;
+
}
+
.blog-img img{
+
width: 100%;
+
display: block;
+
}
+
.blog-img1 img{
+
display:block;
+
width: 100%;
+
}
+
.blog-img2 img{
+
display:block;
+
width: 100%;
+
}
+
.blog-left h4{
+
color:#000;
+
font-style: italic;
+
font-size:1.4em;
+
padding:10px 30px 0;
+
}
+
span.author{
+
float:right;
+
font-size:0.95em;
+
padding: 0 10px 5px;
+
}
+
.blog-desc{
+
background:#ffea00;
+
padding:30px;
+
}
+
.blog-desc h5{
+
color:#000;
+
font-size:1.6em;
+
text-transform:uppercase;
+
}
+
.single-img img{
+
display:block;
+
}
+
.blog-desc p{
+
color:#777;
+
font-size:0.95em;
+
padding-top: 10px;
+
}
+
.comment{
+
padding-top:20px;
+
}
+
span.icon{
+
font-size: 0.95em;
+
float: left;
+
color:#555;
+
display: -webkit-box;
+
}
+
.comment-desc{
+
float: right;
+
color: #000;
+
font-size: 0.95em;
+
vertical-align:top;
+
}
+
.comment-desc a:hover{
+
text-decoration:underline;
+
}
+
.comment-desc a{
+
vertical-align:top;
+
color:#000;
+
}
+
.search_box{
+
background:#f6f6f6;
+
border-radius:20px;
+
-webkit-border-radius:20px;
+
-moz-border-radius:20px;
+
-o-border-radius:20px;
+
}
+
.search_box form input[type="text"] {
+
outline: none;
+
padding: 2px 16px;
+
outline: none;
+
color: #000;
+
background: none;
+
border: none;
+
width: 83.33%;
+
line-height: 1.5em;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
}
+
.search_box form input[type="submit"] {
+
background: url('../images/search.png') no-repeat -3px 0px;
+
padding: 4px 14px;
+
border: none;
+
cursor: pointer;
+
position: absolute;
+
line-height: 1.5em;
+
outline: none;
+
}
+
ul.blog-list{
+
width:50%;
+
float:left;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p{
+
width: 69.5%;
+
float: left;
+
text-transform: uppercase;
+
padding-top: 5px;
+
}
+
ul.blog-list li p a, .ul.blog-list1 li p a{
+
color: #FFF;
+
font-size: 0.89em;
+
}
+
ul.blog-list li p a:hover, .ul.blog-list1 li p a:hover{
+
color:#FFEA00;
+
}
+
ul.dc_pagination {
+
height: 100%;
+
list-style-type: none;
+
margin: 50px 0 30px;
+
overflow: hidden;
+
padding: 0px;
+
margin-left: 30px;
+
}
+
ul.dc_pagination li:first-child {
+
margin-left: 0px;
+
margin-right:25%;
+
text-transform: uppercase;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:25%;
+
margin-right:0px;
+
text-transform: uppercase;
+
}
+
ul.dc_pagination li {
+
float: left;
+
margin: 0px;
+
margin-left: 5px;
+
padding: 0px;
+
}
+
ul.dc_pagination li a {
+
color:#000;
+
display: block;
+
padding: 7px 10px 7px 10px;
+
text-decoration: none;
+
font-size: 1.5em;
+
}
+
ul.dc_paginationA06 li a:hover, ul.dc_paginationA06 li a.current {
+
background:#ffea00;
+
color:#000;
+
}
+
/*--single--*/
+
.single-wrapper{
+
padding:50px 0;
+
}
+
.single-blog{
+
width: 67.3%;
+
float: left;
+
padding:0 3.6%;
+
}
+
p.blog-text{
+
color: #000;
+
font-size: 0.95em;
+
line-height: 1.8em;
+
padding: 30px 0;
+
}
+
.share-point{
+
border-bottom: 1px solid #DBDBDB;
+
margin-bottom:30px;
+
padding-bottom:30px;
+
}
+
.point{
+
color: #FFEA00;
+
background: #424146;
+
float:left;
+
}
+
.point h5{
+
font-size: 1.4em;
+
padding: 5px 10px;
+
text-transform: uppercase;
+
}
+
.social-list{
+
float:right;
+
}
+
.social-list li{
+
display:inline-block;
+
margin-right: 20px;
+
}
+
.social-list li.last{
+
margin-right:0px;
+
}
+
.social-list li img{
+
float: left;
+
}
+
.social-list li p {
+
float: left;
+
padding: 4px 10px 4px 10px;
+
background:#ffea00;
+
color:#000;
+
}
+
.gallery li p{
+
background:#ffea00;
+
padding:20px;
+
line-height:1.5em;
+
color:#000;
+
font-size:1.4em;
+
}
+
.related-post{
+
border-bottom: 1px solid #DBDBDB;
+
margin-bottom: 30px;
+
padding-bottom: 30px;
+
}
+
.related-post h4 {
+
background: #424147;
+
color: #FFEA00;
+
text-transform: uppercase;
+
font-size: 1.4em;
+
padding: 5px 10px;
+
margin-bottom: 30px;
+
float: left;
+
}
+
.blog-comment h5{
+
background: #424147;
+
color: #FFEA00;
+
font-size: 1.4em;
+
padding:5px 20px;
+
float: left;
+
text-transform: uppercase;
+
}
+
ul.list{
+
border-bottom: 1px solid #DBDBDB;
+
margin-bottom: 30px;
+
padding:30px 0 0;
+
}
+
.list li{
+
padding-bottom:30px;
+
}
+
.preview{
+
float: left;
+
width: 5.5%;
+
margin-right: 10px;
+
}
+
.data{
+
float: left;
+
width: 93.5%;
+
}
+
.title {
+
color: #444;
+
font-size: 0.99em;
+
font-weight:600;
+
margin: 0 0 10px 0;
+
}
+
.title a{
+
color:#CFBE01;
+
}
+
.title a:hover{
+
color:#424147;
+
}
+
.data p{
+
color:#000;
+
font-size:0.89em;
+
line-height:1.5em;
+
}
+
li.middle{
+
padding:0 0px 0 70px;
+
margin-bottom: 30px;
+
}
+
.data-middle{
+
float: left;
+
width: 92.5%;
+
}
+
.data-middle p {
+
color: #000;
+
font-size: 0.89em;
+
line-height: 1.5em;
+
}
+
li.last-comment{
+
padding:0 0px 0 140px;
+
margin-bottom: 30px;
+
}
+
.data-last{
+
float: left;
+
width: 92.5%;
+
}
+
.data-last p {
+
color: #000;
+
font-size: 0.89em;
+
line-height: 1.5em;
+
}
+
.to input[type="text"] {
+
padding: 10px 10px;
+
width: 47.4%;
+
font-size: 1em;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
margin: 10px 0;
+
border: 1px solid #E1E2E2;
+
color: #000;
+
background: #FFF;
+
float: left;
+
outline: none;
+
font-size: 0.89em;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:97.6%;
+
margin: 10px 0;
+
border: 1px solid #E1E2E2;
+
color: #000;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
outline: none;
+
margin-bottom: 25px;
+
height: 100px;
+
padding: 10px 10px;
+
font-size: 0.89em;
+
}
+
.submit {
+
color: #FFF;
+
font-size: 1.1em;
+
font-weight: normal;
+
padding: 10px 20px;
+
border-bottom:2px solid #ffea00;
+
background: #000;
+
float:right;
+
display: inline-block;
+
-webkit-transition: all 0.3s ease-out;
+
-moz-transition: all 0.3s ease-out;
+
-ms-transition: all 0.3s ease-out;
+
-o-transition: all 0.3s ease-out;
+
transition: all 0.3s ease-out;
+
}
+
.submit:hover{
+
background:#333;
+
}
+
h5.leave{
+
background: #424147;
+
color: #FFEA00;
+
font-size: 1.4em;
+
padding: 5px 20px;
+
float:left;
+
margin-bottom: 20px;
+
text-transform: uppercase;
+
}
+
/*--about--*/
+
/*  GRID OF Content and sidebar  ============================================================================= */
+
.cont{
+
display: block;
+
float:left;
+
}
+
.lsidebar{
+
display: block;
+
float:left;
+
margin:0% 2.6% 0% 0;
+
}
+
.span_2_of_about {
+
width:65.1%;
+
}
+
.span_1_of_about {
+
width: 32.2%;
+
}
+
/***** Media Quries *****/
+
@media only screen and (max-width: 1024px) {
+
.wrap{
+
width:95%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
+
@media only screen and (max-width: 640px) {
+
.wrap{
+
width:95%;
+
}
+
.cont{
+
margin: 1% 0 1% 0%;
+
}
+
.lsidebar{
+
margin:0;
+
}
+
.span_2_of_about {
+
width:94%;
+
padding:3%; 
+
}
+
.span_1_of_about {
+
width:94%;
+
padding:3%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
+
@media only screen and (max-width: 480px) {
+
.wrap{
+
width:95%;
+
}
+
.cont{
+
margin: 1% 0 1% 0%;
+
}
+
.lsidebar{
+
margin:0;
+
}
+
.span_2_of_about {
+
width:92%;
+
padding:4%;
+
}
+
.span_1_of_about {
+
width:92%;
+
padding:4%;
+
}
+
}
+
.span_2_of_about h2{
+
text-transform:uppercase;
+
color:#5a595d;
+
font-size:2em;
+
margin-bottom: 20px;
+
}
+
.span_2_of_about h3{
+
font-weight:600;
+
color:#5a595d;
+
font-size:0.89em;
+
margin-bottom: 20px;
+
}
+
/*  GRID OF TWO  ============================================================================= */
+
.col_1_of_2{
+
display: block;
+
float:left;
+
margin:0% 0 0% 2.6%;
+
}
+
.col_1_of_2:first-child { margin-left: 0; }
+
.span_1_of_2 {
+
width:48.2%;
+
}
+
.span_1_of_2  p{
+
font-size:0.8125em;
+
color: #000;
+
line-height: 1.7em;
+
}
+
/***** Media Quries *****/
+
@media only screen and (max-width: 1024px) {
+
.wrap{
+
width:95%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
+
@media only screen and (max-width: 640px) and (min-width: 480px) {
+
.wrap{
+
width:95%;
+
}
+
.col_1_of_2{
+
margin: 1% 0 1% 0%;
+
}
+
.span_1_of_2 {
+
width:94%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
+
@media only screen and (max-width: 480px) {
+
.wrap{
+
width:95%;
+
}
+
.span_2_of_2 {
+
width: 100%;
+
}
+
.col_1_of_2{
+
margin: 2% 0 2% 0%;
+
}
+
.span_1_of_2 {
+
width:92%;
+
padding:4%;
+
}
+
}
+
.skills li {
+
width: 100%;
+
height: 38px;
+
background:#424147;
+
margin-bottom: 20px;
+
}
+
.percentage{
+
float: left;
+
background: #000;
+
height: 30px;
+
color: #FFEA00;
+
padding: 8px 10px 0 10px;
+
font-size: 1.2em;
+
}
+
.percent-text{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width: 74%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text1{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width: 70%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text2{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:60%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text3{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:65%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text4{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:68%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text5{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:65%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text6{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:50%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.percent-text7{
+
background: #FFEA00;
+
height: 33px;
+
float: left;
+
width:65%;
+
color: #424147;
+
font-size: 1.4em;
+
padding: 5px 20px 0;
+
}
+
.about-middle{
+
text-align:center;
+
padding-top:40px;
+
}
+
.about-middle h4{
+
font-size: 1.5em;
+
text-transform: uppercase;
+
text-align: center;
+
}
+
.about-middle h4 span {
+
background: #424147;
+
color: #FFEA00;
+
padding: 5px 40px;
+
}
+
.about-middle p{
+
color: #000;
+
font-size: 0.99em;
+
padding: 30px 0;
+
}
+
/*  GRID OF FOUR  ============================================================================= */
+
.col_1_of_about-grids{
+
display: block;
+
float:left;
+
margin: 0% 0 0% 9.6%;
+
}
+
.col_1_of_about-grids:first-child { margin-left: 0; } /* all browsers except IE6 and lower */
+
.span_1_of_about-grids {
+
width: 17.8%;
+
}
+
.span_1_of_about-grids img{
+
border-radius:200px;
+
-webkit-border-radius:200px;
+
-moz-border-radius:200px;
+
-o-border-radius:200px;
+
border:4px solid #ffea00;
+
}
+
.span_1_of_about-grids h3{
+
color: #FFEA00;
+
padding: 5px 20px;
+
text-align: center;
+
font-size: 1.4em;
+
line-height: 1.2;
+
cursor: pointer;
+
font-weight: normal;
+
margin-top: 5px;
+
background: #424147;
+
text-transform: uppercase;
+
}
+
.span_1_of_about-grids h3:hover{
+
background:#222;
+
}
+
/***** Media Quries *****/
+
@media only screen and (max-width: 1024px) {
+
.wrap{
+
width:95%;
+
}
+
}
+
/*  GO FULL WIDTH AT LESS THAN 640 PIXELS */
+
@media only screen and (max-width: 640px) and (min-width: 480px) {
+
.wrap{
+
width:95%;
+
}
+
.col_1_of_about-grids{
+
margin: 1% 0 1% 0%;
+
}
+
.span_1_of_about-grids {
+
width:94%;
+
padding:3%; 
+
}
+
}
+
  
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
+
<p style = "font-size: 15px; float: right; width: 75%; padding: 5px"> Ruchi is from Long Branch, New Jersey, and is currently a Biology major but is hoping to switch into Computational Biology this year. After graduation, she hopes to pursue a career in translational or research-based medicine. Her interest include probabilistic modeling for biological phenomena, reading ancient Latin works, and traveling to new places and trying new things. She likes to spend her free time with family and friends, taking long walks and listening to Ed Sheeran on repeat. Ruchi is an ice cream aficionado, loves The Color Purple, and keeps the pun game strong. </p>
@media only screen and (max-width: 480px) {
+
    <h1>Advisors</h1>
.wrap{
+
    <p class = "name"><b>Taylor Canady</b></p>
width:95%;
+
  <p style = "font-size:15px"> Taylor hails from the New Mexico/California area. He studied Biochemistry at the University of New Mexico and did research in Bioengineering. Right now, his work is figuring out how to make E. coli do all the work. He enjoys action movies, programming, soccer, biking up hills, running down hills, and snow things. He knows ASL, gets sea sick, only reads non-fiction, and believes that his time is money.
}
+
    </p>
.col_1_of_about-grids{
+
margin: 1% 0 1% 0%;
+
}
+
.span_1_of_about-grids {
+
width:92%;
+
padding:4%;
+
}
+
}
+
.team1{
+
margin-bottom:40px;
+
}
+
/*--contact--*/
+
.contact-to input[type="text"] {
+
padding: 10px 10px;
+
width:29.4%;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
margin: 10px 0;
+
border: 1px solid #E1E2E2;
+
color: #000;
+
background: #FFF;
+
float: left;
+
outline: none;
+
font-size: 0.89em;
+
}
+
.contact{
+
padding:50px 0 30px;
+
}
+
.contact-list li{
+
margin: 10px 0 20px;
+
}
+
.contact-list li img {
+
float: left;
+
margin-right: 20px;
+
}
+
.contact-list li p {
+
width: 85.5%;
+
float: left;
+
padding: 0;
+
font-size:0.89em;
+
}
+
span.yellow1 a {
+
color: #FFEA00;
+
background:#424147;
+
padding:5px 10px;
+
}
+
.span_2_of_contact {
+
width: 60.1%;
+
margin-right: 4.6%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:96.6%;
+
margin: 10px 0;
+
border: 1px solid #E1E2E2;
+
color: #000;
+
font-family: "Century Gothic",Arial, Helvetica, sans-serif;
+
outline: none;
+
margin-bottom: 25px;
+
height: 100px;
+
padding: 10px 10px;
+
font-size: 0.89em;
+
}
+
/*--404--*/
+
.page-not-found {
+
text-align: center;
+
padding:50px 0 70px;
+
}
+
.page-not-found h3{
+
font-size: 13em;
+
color:#424146;
+
}
+
.page-not-found h4{
+
font-size:3em;
+
margin-bottom: 40px;
+
}
+
.page-not-found h4 span {
+
background: #424147;
+
color: #FFEA00;
+
padding: 48px 0px 0;
+
}
+
.home{
+
color: #FFF;
+
font-size: 1.1em;
+
font-weight: normal;
+
padding: 10px 20px;
+
border-bottom: 2px solid #FFEA00;
+
background: #000;
+
display: inline-block;
+
-webkit-transition: all 0.3s ease-out;
+
-moz-transition: all 0.3s ease-out;
+
-ms-transition: all 0.3s ease-out;
+
-o-transition: all 0.3s ease-out;
+
transition: all 0.3s ease-out;
+
}
+
.home a:hover .blogpage a:hover{
+
background:#333;
+
}
+
.blogpage{
+
color: #FFF;
+
font-size: 1.1em;
+
font-weight: normal;
+
padding: 10px 20px;
+
border-bottom: 2px solid #FFEA00;
+
background: #000;
+
display: inline-block;
+
-webkit-transition: all 0.3s ease-out;
+
-moz-transition: all 0.3s ease-out;
+
-ms-transition: all 0.3s ease-out;
+
-o-transition: all 0.3s ease-out;
+
transition: all 0.3s ease-out;
+
}
+
.or{
+
display: inline-block;
+
background:#ffea00;
+
color:#000;
+
padding: 10px;
+
margin: 0 20px;
+
}
+
/*--responsive design--*/
+
@media (max-width:1366px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width: 84.5%;
+
}
+
.search input[type="text"] {
+
width: 89.5%;
+
}
+
.project-list li p {
+
width: 81.5%;
+
}
+
.project-list1 li p{
+
width: 56.5%;
+
}
+
.search_box form input[type="text"] {
+
width: 79.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right: 10px;
+
}
+
.to input[type="text"] {
+
width:46.9%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width: 97.2%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width: 28.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width: 93.9%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left: 21%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right: 20%;
+
}
+
.slider-left h4 {
+
font-size: 3.3em;
+
}
+
p.top {
+
width: 78%;
+
}
+
p.middle {
+
width: 75%;
+
}
+
p.bottom {
+
width: 60%;
+
}
+
}
+
@media (max-width:1280px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width: 83.5%;
+
}
+
.search input[type="text"] {
+
width: 88.5%;
+
}
+
.project-list li p {
+
width: 81.5%;
+
}
+
.project-list1 li p{
+
font-size: 10px;
+
width: 56.5%;
+
}
+
.search_box form input[type="text"] {
+
width: 78.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right:5px;
+
}
+
.to input[type="text"] {
+
width:46.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width: 97.1%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width: 28.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:94.6%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 66.5%;
+
}
+
.blog-desc h5 {
+
font-size: 1.4em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:18%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:18%;
+
}
+
.slider-left h4 {
+
font-size:3em;
+
}
+
p.top {
+
width:83%;
+
}
+
p.middle {
+
width:81%;
+
}
+
p.bottom {
+
width: 65%;
+
}
+
.slider-left h3 {
+
font-size:3em;
+
}
+
}
+
@media (max-width:1024px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:82.5%;
+
}
+
.search input[type="text"] {
+
width:86.5%;
+
}
+
.project-list li p {
+
width:80.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:48.5%;
+
}
+
.search_box form input[type="text"] {
+
width: 73.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right: 10px;
+
}
+
.to input[type="text"] {
+
width:45.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width: 96.1%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width:27.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:93.6%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 66.5%;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:11%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:12%;
+
}
+
p.top {
+
font-size:1em;
+
width: 70%;
+
}
+
p.middle {
+
font-size:1em;
+
width: 66%;
+
}
+
p.bottom {
+
font-size:1em;
+
width: 54%;
+
}
+
.grid1 img {
+
padding:0px 0;
+
}
+
.grid1 h4 {
+
font-size: 1.3em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.89em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size: 2.2em;
+
}
+
.content-top h5 {
+
font-size: 1.4em;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 25px;
+
font-size: 1.4em;
+
}
+
.links h4 a {
+
font-size: 1em;
+
}
+
p.img {
+
padding-top:0px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 8px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size: 1.4em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size: 1em;
+
}
+
.contact-list li p {
+
width: 82.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.slider-left h4 {
+
font-size:2.4em;
+
}
+
.slider-left h3 {
+
font-size:2.8em;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
top: 37%;
+
}
+
.wmuSliderPagination {
+
left: 45%;
+
}
+
}
+
@media (max-width:800px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:78.5%;
+
}
+
.search input[type="text"] {
+
width:82.5%;
+
}
+
.project-list li p {
+
width:73.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:30.5%;
+
}
+
.search_box form input[type="text"] {
+
width:63.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right: 10px;
+
}
+
.to input[type="text"] {
+
width:44.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:95.1%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width: 26.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:93.6%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 78.5%;
+
font-size: 12px;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:7%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:7%;
+
}
+
p.top {
+
font-size: 0.8125em;
+
width:77%;
+
}
+
p.middle {
+
font-size: 0.8125em;
+
width: 70%;
+
}
+
p.bottom {
+
font-size: 0.8125em;
+
width:56%;
+
}
+
.grid1 img {
+
padding:0px 0;
+
width: 62%;
+
}
+
.grid1 h4 {
+
font-size: 1em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.8125em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size: 2.2em;
+
}
+
.content-top h5 {
+
font-size: 1.4em;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 25px;
+
font-size:1em;
+
}
+
.links h4 a {
+
font-size: 13px;
+
}
+
p.img {
+
padding-top: 2px;
+
font-size: 13px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 8px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size:1em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size:0.8125em;
+
padding: 5px 15px;
+
}
+
.contact-list li p {
+
width: 82.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
.cssmenu ul li a {
+
padding: 30px 15px;
+
margin: 10px 0px;
+
font-size: 1em;
+
}
+
.cssmenu {
+
padding-top: 20px;
+
}
+
.btn {
+
padding: 8px 25px;
+
}
+
.desc {
+
padding:10px;
+
}
+
.desc h4 {
+
font-size: 1.4em;
+
}
+
.span_1_of_3 h3 {
+
margin-bottom: 15px;
+
}
+
.portfolio-top h3 {
+
font-size: 2em;
+
}
+
.portfolio-top h5 {
+
font-size: 1.2em;
+
margin-bottom:40px;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.links {
+
padding: 10px;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4 {
+
font-size: 1em;
+
margin-bottom: 20px;
+
}
+
.point h5 {
+
font-size: 1em;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.percent-text {
+
width: 67%;
+
}
+
.percent-text1 {
+
width: 63%;
+
}
+
.slider-left h4 {
+
font-size:1.9em;
+
}
+
.slider-left h3 {
+
font-size:2.2em;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
top: 32%;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 91.5%;
+
}
+
}
+
@media (max-width:768px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:77.5%;
+
}
+
.search input[type="text"] {
+
width:81.5%;
+
}
+
.project-list li p {
+
width:72.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:26.5%;
+
}
+
.search_box form input[type="text"] {
+
width:63.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right: 10px;
+
}
+
.to input[type="text"] {
+
width:43.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:93.1%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width: 25.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:91.6%;
+
}
+
.step {
+
width: 620px;
+
height:150px;
+
}
+
.jms-content {
+
margin: 0px;
+
}
+
.step img {
+
width:60%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
.jms-dots {
+
bottom:15px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 78.5%;
+
font-size: 12px;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:6%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:6%;
+
}
+
.step h2 {
+
width: 52%;
+
font-size: 1.5em;
+
}
+
.step h3 {
+
font-size: 1.5em;
+
}
+
p.top {
+
font-size: 0.8125em;
+
width:77%;
+
}
+
p.middle {
+
font-size: 0.8125em;
+
width: 70%;
+
}
+
p.bottom {
+
font-size: 0.8125em;
+
width:56%;
+
}
+
.jms-wrapper {
+
height:445px;
+
}
+
.grid1 img {
+
padding:0px 0;
+
width: 62%;
+
}
+
.grid1 h4 {
+
font-size:0.89em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.8125em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size:1.8em;
+
}
+
.content-top h5 {
+
font-size:1em;
+
margin-bottom: 35px;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 10px;
+
font-size:1em;
+
}
+
.links h4 a {
+
font-size:12px;
+
}
+
p.img {
+
padding-top: 2px;
+
font-size: 13px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 8px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size:1em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size:0.8125em;
+
padding: 5px 15px;
+
}
+
.contact-list li p {
+
width: 82.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
.cssmenu ul li a {
+
padding: 30px 15px;
+
margin: 10px 0px;
+
font-size: 1em;
+
}
+
.cssmenu {
+
padding-top: 20px;
+
}
+
.btn {
+
padding: 8px 25px;
+
}
+
.jms-arrows span {
+
top: 45%;
+
}
+
.desc {
+
padding:10px;
+
}
+
.desc h4 {
+
font-size:1em;
+
}
+
.span_1_of_3 h3 {
+
margin-bottom: 15px;
+
}
+
.portfolio-top h3 {
+
font-size:1.8em;
+
}
+
.portfolio-top h5 {
+
font-size:1em;
+
margin-bottom:30px;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.links {
+
padding: 10px;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4 {
+
font-size: 1em;
+
margin-bottom: 20px;
+
}
+
.point h5 {
+
font-size: 1em;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.percent-text {
+
width: 67%;
+
}
+
.percent-text1 {
+
width: 63%;
+
}
+
.content-bottom p {
+
font-size: 1em;
+
}
+
.content-middle p {
+
font-size: 1em;
+
}
+
.project-list2 li {
+
padding:4px;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 91.5%;
+
}
+
.slider-left h4 {
+
font-size:1.7em;
+
}
+
.slider-left h3 {
+
font-size:2em;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
top: 32%;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 91.5%;
+
}
+
.wmuSliderPagination {
+
left:40%;
+
}
+
}
+
@media (max-width:640px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:77.5%;
+
}
+
.search input[type="text"] {
+
width:92.5%;
+
}
+
.project-list li p {
+
width:72.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:48.5%;
+
}
+
.search_box form input[type="text"] {
+
width:89.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right:10px;
+
}
+
.to input[type="text"] {
+
width:43.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:93.1%;
+
}
+
.data {
+
width: 92.5%;
+
}
+
.contact-to input[type="text"] {
+
width:27.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width: 93.6%;
+
}
+
.step {
+
width:490px;
+
height:100px;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 78.5%;
+
font-size: 12px;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:7%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:7%;
+
}
+
p.top {
+
font-size: 12px;
+
width: 81%;
+
}
+
p.middle {
+
font-size: 12px;
+
width: 77%;
+
}
+
p.bottom {
+
font-size: 12px;
+
width:63%;
+
}
+
.grid1 img {
+
padding:0px 0;
+
width:20%;
+
}
+
.grid1 h4 {
+
font-size:0.89em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.8125em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size:1.8em;
+
}
+
.content-top h5 {
+
font-size:1em;
+
margin-bottom: 35px;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 10px;
+
font-size:0.8125em;
+
}
+
.links h4 a {
+
font-size:12px;
+
}
+
p.img {
+
padding-top: 2px;
+
font-size: 13px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 50px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size:1em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size:0.8125em;
+
padding: 5px 15px;
+
}
+
.contact-list li p {
+
width: 82.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
.cssmenu ul li a {
+
padding: 20px 10px;
+
font-size: 0.8125em;
+
}
+
.cssmenu {
+
padding-top: 13px;
+
}
+
.btn {
+
padding: 8px 20px;
+
font-size: 12px;
+
}
+
.desc {
+
padding:10px;
+
}
+
.desc h4 {
+
font-size:1em;
+
}
+
.span_1_of_3 h3 {
+
margin-bottom: 15px;
+
}
+
.portfolio-top h3 {
+
font-size:1.8em;
+
}
+
.portfolio-top h5 {
+
font-size:1em;
+
margin-bottom:30px;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.links {
+
padding: 10px;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4 {
+
font-size: 1em;
+
margin-bottom: 20px;
+
}
+
.point h5 {
+
font-size: 1em;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.percent-text {
+
width: 67%;
+
}
+
.percent-text1 {
+
width: 63%;
+
}
+
.content-bottom p {
+
font-size: 1em;
+
}
+
.content-middle p {
+
font-size: 1em;
+
}
+
.project-list2 li {
+
padding:4px;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 91.5%;
+
}
+
.logo {
+
width: 17%;
+
}
+
.span_1_of_first {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.col_1_of_4 {
+
float:none;
+
margin: 0% 0 0% 0%;
+
}
+
.span_1_of_4 {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.footer-nav {
+
float:none;
+
}
+
.copy {
+
float: none;
+
padding-top: 7px;
+
}
+
.footer-bottom {
+
text-align:center;
+
}
+
.follow {
+
padding-top: 10px;
+
}
+
.follow p {
+
margin-bottom:0;
+
}
+
.banner h2 {
+
padding: 5px 40px 5px 10px;
+
font-size: 1.7em;
+
}
+
#filters {
+
padding: 0% 5% 5% 5%;
+
}
+
#portfoliolist .portfolio {
+
width: 100%;
+
}
+
.project {
+
width: 100%;
+
float: none;
+
margin-right: 0;
+
}
+
.project-sidebar {
+
width: 100%;
+
float: none;
+
}
+
.single-blog {
+
width:93%;
+
float: none;
+
padding: 0 20px;
+
}
+
.submit {
+
margin-bottom: 25px;
+
}
+
.span_2_of_about h2 {
+
font-size: 1.5em;
+
}
+
.span_2_of_contact {
+
width:100%;
+
margin-right:0%;
+
}
+
.contact{
+
padding:0;
+
}
+
.page-not-found h4 span {
+
padding: 13px 0px 0;
+
}
+
.slider-left h4 {
+
font-size:1.4em;
+
}
+
.slider-left h3 {
+
font-size:1.6em;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
top: 32%;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 91.5%;
+
}
+
}
+
@media (max-width:480px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:77.5%;
+
}
+
.search input[type="text"] {
+
width:90.5%;
+
}
+
.project-list li p {
+
width:72.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:48.5%;
+
}
+
.search_box form input[type="text"] {
+
width:86.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right:10px;
+
}
+
.to input[type="text"] {
+
width:42.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:92.7%;
+
}
+
.data {
+
width:91.5%;
+
}
+
.contact-to input[type="text"] {
+
width:26.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:94.6%;
+
}
+
.btn {
+
margin-top: 20px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 78.5%;
+
font-size: 12px;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:3%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:3%;
+
}
+
p.top {
+
font-size: 10px;
+
width:89%;
+
}
+
p.middle {
+
font-size:10px;
+
width:86%;
+
}
+
p.bottom {
+
font-size: 10px;
+
width:74%;
+
}
+
.grid1 img {
+
padding:0px 0;
+
width:20%;
+
}
+
.grid1 h4 {
+
font-size:0.89em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.8125em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size:1.5em;
+
}
+
.content-top h5 {
+
font-size:0.8125em;
+
margin-bottom: 35px;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 4px;
+
font-size:0.8125em;
+
}
+
.links h4 a {
+
font-size:12px;
+
}
+
p.img {
+
padding-top: 2px;
+
font-size: 13px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 50px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size:0.8125em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size:0.8125em;
+
padding: 5px 15px;
+
}
+
.contact-list li p {
+
width: 82.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
.cssmenu ul li a {
+
padding: 20px 10px;
+
font-size: 0.8125em;
+
}
+
.cssmenu {
+
padding-top:0px;
+
}
+
.btn {
+
padding: 5px 10px;
+
font-size: 0.8125em;
+
}
+
.desc {
+
padding:10px;
+
}
+
.desc h4 {
+
font-size:1em;
+
}
+
.span_1_of_3 h3 {
+
margin-bottom: 15px;
+
}
+
.portfolio-top h3 {
+
font-size:1.5em;
+
}
+
.portfolio-top h5 {
+
font-size:0.8125em;
+
margin-bottom:30px;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.links {
+
padding: 10px;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4 {
+
font-size: 1em;
+
margin-bottom: 20px;
+
}
+
.point h5 {
+
font-size:0.8125em;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.percent-text {
+
width: 67%;
+
}
+
.percent-text1 {
+
width: 63%;
+
}
+
.content-bottom p {
+
font-size: 1em;
+
}
+
.content-middle p {
+
font-size: 1em;
+
}
+
.project-list2 li {
+
padding:4px;
+
}
+
.data-middle {
+
width: 91.5%;
+
}
+
.data-last {
+
width: 90.5%;
+
}
+
.logo {
+
width: 17%;
+
margin: 0 auto;
+
float: none;
+
}
+
.span_1_of_first {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.col_1_of_4 {
+
float:none;
+
margin: 0% 0 0% 0%;
+
}
+
.span_1_of_4 {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.footer-nav {
+
float:none;
+
}
+
.copy {
+
float: none;
+
padding-top: 7px;
+
}
+
.footer-bottom {
+
text-align:center;
+
}
+
.follow {
+
padding-top: 10px;
+
}
+
.follow p {
+
margin-bottom:0;
+
}
+
.banner h2 {
+
padding: 5px 40px 5px 10px;
+
font-size: 1.7em;
+
}
+
#filters {
+
padding: 0% 5% 5% 5%;
+
}
+
#portfoliolist .portfolio {
+
width: 100%;
+
}
+
.project {
+
width: 100%;
+
float: none;
+
margin-right: 0;
+
}
+
.project-sidebar {
+
width: 100%;
+
float: none;
+
}
+
.single-blog {
+
width:91%;
+
float: none;
+
padding: 0 20px;
+
}
+
.submit {
+
margin-bottom:10px;
+
font-size: 0.8125em;
+
padding: 8px 15px;
+
}
+
.span_2_of_about h2 {
+
font-size: 1.5em;
+
}
+
.span_2_of_contact {
+
width:100%;
+
margin-right:0%;
+
}
+
.contact{
+
padding:0;
+
}
+
.page-not-found h4 span {
+
padding: 13px 0px 0;
+
}
+
.footer-nav ul li a {
+
font-size: 0.8125em;
+
}
+
.social-list li {
+
margin-right:10px;
+
}
+
.social-list li p {
+
padding: 8px 10px 5px 10px;
+
font-size: 0.8125em;
+
}
+
.slider-left {
+
float: none;
+
padding-top: 0;
+
width: 100%;
+
}
+
.slider-right {
+
width: 100%;
+
float: none;
+
}
+
.banner-wrap{
+
width:70%;
+
}
+
.wmuSliderPagination {
+
left:35%;
+
}
+
.wmuSliderPrev, .wmuSliderNext {
+
top: 37%;
+
}
+
}
+
@media (max-width:320px){
+
.wrap{
+
width:90%;
+
}
+
.footer-list li p {
+
width:77.5%;
+
}
+
.search input[type="text"] {
+
width:80.5%;
+
}
+
.project-list li p {
+
width:72.5%;
+
padding:0;
+
}
+
.project-list1 li p {
+
width:48.5%;
+
}
+
.search_box form input[type="text"] {
+
width:78.33%;
+
}
+
.project-list li img, .project-list1 li img {
+
margin-right:10px;
+
}
+
.to input[type="text"] {
+
width:39.7%;
+
}
+
.text1 input[type="text"], .text1 textarea {
+
width:90.7%;
+
}
+
.data {
+
width:90.5%;
+
}
+
.contact-to input[type="text"] {
+
width:22.4%;
+
}
+
.text2 input[type="text"], .text2 textarea {
+
width:90.6%;
+
}
+
.btn {
+
margin-top:10px;
+
}
+
ul.blog-list li p, .ul.blog-list1 li p {
+
width: 78.5%;
+
font-size: 12px;
+
}
+
.blog-desc h5 {
+
font-size: 1em;
+
}
+
ul.dc_pagination li:last-child {
+
margin-left:3%;
+
}
+
ul.dc_pagination li:first-child {
+
margin-right:3%;
+
}
+
p.top {
+
font-size:12px;
+
width:100%;
+
}
+
p.middle {
+
display: none;
+
}
+
p.bottom {
+
display:none;
+
}
+
.grid1 img {
+
padding:0px 0;
+
width:20%;
+
}
+
.grid1 h4 {
+
font-size:0.89em;
+
}
+
.grid1 {
+
padding: 13px 0px 10px 0px;
+
}
+
.desc p {
+
font-size: 0.8125em;
+
line-height: 1.5em;
+
}
+
.content-top h3 {
+
font-size:1.5em;
+
}
+
.content-top h5 {
+
font-size:0.8125em;
+
margin-bottom: 35px;
+
}
+
.footer-list li img {
+
margin-right: 10px;
+
}
+
.gallery li {
+
width: 30.9%;
+
}
+
#filters li span {
+
padding: 10px 4px;
+
font-size:0.8125em;
+
}
+
.links h4 a {
+
font-size:12px;
+
}
+
p.img {
+
padding-top: 2px;
+
font-size: 13px;
+
}
+
.project-list li p a {
+
font-size:11px;
+
}
+
.project-list2 {
+
padding: 20px;
+
}
+
.project-list {
+
padding: 20px;
+
}
+
.project-list1 {
+
padding: 20px;
+
}
+
span.likes {
+
font-size: 12px;
+
padding-top: 50px;
+
}
+
.blog-left h4 {
+
font-size: 1em;
+
}
+
span.author {
+
font-size: 0.8125em;
+
}
+
.blog-desc {
+
padding:20px;
+
}
+
.blog-desc p {
+
font-size:0.8125em;
+
}
+
.comment-desc {
+
font-size: 0.8125em;
+
}
+
ul.dc_pagination li a {
+
font-size:0.8125em;
+
}
+
.span_1_of_about-grids h3 {
+
font-size:0.8125em;
+
padding: 5px 15px;
+
}
+
.contact-list li p {
+
width:79.5%;
+
}
+
.page-not-found h3 {
+
font-size: 10em;
+
}
+
.page-not-found h4 span img{
+
width: 69%;
+
}
+
.cssmenu ul li a {
+
padding: 10px 90px;
+
font-size: 0.8125em;
+
}
+
.cssmenu {
+
padding-top:0px;
+
text-align: center;
+
}
+
.btn {
+
padding: 5px 10px;
+
font-size: 0.8125em;
+
width: 57%;
+
}
+
.desc {
+
padding:10px;
+
}
+
.desc h4 {
+
font-size:1em;
+
}
+
.span_1_of_3 h3 {
+
margin-bottom: 15px;
+
}
+
.portfolio-top h3 {
+
font-size:1.4em;
+
}
+
.portfolio-top h5 {
+
font-size:0.8125em;
+
margin-bottom:30px;
+
}
+
#filters {
+
margin-bottom: 20px;
+
}
+
.links {
+
padding: 10px;
+
}
+
.project-list h4, .project-list1 h4, .project-list2 h4 {
+
font-size: 1em;
+
margin-bottom: 20px;
+
}
+
.point h5 {
+
font-size:0.8125em;
+
}
+
.gallery li p {
+
font-size: 0.8125em;
+
padding: 15px;
+
}
+
.percent-text {
+
width:54%;
+
}
+
.percent-text1 {
+
width:50%;
+
}
+
.percent-text2 {
+
width: 45%;
+
}
+
.percent-text3 {
+
width: 48%;
+
}
+
.percent-text4 {
+
width: 54%;
+
}
+
.percent-text5 {
+
width:48%;
+
}
+
.percent-text7 {
+
width:44%;
+
}
+
.content-bottom p {
+
font-size: 1em;
+
}
+
.content-middle p {
+
font-size: 1em;
+
}
+
.project-list2 li {
+
padding:4px;
+
}
+
.data-middle {
+
width:89.5%;
+
}
+
.data-last {
+
width:89.5%;
+
}
+
.logo {
+
width:35%;
+
margin: 0 auto;
+
float: none;
+
}
+
.span_1_of_first {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.col_1_of_4 {
+
float:none;
+
margin: 0% 0 0% 0%;
+
}
+
.span_1_of_4 {
+
width:100%;
+
margin-bottom:20px;
+
}
+
.footer-nav {
+
float:none;
+
}
+
.copy {
+
float: none;
+
padding-top: 7px;
+
}
+
.footer-bottom {
+
text-align:center;
+
}
+
.follow {
+
padding-top: 10px;
+
}
+
.follow p {
+
margin-bottom:0;
+
}
+
.banner h2 {
+
padding: 5px 40px 5px 10px;
+
font-size: 1.7em;
+
}
+
#filters {
+
padding: 0% 5% 5% 5%;
+
}
+
#portfoliolist .portfolio {
+
width: 100%;
+
}
+
.project {
+
width: 100%;
+
float: none;
+
margin-right: 0;
+
}
+
.project-sidebar {
+
width: 100%;
+
float: none;
+
}
+
.single-blog {
+
width:91%;
+
float: none;
+
padding: 0 20px;
+
}
+
.submit {
+
margin-bottom:20px;
+
font-size: 0.8125em;
+
padding: 8px 15px;
+
}
+
.span_2_of_about h2 {
+
font-size: 1.1em;
+
}
+
.span_2_of_contact {
+
width:100%;
+
margin-right:0%;
+
}
+
.contact{
+
padding:0;
+
}
+
.page-not-found h4 span {
+
padding: 13px 0px 0;
+
}
+
.footer-nav ul li a {
+
font-size:12px;
+
margin:10px 1px;
+
}
+
.social-list li {
+
margin-right:10px;
+
}
+
.social-list li p {
+
padding: 8px 10px 5px 10px;
+
font-size: 0.8125em;
+
}
+
.slider-left {
+
float: none;
+
padding-top: 0;
+
width: 100%;
+
}
+
.banner {
+
padding: 30px 0;
+
}
+
.banner h2{
+
font-size: 1.4em;
+
}
+
.proj-desc h4 {
+
font-size: 1.2em;
+
}
+
.proj-desc p {
+
font-size: 0.8125em;
+
}
+
.blog-left {
+
width: 100%;
+
margin-right: 0;
+
float: none;
+
}
+
.blog-right {
+
width: 100%;
+
float: none;
+
}
+
.social-list {
+
padding-top: 20px;
+
}
+
li.middle {
+
padding: 0 0px 0 30px;
+
}
+
li.last-comment {
+
padding: 0 0px 0 50px;
+
}
+
.slider-left h4 {
+
display:none;
+
}
+
.slider-left h3 {
+
font-size: 1.4em;
+
width: 100%;
+
}
+
.banner-wrap {
+
width: 60%;
+
}
+
}
+
</style>
+
  
<link href='http://fonts.googleapis.com/css?family=Karla' rel='stylesheet' type='text/css'>
 
<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
 
<!-- jQuery -->
 
<script type="text/javascript" src="js/jquery.min.js"></script>
 
<!-- Add fancyBox main JS and CSS files -->
 
<script src="js/jquery.magnific-popup.js" type="text/javascript"></script>
 
<link href="css/magnific-popup.css" rel="stylesheet" type="text/css">
 
<script>
 
$(document).ready(function() {
 
$('.popup-with-zoom-anim').magnificPopup({
 
type: 'inline',
 
fixedContentPos: false,
 
fixedBgPos: true,
 
overflowY: 'auto',
 
closeBtnInside: true,
 
preloader: false,
 
midClick: true,
 
removalDelay: 300,
 
mainClass: 'my-mfp-zoom-in'
 
});
 
});
 
</script>
 
<body>
 
  <div class="header">
 
      <div class="wrap">
 
        <div class="logo">
 
<a href="igem.org"><img src="https://static.igem.org/mediawiki/2015/c/cf/CMU_Logo1.jpg" height="100" width = "100"/></a>
 
</div>
 
<div class="cssmenu">
 
<ul>
 
<li class="active"><a href="index.html">Home</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Team">Team</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Team#">Project</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Parts">Parts</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Notebook">Notebook</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Modeling”>Modeling</a></li>
 
<li><a href="https://2015.igem.org/Team:Carnegie_Mellon/Practices”>Outreach</a></li>
 
</ul>
 
    </div>
 
    <div class="clear"></div>
 
  </div>
 
  </div>
 
  <div class="index-banner">
 
      <div class="wmuSlider example1">
 
  <div class="wmuSliderWrapper">
 
  <article style="position: absolute; width: 100%; opacity: 0;">
 
  <div class="banner-wrap">
 
  <div class="slider-left">
 
<h3>Project Title</h3>
 
<h4>iGEM 2015</h4>
 
<p class="top">Carnegie Mellon University</p>
 
<p class="middle”>description</p>
 
 
 
</div>
 
<div class="slider-right">
 
    <img src="images/banner-left.png" />
 
</div>
 
<div class="clear"></div>
 
</div>
 
</article>
 
  <article style="position: relative; width: 100%; opacity: 1;">
 
  <div class="banner-wrap">
 
  <div class="slider-right">
 
    <img src="images/banner-left.png" />
 
</div>
 
  <div class="slider-left">
 
<h3>We Believe</h3>
 
<h4>In Quality Design</h4>
 
<p class="top">Any Creative Project is Unique</p>
 
<p class="middle">and should be provided with</p>
 
<p class="bottom">the appropriate quality</p>
 
<button class="btn btn-8 btn-8b"><a class="popup-with-zoom-anim" href="#small-dialog">Order Now</a></button>
 
</div>
 
<div class="clear"></div>
 
</div>
 
  </article>
 
  <article style="position: absolute; width: 100%; opacity: 0;">
 
  <div class="banner-wrap">
 
  <div class="slider-left">
 
<h3>We Believe</h3>
 
<h4>In Quality Design</h4>
 
<p class="top">Any Creative Project is Unique</p>
 
<p class="middle">and should be provided with</p>
 
<p class="bottom">the appropriate quality</p>
 
<button class="btn btn-8 btn-8b"><a class="popup-with-zoom-anim" href="#small-dialog">Order Now</a></button>
 
</div>
 
<div class="slider-right">
 
    <img src="images/banner-left.png" />
 
</div>
 
<div class="clear"></div>
 
</div>
 
  </article>
 
  <article style="position: absolute; width: 100%; opacity: 0;">
 
  <div class="banner-wrap">
 
  <div class="slider-right">
 
    <img src="images/banner-left.png" />
 
</div>
 
  <div class="slider-left">
 
<h3>We Believe</h3>
 
<h4>In Quality Design</h4>
 
<p class="top">Any Creative Project is Unique</p>
 
<p class="middle">and should be provided with</p>
 
<p class="bottom">the appropriate quality</p>
 
<button class="btn btn-8 btn-8b"><a class="popup-with-zoom-anim" href="#small-dialog">Order Now</a></button>
 
</div>
 
<div class="clear"></div>
 
</div>
 
  </article>
 
  <article style="position: absolute; width: 100%; opacity: 0;">
 
  <div class="banner-wrap">
 
  <div class="slider-left">
 
<h3>We Believe</h3>
 
<h4>In Quality Design</h4>
 
<p class="top">Any Creative Project is Unique</p>
 
<p class="middle">and should be provided with</p>
 
<p class="bottom">the appropriate quality</p>
 
<button class="btn btn-8 btn-8b"><a class="popup-with-zoom-anim" href="#small-dialog">Order Now</a></button>
 
</div>
 
<div class="slider-right">
 
    <img src="images/banner-left.png" />
 
</div>
 
<div class="clear"></div>
 
</div>
 
      </article>
 
</div>
 
                <a class="wmuSliderPrev">Previous</a><a class="wmuSliderNext">Next</a>
 
                <ul class="wmuSliderPagination">
 
                <li><a href="#" class="">0</a></li>
 
                <li><a href="#" class="">1</a></li>
 
                <li><a href="#" class="wmuActive">2</a></li>
 
                <li><a href="#">3</a></li>
 
                <li><a href="#">4</a></li>
 
                  </ul>
 
        </div>
 
            <script src="js/jquery.wmuSlider.js"></script>
 
<script type="text/javascript" src="js/modernizr.custom.min.js"></script>
 
<script>
 
      $('.example1').wmuSlider();       
 
  </script>                
 
  </div>
 
<!---//End-da-slider----->
 
  <div class="main">
 
<div class="content-top">
 
<div class="wrap">
 
<h3>We Creative Quality Designs.</h3>
 
<h5>We Specialize in Web Design / Development and Graphic Design</h5>
 
<div class="section group">
 
<div class="col_1_of_4 span_1_of_first">
 
<img src="images/pic.jpg" alt=""/>
 
<div class="desc">
 
  <h4>Redesigning<br> with personality<br><span>in<span class="small">&nbsp;web design</span></span><div class="clear"></div></h4>
 
</div>
 
</div>
 
<div class="col_1_of_4 span_1_of_4">
 
<div class="grid1">
 
<img src="images/icon1.png" alt=""/>
 
<h4>Web development</h4>
 
</div>
 
<div class="desc">
 
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
 
</div>
 
</div>
 
<div class="col_1_of_4 span_1_of_4">
 
<div class="grid1">
 
<img src="images/icon2.png" alt=""/>
 
<h4>Web design</h4>
 
</div>
 
<div class="desc">
 
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
 
</div>
 
</div>
 
<div class="col_1_of_4 span_1_of_4">
 
<div class="grid1">
 
<img src="images/icon3.png" alt=""/>
 
<h4>Graphic design</h4>
 
</div>
 
<div class="desc">
 
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
 
</div>
 
</div>
 
<div class="clear"></div>
 
</div>
 
</div>
 
</div>
 
<div class="content-middle">
 
<h2><span>Our work</span></h2>
 
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
 
      <div id="container">
 
        <div id="main1">
 
      <ul id="tiles">
 
        <!-- These are our grid blocks -->
 
        <li>
 
          <a href="images/t-pic1.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic1.jpg" width="200" height="283">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/t-pic2.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic2.jpg" width="200" height="300">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/t-pic3.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic3.jpg" width="200" height="252">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/t-pic4.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic4.jpg" width="200" height="158">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/t-pic5.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic5.jpg" width="200" height="265">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/pic6.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic6.jpg" width="200" height="158">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic7.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic7.jpg" width="200" height="200">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic8.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic8.jpg" width="200" height="200">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic9.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic9.jpg" width="200" height="133">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic10.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic10.jpg" width="200" height="193">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic11.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic11.jpg" width="200" height="283">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/t-pic1.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic1.jpg" width="200" height="283">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/t-pic2.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic2.jpg" width="200" height="300">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/t-pic3.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic3.jpg" width="200" height="252">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/t-pic4.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic4.jpg" width="200" height="158">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/t-pic5.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic5.jpg" width="200" height="265">
 
          </a>
 
      </li>
 
        <li>
 
          <a href="images/pic6.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic6.jpg" width="200" height="158">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic7.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic7.jpg" width="200" height="200">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic8.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic8.jpg" width="200" height="200">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic9.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic9.jpg" width="200" height="133">
 
          </a>
 
        </li>
 
        <li>
 
          <a href="images/pic10.jpg" rel="lightbox" class="cboxElement">
 
            <img src="images/pic10.jpg" width="200" height="193">
 
          </a>
 
        </li>
 
    </ul>
 
  </div>
 
  </div>
 
  <link rel="stylesheet" href="css/colorbox.css">
 
  <!-- Include the imagesLoaded plug-in -->
 
  <script src="js/jquery.imagesloaded.js"></script>
 
  <!-- include colorbox -->
 
  <script src="js/jquery.colorbox-min.js"></script>
 
  <!-- Include the plug-in -->
 
  <script src="js/jquery.wookmark.js"></script>
 
  <!-- Once the page is loaded, initalize the plug-in. -->
 
  <script type="text/javascript">
 
    (function ($){
 
      $('#tiles').imagesLoaded(function() {
 
        // Prepare layout options.
 
        var options = {
 
          autoResize: true, // This will auto-update the layout when the browser window is resized.
 
          container: $('#main1'), // Optional, used for some extra CSS styling
 
          offset: 2, // Optional, the distance between grid items
 
          itemWidth:200 // Optional, the width of a grid item
 
        };
 
  
        // Get a reference to your grid items.
+
<!-- <h4>Inspiration</h4>
        var handler = $('#tiles li');
+
<p>You can look at what other teams did to get some inspiration! <br />
 +
Here are a few examples:</p>
 +
<ul>
 +
<li><a href="https://2014.igem.org/Team:METU_Turkey_team">METU Turkey </a></li>
 +
<li><a href="https://2014.igem.org/Team:Colombia/Members">Colombia</a></li>
 +
<li><a href="https://2014.igem.org/Team:Stony_Brook/Team">Stony Brook</a></li>
 +
<li><a href="https://2014.igem.org/Team:OUC-China/Team">OUC-China</a></li>
 +
</ul>
  
        // Call the layout function.
+
<h5>What should this page contain?</h5>
        handler.wookmark(options);
+
<ul>
 
+
<li> Include pictures of your teammates, don’t forget instructors and advisors! </li>
        // Init lightbox
+
<li>You can add a small biography or a few words from each team member, to tell us what you like, and what motivated you to participate in iGEM.</li>
        $('a', handler).colorbox({
+
<li>Take team pictures! Show us your school, your lab and little bit of your city.</li>
          rel: 'lightbox'
+
<li>Remember that image galleries can help you showcase many pictures while saving space.</li>
        });
+
</ul> -->
      });
+
    })(jQuery);
+
  </script>
+
</div>
+
  <div class="content-bottom">
+
<h2><span>Our Clients</span></h2> 
+
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>    
+
<ul id="flexiselDemo3">
+
<li><img src="images/client1.jpg" /></li>
+
<li><img src="images/client2.jpg" /></li>
+
<li><img src="images/client3.jpg" /></li>
+
<li><img src="images/client4.jpg" /></li>
+
<li><img src="images/client5.jpg" /></li>
+
<li><img src="images/client6.jpg" /></li>
+
<li><img src="images/client7.jpg" /></li>
+
<li><img src="images/client8.jpg" /></li>
+
</ul>
+
<script type="text/javascript">
+
$(window).load(function() {
+
$("#flexiselDemo1").flexisel();
+
$("#flexiselDemo2").flexisel({
+
enableResponsiveBreakpoints: true,
+
    responsiveBreakpoints: {
+
    portrait: {
+
    changePoint:480,
+
    visibleItems: 1
+
    },
+
    landscape: {
+
    changePoint:640,
+
    visibleItems: 2
+
    },
+
    tablet: {
+
    changePoint:768,
+
    visibleItems: 3
+
    }
+
    }
+
    });
+
  
$("#flexiselDemo3").flexisel({
 
visibleItems: 5,
 
animationSpeed: 1000,
 
autoPlay: true,
 
autoPlaySpeed: 3000,   
 
pauseOnHover: true,
 
enableResponsiveBreakpoints: true,
 
    responsiveBreakpoints: {
 
    portrait: {
 
    changePoint:480,
 
    visibleItems: 1
 
    },
 
    landscape: {
 
    changePoint:640,
 
    visibleItems: 2
 
    },
 
    tablet: {
 
    changePoint:768,
 
    visibleItems: 3
 
    }
 
    }
 
    });
 
   
 
});
 
</script>
 
<script type="text/javascript" src="js/jquery.flexisel.js"></script>
 
 
</div>
 
</div>
</div>
 
  <div class="footer">
 
<div class="footer-top">
 
  <div class="wrap">
 
  <div class="section group">
 
<div class="col_1_of_3 span_1_of_3">
 
<h3>About Us</h3>
 
<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 dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
 
<button class="btn1 btn-8 btn-8b">Learn more</button>
 
<h4>Photo Stream</h4>
 
<div class="gallery">
 
<ul>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g1.jpg" alt=""/></a></li>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g2.jpg" alt=""/></a></li>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g3.jpg" alt=""/></a></li>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g4.jpg" alt=""/></a></li>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g5.jpg" alt=""/></a></li>
 
<li><a class="popup-with-zoom-anim" href="#small-dialog1"><img src="images/g6.jpg" alt=""/></a></li>
 
<div id="small-dialog1" class="mfp-hide">
 
<div class="pop_up">
 
<h2>A Sample Photo Stream</h2>
 
<img src="images/g_zoom.jpg" alt=""/>
 
  </div>
 
</div>
 
</ul>
 
</div>
 
</div>
 
<div class="col_1_of_3 span_1_of_3">
 
<h3>Latest tweets</h3>
 
<div class="footer-list">
 
<ul>
 
<li><img src="images/tw.png" alt=""/><p>Lorem ipsum <span class="yellow"><a href="#">consectetuer</a></span> adipiscing elit, seddia<br><span class="small">&nbsp;web design</span></p><div class="clear"></div></li>
 
<li><img src="images/tw.png" alt=""/><p>Lorem ipsum <span class="yellow"><a href="#">consectetuer</a></span> adipiscing elit, seddia<br><span class="small">&nbsp;web design</span></p><div class="clear"></div></li>
 
<li><img src="images/tw.png" alt=""/><p>Lorem ipsum dolor sit amet, <span class="yellow"><a href="#">consectetuer</a></span> adipiscing elit, sed diam nonummy nibh<br><span class="small">&nbsp;web design</span></p><div class="clear"></div></li>
 
<li><img src="images/tw.png" alt=""/><p>Lorem ipsum dolor sit amet, <span class="yellow"><a href="#">consectetuer</a></span> adipiscing elit, sed diam nonummy nibh<br><span class="small">&nbsp;web design</span></p><div class="clear"></div></li>
 
<li><img src="images/tw.png" alt=""/><p>Lorem ipsum <span class="yellow"><a href="#">consectetuer</a></span> adipiscing elit, seddia<br><span class="small">&nbsp;web design</span></p><div class="clear"></div></li>
 
</ul>
 
</div>
 
<div class="social-icons">
 
<h4>Social Connecting</h4>
 
    <ul>
 
  <li class="facebook"><a href="#"><span> </span></a></li>
 
          <li class="google"><a href="#"><span> </span></a></li>
 
          <li class="twitter"><a href="#"><span> </span></a></li>
 
          <li class="linkedin"><a href="#"><span> </span></a></li>
 
          <li class="youtube"><a href="#"><span> </span></a></li>
 
          <li class="bloger"><a href="#"><span> </span></a></li>
 
          <li class="rss"><a href="#"><span> </span></a></li>
 
          <li class="dribble"><a href="#"><span> </span></a></li>        
 
        </ul>
 
    </div>
 
    </div>
 
<div class="col_1_of_3 span_1_of_3">
 
<h3>Contact info</h3>
 
<div class="footer-list">
 
<ul>
 
<li><img src="images/address.png" alt=""/><p>Lorem ipsum dolor sit amet,consectetuer adipiscing elit, sed diam nonummy nibh<br>&nbsp;web design</p><div class="clear"></div></li>
 
<li><img src="images/phone.png" alt=""/><p>Phone: +1 800 258 2689<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;+1 800 258 2689 </p><div class="clear"></div></li>
 
<li><img src="images/msg.png" alt=""/><p>Email: <span class="yellow"><a href="#">info(at)skokov.com</a></span></p><div class="clear"></div></li>
 
  </ul>
 
</div>
 
<div class="follow">
 
  <h4>Follow Us</h4>
 
  <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod</p>
 
  <div class="search">
 
  <form>
 
  <input type="text" value="">
 
  <input type="submit" value="">
 
  </form>
 
  </div>
 
    </div>
 
</div>
 
<div class="clear"></div>
 
</div>
 
  </div>
 
</div>
 
<div class="footer-bottom">
 
<div class="wrap">
 
<div class="copy">
 
    <p class="copy">© 2013 Template by <a href="http://w3layouts.com" target="_blank">w3layouts</a></p>
 
    </div>
 
<div class="footer-nav">
 
<ul>
 
<li><a href="index.html">Home</a></li>
 
<li><a href="portfolio.html">Portfolio</a></li>
 
<li><a href="blog.html">Blog</a></li>
 
<li><a href="about.html">About Us</a></li>
 
<li><a href="contact.html">Contact</a></li>
 
</ul>
 
</div>
 
<div class="clear"></div>
 
    </div>
 
</div>
 
 
</div>
 
</div>
 
</body>
 
</body>
 
</html>
 
</html>

Latest revision as of 21:11, 31 July 2015

Meet the Team.

Biologists, engineers, enthusiastic people.

Students Advisors Attributions

Student Researchers

Niteesh Sundaram

"You miss 100% of the shots you don't take." -Wayne Gretzky

Niteesh grew up in Pittsburgh and is a rising master's student in Electrical and Computer Engineering. He graduated with a Bachelor's in Electrical and Computer Engineering from Carnegie Mellon in the spring of 2015. Niteesh's academic interests include computer hardware, embedded systems, programming, modeling of biological systems, biochemistry, pathology, and epidemiology. Outside the classroom Niteesh likes to watch Pittsburgh sports teams win, the occasional Netflix binge, pickup basketball, and going to the climbing wall and the gym. At Carnegie Mellon University, Niteesh is a teaching assistant in the Electrical and Computer Engineering department, a member of Model UN, and participates in a handful of clubs dedicated at exposing middle and high school aged children to math and science.



Dominique Maccalla

"I can do all things through Him who strengthens me." Philippians 4:13

Dominique is from New Haven, Connecticut and is a rising senior studying biomedical engineering and material science engineering. After graduation, she wants to work as a cosmetic chemist developing hair and skin products. Her interests include beauty, dance, and issues of social justice. In her free time, she loves to attend church, watch YouTube videos, and going for runs. She would spend the last $20 to her name getting her nails done, has been a competitive gymnast for most of her life, and is also deathly afraid of bees.





Michelle Yu

"Be miserable. Or motivate yourself. Whatever has to be done, it's always your choice."

Michelle is a senior from New York majoring Biology with a double major in Psychology and a minor in Biomedical Engineering. She would like to eventually go to medical school and start her own clinic in a developing country. In her free time, she enjoys swimming, running, sleeping, writing, watching Netflix, and being a YouTube fanatic. Michelle likes to collects pennies from every place she’s traveled to. She had two differently shaped thumbs, and once when she was little, she was stung by a jellyfish in Maryland and a lifeguard peed on her leg to ease the pain.



Donna Lee

"A man must be big enough to admit his mistakes, smart enough to profit from them, and strong enough to correct them"-- John C. Maxwell

Donna is from Brooklyn, New York and studies biology with a double major in psychology. She hopes to go to med school and be a physician that interacts with people of all ages and from all backgrounds. Her interests include swimming, basketball, soccer, and volleyball. Sadly, she lacks the talent to actually play by any of these games’ rules. Some people compare Donna to a sloth. She hopes it’s because of their similar sleeping and lounging habits, and not because of any physical similarities. Donna also sleep walks, sleep talks, grinds her teeth, tosses and turns, and kicks people. She pasically exercises more when she’s asleep than when she’s awake. And of course, when someone likes sleeping, eating is probably that person's second most favorite thing. She loves cooking and trying new foods, despite all her random food allergies. Donna also likes listening to music and playing the piano. Despite being afraid of heights, she actually loves pra the thrills and sceneries that only accompany heights. She is proud to have been the first of her sisters to travel outside of the country.







Wei Mon Lu

"I go to seek a Great Perhaps." -- François Rabelais

Wei is a Pittsburgh native studying Chemical Engineering with a double major in Biomedical Engineering. She aspires to either work in pharmaceuticals or consumable consumer goods (read: food). She is the vice president of the Society of Women Engineers, member of the Joint Funding Committee, a projectionist for AB Films, and is in her second year of being a Residential Advisor. She is a master cake decorator, hates running but still signs up for the Pittsburgh Marathon every year, and enjoys discussing and trying to remedy social inequality, race, poverty, and affordable access to quality education. She would rather spend her money on concert tickets than food, but still believes that she can definitively out-eat anyone in any kind of vegetarian-friendly eating competition. Wei is so uncoordinated that she almost fell down a waterfall once.



William Casazza

"Iron rusts from disuse; water loses its purity from stagnation... even so does inaction sap the vigor of the mind." - Leonardo da Vinci

Will is a rising junior from Barrington, Rhode Island, and is majoring in computational biology. His ultimate goal after graduation is to work in industry either developing diagnostic models/tools or working with synthetic biology and genetic engineering. Will’s interests include genetic engineering, parallel algorithms, epigenetic regulation, and probably some sort of math. In his free time, he likes to go long distance racing and long distance running, playing the upright bass, and listening to jazz. And, you know, just hanging out. He plays an impressive range of instruments including guitar, upright and electric bass, trombone, piano, ukulele, and melodica. He’s involved with the jazz scene at CMU and around Pittsburgh once playing in a large ensemble and occasionally gigs in small combos. He is secretly very interested in ethics and social issues.





Jordan Tick

"Part of me suspects that I'm a loser, and the other part of me thinks I'm God Almighty" --John Lennon

Jordan is from Buffalo, New York and studies Computer Science and Electrical and Computer Engineering (and may pick up a minor, time permitting). After graduation, he wants to pursue a Masters in one of his majors before involving himself in augmented reality or signals processing. Academically, his interests are signal processing and graphics. Outside of the classroom, he enjoys listening to music, watching movies, playing video games, and is in Carnegie Mellon’s Archery, Parkour, and Taekwondo clubs. He’s studied French, Spanish, and Chinese and knows how to play the ukulele, piano, guitar, and trumpet. Previous research experience includes studying evolution by looking at the structural proteins of ribosomes. Jordan graduated a year early from high school and is the proud owner of three dogs.





Max Telmer

"Everybody falls down."

Max grew up in Pittsburgh and now studies Material Science and Engineering. After graduation he wants to go into the world of manufacturing. His favourite sports team is FC Barcelona and he enjoys watching It’s Always Sunny in Philadelphia. In his free time, he enjoys sports, movies, and camping. His family is from Canada, he’s twenty years old, and he used to be a swimmer.

Kenneth Li

"Quote." --Quotee

Kenneth is from New Hyde Park, New York and is a rising senior studying Biology and Psychology. He is currently applying to dental schools and hopes to matriculate right after graduation. His academic interests include cell and molecular biology research, specifically within the topic of carcinogenesis, and he will be a teaching assistant for genetic and biochemistry lab courses. He is also a dedicated member of Global Public Health Brigades, which is an organization involved in building home infrastructure in under-developed countries to promote hygiene and healthy lifestyles. Ken enjoys playing tennis and swimming during his free time, and he loves watching Youtube videos and NBA games.





Ruchi Asthana

"Sometimes the questions are complicated, but the answers are simple."

Ruchi is from Long Branch, New Jersey, and is currently a Biology major but is hoping to switch into Computational Biology this year. After graduation, she hopes to pursue a career in translational or research-based medicine. Her interest include probabilistic modeling for biological phenomena, reading ancient Latin works, and traveling to new places and trying new things. She likes to spend her free time with family and friends, taking long walks and listening to Ed Sheeran on repeat. Ruchi is an ice cream aficionado, loves The Color Purple, and keeps the pun game strong.

Advisors

Taylor Canady

Taylor hails from the New Mexico/California area. He studied Biochemistry at the University of New Mexico and did research in Bioengineering. Right now, his work is figuring out how to make E. coli do all the work. He enjoys action movies, programming, soccer, biking up hills, running down hills, and snow things. He knows ASL, gets sea sick, only reads non-fiction, and believes that his time is money.