Line 664: | Line 664: | ||
width: 0px; | width: 0px; | ||
height: 0; | height: 0; | ||
− | border-bottom: | + | border-bottom: 80px solid white; |
− | border-left: | + | border-left: 98px solid transparent; |
− | border-right: | + | border-right: 98px solid transparent; |
Revision as of 16:32, 12 October 2016
@font-face{font-family:'FontAwesome';
src:url('https://static.igem.org/mediawiki/2016/5/50/T--Aachen--fontawesome_webfonte0a5.eot?v=4.3.0'); src:url('https://static.igem.org/mediawiki/2016/b/b0/T--Aachen--fontawesome_webfontd41d.eot?#iefix&v=4.3.0') format('embedded-opentype'), url('https://static.igem.org/mediawiki/2016/b/b8/T--Aachen--fontawesome_webfonte0a53.woff') format('woff'), url('https://static.igem.org/mediawiki/2016/e/e5/T--Aachen--fontawesome_webfonte0a52.ttf?v=4.3.0') format('truetype'); font-weight:normal; font-style:normal
}
body{
font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ; height: auto; width: auto; background-image: url('https://static.igem.org/mediawiki/2016/9/93/T--Aachen--background.JPG'); font-size:14px; line-height:20px; color:#414141;
}
/*code to highlight current tab */
nav.main-navigation ul li a.current {
color: #005b04;
}
a {
color:#000; text-decoration:none
} a:hover {
text-decoration:none
}
input[type=text],input[type=password], textarea{ border:1px solid #ddd;padding:5px } input[type=submit] h1,h2,h3,h4,h5,h6 {
font-weight:normal; margin:0 0 15px; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ;
} h2 { font-size:25px;
line-height:30px
} img{
max-width:100%;height:auto
} p{
margin-bottom:20px;
font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ; } div.floatleft p {
/* font-style: italic; */
} div.floatleft p {
/* font-style: italic; */
} .alignleft{float:left;margin-left:0px} .aligncenter{display:block;margin:10px auto} .alignright{float:right;margin-left:10px}
.floatleft{float:left} .floatright{float:right}
.structure{
display:block; margin:0 auto; transition: all 1.3s ease 0s; -moz-transition: all 1.3s ease 0s; -webkit-transition: all 1.3s ease 0s; -o-transition: all 1.3s ease 0s ;-ms-transition: all 1.3s ease 0s; overflow: hidden;
} .fix {
overflow: visible;
}
/* Code for header */ .header_area{
margin-top: 107px; border-left: 10px solid transparent; border-right: 10px solid transparent;
} .header {
position: fixed; z-index:1000; padding: 10px 0px 0px 0px; margin: 0 auto; margin-top: 10px; top:0; left:0; right: 0; width: 100%; background-color: #FFFFFF; transition: all 1.3s ease 0s; -moz-transition: all 1.3s ease 0s; -webkit-transition: all 1.3s ease 0s; -o-transition: all 1.3s ease 0s; -ms-transition: all 1.3s ease 0s;
} .logo{} .logo span {
color:#005b04;
} .logo h1 {
font-size: 36px; margin: 30px 0; color:#005b04; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif;
} .mainmenu {
margin-top: 20px; margin-right: -15px;
} .mainmenu ul {
margin:0; padding:0; list-style:none
} .mainmenu ul li {
float:left
} .mainmenu ul li a {
display: block; padding: 10px 15px; text-transform: uppercase; color: #353535; font-size: 14px; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ; font-weight: bolder;
} .mainmenu ul li a:hover,.current-page-item,.active{color:#005b04 !important;}
.header_bottom_area
{
background: #005b04; min-height: 50px;
} .header_bottom_area_team {
background: #d1d1d1; min-height: 50px;
} .main_content_area {
margin-top: -50px;
} .content_area {
background: none repeat scroll 0 0 #FFFFFF;
}
/* Code end for header */ /* code for footer */ .footer_area {
background: none repeat scroll 0 0 #d1d1d1; margin-top: 40px; overflow: hidden; max-height: 90px;
} .footer{
background: none repeat scroll 0 0 #005b04; border-left: 10px solid transparent; border-right: 10px solid transparent; margin: 0 auto; transition: all 1.3s ease 0s;-moz-transition: all 1.3s ease 0s;-webkit-transition: all 1.3s ease 0s;-o-transition: all 1.3s ease 0s;-ms-transition: all 1.3s ease 0s;
} .single_footer_container{
margin-left: -25px; overflow: hidden; }
.single_footer{
color: #FFFFFF; margin-left: 25px; overflow: hidden; padding: 2px;
}
.single_footer a{
color: #7fb983; font-size: 16px; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ;
} .single_footer h2{
font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ;
}
/* code ends for footer */
/* Team page to display the green bar */
.single_header_title {
background: none repeat scroll 0 0 #005b04; min-height: 50px; max-height: 50px; margin-bottom: 30px; display: flex; align-items: center;
} .single_header_title h1 {
color: #FFFFFF; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ; font-size: 24px; line-height: 45px; padding-left: 10px;
} a.anchor {
color: white; text-decoration: none; display: block; padding-top:-20px;
} /* Team page codes end to display the green bar */ .selectnav{}
/* Code for the page scroll bar */ .site-header {
position: fixed; width: 100%; top: 0; left: 0; z-index: 9999; border-bottom: 1px solid rgba(255, 255, 255, 0.5); padding: 10px 0; -webkit-transition: all 000ms; -moz-transition: all 00ms; -o-transition: all 000ms; transition: all 00ms;
} @media (max-width: 991px) {
.site-header { position: relative; }
}
.scrolled-header {
background: #FFFFFF; padding: 0; border-color: #FFFFFF;
} .scrolled-header .main-navigation ul > li > a {
color: #FFFFFF;
} .go-top {
width: 46px!important; height: 46px!important; line-height: 46px!important; font-size: 14px!important;
} .go-top {
display: inline-block; height: 40px; width: 40px; line-height: 40px; position: fixed; bottom: 60px; right: 10px; z-index: 77; font-size: 18px; text-align: center;
color: #fff !important; overflow: hidden; visibility: hidden; opacity: 0;
}
.go-top.go-top-visible {
/* the button becomes visible */ visibility: visible; opacity: 1;
} .go-top.go-top-fade-out {
opacity: 1;
} @media (max-width: 991px) {
.go-top { right: 20px; bottom: 20px; }
} @media (min-width: 992px) {
.go-top { height: 60px; width: 60px; line-height: 60px; right: 30px; bottom: 60px; }
}
@media (max-width: 767px) {
.hidden-xs { display: none !important; }
} @media (min-width: 768px) and (max-width: 991px) {
.hidden-sm { display: none !important; }
}
/* Code end for the page scroll bar */
/* Code for the drop down meanu */ nav.main-navigation {
position: relative; z-index: 9999; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ;
} nav.main-navigation ul {
margin: 0; padding: 0; list-style: none;
} nav.main-navigation ul li {
position: relative; display: inline-block; padding: 10px;
} nav.main-navigation ul li ul.sub-menu {
position: absolute; top: 82%; left: 0; width: 195px; background: #fff; padding: 15px 0; -moz-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); visibility: hidden; opacity: 0; -moz-transform: translate3d(0, 20px, 0); -o-transform: translate3d(0, 20px, 0); -ms-transform: translate3d(0, 20px, 0); -webkit-transform: translate3d(0, 20px, 0); transform: translate3d(0, 20px, 0); -moz-transition: all 0.3s; -webkit-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s;
} nav.main-navigation ul li ul.sub-menu li {
display: block; padding: 0; margin: 0;
} nav.main-navigation ul li ul.sub-menu li a {
text-transform: capitalize; color: #7fb983; font-size: 13px; padding: 5px 30px;
} nav.main-navigation ul li:hover ul.sub-menu {
visibility: visible; opacity: 1; -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);
}
nav.main-navigation ul a {
font-size: 13px; letter-spacing: 1px; text-transform: uppercase; color: #7fb983; display: block; padding: 15px 10px;
} nav.main-navigation ul a i {
margin-left: 7px;
} @media (min-width: 992px) and (max-width: 1200px) {
nav.main-navigation ul a { padding: 10px 0; }
} nav.responsive-menu ul {
padding: 25px 15px; margin: 0; list-style: none;
} nav.responsive-menu ul li {
display: block; position: relative; z-index: 9999;
} nav.responsive-menu ul li .show-submenu {
position: absolute; top: 5px; right: 15px; cursor: pointer; color: #a8a8a8;
} nav.responsive-menu ul li .sub-menu {
display: none; padding: 0 0 0 30px;
} nav.responsive-menu ul li .sub-menu.open {
display: block;
} nav.responsive-menu ul li .sub-menu li {
position: relative; margin: 0; padding: 0 0 0 10px;
} nav.responsive-menu ul li .sub-menu li:before {
content: '-'; position: absolute; left: 0; top: 2px;
} nav.responsive-menu ul li .sub-menu a {
padding: 2px; text-transform: capitalize;
} nav.responsive-menu a {
font-size: 13px; text-transform: uppercase; display: block; padding: 5px 10px; margin: 0; color: #757575; z-index: 9999;
} /* Code end for the page drop down */
/* Code to change the background of header on scroll */ .activeColour {
background-color: #FFFFFF}
/* Code end for the background of header on scroll */ /* Code for the grey image */ img.grayscale{
filter: gray; /* IE6-9 */ filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */ -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */ -webkit-transition: all 0.0s ease-in-out; -moz-transition: all 0.0s ease-in-out; -o-transition: all 0.0s ease-in-out; -ms-transition: all 0.0s ease-in-out; transition: all 0.0s ease-in-out;
}
a.activeimage img.grayscale {
filter: none; -webkit-filter: grayscale(0%); -webkit-transform: scale(1.07); -moz-transform: scale(1.071); -o-transform: scale(1.07); transform: scale(1.07);
}
/* Disable grayscale on hover */ img.grayscaleSupporters{
filter: gray; /* IE6-9 */ filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */ -webkit-filter: grayscale(100%); /* Google Chrome, Safari 6+ & Opera 15+ */ -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;
} img.grayscaleSupporters:hover {
filter: gray; filter: none; -webkit-filter: grayscale(0); -webkit-transform: scale(1.1); -moz-transform: scale(1.1); -o-transform: scale(1.1); transform: scale(1.1);
}
/* Code end for the grey image */
/* Code for the green image team icon */ img.grayscaleTeam{
filter: gray; /* IE6-9 */ filter: grayscale(1); /* Microsoft Edge and Firefox 35+ */ -webkit-filter: grayscale(1); /* Google Chrome, Safari 6+ & Opera 15+ */
}
/* Disable grayscale on hover */ img.grayscaleTeam:hover {
filter: none; -webkit-filter: grayscale(0);
}
/* Code end for the green image team icon */
/* Code for the fon awesome */
.fa{
display:inline-block; font:normal normal normal 14px/1 FontAwesome; font-size:inherit;text-rendering:auto; -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale; transform:translate(0, 0)
}
.fa-angle-up:before {content:"\f106"} .fa-angle-down:before{content:"\f107"} .pull-right{float:right} .fa-chevron-up:before{content:"\f077"} .fa-chevron-circle-up:before{content:"\f139";
color: #7fb983;
} .fa-chevron-circle-down:before{content:"\f13a"} .fa-3x{
font-size: 30px;
}
.fa-facebook-square:before{
content: "\f082 "; color: #7fb983;
} .fa-twitter-square:before{
content: "\f081 "; color: #7fb983;
} .fa-instagram:before{
content: "\f16d"; color: #7fb983;
}
.fa-youtube-square:before{
content: "\f166"; color: #7fb983;
} .fa-arrow-right:before{
content: "\f061";
}
.img-circle {
height: 195px; width: 185px; border-radius: 50%; z-index:0; position: absolute;
}
ol li{color:#7fb983;} ol li span{color:#000;}
/* Code end for the font awesome */
/* for Team Page*/ /* .portfolio-area{min-height:500px !important;}*/
.portfolio-area li{
float: left; margin: 0 3px 20px 0; overflow: hidden; padding: 5px; display:inline-block;
}
.home-portfolio-text a{
color: #000000; display: block; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ; font-size: 18px;
}
.home-portfolio-text p{
font-size: 15px; color: #65a42d; font-family: Calibri,Candara,Segoe,Segoe UI,Optima,Arial,sans-serif ;
}
.portfolio-categ{
margin-bottom:-10px; display: flex; list-style:none; overflow:hidden; margin-left: 40px; margin-right: 40px;
}
.portfolio-categ li img{
margin: -4px; margin: 0; height: 60px;
}
/*code for class table*/
tr { border:2pt solid black; }
/*shapes*/ .flag {
width: 200px; height: 250px; position: relative; background: #d1d1d1; color: Black; font-size: 16px; text-align: center;
} .flag:after {
content: close-quote; position: absolute; left: 0px; bottom: 0px; width: 0px; height: 0; border-bottom: 80px solid white; border-left: 98px solid transparent; border-right: 98px solid transparent;
}
.flag1 {
width: auto; height: 300px; position: relative; background: #d1d1d1; color: Black; font-size: 16px; text-align: center;
} .flag1:after {
content: close-quote; position: absolute; left: -2px; bottom: 0px; width: 0px; height: 0; border-bottom: 86px solid white; border-left: 128px solid transparent; border-right: 128px solid transparent;
}
.shape {
width: 150px; height: 200px; background: #7fb5dd; justify-content: center; align-items: center; -webkit-clip-path: polygon(50% 20%, 100% 14%, 100% 0, 0 0, 0 14%); clip-path: polygon(50% 20%, 100% 14%, 100% 0, 0 0, 0 14%);
}
.shapeLab {
width: 200px; height: 200px; background: #7fb5dd; justify-content: center; align-items: center; -webkit-clip-path: polygon(50% 100%, 100% 73%, 100% 0, 0 0, 0 72%);
clip-path: polygon(50% 100%, 100% 73%, 100% 0, 0 0, 0 72%); }