Difference between revisions of "Template:Bilkent-UNAMBG"

Line 1: Line 1:
−
 
+
{{Bilkent-UNAMBG}}
 
<html>
 
<html>
 
<head>
 
<head>
−
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
<link rel="stylesheet" type="text/css" href="style.css">
−
<title></title>
+
<meta charset="UTF-8">
−
<meta name="keywords" content="" />
+
<title>index</title>
−
<meta name="description" content="" />
+
</head>
−
<link href="fonts.css" rel="stylesheet" type="text/css" media="all" />
+
<body>
 +
<div class="container">
 +
                    <div class="row">
 +
                        <div class="heading-title text-center">
 +
                            <h3 class="text-uppercase">Our professionals </h3>
 +
                            <p class="p-top-30 half-txt">Nam pulvinar vitae neque et porttitor. Praesent sed nisi eleifend. Nam pulvinar vitae neque et porttitor. Praesent sed nisi eleifend. </p>
 +
                        </div>
  
−
<style>
+
                        <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://static.igem.org/mediawiki/2018/thumb/a/ae/T--Bilkent-UNAMBG--azra.jpg/180px-T--Bilkent-UNAMBG--azra.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>Hi There !</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
.sponsor {width: 100%}
+
                        </div>
−
img.sponsors {margin-left:30%; margin-right:30%;width:40%; height: auto;}
+
                        <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/elegant-man-with-thumbs-up_1149-1595.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>Hello World</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
 +
                       
 +
                        </div>
 +
                        <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
#page.team img.safety {width: 240px; height:240px;}
+
                        </div>
−
#page .title h2.headline {line-height:1em; font-size: 4em; overflow:visible; text-shadow: 3px 3px 0 #666666;top: -5em;}
+
                                                <div class="col-md-4 col-sm-4">
−
li.noteb { display: inline-block; float: none;}
+
                            <div class="team-member">
−
.notebooks .buttonx {font-size: 1.2em;}
+
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
@keyframes example {
+
                        </div>
−
    0%  {text-shadow: 0px 3px 3px 0 red;}
+
                                                <div class="col-md-4 col-sm-4">
−
    25%  {text-shadow: 3px 0px 3px 0 blue;}
+
                            <div class="team-member">
−
    50%  {text-shadow: 0px -3px 3px 0 green;}
+
                                <div class="team-img">
−
    75%  {text-shadow: 3px  0 3px gray;}
+
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
−
    100% {text-shadow: 3px 3px 0 red;}}
+
                                </div>
−
@-webkit-keyframes example {
+
                                <div class="team-hover">
−
    0%  {text-shadow: 0px 3px 3px 0 red;}
+
                                    <div class="desk">
−
    25%  {text-shadow: 3px 0px 3px 0 blue;}
+
                                        <h4>I love to design</h4>
−
    50%  {text-shadow: 0px -3px 3px 0 green;}
+
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
−
    75%  {text-shadow: 3px  0 3px gray;}
+
                                    </div>
−
    100% {text-shadow: 3px 3px 0 red;}}
+
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
#page .title h2.headline:hover{
+
                        </div>
−
-webkit-animation-name: example; /* Safari 4.0 - 8.0 */
+
                                                <div class="col-md-4 col-sm-4">
−
    -webkit-animation-duration: 2s; /* Safari 4.0 - 8.0 */
+
                            <div class="team-member">
−
    -webkit-animation-iteration-count: infinite; /* Safari 4.0 - 8.0 */
+
                                <div class="team-img">
−
    animation-name: example;
+
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
−
    animation-duration: 2s;
+
                                </div>
−
    animation-iteration-count: infinite;}
+
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
 +
                        </div>
 +
                                                <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
ul.notebooks {width: 50%; margin-left:25%; margin-right:25%;}
+
                        </div>
−
.hpgoldbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/f/fe/Bilkent-hpgoldbg.jpg");background-position: center top;background-size: 100% auto;}
+
                                                <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
.hpgoldbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
                        </div>
 +
                                                <div class="col-md-4 col-sm-4">
 +
                            <div class="team-member">
 +
                                <div class="team-img">
 +
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
 +
                                </div>
 +
                                <div class="team-hover">
 +
                                    <div class="desk">
 +
                                        <h4>I love to design</h4>
 +
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
 +
                                    </div>
 +
                                    <div class="s-link">
 +
                                        <a href="#"><i class="fa fa-facebook"></i></a>
 +
                                        <a href="#"><i class="fa fa-twitter"></i></a>
 +
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
 +
                                    </div>
 +
                                </div>
 +
                            </div>
  
