|
|
Line 1: |
Line 1: |
- | {{Team:Sheffield}}
| + | <!DOCTYPE HTML> |
| <html> | | <html> |
| <head> | | <head> |
Line 15: |
Line 15: |
| | | |
| | | |
- | /*
| |
- | Author: W3layout
| |
- | Author URL: http://w3layouts.com
| |
- | License: Creative Commons Attribution 3.0 Unported
| |
- | License URL: http://creativecommons.org/licenses/by/3.0/
| |
- | */
| |
| /* reset */ | | /* 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;} | | 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;} |
Line 92: |
Line 86: |
| margin:20px 0; | | margin:20px 0; |
| } | | } |
- | /** Social Icons **/
| + | |
- | .social-icons li:first-child {
| + | |
- | border-left: 1px solid rgba(190, 190, 190, 0.25);
| + | |
- | }
| + | |
- | .social-icons ul li:first-child, ol li:first-child {
| + | |
- | margin-top: 0px;
| + | |
- | margin-left: 0px;
| + | |
- | }
| + | |
- | .social-icons li {
| + | |
- | display:inline-block;
| + | |
- | width: 40px;
| + | |
- | height: 40px;
| + | |
- | border-right: 1px solid rgba(190, 190, 190, 0.25);
| + | |
- | background: none;
| + | |
- | padding: 0px;
| + | |
- | margin-left:10px;
| + | |
- | }
| + | |
- | .social-icons a.facebook:hover {
| + | |
- | background-position: 0px top;
| + | |
- | }
| + | |
- | .social-icons a.facebook {
| + | |
- | background-position: 0px bottom;
| + | |
- | }
| + | |
- | .social-icons li a {
| + | |
- | height: 40px;
| + | |
- | width: 40px;
| + | |
- | display: block;
| + | |
- | text-indent: -9999px;
| + | |
- | background: url(../images/social_icons.png);
| + | |
- | transition:all 0.5s ease;
| + | |
- | -o-transition:all 0.5s ease;
| + | |
- | -moz-transition:all 0.5s ease;
| + | |
- | -webkit-transition:all 0.5s ease;
| + | |
- | background-color:#FFF
| + | |
- | }
| + | |
- | .social-icons a.twitter {
| + | |
- | background-position: -40px bottom;
| + | |
- | }
| + | |
- | .social-icons a.twitter:hover {
| + | |
- | background-position: -40px top;
| + | |
- | }
| + | |
- | .social-icons a.googleplus {
| + | |
- | background-position: -440px bottom;
| + | |
- | }
| + | |
- | .social-icons a.googleplus:hover {
| + | |
- | background-position: -440px top;
| + | |
- | }
| + | |
- | .social-icons a.pinterest {
| + | |
- | background-position: -480px bottom;
| + | |
- | }
| + | |
- | .social-icons a.pinterest:hover {
| + | |
- | background-position: -480px top ;
| + | |
- | }
| + | |
- | .social-icons a.dribbble {
| + | |
- | background-position: -160px bottom;
| + | |
- | }
| + | |
- | .social-icons a.dribbble:hover {
| + | |
- | background-position: -160px top;
| + | |
- | }
| + | |
- | .social-iconst a.dribbble:hover {
| + | |
- | background-position: -160px top;
| + | |
- | }
| + | |
- | .social-icons a.vimeo {
| + | |
- | background-position: -120px bottom;
| + | |
- | }
| + | |
- | .social-icons a.vimeo:hover {
| + | |
- | background-position: -120px top;
| + | |
- | }
| + | |
- | /*-------------
| + | |
- | SEARCH
| + | |
- | -------------*/
| + | |
- | .search_box{
| + | |
- | margin-top:15px;
| + | |
- | position:relative;
| + | |
- | outline:none;
| + | |
- | background: -webkit-linear-gradient(#eee, #fff);
| + | |
- | background: -moz-linear-gradient(#eee, #fff);
| + | |
- | background: -o-linear-gradient(#eee, #fff);
| + | |
- | background: -ms-linear-gradient(#eee, #fff);
| + | |
- | background: linear-gradient(#eee, #fff);
| + | |
- | -webkit-transition: all 0.3s ease-out;
| + | |
- | -moz-transition: all 0.3s ease-out;
| + | |
- | -o-transition: all 0.3s ease-out;
| + | |
- | -ms-transition: all 0.3s ease-out;
| + | |
- | transition: all 0.3s ease-out;
| + | |
- | }
| + | |
- | .text-box{
| + | |
- | width:85%;
| + | |
- | padding:8px 10px;
| + | |
- | font-size:0.9em;
| + | |
- | color: #555;
| + | |
- | background:none;
| + | |
- | border:none;
| + | |
- | outline: none;
| + | |
- | }
| + | |
- | .search_box input[type="submit"]{
| + | |
- | border:none;
| + | |
- | cursor:pointer;
| + | |
- | background: url(../images/search.png) no-repeat 0px 9px;
| + | |
- | position: absolute;
| + | |
- | width: 25px;
| + | |
- | right:0px;
| + | |
- | height: 30px;
| + | |
- | }
| + | |
- | /**** End Search Box ****************/
| + | |
| .logo{ | | .logo{ |
| float:left; | | float:left; |
Line 407: |
Line 297: |
| 33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; } | | 33% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ccc, -15px 30px 1px #ddd; } |
| 66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; } | | 66% { background: #ccc; box-shadow: 0 0 1px #ccc, 15px 30px 1px #ddd, -15px 30px 1px #ccc; } |
- | }
| |
- | /***** Details Page *****/
| |
- | /**** Details Page *****/
| |
- | .content h3{
| |
- | padding:10px 0;
| |
- | }
| |
- | .content h3 a{
| |
- | font-size:2.5em;
| |
- | color:#616161;
| |
- | padding-bottom:10px;
| |
- | font-family: 'bebas_neueregular';
| |
- | }
| |
- | .box1 h3 a:hover{
| |
- | text-decoration:underline;
| |
- | color:#444;
| |
- | }
| |
- | .box1{
| |
- | padding:15px 0;
| |
- | }
| |
- | .blog-img img{
| |
- | padding:5px;
| |
- | background:#FFF;
| |
- | border:1px solid #DDD;
| |
- | margin:20px 0;
| |
- | }
| |
- | .blog-data{
| |
- | width:100%;
| |
- | }
| |
- | .blog-data span a{
| |
- | color:#EB7F1A;
| |
- | font-size:1em;
| |
- | }
| |
- | .blog-data span a:hover{
| |
- | text-decoration:underline;
| |
- | }
| |
- | .blog-data p{
| |
- | font-size:0.8em;
| |
- | line-height:2em;
| |
- | color:#6D6B6B;
| |
- | font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
| |
- | }
| |
- | /*----artical-links---*/
| |
- | .artical-links{
| |
- | padding: 10px 0px;
| |
- | border: 1px solid rgba(192, 192, 192, 0.22);
| |
- | border-left: none;
| |
- | margin-top: 5px;
| |
- | border-right: none;
| |
- | }
| |
- | .artical-links ul li{
| |
- | display:inline-block;
| |
- | }
| |
- | .artical-links ul li:last-child{
| |
- | float:right;
| |
- | }
| |
- | .artical-links ul li img{
| |
- | vertical-align:middle;
| |
- | padding-right:10px;
| |
- | }
| |
- | .artical-links ul li a{
| |
- | font: 400 14px/22px Arial;
| |
- | color: #ADADAB;
| |
- | padding-left: 20px;
| |
- | }
| |
- | .artical-links ul li a:hover{
| |
- | color:#797D7E;
| |
- | }
| |
- | /****** Comment Area ******/
| |
- | .comments-area h3{
| |
- | color: rgb(80, 80, 80);
| |
- | font-size: 1.5em;
| |
- | font-family: 'bebas_neueregular';
| |
- | text-transform: uppercase;
| |
- | padding: 0px 0px 7px 0px;
| |
- | margin-bottom: 15px;
| |
- | border-bottom: 5px solid #D5D5D5;
| |
- | box-shadow: 0px 6px 8px rgba(0, 0, 0, 0.05);
| |
- | }
| |
- | .comments-area h3 img{
| |
- | vertical-align:middle;
| |
- | padding-right:5px;
| |
- | }
| |
- | .comments-area{
| |
- | margin-top:20px;
| |
- | color: #666;
| |
- | }
| |
- | .comments-area p{
| |
- | position: relative;
| |
- | padding: 8px 0;
| |
- | }
| |
- | .comments-area label{
| |
- | display: block;
| |
- | font-family: 'bebas_neueregular';
| |
- | font-size:1.1em;
| |
- | padding-bottom: 5px;
| |
- | }
| |
- | .comments-area span{
| |
- | color: #F05F3D;
| |
- | position: absolute;
| |
- | left: 4px;
| |
- | top: 33px;
| |
- | font-size: 1.4em;
| |
- | }
| |
- | .comments-area input[type="text"],.comments-area textarea{
| |
- | padding: 10px 15px;
| |
- | width: 30%;
| |
- | color: #444;
| |
- | font-size:1.2em;
| |
- | border: none;
| |
- | font-family: Arial, Helvetica, sans-serif;
| |
- | font-size: 0.8em;
| |
- | background:#FFF;
| |
- | box-shadow: inset 0px 0px 3px #535353;
| |
- | -webkit-box-shadow: inset 0px 0px 3px #535353;
| |
- | -moz-box-shadow: inset 0px 0px 3px #535353;
| |
- | -o-box-shadow: inset 0px 0px 3px #535353;
| |
- | -webkit-appearance:none;
| |
- | outline: none;
| |
- | display: block;
| |
- |
| |
- | }
| |
- | .comments-area input[type="submit"]{
| |
- | outline-style:none;
| |
- | outline-width:medium;
| |
- | font-size:1em;
| |
- | text-transform:uppercase;
| |
- | font-weight:bold;
| |
- | padding:8px 25px;
| |
- | -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e8543f), color-stop(100%, #d9331a));
| |
- | background: -webkit-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: -moz-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: -o-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: linear-gradient(top, #e8543f, #d9331a);
| |
- | background-color: #e54028;
| |
- | color: white;
| |
- | text-shadow:0px 1px 0px rgba(255, 255, 255, 0.16);
| |
- | border:none;
| |
- | cursor:pointer;
| |
- | }
| |
- | .comments-area [type="submit"]:hover{
| |
- | background-color: #e54028;
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eb6855), color-stop(100%, #d9331a));
| |
- | background: -webkit-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: -moz-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: -o-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: linear-gradient(top, #eb6855, #d9331a);
| |
- | }
| |
- | .comments-area [type="submit"]:active{
| |
- | color: #952312;
| |
- | background: #cd5240;
| |
- | }
| |
- | .comments-area textarea{
| |
- | width: 50%;
| |
- | height: 100px;
| |
- | }
| |
- | /*---comment box--*/
| |
- | .comment{
| |
- | position:relative;
| |
- | margin:25px 0;
| |
- | }
| |
- | .comment h2{
| |
- | margin:0;
| |
- | border:1px solid #C4C4C4;
| |
- | padding:10px 15px;
| |
- | }
| |
- | .comment h2 a,
| |
- | .comment h2{
| |
- | font-weight:normal;
| |
- | font-size:12px;
| |
- | color:rgb(155, 155, 155);
| |
- | margin:0 0 10px 0;
| |
- | }
| |
- | .comment box{
| |
- | float:left;
| |
- | }
| |
- | .comment box div{
| |
- | padding:5px;
| |
- | border:none;
| |
- | }
| |
- | .comment h2{
| |
- | -moz-border-radius:.4em;
| |
- | -webkit-border-radius:.4em;
| |
- | border-radius:.4em;
| |
- | font-size: 1.3em;
| |
- | padding: 7px;
| |
- | font-family: 'bebas_neueregular';
| |
- | }
| |
- | .comment h2 span{
| |
- | color:#F05F3D;
| |
- | }
| |
- | .comment ul.list{
| |
- | margin:0;
| |
- | padding:0;
| |
- | list-style:none;
| |
- | }
| |
- | .comment .list li{
| |
- | display:block;
| |
- | padding:10px 0;
| |
- | margin:0 0 18px 0;
| |
- | -moz-border-radius:.5em;
| |
- | -webkit-border-radius:.5em;
| |
- | border-radius:.5em;
| |
- | }
| |
- | .comment .preview,
| |
- | .comment .data{
| |
- | float:left;
| |
- | }
| |
- | .comment .preview{
| |
- | width:85px;
| |
- | padding:0 10px;
| |
- | margin-right:15px;
| |
- | }
| |
- | .comment .preview img{
| |
- | background: #fff;
| |
- | }
| |
- | .comment .preview img,
| |
- | .comment .preview a{
| |
- | display:block;
| |
- | padding: 3px;
| |
- | }
| |
- | .comment .data{
| |
- | width:92%;
| |
- | padding:10px;
| |
- | border: 1px solid #DDD;
| |
- | background:#FFF;
| |
- | position:relative;
| |
- | }
| |
- | .data span.comment-arrow{
| |
- | background:url(../images/comment-arrow.png) no-repeat;
| |
- | height:32px;
| |
- | width:20px;
| |
- | position:absolute;
| |
- | top:12px;
| |
- | left:-18px;
| |
- | }
| |
- | .comment .data .title{
| |
- | color:#666;
| |
- | font-size:16px;
| |
- | margin:0 0 5px 0;
| |
- | font-family: 'bebas_neueregular';
| |
- | }
| |
- | .comment .data a{
| |
- | color:#F05F3D;
| |
- | }
| |
- | .comment .data .title a{
| |
- | font-size:1em;
| |
- | font-family: 'bebas_neueregular';
| |
- | }
| |
- | .comment .data p{
| |
- | margin:0;
| |
- | padding:0;
| |
- | font-size:0.8123em;
| |
- | line-height:1.8em;
| |
- | color:#6D6B6B;
| |
- | font-family:Verdana, Geneva, Arial, Helvetica, sans-serif;
| |
- | }
| |
- | .leave-reply{
| |
- | margin: 10px 0;
| |
- | }
| |
- | .leave-comment a{
| |
- | font-size: 1.1em;
| |
- | }
| |
- | .leave-reply{
| |
- | color: #F05F3D;
| |
- | margin: 10px 0;
| |
- | font-size: 1em;
| |
- | -webkit-border-radius:.3em;
| |
- | -moz-border-radius:.3em;
| |
- | border-radius:.3em;
| |
- | padding: 7px;
| |
- | background: #ddd;
| |
- | }
| |
- | /*--respond---*/
| |
- | #respond{
| |
- | color: #666;
| |
- | position: relative;
| |
- | }
| |
- | #reply-title{
| |
- | color: #777;
| |
- | font-size: 1em;
| |
- | font-family: 'bebas_neueregular';
| |
- | }
| |
- | a#cancel-comment-reply-link{
| |
- | color:#F05F3D;
| |
- | padding-left:5px;
| |
- | }
| |
- | .comment-notes{
| |
- | color:rgb(155, 155, 155);
| |
- | }
| |
- | #commentform p{
| |
- | position: relative;
| |
- | padding: 8px 0;
| |
- | font-family: Arial, Helvetica, sans-serif;
| |
- | font-size:1em;
| |
- | }
| |
- | #commentform label{
| |
- | display: block;
| |
- | font-family: 'bebas_neueregular';
| |
- | padding-bottom: 5px;
| |
- | font-size:1.1em;
| |
- | }
| |
- | #commentform span{
| |
- | color:#F05F3D;
| |
- | position: absolute;
| |
- | font-size:1.5em;
| |
- | }
| |
- | #commentform input[type="text"]{
| |
- | padding: 10px 15px;
| |
- | width:30%;
| |
- | color: #555;
| |
- | border: none;
| |
- | font-family: Arial, Helvetica, sans-serif;
| |
- | font-size:0.8em;
| |
- | color: rgb(155, 155, 155);
| |
- | box-shadow: 0.2px 0.2px 1px #3C3C3C;
| |
- | outline: none;
| |
- | display: block;
| |
- | }
| |
- | #commentform input[type="submit"]{
| |
- | color:#F05F3D;
| |
- | background: #fff;
| |
- | padding:8px 12px;
| |
- | -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | background-color: #eeeeee;
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fbfbfb), color-stop(100%, #e1e1e1));
| |
- | background: -webkit-linear-gradient(top, #fbfbfb, #e1e1e1);
| |
- | background: -moz-linear-gradient(top, #fbfbfb, #e1e1e1);
| |
- | background: -o-linear-gradient(top, #fbfbfb, #e1e1e1);
| |
- | background: linear-gradient(top, #fbfbfb, #e1e1e1);
| |
- | display: -moz-inline-stack;
| |
- | color: #666666;
| |
- | text-shadow: 0 1px 1px white;
| |
- | border: 1px solid #C9C7C7;
| |
- | font-size:0.9em;
| |
- | text-transform:uppercase;
| |
- | font-weight:bold;
| |
- | }
| |
- | #commentform [type="submit"]:hover{
| |
- | background-color: #eeeeee;
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(100%, #dcdcdc));
| |
- | background: -webkit-linear-gradient(top, #ffffff, #dcdcdc);
| |
- | background: -moz-linear-gradient(top, #ffffff, #dcdcdc);
| |
- | background: -o-linear-gradient(top, #ffffff, #dcdcdc);
| |
- | background: linear-gradient(top, #ffffff, #dcdcdc);
| |
- | }
| |
- | #commentform [type="submit"]:active{
| |
- | -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3), 0px 1px 0px white;
| |
- | -moz-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3), 0px 1px 0px white;
| |
- | box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.3), 0px 1px 0px white;
| |
- | text-shadow: 0px 1px 0px rgba(255, 255, 255, 0.4);
| |
- | background: #eeeeee;
| |
- | color: #bbbbbb;
| |
- | }
| |
- | #commentform textarea{
| |
- | padding: 10px 15px;
| |
- | width:50%;
| |
- | color: #555;
| |
- | font-size: 16px;
| |
- | outline: none;
| |
- | height: 100px;
| |
- | display: block;
| |
- | border: none;
| |
- | font-family: Arial, Helvetica, sans-serif;
| |
- | color: rgb(155, 155, 155);
| |
- | box-shadow: 0.2px 0.2px 1px #3C3C3C;
| |
- | font-size:1em;
| |
- | }
| |
- | /**** End Comment Area ****/
| |
- | /**** Inner Contact styling ***/
| |
- | #contactable #contactable_inner {
| |
- | background-image:url(../images/contact.png);
| |
- | color:#FFFFFF;
| |
- | background-color:#333333;
| |
- | cursor:pointer;
| |
- | height:102px;
| |
- | left:0;
| |
- | margin-left:-5px;
| |
- | *margin-left:-5px;
| |
- | overflow:hidden;
| |
- | position:fixed;
| |
- | *position:absolute;
| |
- | text-indent:-100000px;
| |
- | top:102px;
| |
- | *margin-top:10px;
| |
- | width:44px;
| |
- | z-index:100000;
| |
| } | | } |
| | | |
- | #contactable #contactForm {
| |
- | background-color:#333;
| |
- | border:2px solid #FFFFFF;
| |
- | color:#FFFFFF;
| |
- | left:0;
| |
- | margin-left:-400px;
| |
- | *margin-left:-434px;
| |
- | margin-top:-160px;
| |
- | overflow:hidden;
| |
- | padding-left:30px;
| |
- | position:fixed;
| |
- | top:200px;
| |
- | width:394px;
| |
- | *width:394px;
| |
- | z-index:99;
| |
- | }
| |
- |
| |
- | #contactable form#contactForm input, textarea {
| |
- | background:#FFFFFF none repeat scroll 0 0;
| |
- | outline-style:none;
| |
- | outline-width:medium;
| |
- | width:325px;
| |
- | padding:5px;
| |
- | border:1px solid #dfdfdf;
| |
- | font-family:Arial, Helvetica, sans-serif;
| |
- | font-size:1em;
| |
- | margin-bottom:10px;
| |
- | }
| |
- |
| |
- | #contactable form#contactForm .submit {
| |
- | outline-style:none;
| |
- | outline-width:medium;
| |
- | width:325px;
| |
- | font-size:1em;
| |
- | font-weight:bold;
| |
- | padding:8px;
| |
- | -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | -moz-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.5), 0px 1px 2px rgba(0, 0, 0, 0.15);
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #e8543f), color-stop(100%, #d9331a));
| |
- | background: -webkit-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: -moz-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: -o-linear-gradient(top, #e8543f, #d9331a);
| |
- | background: linear-gradient(top, #e8543f, #d9331a);
| |
- | background-color: #e54028;
| |
- | border-color: #c22d18;
| |
- | color: white;
| |
- | text-shadow:0px 1px 0px rgba(255, 255, 255, 0.16)
| |
- | border:none;
| |
- | border-radius:10px;
| |
- | -moz-border-radius:10px;
| |
- | -webkit-border-radius:10px;
| |
- | -o-border-radius:10px;
| |
- | cursor:pointer;
| |
- | }
| |
- | #contactable form#contactForm .submit:hover{
| |
- | color: #952312;
| |
- | background: #cd5240;
| |
- | background-color: #e54028;
| |
- | background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eb6855), color-stop(100%, #d9331a));
| |
- | background: -webkit-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: -moz-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: -o-linear-gradient(top, #eb6855, #d9331a);
| |
- | background: linear-gradient(top, #eb6855, #d9331a);
| |
- | }
| |
- | #contactable form#contactForm .submit:active{
| |
- | color: #952312;
| |
- | }
| |
- | #contactable form#contactForm p {
| |
- | width:325px;
| |
- | font-size:0.9em;
| |
- | padding-bottom:10px;
| |
- | }
| |
- |
| |
- | #contactable form#contactForm .disclaimer {
| |
- | *margin-left:20px;
| |
- | }
| |
- |
| |
- | #contactable #contactForm .red {
| |
- | color: #F5410F;
| |
- | }
| |
- |
| |
- | #contactable #overlay {
| |
- | background-color:#666666;
| |
- | display:none;
| |
- | height:100%;
| |
- | left:0;
| |
- | margin:0;
| |
- | padding:0;
| |
- | position:absolute;
| |
- | top:0;
| |
- | width:100%;
| |
- | z-index:0;
| |
- | }
| |
- | #contactable .error { background-color: #EDBE9C; }
| |
- |
| |
- | #contactable #name.error { background-color: #EDBE9C; }
| |
- | #contactable #email.error { background-color: #EDBE9C; }
| |
- | #contactable #comment.error { background-color: #EDBE9C; }
| |
- |
| |
- | #contactable form#contactForm label{
| |
- | *margin-left:20px;
| |
- | margin-bottom:-10px;
| |
- | display:block;
| |
- | font-family: 'bebas_neueregular';
| |
- | font-size:1.2em;
| |
- | letter-spacing:1px;
| |
- | }
| |
- |
| |
- | #contactable form#contactForm #loading {
| |
- | background: url(images/ajax-loader.gif) no-repeat;
| |
- | width:55px;
| |
- | height:55px;
| |
- | margin: 100px auto;
| |
- | display:none;
| |
- | }
| |
- |
| |
- | #contactable #callback {
| |
- | font-family: georgia;
| |
- | font-size:1.1em;
| |
- | color: #FFF;
| |
- | width:325px;
| |
- | margin: 100px auto;
| |
- | display:none;
| |
- | }
| |
- | #contactable .holder {
| |
- | margin:0 auto;
| |
- | *margin-left:20px;
| |
- | padding-top:20px;
| |
- | }
| |
- | .copy_right{
| |
- | padding:15px 0;
| |
- | text-align:center;
| |
- | margin-top:35px;
| |
- | border-top:2px ridge #FFF;
| |
- | }
| |
- | .copy_right p{
| |
- | font-size:0.8123em;
| |
- | color: #6D6B6B;
| |
- | line-height:1.8em;
| |
- | }
| |
- | .copy_right p a{
| |
- | color: #6D6B6B;
| |
- | font-size:1em;
| |
- | text-decoration:underline;
| |
- | }
| |
- | .copy_right p a:hover{
| |
- | color:#F05F3D;
| |
- | text-decoration:none;
| |
- | }
| |
- |
| |
- | /**************** Media Quries ************************/
| |
- |
| |
- | @media all and (max-width:1024px){
| |
- | .wrap{
| |
- | width:90%;
| |
- | }
| |
- | .og-details h3 {
| |
- | font-size:4em;
| |
- | padding:0 0 10px;
| |
- | margin-bottom:0;
| |
- | }
| |
- | .comment .preview {
| |
- | margin-right:13px;
| |
- | }
| |
- | .comment .data {
| |
- | width: 89%;
| |
- | }
| |
- | }
| |
- | @media all and (max-width:800px){
| |
- | .wrap{
| |
- | width:95%;
| |
- | }
| |
- | .og-details a {
| |
- | margin:0;
| |
- | }
| |
- | .og-details h3 {
| |
- | font-size:3em;
| |
- | }
| |
- | .comments-area input[type="text"], .comments-area textarea {
| |
- | width:50%;
| |
- | }
| |
- | .comments-area textarea {
| |
- | width: 65%;
| |
- | }
| |
- | .comment .preview {
| |
- | margin-right:10px;
| |
- | }
| |
- | .comment .data {
| |
- | width: 87%;
| |
- | }
| |
- | .comment .data p {
| |
- | font-family:Arial, Helvetica, sans-serif;
| |
- | }
| |
- | #commentform input[type="text"] {
| |
- | width:50%;
| |
- | }
| |
- | #commentform textarea {
| |
- | width:65%;
| |
- | }
| |
- | #commentform p {
| |
- | font-size:0.8123em;
| |
- | line-height:1.8em;
| |
- | }
| |
- | }
| |
- | @media all and (max-width:640px){
| |
- | .wrap{
| |
- | width:95%;
| |
- | }
| |
- | .social-icons li {
| |
- | margin-left:0;
| |
- | }
| |
- | .logo h1 {
| |
- | font-size: 3.5em;
| |
- | padding:28px 0;
| |
- | }
| |
- | .comments-area input[type="text"], .comments-area textarea {
| |
- | width:95%;
| |
- | }
| |
- | #commentform input[type="text"] {
| |
- | width: 95%;
| |
- | }
| |
- | #commentform textarea {
| |
- | width: 95%;
| |
- | }
| |
- | .comment .preview {
| |
- | margin-right:8px;
| |
- | }
| |
- | .comment .data {
| |
- | width:84%;
| |
- | }
| |
- | .og-grid li{
| |
- | margin:10px 2px 0 2px;
| |
- | }
| |
- | .og-expander-inner {
| |
- | padding: 20px 30px;
| |
- | }
| |
- | .og-fullimg{
| |
- | display:none;
| |
- | }
| |
- | .og-details {
| |
- | width: 100%;
| |
- | float: none;
| |
- | padding-top: 25px;
| |
- | }
| |
- | .og-close {
| |
- | right:10px;
| |
- | }
| |
- | .og-details a {
| |
- | margin:30px 0 0;
| |
- | }
| |
- | .og-details h3 {
| |
- | font-size:5em;
| |
- | }
| |
- | }
| |
- | @media all and (max-width:480px){
| |
- | .wrap{
| |
- | width:95%;
| |
- | }
| |
- | .logo,.header_top{
| |
- | float:inherit;
| |
- | width:100%;
| |
- | }
| |
- | .logo h1 {
| |
- | padding:0;
| |
- | text-align:center;
| |
- | }
| |
- | .social-icons {
| |
- | text-align:center;
| |
- | }
| |
- | .search_box {
| |
- | margin:5px 0 10px 0;
| |
- | }
| |
- | .og-close {
| |
- | right:5px;
| |
- | top:10px;
| |
- | }
| |
- | .og-details h3 {
| |
- | font-size:3em;
| |
- | padding-bottom:0;
| |
- | }
| |
- | .artical-links ul li a {
| |
- | font: 400 13px/22px Arial;
| |
- | padding-left: 5px;
| |
- | }
| |
- | .artical-links ul li img {
| |
- | padding-right: 3px;
| |
- | }
| |
- | .comment .data {
| |
- | width: 78%;
| |
- | }
| |
- | }
| |
- | @media all and (max-width:320px){
| |
- | .wrap{
| |
- | width:95%;
| |
- | }
| |
- | .og-expander-inner {
| |
- | padding: 20px 0px;
| |
- | }
| |
- | .og-details {
| |
- | padding: 0 10px 0 10px;
| |
- | margin-top:25px;
| |
- | }
| |
- | .content h3 a {
| |
- | font-size:1.5em;
| |
- | }
| |
- | .blog-img img {
| |
- | margin:0;
| |
- | }
| |
- | .blog-data p {
| |
- | line-height:1.8em;
| |
- | }
| |
- | .artical-links ul li {
| |
- | line-height:2em;
| |
- | }
| |
- | .comment .preview {
| |
- | margin-right: 5px;
| |
- | padding:0 5px;
| |
- | width:75px;
| |
- | }
| |
- | .comment .data {
| |
- | width: 72%;
| |
- | }
| |
- | #contactable #contactForm {
| |
- | width:275px;
| |
- | padding-left:15px;
| |
- | }
| |
- | #contactable form#contactForm input, textarea {
| |
- | width:97%;
| |
- | }
| |
- | #contactable form#contactForm .submit {
| |
- | width:240px;
| |
- | }
| |
- | #contactable form#contactForm p {
| |
- | width: 255px;
| |
- | }
| |
| </style> | | </style> |
| | | |
Line 1,170: |
Line 333: |
| <ul id="og-grid" class="og-grid"> | | <ul id="og-grid" class="og-grid"> |
| <li> | | <li> |
- | <a href="#" data-largesrc="https://static.igem.org/mediawiki/2014/f/f0/IGEM_logo.png" data-title="Azuki bean" data-description="Swiss chard pumpkin bunya nuts maize plantain aubergine napa cabbage soko coriander sweet pepper water spinach winter purslane shallot tigernut lentil beetroot."> | + | <a data-largesrc="./images/img2_b.jpg" data-title="Azuki bean" data-description="Swiss chard pumpkin bunya nuts maize plantain aubergine napa cabbage soko coriander sweet pepper water spinach winter purslane shallot tigernut lentil beetroot."> |
| <img src="https://static.igem.org/mediawiki/2014/f/f0/IGEM_logo.png" width="200px"> | | <img src="https://static.igem.org/mediawiki/2014/f/f0/IGEM_logo.png" width="200px"> |
| </a> | | </a> |
Line 1,188: |
Line 351: |
| </div> | | </div> |
| </div><!-- /container --> | | </div><!-- /container --> |
- | <script type="text/javascript">/* | + | <script type="text/javascript"> |
- | * debouncedresize: special jQuery event that happens once after a window resize
| + | |
- | *
| + | |
- | * latest version and complete README available on Github:
| + | |
- | * https://github.com/louisremi/jquery-smartresize/blob/master/jquery.debouncedresize.js
| + | |
- | *
| + | |
- | * Copyright 2011 @louis_remi
| + | |
- | * Licensed under the MIT license.
| + | |
- | */
| + | |
| var $event = $.event, | | var $event = $.event, |
| $special, | | $special, |