−
.middle {margin-left: 15%; margin-right:15%; width: 60%; }
+
                        </div>
−
.middle p {text-align:center;}
+
                                                <div class="col-md-4 col-sm-4">
−
.middle p b {text-align:center;}
+
                            <div class="team-member">
−
 
+
                                <div class="team-img">
−
.hp img {width:100%;}
+
                                    <img src="https://image.freepik.com/free-photo/well-dressed-executive-with-crossed-arms_1098-3930.jpg" alt="team member" class="img-responsive">
−
.teambg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/0/05/Bilkent-team.jpg");background-position: center;}
+
                                </div>
−
 
+
                                <div class="team-hover">
−
.teambg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
                                    <div class="desk">
−
 
+
                                        <h4>I love to design</h4>
−
.collabsbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/c/ce/Bilkent-collabs.jpg");background-position: center;}
+
                                        <p>I love to introduce myself as a hardcore Web Designer.</p>
−
 
+
                                    </div>
−
.collabsbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
                                    <div class="s-link">
−
 
+
                                        <a href="#"><i class="fa fa-facebook"></i></a>
−
.safetybg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/8/8a/Bilkent-safety.jpg");background-position: center;}
+
                                        <a href="#"><i class="fa fa-twitter"></i></a>
−
 
+
                                        <a href="#"><i class="fa fa-google-plus"></i></a>
−
.safetybg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
                                    </div>
−
 
+
                                </div>
−
.partsbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/e/ea/Bilkent-parts.jpg");background-position: center;}
+
                            </div>
−
 
+
−
.partsbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
−
 
+
−
.attrbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/9/9f/Bilkent-attr.jpg");background-position: center;background-size: 100% auto;}
+
−
 
+
−
.attrbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
−
 
+
−
.hpbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/8/8e/Bilkent-hp.jpg");background-position: center;}
+
−
 
+
−
.hpbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
−
 
+
−
.projectbg {width:100%; height: 80vh; background-image: url("https://static.igem.org/mediawiki/2017/0/00/Bilkent-teambg.jpg");background-position: center;}
+
−
 
+
−
.projectbg h1 {line-height: 4em;padding-top: 50vh; padding-left: 7%; font-size: 3em; text-shadow: 2px 2px 1px #36332D; overflow: visible; color: rgb(39, 174, 97);}
+
−
 
+
−
 
+
−
#page img{margin: 20px;}
+
−
 
+
−
#page.team img {width: 100%; height:auto; margin: 0;}
+
−
 
+
−
.quote {width: 80%; margin-left: 10%; font-style: italic; color: #333; font-size: 1em;}
+
−
.quote_source {margin-left: 10%;}
+
−
 
+
−
#page h4 {font-size:0.7em; color:#111;}
+
−
 
+
−
#page h2 {font-size: 1.3em;}
+
−
#page .byline {font-size: 0.8em;}
+
−
 
+
−
/* Clear the default wiki settings */
+
−
+
−
#home_logo, #sideMenu { display:none; }
+
−
#sideMenu, #top_title, .patrollink  {display:none;}
+
−
#content { width:100%; padding:0px;  margin-top:-7px; margin-left:0px;}
+
−
body {background-color:white; }
+
−
+
−
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, center,
+
−
dl, dt, dd, ol, ul, 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%;
+
−
vertical-align: baseline;
+
−
}
+
−
 
+
−
small {
+
−
    font-size: 0.8em;
+
−
font-weight: 700;
+
−
}
+
−
 
+
−
/* HTML5 display-role reset for older browsers */
+
−
article, aside, details, figcaption, figure,
+
−
footer, header, hgroup, menu, nav, section {
+
−
display: block;
+
−
}
+
−
body {
+
−
line-height: 1;
+
−
}
+
−
 
+
−
blockquote, q {
+
−
quotes: none;
+
−
}
+
−
blockquote:before, blockquote:after,
+
−
q:before, q:after {
+
−
content: '';
+
−
content: none;
+
−
}
+
−
table {
+
−
border-collapse: collapse;
+
−
border-spacing: 0;
+
−
}
+
−
+
−
+
−
html, body
+
−
{
+
−
height: 100%;
+
−
}
+
−
+
−
body
+
−
{
+
−
margin: 0px;
+
−
padding: 0px;
+
−
background: #EEEEEE;
+
−
font-family: 'News Cycle', sans-serif;
+
−
font-size: 13pt;
+
−
font-weight: 300;
+
−
color: #656565;
+
−
}
+
−
+
−
+
−
h1, h2, h3
+
−
{
+
−
padding: 0;
+
−
font-weight: 700;
+
−
color: #2B3F48;
+
−
}
+
−
+
−
p, ol, ul
+
−
{
+
−
margin-top: 0;
+
−
}
+
−
+
−
ol, ul
+
−
{
+
−
padding: 0;
+
−
}
+
−
+
−
ul.actions
+
−
{
+
−
text-align: center;
+
−
list-style-type:none;
+
−
list-style-image: none;
+
−
}
+
−
+
−
ul.actions li
+
−
{
+
−
}
+
−
+
−
p
+
−
{
+
−
line-height: 180%;
+
−
}
+
−
 
+
−
 
+
−
+
−
strong
+
−
{
+
−
}
+
−
+
−
a
+
−
{
+
−
color: #0000FF;
+
−
}
+
−
+
−
a:hover
+
−
{
+
−
text-decoration: none;
+
−
}
+
−
+
−
.container
+
−
{
+
−
overflow: hidden;
+
−
margin: 0em auto;
+
−
width: 1000px;
+
−
}
+
−
+
−
/*********************************************************************************/
+
−
/* Image Style                                                                  */
+
−
/*********************************************************************************/
+
−
 
+
−
.image
+
−
{
+
−
display: inline-block;
+
−
}
+
−
+
−
.image img
+
−
{
+
−
display: block;
+
−
width: 100%;
+
−
}
+
−
+
−
.image-full
+
−
{
+
−
display: block;
+
−
width: 100%;
+
−
margin: 0 0 2em 0;
+
−
}
+
−
+
−
.image-left
+
−
{
+
−
float: left;
+
−
margin: 0 2em 2em 0;
+
−
}
+
−
+
−
.image-centered
+
−
{
+
−
display: block;
+
−
margin: 0 0 2em 0;
+
−
}
+
−
+
−
.image-centered img
+
−
{
+
−
margin: 0 auto;
+
−
width: auto;
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* List Styles                                                                  */
+
−
/*********************************************************************************/
+
−
 
+
−
ul.staff
+
−
{
+
−
margin-bottom: 3em;
+
−
}
+
−
 
+
−
ul.staff li
+
−
{
+
−
display: inline-block;
+
−
}
+
−
+
−
ul.staff li img
+
−
{
+
−
width: 80%;
+
−
border-radius: 50%;
+
−
}
+
−
 
+
−
 
+
−
/*********************************************************************************/
+
−
/* Social Icon Styles                                                            */
+
−
/*********************************************************************************/
+
−
 
+
−
ul.contact
+
−
{
+
−
margin: 0;
+
−
padding: 2em 0em 0em 0em;
+
−
list-style: none;
+
−
}
+
−
+
−
ul.contact li
+
−
{
+
−
display: inline-block;
+
−
padding: 0em 0.30em;
+
−
font-size: 1em;
+
−
}
+
−
+
−
ul.contact li span
+
−
{
+
−
display: none;
+
−
margin: 0;
+
−
padding: 0;
+
−
}
+
−
+
−
ul.contact li a
+
−
{
+
−
color: #FFF;
+
−
}
+
−
+
−
ul.contact li a:before
+
−
{
+
−
display: inline-block;
+
−
background: #3f3f3f;
+
−
width: 40px;
+
−
height: 40px;
+
−
line-height: 40px;
+
−
border-radius: 20px;
+
−
text-align: center;
+
−
color: #FFFFFF;
+
−
}
+
−
+
−
ul.contact li a.icon-twitter:before { background: #2DAAE4; }
+
−
ul.contact li a.icon-facebook:before { background: #39599F; }
+
−
ul.contact li a.icon-dribbble:before { background: #C4376B; }
+
−
ul.contact li a.icon-tumblr:before { background: #31516A; }
+
−
ul.contact li a.icon-rss:before { background: #F2600B; }
+
−
 
+
−
/*********************************************************************************/
+
−
/* Button Style                                                                  */
+
−
/*********************************************************************************/
+
−
 
+
−
.buttonx
+
−
{
+
−
display: inline-block;
+
−
padding: 0em 1.6em;
+
−
background: #27AE61;
+
−
border-radius: 8px;
+
−
letter-spacing: 0.20em;
+
−
line-height: 2.5em;
+
−
text-decoration: none;
+
−
text-transform: uppercase;
+
−
font-weight: 400;
+
−
font-size: 0.7em;
+
−
color: #FFF;
+
−
}
+
−
a.buttonx:visited {
+
−
    color: white;
+
−
}
+
−
+
−
.buttonx:before
+
−
{
+
−
display: inline-block;
+
−
background: #FFC31F;
+
−
margin-right: 1em;
+
−
width: 40px;
+
−
height: 40px;
+
−
line-height: 40px;
+
−
border-radius: 20px;
+
−
text-align: center;
+
−
color: #272925;
+
−
}
+
−
+
−
/*********************************************************************************/
+
−
/* Heading Titles                                                                */
+
−
/*********************************************************************************/
+
−
 
+
−
.title
+
−
{
+
−
margin-bottom: 1.8em;
+
−
}
+
−
+
−
.title h2
+
−
{
+
−
font-size: 2em;
+
−
margin: 10px;
+
−
overflow: visible;
+
−
}
+
−
+
−
.title .byline
+
−
{
+
−
font-size: 0.9em;
+
−
color: #6F6F6F;
+
−
}
+
−
+
−
/*********************************************************************************/
+
−
/* 4-column                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
.box1,
+
−
.box2,
+
−
.box3,
+
−
.box4
+
−
{
+
−
width: 22.5%;
+
−
}
+
−
+
−
.box1,
+
−
.box2,
+
−
.box3,
+
−
{
+
−
float: left;
+
−
margin-right: 20px;
+
−
}
+
−
+
−
.box4
+
−
{
+
−
float: right;
+
−
}
+
−
+
−
/*********************************************************************************/
+
−
/* 3-column                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
.boxA,
+
−
.boxB,
+
−
.boxC
+
−
{
+
−
width: 31%;
+
−
margin: 1%;
+
−
text-align:center;
+
−
}
+
−
 
+
−
.boxA,
+
−
.boxB
+
−
{
+
−
float: left;
+
−
+
−
}
+
−
+
−
.boxC
+
−
{
+
−
float: right;
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* 2-column                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
.tbox1,
+
−
.tbox2
+
−
{
+
−
width: 45%;
+
−
margin-left: 2.5%;
+
−
margin-right: 2.5%
+
−
}
+
−
+
−
.tbox1
+
−
{
+
−
float: left;
+
−
}
+
−
 
+
−
.tbox2
+
−
{
+
−
float: right;
+
−
}
+
−
 
+
−
hr { margin-top:10px;
+
−
margin-bottom: 10px;}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Header                                                                        */
+
−
/*********************************************************************************/
+
−
 
+
−
#header
+
−
{
+
−
position: relative;
+
−
padding: 3em 0em;
+
−
overflow: visible;
+
−
}
+
−
 
+
−
#header.container {width: 1200px;}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Logo                                                                          */
+
−
/*********************************************************************************/
+
−
 
+
−
#logo
+
−
{
+
−
position: absolute;
+
−
top: 1em;
+
−
left: 0;
+
−
}
+
−
+
−
#logo h1
+
−
{
+
−
color: #2B3F48;
+
−
+
−
padding-top: 10px;
+
−
}
+
−
+
−
#logo a
+
−
{
+
−
text-decoration: none;
+
−
color: #2B3F48;
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Menu                                                                          */
+
−
/*********************************************************************************/
+
−
 
+
−
#menux
+
−
{
+
−
width: 70%;
+
−
position: absolute;
+
−
top: 2em;
+
−
right: 0;
+
−
}
+
−
+
−
#menux ul
+
−
{
+
−
display: inline-block;
+
−
}
+
−
+
−
#menux li
+
−
{
+
−
display: block;
+
−
float: left;
+
−
text-align: center;
+
−
}
+
−
+
−
+
−
#menux li a, #menu li span
+
−
{
+
−
padding: 1em 1.5em;
+
−
letter-spacing: 1px;
+
−
text-decoration: none;
+
−
text-transform: uppercase;
+
−
font-size: 0.6em !important;
+
−
color: #2B3F48;
+
−
}
+
−
+
−
#menux li:hover a, #menu li.active a, #menu li.active span
+
−
{
+
−
color: #2B3F48;
+
−
}
+
−
+
−
#menux .current_page_item a
+
−
{
+
−
color: #27AE61;
+
−
}
+
−
+
−
#menux .icon
+
−
{
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Banner                                                                        */
+
−
/*********************************************************************************/
+
−
 
+
−
#banner
+
−
{
+
−
overflow: hidden;
+
−
background: #27AE61 url(images/banner.png) no-repeat center;
+
−
background-size: cover;
+
−
text-align: center;
+
−
color: rgba(255,255,255,.8);
+
−
}
+
−
 
+
−
#banner .title
+
−
{
+
−
}
+
−
 
+
−
#banner .title h2
+
−
{
+
−
color: #FFF;
+
−
}
+
−
 
+
−
#banner .title .byline
+
−
{
+
−
color: rgba(255,255,255,.6);
+
−
}
+
−
+
−
#banner .buttonx
+
−
{
+
−
margin-top: 3em;
+
−
background: #2B3F48 !important;
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Page                                                                          */
+
−
/*********************************************************************************/
+
−
 
+
−
#page
+
−
{
+
−
padding: 2em 0em;
+
−
text-align: center;
+
−
}
+
−
+
−
#page .buttonx
+
−
{
+
−
margin-top: 1.2em;
+
−
display: inline-block;
+
−
text-align: center;
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Content                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
#content
+
−
{
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Sidebar                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
#sidebar
+
−
{
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Footer                                                                        */
+
−
/*********************************************************************************/
+
−
 
+
−
#footer
+
−
{
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Copyright                                                                    */
+
−
/*********************************************************************************/
+
−
 
+
−
#copyright
+
−
{
+
−
overflow: hidden;
+
−
padding: 5em 0em;
+
−
border-top: 1px solid rgba(0,0,0,0.08);
+
−
}
+
−
+
−
#copyright p
+
−
{
+
−
letter-spacing: 0.20em;
+
−
text-align: center;
+
−
text-transform: uppercase;
+
−
font-size: 0.40em;
+
−
color: rgba(0,0,0,0.5);
+
−
}
+
−
+
−
#copyright a
+
−
{
+
−
text-decoration: none;
+
−
color: rgba(0,0,0,0.8);
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Featured                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
#featured
+
−
{
+
−
overflow: hidden;
+
−
padding: 1em 0em;
+
−
background: #27AE61;
+
−
text-align: center;
+
−
color: rgba(255,255,255,.8);
+
−
}
+
−
 
+
−
#featured a
+
−
{
+
−
color: rgba(255,255,255,1);
+
−
}
+
−
+
−
#featured .buttonx
+
−
 
+
−
{
+
−
background: #FFF;
+
−
margin-top: 1.2em;
+
−
font-size: 0.8em;
+
−
color: #27AE61;
+
−
}
+
−
 
+
−
#featured .title
+
−
{
+
−
}
+
−
 
+
−
#featured .title h2
+
−
{
+
−
color: #FFF;
+
−
}
+
−
 
+
−
#featured .title .byline
+
−
{
+
−
color: rgba(255,255,255,.6);
+
−
}
+
−
 
+
−
/*********************************************************************************/
+
−
/* Featured                                                                      */
+
−
/*********************************************************************************/
+
−
 
+
−
.box
+
−
{
+
−
padding: 2em 2em;
+
−
border: 1px solid rgba(0,0,0,0.1);
+
−
border-radius: 8px;
+
−
}
+
−
 
+
−
 
+
−
#extra
+
−
{
+
−
overflow: hidden;
+
−
padding: 5em 0em;
+
−
}
+
−
+
−
#extra .title
+
−
{
+
−
text-align: center;
+
−
}
+
−
+
−
#extra .buttonx
+
−
{
+
−
margin-top: 5em;
+
−
}
+
−
 
+
−
#page ul, #page ol, #page ol li ul li, #page li {font-size: 0.8em; }
+
−
#page li, #page li ul li {text-align: left;}
+
−
//DROPDOWN MENU
+
−
 
+
−
.dropdown {
+
−
    position: relative;
+
−
    display: inline-block;
+
−
}
+
−
 
+
−
/* Dropdown Content (Hidden by Default) */
+
−
.dropdown-content {
+
−
    display: none;
+
−
    position: absolute;
+
−
    background-color: #f9f9f9;
+
−
    min-width: 160px;
+
−
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
+
−
    z-index: 1;
+
−
}
+
−
 
+
−
/* Links inside the dropdown */
+
−
.dropdown-content a {
+
−
    color: black;
+
−
    padding: 12px 16px;
+
−
    text-decoration: none;
+
−
    display: block;
+
−
}
+
−
 
+
−
/* Change color of dropdown links on hover */
+
−
.dropdown-content a:hover {background-color: #f1f1f1}
+
−
 
+
−
/* Show the dropdown menu on hover */
+
−
.dropdown:hover .dropdown-content {
+
−
    display: block;
+
−
}
+
−
 
+
−
/* Change the background color of the dropdown button when the dropdown content is shown */
+
−
.dropdown:hover .dropbtn {
+
−
    background-color: #3e8e41;
+
−
}
+
−
 
+
−
.social {position: fixed; top: 22px; right: 0; width:32px; margin-right: 10px;}
+
−
</style>
+
−
 
+
−
<!--[if IE 6]><link href="default_ie6.css" rel="stylesheet" type="text/css" /><![endif]-->
+
−
 
+
−
</head>
+
−
<body>
+
  
−
<div class="social">
+
                        </div>
−
<a href="https://www.facebook.com/UNAMBG2017/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/d/df/Bilkent-facebook.png"></a>
+
−
<a href="https://twitter.com/BilkentUNAMBG?lang=tr" target="_blank"><img src="https://static.igem.org/mediawiki/2017/b/b7/Bilkent-twitter.png"></a>
+
−
<a href="mailto:unambgigem@gmail.com" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/89/Bilkent-mail.png"></a>
+
−
</div>
+
  
−
<div id="header" class="container">
+
                    </div>
−
<div id="logo">
+
−
<a href="#"><img src="https://static.igem.org/mediawiki/2017/4/49/UnambgLogo.png"></a>
+
−
</div>
+
−
<div id="menux">
+
−
<ul>
+
−
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG" title="">Home</a></li>
+
−
<li class="dropdown"><a href="#">Team</a><div class="dropdown-content">
+
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Team">Team Members</a>
+
−
    <a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Attributions">Attributions</a>
+
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Collaborations">Collaborations</a>
+
−
  </div></li>
+
−
<li class="dropdown"><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project">Project</a><div class="dropdown-content">
+
  
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#desc">Description</a>
+
                </div>
  
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#const">Constructs</a><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#notebooks">Notebooks</a>
+
</body>
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#modeling">Modeling</a>
+
</html>
−
<a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Project#protocols">Protocols</a><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/InterLab">InterLab</a>
+
−
  </div></li>
+
−
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Parts">Parts</a></li>
+
−
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Safety">Safety</a></li>
+
−
<li><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/Results">Results</a></li>
+
−
<li class="dropdown"><a href="#">Human Practices</a><div class="dropdown-content"><a href="https://2017.igem.org/Team:Bilkent-UNAMBG/HP/Silver">Human Practice</a>
+
−
    <a href="https://2017.igem.org/Team:Bilkent-UNAMBG/HP/Gold_Integrated">Integrated Human Practice</a>
+
−
  </div></li>
+
−
                     
+
−
</ul>
+
−
</div>
+
−
</div>
+

Revision as of 19:31, 17 October 2018

index

Our professionals

Nam pulvinar vitae neque et porttitor. Praesent sed nisi eleifend. Nam pulvinar vitae neque et porttitor. Praesent sed nisi eleifend.

team member

Hi There !

I love to introduce myself as a hardcore Web Designer.

team member

Hello World

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.

team member

I love to design

I love to introduce myself as a hardcore Web Designer.