|
|
Line 3: |
Line 3: |
| {{Template:Aalto-Helsinki/Banner}} | | {{Template:Aalto-Helsinki/Banner}} |
| <html> | | <html> |
− |
| |
− | <head>
| |
− | <style>
| |
− |
| |
− | /****************************************************************
| |
− | *
| |
− | * CSS Percentage Circle
| |
− | * Author: Andre Firchow
| |
− | *
| |
− | *****************************************************************/
| |
− | .rect-auto, .c100.p51 .slice, .c100.p52 .slice, .c100.p53 .slice, .c100.p54 .slice, .c100.p55 .slice, .c100.p56 .slice, .c100.p57 .slice, .c100.p58 .slice, .c100.p59 .slice, .c100.p60 .slice, .c100.p61 .slice, .c100.p62 .slice, .c100.p63 .slice, .c100.p64 .slice, .c100.p65 .slice, .c100.p66 .slice, .c100.p67 .slice, .c100.p68 .slice, .c100.p69 .slice, .c100.p70 .slice, .c100.p71 .slice, .c100.p72 .slice, .c100.p73 .slice, .c100.p74 .slice, .c100.p75 .slice, .c100.p76 .slice, .c100.p77 .slice, .c100.p78 .slice, .c100.p79 .slice, .c100.p80 .slice, .c100.p81 .slice, .c100.p82 .slice, .c100.p83 .slice, .c100.p84 .slice, .c100.p85 .slice, .c100.p86 .slice, .c100.p87 .slice, .c100.p88 .slice, .c100.p89 .slice, .c100.p90 .slice, .c100.p91 .slice, .c100.p92 .slice, .c100.p93 .slice, .c100.p94 .slice, .c100.p95 .slice, .c100.p96 .slice, .c100.p97 .slice, .c100.p98 .slice, .c100.p99 .slice, .c100.p100 .slice {
| |
− | clip: rect(auto, auto, auto, auto);
| |
− | }
| |
− |
| |
− | .pie, .c100 .bar, .c100.p51 .fill, .c100.p52 .fill, .c100.p53 .fill, .c100.p54 .fill, .c100.p55 .fill, .c100.p56 .fill, .c100.p57 .fill, .c100.p58 .fill, .c100.p59 .fill, .c100.p60 .fill, .c100.p61 .fill, .c100.p62 .fill, .c100.p63 .fill, .c100.p64 .fill, .c100.p65 .fill, .c100.p66 .fill, .c100.p67 .fill, .c100.p68 .fill, .c100.p69 .fill, .c100.p70 .fill, .c100.p71 .fill, .c100.p72 .fill, .c100.p73 .fill, .c100.p74 .fill, .c100.p75 .fill, .c100.p76 .fill, .c100.p77 .fill, .c100.p78 .fill, .c100.p79 .fill, .c100.p80 .fill, .c100.p81 .fill, .c100.p82 .fill, .c100.p83 .fill, .c100.p84 .fill, .c100.p85 .fill, .c100.p86 .fill, .c100.p87 .fill, .c100.p88 .fill, .c100.p89 .fill, .c100.p90 .fill, .c100.p91 .fill, .c100.p92 .fill, .c100.p93 .fill, .c100.p94 .fill, .c100.p95 .fill, .c100.p96 .fill, .c100.p97 .fill, .c100.p98 .fill, .c100.p99 .fill, .c100.p100 .fill {
| |
− | position: absolute;
| |
− | border: 0.08em solid #4e2a84;
| |
− | width: 0.84em;
| |
− | height: 0.84em;
| |
− | clip: rect(0em, 0.5em, 1em, 0em);
| |
− | -webkit-border-radius: 50%;
| |
− | -moz-border-radius: 50%;
| |
− | -ms-border-radius: 50%;
| |
− | -o-border-radius: 50%;
| |
− | border-radius: 50%;
| |
− | -webkit-transform: rotate(0deg);
| |
− | -moz-transform: rotate(0deg);
| |
− | -ms-transform: rotate(0deg);
| |
− | -o-transform: rotate(0deg);
| |
− | transform: rotate(0deg);
| |
− | }
| |
− |
| |
− | .pie-fill, .c100.p51 .bar:after, .c100.p51 .fill, .c100.p52 .bar:after, .c100.p52 .fill, .c100.p53 .bar:after, .c100.p53 .fill, .c100.p54 .bar:after, .c100.p54 .fill, .c100.p55 .bar:after, .c100.p55 .fill, .c100.p56 .bar:after, .c100.p56 .fill, .c100.p57 .bar:after, .c100.p57 .fill, .c100.p58 .bar:after, .c100.p58 .fill, .c100.p59 .bar:after, .c100.p59 .fill, .c100.p60 .bar:after, .c100.p60 .fill, .c100.p61 .bar:after, .c100.p61 .fill, .c100.p62 .bar:after, .c100.p62 .fill, .c100.p63 .bar:after, .c100.p63 .fill, .c100.p64 .bar:after, .c100.p64 .fill, .c100.p65 .bar:after, .c100.p65 .fill, .c100.p66 .bar:after, .c100.p66 .fill, .c100.p67 .bar:after, .c100.p67 .fill, .c100.p68 .bar:after, .c100.p68 .fill, .c100.p69 .bar:after, .c100.p69 .fill, .c100.p70 .bar:after, .c100.p70 .fill, .c100.p71 .bar:after, .c100.p71 .fill, .c100.p72 .bar:after, .c100.p72 .fill, .c100.p73 .bar:after, .c100.p73 .fill, .c100.p74 .bar:after, .c100.p74 .fill, .c100.p75 .bar:after, .c100.p75 .fill, .c100.p76 .bar:after, .c100.p76 .fill, .c100.p77 .bar:after, .c100.p77 .fill, .c100.p78 .bar:after, .c100.p78 .fill, .c100.p79 .bar:after, .c100.p79 .fill, .c100.p80 .bar:after, .c100.p80 .fill, .c100.p81 .bar:after, .c100.p81 .fill, .c100.p82 .bar:after, .c100.p82 .fill, .c100.p83 .bar:after, .c100.p83 .fill, .c100.p84 .bar:after, .c100.p84 .fill, .c100.p85 .bar:after, .c100.p85 .fill, .c100.p86 .bar:after, .c100.p86 .fill, .c100.p87 .bar:after, .c100.p87 .fill, .c100.p88 .bar:after, .c100.p88 .fill, .c100.p89 .bar:after, .c100.p89 .fill, .c100.p90 .bar:after, .c100.p90 .fill, .c100.p91 .bar:after, .c100.p91 .fill, .c100.p92 .bar:after, .c100.p92 .fill, .c100.p93 .bar:after, .c100.p93 .fill, .c100.p94 .bar:after, .c100.p94 .fill, .c100.p95 .bar:after, .c100.p95 .fill, .c100.p96 .bar:after, .c100.p96 .fill, .c100.p97 .bar:after, .c100.p97 .fill, .c100.p98 .bar:after, .c100.p98 .fill, .c100.p99 .bar:after, .c100.p99 .fill, .c100.p100 .bar:after, .c100.p100 .fill {
| |
− | -webkit-transform: rotate(180deg);
| |
− | -moz-transform: rotate(180deg);
| |
− | -ms-transform: rotate(180deg);
| |
− | -o-transform: rotate(180deg);
| |
− | transform: rotate(180deg);
| |
− | }
| |
− |
| |
− | .c100 {
| |
− | position: relative;
| |
− | font-size: 120px;
| |
− | width: 1em;
| |
− | height: 1em;
| |
− | -webkit-border-radius: 50%;
| |
− | -moz-border-radius: 50%;
| |
− | -ms-border-radius: 50%;
| |
− | -o-border-radius: 50%;
| |
− | border-radius: 50%;
| |
− | float: left;
| |
− | margin: 0 0.1em 0.1em 0;
| |
− | background-color: #808080;
| |
− | }
| |
− | .c100 *, .c100 *:before, .c100 *:after {
| |
− | -webkit-box-sizing: content-box;
| |
− | -moz-box-sizing: content-box;
| |
− | box-sizing: content-box;
| |
− | }
| |
− | .c100.center {
| |
− | float: none;
| |
− | margin: 0 auto;
| |
− | }
| |
− | .c100.big {
| |
− | font-size: 240px;
| |
− | }
| |
− | .c100.small {
| |
− | font-size: 80px;
| |
− | }
| |
− | .c100 > span {
| |
− | position: absolute;
| |
− | width: 100%;
| |
− | z-index: 1;
| |
− | left: 0;
| |
− | top: 0;
| |
− | width: 5em;
| |
− | line-height: 5em;
| |
− | font-size: 0.2em;
| |
− | color: #808080;
| |
− | display: block;
| |
− | text-align: center;
| |
− | white-space: nowrap;
| |
− | -webkit-transition-property: all;
| |
− | -moz-transition-property: all;
| |
− | -o-transition-property: all;
| |
− | transition-property: all;
| |
− | -webkit-transition-duration: 0.2s;
| |
− | -moz-transition-duration: 0.2s;
| |
− | -o-transition-duration: 0.2s;
| |
− | transition-duration: 0.2s;
| |
− | -webkit-transition-timing-function: ease-out;
| |
− | -moz-transition-timing-function: ease-out;
| |
− | -o-transition-timing-function: ease-out;
| |
− | transition-timing-function: ease-out;
| |
− | }
| |
− | .c100:after {
| |
− | position: absolute;
| |
− | top: 0.08em;
| |
− | left: 0.08em;
| |
− | display: block;
| |
− | content: " ";
| |
− | -webkit-border-radius: 50%;
| |
− | -moz-border-radius: 50%;
| |
− | -ms-border-radius: 50%;
| |
− | -o-border-radius: 50%;
| |
− | border-radius: 50%;
| |
− | background-color: #ffffff;
| |
− | width: 0.84em;
| |
− | height: 0.84em;
| |
− | -webkit-transition-property: all;
| |
− | -moz-transition-property: all;
| |
− | -o-transition-property: all;
| |
− | transition-property: all;
| |
− | -webkit-transition-duration: 0.2s;
| |
− | -moz-transition-duration: 0.2s;
| |
− | -o-transition-duration: 0.2s;
| |
− | transition-duration: 0.2s;
| |
− | -webkit-transition-timing-function: ease-in;
| |
− | -moz-transition-timing-function: ease-in;
| |
− | -o-transition-timing-function: ease-in;
| |
− | transition-timing-function: ease-in;
| |
− | }
| |
− | .c100 .slice {
| |
− | position: absolute;
| |
− | width: 1em;
| |
− | height: 1em;
| |
− | clip: rect(0em, 1em, 1em, 0.5em);
| |
− | }
| |
− | .c100.p1 .bar {
| |
− | -webkit-transform: rotate(3.6deg);
| |
− | -moz-transform: rotate(3.6deg);
| |
− | -ms-transform: rotate(3.6deg);
| |
− | -o-transform: rotate(3.6deg);
| |
− | transform: rotate(3.6deg);
| |
− | }
| |
− | .c100.p2 .bar {
| |
− | -webkit-transform: rotate(7.2deg);
| |
− | -moz-transform: rotate(7.2deg);
| |
− | -ms-transform: rotate(7.2deg);
| |
− | -o-transform: rotate(7.2deg);
| |
− | transform: rotate(7.2deg);
| |
− | }
| |
− | .c100.p3 .bar {
| |
− | -webkit-transform: rotate(10.8deg);
| |
− | -moz-transform: rotate(10.8deg);
| |
− | -ms-transform: rotate(10.8deg);
| |
− | -o-transform: rotate(10.8deg);
| |
− | transform: rotate(10.8deg);
| |
− | }
| |
− | .c100.p4 .bar {
| |
− | -webkit-transform: rotate(14.4deg);
| |
− | -moz-transform: rotate(14.4deg);
| |
− | -ms-transform: rotate(14.4deg);
| |
− | -o-transform: rotate(14.4deg);
| |
− | transform: rotate(14.4deg);
| |
− | }
| |
− | .c100.p5 .bar {
| |
− | -webkit-transform: rotate(18deg);
| |
− | -moz-transform: rotate(18deg);
| |
− | -ms-transform: rotate(18deg);
| |
− | -o-transform: rotate(18deg);
| |
− | transform: rotate(18deg);
| |
− | }
| |
− | .c100.p6 .bar {
| |
− | -webkit-transform: rotate(21.6deg);
| |
− | -moz-transform: rotate(21.6deg);
| |
− | -ms-transform: rotate(21.6deg);
| |
− | -o-transform: rotate(21.6deg);
| |
− | transform: rotate(21.6deg);
| |
− | }
| |
− | .c100.p7 .bar {
| |
− | -webkit-transform: rotate(25.2deg);
| |
− | -moz-transform: rotate(25.2deg);
| |
− | -ms-transform: rotate(25.2deg);
| |
− | -o-transform: rotate(25.2deg);
| |
− | transform: rotate(25.2deg);
| |
− | }
| |
− | .c100.p8 .bar {
| |
− | -webkit-transform: rotate(28.8deg);
| |
− | -moz-transform: rotate(28.8deg);
| |
− | -ms-transform: rotate(28.8deg);
| |
− | -o-transform: rotate(28.8deg);
| |
− | transform: rotate(28.8deg);
| |
− | }
| |
− | .c100.p9 .bar {
| |
− | -webkit-transform: rotate(32.4deg);
| |
− | -moz-transform: rotate(32.4deg);
| |
− | -ms-transform: rotate(32.4deg);
| |
− | -o-transform: rotate(32.4deg);
| |
− | transform: rotate(32.4deg);
| |
− | }
| |
− | .c100.p10 .bar {
| |
− | -webkit-transform: rotate(36deg);
| |
− | -moz-transform: rotate(36deg);
| |
− | -ms-transform: rotate(36deg);
| |
− | -o-transform: rotate(36deg);
| |
− | transform: rotate(36deg);
| |
− | }
| |
− | .c100.p11 .bar {
| |
− | -webkit-transform: rotate(39.6deg);
| |
− | -moz-transform: rotate(39.6deg);
| |
− | -ms-transform: rotate(39.6deg);
| |
− | -o-transform: rotate(39.6deg);
| |
− | transform: rotate(39.6deg);
| |
− | }
| |
− | .c100.p12 .bar {
| |
− | -webkit-transform: rotate(43.2deg);
| |
− | -moz-transform: rotate(43.2deg);
| |
− | -ms-transform: rotate(43.2deg);
| |
− | -o-transform: rotate(43.2deg);
| |
− | transform: rotate(43.2deg);
| |
− | }
| |
− | .c100.p13 .bar {
| |
− | -webkit-transform: rotate(46.8deg);
| |
− | -moz-transform: rotate(46.8deg);
| |
− | -ms-transform: rotate(46.8deg);
| |
− | -o-transform: rotate(46.8deg);
| |
− | transform: rotate(46.8deg);
| |
− | }
| |
− | .c100.p14 .bar {
| |
− | -webkit-transform: rotate(50.4deg);
| |
− | -moz-transform: rotate(50.4deg);
| |
− | -ms-transform: rotate(50.4deg);
| |
− | -o-transform: rotate(50.4deg);
| |
− | transform: rotate(50.4deg);
| |
− | }
| |
− | .c100.p15 .bar {
| |
− | -webkit-transform: rotate(54deg);
| |
− | -moz-transform: rotate(54deg);
| |
− | -ms-transform: rotate(54deg);
| |
− | -o-transform: rotate(54deg);
| |
− | transform: rotate(54deg);
| |
− | }
| |
− | .c100.p16 .bar {
| |
− | -webkit-transform: rotate(57.6deg);
| |
− | -moz-transform: rotate(57.6deg);
| |
− | -ms-transform: rotate(57.6deg);
| |
− | -o-transform: rotate(57.6deg);
| |
− | transform: rotate(57.6deg);
| |
− | }
| |
− | .c100.p17 .bar {
| |
− | -webkit-transform: rotate(61.2deg);
| |
− | -moz-transform: rotate(61.2deg);
| |
− | -ms-transform: rotate(61.2deg);
| |
− | -o-transform: rotate(61.2deg);
| |
− | transform: rotate(61.2deg);
| |
− | }
| |
− | .c100.p18 .bar {
| |
− | -webkit-transform: rotate(64.8deg);
| |
− | -moz-transform: rotate(64.8deg);
| |
− | -ms-transform: rotate(64.8deg);
| |
− | -o-transform: rotate(64.8deg);
| |
− | transform: rotate(64.8deg);
| |
− | }
| |
− | .c100.p19 .bar {
| |
− | -webkit-transform: rotate(68.4deg);
| |
− | -moz-transform: rotate(68.4deg);
| |
− | -ms-transform: rotate(68.4deg);
| |
− | -o-transform: rotate(68.4deg);
| |
− | transform: rotate(68.4deg);
| |
− | }
| |
− | .c100.p20 .bar {
| |
− | -webkit-transform: rotate(72deg);
| |
− | -moz-transform: rotate(72deg);
| |
− | -ms-transform: rotate(72deg);
| |
− | -o-transform: rotate(72deg);
| |
− | transform: rotate(72deg);
| |
− | }
| |
− | .c100.p21 .bar {
| |
− | -webkit-transform: rotate(75.6deg);
| |
− | -moz-transform: rotate(75.6deg);
| |
− | -ms-transform: rotate(75.6deg);
| |
− | -o-transform: rotate(75.6deg);
| |
− | transform: rotate(75.6deg);
| |
− | }
| |
− | .c100.p22 .bar {
| |
− | -webkit-transform: rotate(79.2deg);
| |
− | -moz-transform: rotate(79.2deg);
| |
− | -ms-transform: rotate(79.2deg);
| |
− | -o-transform: rotate(79.2deg);
| |
− | transform: rotate(79.2deg);
| |
− | }
| |
− | .c100.p23 .bar {
| |
− | -webkit-transform: rotate(82.8deg);
| |
− | -moz-transform: rotate(82.8deg);
| |
− | -ms-transform: rotate(82.8deg);
| |
− | -o-transform: rotate(82.8deg);
| |
− | transform: rotate(82.8deg);
| |
− | }
| |
− | .c100.p24 .bar {
| |
− | -webkit-transform: rotate(86.4deg);
| |
− | -moz-transform: rotate(86.4deg);
| |
− | -ms-transform: rotate(86.4deg);
| |
− | -o-transform: rotate(86.4deg);
| |
− | transform: rotate(86.4deg);
| |
− | }
| |
− | .c100.p25 .bar {
| |
− | -webkit-transform: rotate(90deg);
| |
− | -moz-transform: rotate(90deg);
| |
− | -ms-transform: rotate(90deg);
| |
− | -o-transform: rotate(90deg);
| |
− | transform: rotate(90deg);
| |
− | }
| |
− | .c100.p26 .bar {
| |
− | -webkit-transform: rotate(93.6deg);
| |
− | -moz-transform: rotate(93.6deg);
| |
− | -ms-transform: rotate(93.6deg);
| |
− | -o-transform: rotate(93.6deg);
| |
− | transform: rotate(93.6deg);
| |
− | }
| |
− | .c100.p27 .bar {
| |
− | -webkit-transform: rotate(97.2deg);
| |
− | -moz-transform: rotate(97.2deg);
| |
− | -ms-transform: rotate(97.2deg);
| |
− | -o-transform: rotate(97.2deg);
| |
− | transform: rotate(97.2deg);
| |
− | }
| |
− | .c100.p28 .bar {
| |
− | -webkit-transform: rotate(100.8deg);
| |
− | -moz-transform: rotate(100.8deg);
| |
− | -ms-transform: rotate(100.8deg);
| |
− | -o-transform: rotate(100.8deg);
| |
− | transform: rotate(100.8deg);
| |
− | }
| |
− | .c100.p29 .bar {
| |
− | -webkit-transform: rotate(104.4deg);
| |
− | -moz-transform: rotate(104.4deg);
| |
− | -ms-transform: rotate(104.4deg);
| |
− | -o-transform: rotate(104.4deg);
| |
− | transform: rotate(104.4deg);
| |
− | }
| |
− | .c100.p30 .bar {
| |
− | -webkit-transform: rotate(108deg);
| |
− | -moz-transform: rotate(108deg);
| |
− | -ms-transform: rotate(108deg);
| |
− | -o-transform: rotate(108deg);
| |
− | transform: rotate(108deg);
| |
− | }
| |
− | .c100.p31 .bar {
| |
− | -webkit-transform: rotate(111.6deg);
| |
− | -moz-transform: rotate(111.6deg);
| |
− | -ms-transform: rotate(111.6deg);
| |
− | -o-transform: rotate(111.6deg);
| |
− | transform: rotate(111.6deg);
| |
− | }
| |
− | .c100.p32 .bar {
| |
− | -webkit-transform: rotate(115.2deg);
| |
− | -moz-transform: rotate(115.2deg);
| |
− | -ms-transform: rotate(115.2deg);
| |
− | -o-transform: rotate(115.2deg);
| |
− | transform: rotate(115.2deg);
| |
− | }
| |
− | .c100.p33 .bar {
| |
− | -webkit-transform: rotate(118.8deg);
| |
− | -moz-transform: rotate(118.8deg);
| |
− | -ms-transform: rotate(118.8deg);
| |
− | -o-transform: rotate(118.8deg);
| |
− | transform: rotate(118.8deg);
| |
− | }
| |
− | .c100.p34 .bar {
| |
− | -webkit-transform: rotate(122.4deg);
| |
− | -moz-transform: rotate(122.4deg);
| |
− | -ms-transform: rotate(122.4deg);
| |
− | -o-transform: rotate(122.4deg);
| |
− | transform: rotate(122.4deg);
| |
− | }
| |
− | .c100.p35 .bar {
| |
− | -webkit-transform: rotate(126deg);
| |
− | -moz-transform: rotate(126deg);
| |
− | -ms-transform: rotate(126deg);
| |
− | -o-transform: rotate(126deg);
| |
− | transform: rotate(126deg);
| |
− | }
| |
− | .c100.p36 .bar {
| |
− | -webkit-transform: rotate(129.6deg);
| |
− | -moz-transform: rotate(129.6deg);
| |
− | -ms-transform: rotate(129.6deg);
| |
− | -o-transform: rotate(129.6deg);
| |
− | transform: rotate(129.6deg);
| |
− | }
| |
− | .c100.p37 .bar {
| |
− | -webkit-transform: rotate(133.2deg);
| |
− | -moz-transform: rotate(133.2deg);
| |
− | -ms-transform: rotate(133.2deg);
| |
− | -o-transform: rotate(133.2deg);
| |
− | transform: rotate(133.2deg);
| |
− | }
| |
− | .c100.p38 .bar {
| |
− | -webkit-transform: rotate(136.8deg);
| |
− | -moz-transform: rotate(136.8deg);
| |
− | -ms-transform: rotate(136.8deg);
| |
− | -o-transform: rotate(136.8deg);
| |
− | transform: rotate(136.8deg);
| |
− | }
| |
− | .c100.p39 .bar {
| |
− | -webkit-transform: rotate(140.4deg);
| |
− | -moz-transform: rotate(140.4deg);
| |
− | -ms-transform: rotate(140.4deg);
| |
− | -o-transform: rotate(140.4deg);
| |
− | transform: rotate(140.4deg);
| |
− | }
| |
− | .c100.p40 .bar {
| |
− | -webkit-transform: rotate(144deg);
| |
− | -moz-transform: rotate(144deg);
| |
− | -ms-transform: rotate(144deg);
| |
− | -o-transform: rotate(144deg);
| |
− | transform: rotate(144deg);
| |
− | }
| |
− | .c100.p41 .bar {
| |
− | -webkit-transform: rotate(147.6deg);
| |
− | -moz-transform: rotate(147.6deg);
| |
− | -ms-transform: rotate(147.6deg);
| |
− | -o-transform: rotate(147.6deg);
| |
− | transform: rotate(147.6deg);
| |
− | }
| |
− | .c100.p42 .bar {
| |
− | -webkit-transform: rotate(151.2deg);
| |
− | -moz-transform: rotate(151.2deg);
| |
− | -ms-transform: rotate(151.2deg);
| |
− | -o-transform: rotate(151.2deg);
| |
− | transform: rotate(151.2deg);
| |
− | }
| |
− | .c100.p43 .bar {
| |
− | -webkit-transform: rotate(154.8deg);
| |
− | -moz-transform: rotate(154.8deg);
| |
− | -ms-transform: rotate(154.8deg);
| |
− | -o-transform: rotate(154.8deg);
| |
− | transform: rotate(154.8deg);
| |
− | }
| |
− | .c100.p44 .bar {
| |
− | -webkit-transform: rotate(158.4deg);
| |
− | -moz-transform: rotate(158.4deg);
| |
− | -ms-transform: rotate(158.4deg);
| |
− | -o-transform: rotate(158.4deg);
| |
− | transform: rotate(158.4deg);
| |
− | }
| |
− | .c100.p45 .bar {
| |
− | -webkit-transform: rotate(162deg);
| |
− | -moz-transform: rotate(162deg);
| |
− | -ms-transform: rotate(162deg);
| |
− | -o-transform: rotate(162deg);
| |
− | transform: rotate(162deg);
| |
− | }
| |
− | .c100.p46 .bar {
| |
− | -webkit-transform: rotate(165.6deg);
| |
− | -moz-transform: rotate(165.6deg);
| |
− | -ms-transform: rotate(165.6deg);
| |
− | -o-transform: rotate(165.6deg);
| |
− | transform: rotate(165.6deg);
| |
− | }
| |
− | .c100.p47 .bar {
| |
− | -webkit-transform: rotate(169.2deg);
| |
− | -moz-transform: rotate(169.2deg);
| |
− | -ms-transform: rotate(169.2deg);
| |
− | -o-transform: rotate(169.2deg);
| |
− | transform: rotate(169.2deg);
| |
− | }
| |
− | .c100.p48 .bar {
| |
− | -webkit-transform: rotate(172.8deg);
| |
− | -moz-transform: rotate(172.8deg);
| |
− | -ms-transform: rotate(172.8deg);
| |
− | -o-transform: rotate(172.8deg);
| |
− | transform: rotate(172.8deg);
| |
− | }
| |
− | .c100.p49 .bar {
| |
− | -webkit-transform: rotate(176.4deg);
| |
− | -moz-transform: rotate(176.4deg);
| |
− | -ms-transform: rotate(176.4deg);
| |
− | -o-transform: rotate(176.4deg);
| |
− | transform: rotate(176.4deg);
| |
− | }
| |
− | .c100.p50 .bar {
| |
− | -webkit-transform: rotate(180deg);
| |
− | -moz-transform: rotate(180deg);
| |
− | -ms-transform: rotate(180deg);
| |
− | -o-transform: rotate(180deg);
| |
− | transform: rotate(180deg);
| |
− | }
| |
− | .c100.p51 .bar {
| |
− | -webkit-transform: rotate(183.6deg);
| |
− | -moz-transform: rotate(183.6deg);
| |
− | -ms-transform: rotate(183.6deg);
| |
− | -o-transform: rotate(183.6deg);
| |
− | transform: rotate(183.6deg);
| |
− | }
| |
− | .c100.p52 .bar {
| |
− | -webkit-transform: rotate(187.2deg);
| |
− | -moz-transform: rotate(187.2deg);
| |
− | -ms-transform: rotate(187.2deg);
| |
− | -o-transform: rotate(187.2deg);
| |
− | transform: rotate(187.2deg);
| |
− | }
| |
− | .c100.p53 .bar {
| |
− | -webkit-transform: rotate(190.8deg);
| |
− | -moz-transform: rotate(190.8deg);
| |
− | -ms-transform: rotate(190.8deg);
| |
− | -o-transform: rotate(190.8deg);
| |
− | transform: rotate(190.8deg);
| |
− | }
| |
− | .c100.p54 .bar {
| |
− | -webkit-transform: rotate(194.4deg);
| |
− | -moz-transform: rotate(194.4deg);
| |
− | -ms-transform: rotate(194.4deg);
| |
− | -o-transform: rotate(194.4deg);
| |
− | transform: rotate(194.4deg);
| |
− | }
| |
− | .c100.p55 .bar {
| |
− | -webkit-transform: rotate(198deg);
| |
− | -moz-transform: rotate(198deg);
| |
− | -ms-transform: rotate(198deg);
| |
− | -o-transform: rotate(198deg);
| |
− | transform: rotate(198deg);
| |
− | }
| |
− | .c100.p56 .bar {
| |
− | -webkit-transform: rotate(201.6deg);
| |
− | -moz-transform: rotate(201.6deg);
| |
− | -ms-transform: rotate(201.6deg);
| |
− | -o-transform: rotate(201.6deg);
| |
− | transform: rotate(201.6deg);
| |
− | }
| |
− | .c100.p57 .bar {
| |
− | -webkit-transform: rotate(205.2deg);
| |
− | -moz-transform: rotate(205.2deg);
| |
− | -ms-transform: rotate(205.2deg);
| |
− | -o-transform: rotate(205.2deg);
| |
− | transform: rotate(205.2deg);
| |
− | }
| |
− | .c100.p58 .bar {
| |
− | -webkit-transform: rotate(208.8deg);
| |
− | -moz-transform: rotate(208.8deg);
| |
− | -ms-transform: rotate(208.8deg);
| |
− | -o-transform: rotate(208.8deg);
| |
− | transform: rotate(208.8deg);
| |
− | }
| |
− | .c100.p59 .bar {
| |
− | -webkit-transform: rotate(212.4deg);
| |
− | -moz-transform: rotate(212.4deg);
| |
− | -ms-transform: rotate(212.4deg);
| |
− | -o-transform: rotate(212.4deg);
| |
− | transform: rotate(212.4deg);
| |
− | }
| |
− | .c100.p60 .bar {
| |
− | -webkit-transform: rotate(216deg);
| |
− | -moz-transform: rotate(216deg);
| |
− | -ms-transform: rotate(216deg);
| |
− | -o-transform: rotate(216deg);
| |
− | transform: rotate(216deg);
| |
− | }
| |
− | .c100.p61 .bar {
| |
− | -webkit-transform: rotate(219.6deg);
| |
− | -moz-transform: rotate(219.6deg);
| |
− | -ms-transform: rotate(219.6deg);
| |
− | -o-transform: rotate(219.6deg);
| |
− | transform: rotate(219.6deg);
| |
− | }
| |
− | .c100.p62 .bar {
| |
− | -webkit-transform: rotate(223.2deg);
| |
− | -moz-transform: rotate(223.2deg);
| |
− | -ms-transform: rotate(223.2deg);
| |
− | -o-transform: rotate(223.2deg);
| |
− | transform: rotate(223.2deg);
| |
− | }
| |
− | .c100.p63 .bar {
| |
− | -webkit-transform: rotate(226.8deg);
| |
− | -moz-transform: rotate(226.8deg);
| |
− | -ms-transform: rotate(226.8deg);
| |
− | -o-transform: rotate(226.8deg);
| |
− | transform: rotate(226.8deg);
| |
− | }
| |
− | .c100.p64 .bar {
| |
− | -webkit-transform: rotate(230.4deg);
| |
− | -moz-transform: rotate(230.4deg);
| |
− | -ms-transform: rotate(230.4deg);
| |
− | -o-transform: rotate(230.4deg);
| |
− | transform: rotate(230.4deg);
| |
− | }
| |
− | .c100.p65 .bar {
| |
− | -webkit-transform: rotate(234deg);
| |
− | -moz-transform: rotate(234deg);
| |
− | -ms-transform: rotate(234deg);
| |
− | -o-transform: rotate(234deg);
| |
− | transform: rotate(234deg);
| |
− | }
| |
− | .c100.p66 .bar {
| |
− | -webkit-transform: rotate(237.6deg);
| |
− | -moz-transform: rotate(237.6deg);
| |
− | -ms-transform: rotate(237.6deg);
| |
− | -o-transform: rotate(237.6deg);
| |
− | transform: rotate(237.6deg);
| |
− | }
| |
− | .c100.p67 .bar {
| |
− | -webkit-transform: rotate(241.2deg);
| |
− | -moz-transform: rotate(241.2deg);
| |
− | -ms-transform: rotate(241.2deg);
| |
− | -o-transform: rotate(241.2deg);
| |
− | transform: rotate(241.2deg);
| |
− | }
| |
− | .c100.p68 .bar {
| |
− | -webkit-transform: rotate(244.8deg);
| |
− | -moz-transform: rotate(244.8deg);
| |
− | -ms-transform: rotate(244.8deg);
| |
− | -o-transform: rotate(244.8deg);
| |
− | transform: rotate(244.8deg);
| |
− | }
| |
− | .c100.p69 .bar {
| |
− | -webkit-transform: rotate(248.4deg);
| |
− | -moz-transform: rotate(248.4deg);
| |
− | -ms-transform: rotate(248.4deg);
| |
− | -o-transform: rotate(248.4deg);
| |
− | transform: rotate(248.4deg);
| |
− | }
| |
− | .c100.p70 .bar {
| |
− | -webkit-transform: rotate(252deg);
| |
− | -moz-transform: rotate(252deg);
| |
− | -ms-transform: rotate(252deg);
| |
− | -o-transform: rotate(252deg);
| |
− | transform: rotate(252deg);
| |
− | }
| |
− | .c100.p71 .bar {
| |
− | -webkit-transform: rotate(255.6deg);
| |
− | -moz-transform: rotate(255.6deg);
| |
− | -ms-transform: rotate(255.6deg);
| |
− | -o-transform: rotate(255.6deg);
| |
− | transform: rotate(255.6deg);
| |
− | }
| |
− | .c100.p72 .bar {
| |
− | -webkit-transform: rotate(259.2deg);
| |
− | -moz-transform: rotate(259.2deg);
| |
− | -ms-transform: rotate(259.2deg);
| |
− | -o-transform: rotate(259.2deg);
| |
− | transform: rotate(259.2deg);
| |
− | }
| |
− | .c100.p73 .bar {
| |
− | -webkit-transform: rotate(262.8deg);
| |
− | -moz-transform: rotate(262.8deg);
| |
− | -ms-transform: rotate(262.8deg);
| |
− | -o-transform: rotate(262.8deg);
| |
− | transform: rotate(262.8deg);
| |
− | }
| |
− | .c100.p74 .bar {
| |
− | -webkit-transform: rotate(266.4deg);
| |
− | -moz-transform: rotate(266.4deg);
| |
− | -ms-transform: rotate(266.4deg);
| |
− | -o-transform: rotate(266.4deg);
| |
− | transform: rotate(266.4deg);
| |
− | }
| |
− | .c100.p75 .bar {
| |
− | -webkit-transform: rotate(270deg);
| |
− | -moz-transform: rotate(270deg);
| |
− | -ms-transform: rotate(270deg);
| |
− | -o-transform: rotate(270deg);
| |
− | transform: rotate(270deg);
| |
− | }
| |
− | .c100.p76 .bar {
| |
− | -webkit-transform: rotate(273.6deg);
| |
− | -moz-transform: rotate(273.6deg);
| |
− | -ms-transform: rotate(273.6deg);
| |
− | -o-transform: rotate(273.6deg);
| |
− | transform: rotate(273.6deg);
| |
− | }
| |
− | .c100.p77 .bar {
| |
− | -webkit-transform: rotate(277.2deg);
| |
− | -moz-transform: rotate(277.2deg);
| |
− | -ms-transform: rotate(277.2deg);
| |
− | -o-transform: rotate(277.2deg);
| |
− | transform: rotate(277.2deg);
| |
− | }
| |
− | .c100.p78 .bar {
| |
− | -webkit-transform: rotate(280.8deg);
| |
− | -moz-transform: rotate(280.8deg);
| |
− | -ms-transform: rotate(280.8deg);
| |
− | -o-transform: rotate(280.8deg);
| |
− | transform: rotate(280.8deg);
| |
− | }
| |
− | .c100.p79 .bar {
| |
− | -webkit-transform: rotate(284.4deg);
| |
− | -moz-transform: rotate(284.4deg);
| |
− | -ms-transform: rotate(284.4deg);
| |
− | -o-transform: rotate(284.4deg);
| |
− | transform: rotate(284.4deg);
| |
− | }
| |
− | .c100.p80 .bar {
| |
− | -webkit-transform: rotate(288deg);
| |
− | -moz-transform: rotate(288deg);
| |
− | -ms-transform: rotate(288deg);
| |
− | -o-transform: rotate(288deg);
| |
− | transform: rotate(288deg);
| |
− | }
| |
− | .c100.p81 .bar {
| |
− | -webkit-transform: rotate(291.6deg);
| |
− | -moz-transform: rotate(291.6deg);
| |
− | -ms-transform: rotate(291.6deg);
| |
− | -o-transform: rotate(291.6deg);
| |
− | transform: rotate(291.6deg);
| |
− | }
| |
− | .c100.p82 .bar {
| |
− | -webkit-transform: rotate(295.2deg);
| |
− | -moz-transform: rotate(295.2deg);
| |
− | -ms-transform: rotate(295.2deg);
| |
− | -o-transform: rotate(295.2deg);
| |
− | transform: rotate(295.2deg);
| |
− | }
| |
− | .c100.p83 .bar {
| |
− | -webkit-transform: rotate(298.8deg);
| |
− | -moz-transform: rotate(298.8deg);
| |
− | -ms-transform: rotate(298.8deg);
| |
− | -o-transform: rotate(298.8deg);
| |
− | transform: rotate(298.8deg);
| |
− | }
| |
− | .c100.p84 .bar {
| |
− | -webkit-transform: rotate(302.4deg);
| |
− | -moz-transform: rotate(302.4deg);
| |
− | -ms-transform: rotate(302.4deg);
| |
− | -o-transform: rotate(302.4deg);
| |
− | transform: rotate(302.4deg);
| |
− | }
| |
− | .c100.p85 .bar {
| |
− | -webkit-transform: rotate(306deg);
| |
− | -moz-transform: rotate(306deg);
| |
− | -ms-transform: rotate(306deg);
| |
− | -o-transform: rotate(306deg);
| |
− | transform: rotate(306deg);
| |
− | }
| |
− | .c100.p86 .bar {
| |
− | -webkit-transform: rotate(309.6deg);
| |
− | -moz-transform: rotate(309.6deg);
| |
− | -ms-transform: rotate(309.6deg);
| |
− | -o-transform: rotate(309.6deg);
| |
− | transform: rotate(309.6deg);
| |
− | }
| |
− | .c100.p87 .bar {
| |
− | -webkit-transform: rotate(313.2deg);
| |
− | -moz-transform: rotate(313.2deg);
| |
− | -ms-transform: rotate(313.2deg);
| |
− | -o-transform: rotate(313.2deg);
| |
− | transform: rotate(313.2deg);
| |
− | }
| |
− | .c100.p88 .bar {
| |
− | -webkit-transform: rotate(316.8deg);
| |
− | -moz-transform: rotate(316.8deg);
| |
− | -ms-transform: rotate(316.8deg);
| |
− | -o-transform: rotate(316.8deg);
| |
− | transform: rotate(316.8deg);
| |
− | }
| |
− | .c100.p89 .bar {
| |
− | -webkit-transform: rotate(320.4deg);
| |
− | -moz-transform: rotate(320.4deg);
| |
− | -ms-transform: rotate(320.4deg);
| |
− | -o-transform: rotate(320.4deg);
| |
− | transform: rotate(320.4deg);
| |
− | }
| |
− | .c100.p90 .bar {
| |
− | -webkit-transform: rotate(324deg);
| |
− | -moz-transform: rotate(324deg);
| |
− | -ms-transform: rotate(324deg);
| |
− | -o-transform: rotate(324deg);
| |
− | transform: rotate(324deg);
| |
− | }
| |
− | .c100.p91 .bar {
| |
− | -webkit-transform: rotate(327.6deg);
| |
− | -moz-transform: rotate(327.6deg);
| |
− | -ms-transform: rotate(327.6deg);
| |
− | -o-transform: rotate(327.6deg);
| |
− | transform: rotate(327.6deg);
| |
− | }
| |
− | .c100.p92 .bar {
| |
− | -webkit-transform: rotate(331.2deg);
| |
− | -moz-transform: rotate(331.2deg);
| |
− | -ms-transform: rotate(331.2deg);
| |
− | -o-transform: rotate(331.2deg);
| |
− | transform: rotate(331.2deg);
| |
− | }
| |
− | .c100.p93 .bar {
| |
− | -webkit-transform: rotate(334.8deg);
| |
− | -moz-transform: rotate(334.8deg);
| |
− | -ms-transform: rotate(334.8deg);
| |
− | -o-transform: rotate(334.8deg);
| |
− | transform: rotate(334.8deg);
| |
− | }
| |
− | .c100.p94 .bar {
| |
− | -webkit-transform: rotate(338.4deg);
| |
− | -moz-transform: rotate(338.4deg);
| |
− | -ms-transform: rotate(338.4deg);
| |
− | -o-transform: rotate(338.4deg);
| |
− | transform: rotate(338.4deg);
| |
− | }
| |
− | .c100.p95 .bar {
| |
− | -webkit-transform: rotate(342deg);
| |
− | -moz-transform: rotate(342deg);
| |
− | -ms-transform: rotate(342deg);
| |
− | -o-transform: rotate(342deg);
| |
− | transform: rotate(342deg);
| |
− | }
| |
− | .c100.p96 .bar {
| |
− | -webkit-transform: rotate(345.6deg);
| |
− | -moz-transform: rotate(345.6deg);
| |
− | -ms-transform: rotate(345.6deg);
| |
− | -o-transform: rotate(345.6deg);
| |
− | transform: rotate(345.6deg);
| |
− | }
| |
− | .c100.p97 .bar {
| |
− | -webkit-transform: rotate(349.2deg);
| |
− | -moz-transform: rotate(349.2deg);
| |
− | -ms-transform: rotate(349.2deg);
| |
− | -o-transform: rotate(349.2deg);
| |
− | transform: rotate(349.2deg);
| |
− | }
| |
− | .c100.p98 .bar {
| |
− | -webkit-transform: rotate(352.8deg);
| |
− | -moz-transform: rotate(352.8deg);
| |
− | -ms-transform: rotate(352.8deg);
| |
− | -o-transform: rotate(352.8deg);
| |
− | transform: rotate(352.8deg);
| |
− | }
| |
− | .c100.p99 .bar {
| |
− | -webkit-transform: rotate(356.4deg);
| |
− | -moz-transform: rotate(356.4deg);
| |
− | -ms-transform: rotate(356.4deg);
| |
− | -o-transform: rotate(356.4deg);
| |
− | transform: rotate(356.4deg);
| |
− | }
| |
− | .c100.p100 .bar {
| |
− | -webkit-transform: rotate(360deg);
| |
− | -moz-transform: rotate(360deg);
| |
− | -ms-transform: rotate(360deg);
| |
− | -o-transform: rotate(360deg);
| |
− | transform: rotate(360deg);
| |
− | }
| |
− | .c100:hover {
| |
− | cursor: default;
| |
− | }
| |
− | .c100:hover > span {
| |
− | width: 3.33em;
| |
− | line-height: 3.33em;
| |
− | font-size: 0.3em;
| |
− | color: #4e2a84;
| |
− | }
| |
− | .c100:hover:after {
| |
− | top: 0.04em;
| |
− | left: 0.04em;
| |
− | width: 0.92em;
| |
− | height: 0.92em;
| |
− | }
| |
− | .c100.dark {
| |
− | background-color: #777777;
| |
− | }
| |
− | .c100.dark .bar,
| |
− | .c100.dark .fill {
| |
− | border-color: #c6ff00 !important;
| |
− | }
| |
− | .c100.dark > span {
| |
− | color: #777777;
| |
− | }
| |
− | .c100.dark:after {
| |
− | background-color: #666666;
| |
− | }
| |
− | .c100.dark:hover > span {
| |
− | color: #c6ff00;
| |
− | }
| |
− | .c100.green .bar, .c100.green .fill {
| |
− | border-color: #4db53c !important;
| |
− | }
| |
− | .c100.green:hover > span {
| |
− | color: #4db53c;
| |
− | }
| |
− | .c100.green.dark .bar, .c100.green.dark .fill {
| |
− | border-color: #5fd400 !important;
| |
− | }
| |
− | .c100.green.dark:hover > span {
| |
− | color: #5fd400;
| |
− | }
| |
− | .c100.orange .bar, .c100.orange .fill {
| |
− | border-color: #dd9d22 !important;
| |
− | }
| |
− | .c100.orange:hover > span {
| |
− | color: #dd9d22;
| |
− | }
| |
− | .c100.orange.dark .bar, .c100.orange.dark .fill {
| |
− | border-color: #e08833 !important;
| |
− | }
| |
− | .c100.orange.dark:hover > span {
| |
− | color: #e08833;
| |
− | }
| |
− |
| |
− |
| |
− | </style>
| |
− | </head>
| |
| | | |
| <body> | | <body> |
Line 898: |
Line 11: |
| <br> | | <br> |
| | | |
− | <div class="row">
| + | <b><p>Abstract</p></b> |
| + | <br> |
| + | <p>Molecular dynamics simulations were performed in order to find out the heat stability of our fusion constructs. The simulated parts of our constructs were the ones for which we did not have any data from literature regarding the heat resistance. In particular, our red fluorescent protein and keratin binding domain were simulated between 298 K and 358 K. The goal of the simulations was to help us choose the best purification strategy once we were able to produce the fusion proteins. Based on the results, we decided to use a purification protocol where the proteins are heated up to 343 K, which is faster and cheaper than using His-tags and Ni-columns for purification.</p> |
| + | <br> |
| | | |
− | <div class="col-md-4">
| + | <b><p>Introduction</p></b> |
− | <div class="c100 p32 center">
| + | <br> |
− | <span>32%</span>
| + | <p>While we were designing our silk repeat containing fusion proteins, we had been provided with a purification protocol for a similar silk based fusion construct by one of our advisors. This protocol requires heating up the mixture of unpurified proteins to denature most of the non-silk based proteins. Therefore, it was necessary to see whether or not our modified fusion proteins would be able to survive this heat treatment. If they remained functional, we could then use this faster and cheaper protocol for purification compared to using His-tags and Ni-column chromatography. Also, due to the high complexity (e.g. a high GC content) of our silk repeat sequences, we had to wait approximately one month to get the synthesized parts. To save time, instead of experimental tests we decided to use molecular dynamics (MD) simulations to find out the heat resistance of our red fluorescent protein (mRFP) and keratin binding domain (KBD), for which we were unable to find the relevant data in literature. Our other parts were known to be heat stable so they were not simulated. For example the cellulose binding domain was already known to be heat resistant because it was from a thermophilic bacterium, Clostridium thermocellum. </p> |
− | <div class="slice"><div class="bar"></div><div class="fill"></div></div>
| + | <br> |
− | </div>
| + | <p>Instead of separately simulating all of our fusion construct combinations that contained silk with either mRFP, KBD, or both, it was assumed that due to the linker sequences the behaviour of the parts that were simulated would be relatively similar to how they would act as individual non-fusion proteins. This assumption also saved a lot of computational resources and therefore time that would have been needed in order to simulate the much larger and higher amount of complete fusion proteins. </p> |
| + | <br> |
| | | |
− | <br>
| + | <b><p>Methods</p></b> |
− | <center><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sed lectus vestibulum mattis ullamcorper velit.</p></center>
| + | <br> |
− | <br>
| + | <p>MD simulations were performed using GROMACS [1] software version 2016.4. The results were visualized using VMD [2]. The computational resources were from CSC IT center for science, Finland.</p> |
− | </div>
| + | <br> |
| + | <p>Prior to running the simulations, the structural files for both mRFP (PDB ID: 2VAD) and KBD (PDB ID: 1LM5) caused some adjustments to be made in order to successfully simulate these molecules. For mRFP, the main issue was that the chromophore, i.e. the part of the molecule that causes its color, is formed by three neighboring amino acids in the peptide chain reacting with each other during the maturation of the protein. The final protein structure therefore contains a non-standard amino acid, which means that the force field files need to be modified to contain the correct parameters for the chromophore. Obtaining and validating the parameters can be difficult, but luckily Dmitrienko et al. [3] had already calculated these for the OPLS-AA force field. This is also why all of our simulations were performed using the OPLS-AA force field [4] after manually adding the correct parameters for the chromophore. Some internal residues were missing from the KBD-C structural file, which is why the SWISS-MODEL fully automated protein structure homology-modelling server [5] was used to approximate the coordinates for the missing residues. </p> |
| + | <br> |
| + | <p>After cleaning up the structure files and making the necessary changes described above, the simulations were set up by creating a periodic box around the molecules so that there was at least 1.0 nm between the protein and the box sides. Three replicates were made for both mRFP and KBD-C. This was followed by filling the simulation box with water molecules using the TIP4P water model [6]. Na+ and Cl- ions were added to neutralize the charge of the protein. Energy minimization was performed, followed by a 0.5 ns NVT equilibration and a 10 ns NPT equilibration. The final production run contained 5x 45 ns time intervals at increasing temperatures (298 K, 313 K, 328 K, 343 K, and 358 K to be precise). The temperature was kept constant for the entire time intervals except for the last 100 ps of each interval during which the system was heated up by 15 K. 343 K was the main temperature of interest due to the purification protocol that was going to be used, but the other temperatures were simulated to see if there is any change in behaviour while the system is heated up and to make the rise in temperature more even.</p> |
| + | <br> |
| | | |
− | <div class="col-md-4">
| + | <b><p>Results</p></b> |
− | <div class="c100 p12 center">
| + | <br> |
− | <span>12%</span>
| + | <p>The aim of the simulations was to find out if our proteins would denature when heated up to 343 K. Therefore, the analysis was focused on seeing if there is any change in the structure of the proteins that could indicate potential denaturing. Thus, the radius of gyration of the proteins as well as the number of hydrogen bonds within the proteins were calculated at each time interval. The first 5 ns of each time interval was not analysed to reduce possible errors caused by the the system getting used to the sudden increase in temperature. The data points and error bars were calculated by averaging the results from each time point within the time intervals and from each of the three replicate simulations. </p> |
− | <div class="slice"><div class="bar"></div><div class="fill"></div></div>
| + | <br> |
− | </div>
| + | <p>The radius of gyration (Rg) describes the dimensions of a protein by calculating the mass weighted distances of the parts of the protein around its center of mass. Significant changes of Rg at higher temperatures could mean that the tertiary structure has changed enough to destroy its functionality. The average radii of gyration as a function of temperature for mRFP and KBD-C are shown in Figure 1. </p> |
| + | <br> |
| | | |
− | <br>
| + | <img src="https://static.igem.org/mediawiki/2018/9/9e/T--Aalto-Helsinki--model1.png" class="img-fluid"> |
− | <center><p>Eu facilisis sed odio morbi. Dictumst vestibulum rhoncus est pellentesque elit ullamcorper dignissim cras. </p></center>
| + | <p>Figure 1. Radius of gyration as a function of temperature. Red circles and error bars are for mRFP, black triangles and error bars are for KBD.</p> |
− | <br>
| + | <br> |
− | </div>
| + | <p>As can be seen from Figure 1, the radius of gyration does not change significantly at any temperature for either protein. This may indicate that the proteins can tolerate these temperatures without denaturing. To further test this, the number of hydrogen bonds within the simulated proteins was analysed. Hydrogen bonds play a major part in the formation of both the secondary and tertiary structures of proteins. Therefore, a significant decrease in the amount of hydrogen bonding between amino acids would indicate denaturing of the proteins. The number of hydrogen bonds is shown as a function of temperature in Figure 2 for mRFP and KBD. </p> |
| + | <br> |
| | | |
− | <div class="col-md-4">
| |
− | <div class="c100 p54 center">
| |
− | <span>54%</span>
| |
− | <div class="slice"><div class="bar"></div><div class="fill"></div></div>
| |
− | </div>
| |
− |
| |
− | <br>
| |
− | <center><p>Sed vulputate mi sit amet. Leo vel orci porta non pulvinar neque laoreet suspendisse. Lorem ipsum dolor sit amet consectetur adipiscing elit duis tristique. Cras fermentum odio eu feugiat pretium nibh ipsum consequat nisl. </p></center>
| |
− | <br>
| |
− | </div>
| |
− |
| |
− | </div>
| |
| | | |
| + | <p>###picture here###</p> |
| + | <p>Figure 2. The number of hydrogen bonds between amino acids in the simulated proteins as a function of temperature. Red circles and error bars are for mRFP, black triangles and error bars are for KBD.</p> |
| + | <br> |
| + | <p>As can be seen from Figure 2, there is a small decrease in the number of hydrogen bonds in mRFP, whereas there is no noticeable difference in KBD. A small decrease can be expected, because higher temperatures translate to more movement of atoms.</p> |
| <br> | | <br> |
| + | <p>In conclusion, based on the results both mRFP and KBD-C should be able to stay intact at 343 K. This allowed us to purify our silk containing fusion proteins with the heat treatment protocol provided to us instead of using His-tags and Ni-column chromatography, saving time and resources.</p> |
| <br> | | <br> |
| | | |
− | <button class="btn btn-default btn-block lightblue-background blue-text" type="button" data-toggle="collapse" data-target="#collapseExample" aria-expanded="false" aria-controls="collapseExample">
| |
− | Read more
| |
− | </button>
| |
| | | |
| + | <b><p>References:</p></b> |
| <br> | | <br> |
| + | <p>1 Berendsen, H. J. C., van der Spoel, D., van Drunen, R. GROMACS: A message-passing parallel molecular dynamics implementation. Comp. Phys. Comm. 1995, 91 43–56.</p> |
| + | <br> |
| + | <p>2 Humphrey, W., Dalke, A., Schulten, K. VMD: visual molecular dynamics. J Mol Graph 1996, 14(1), 33–38.</p> |
| + | <br> |
| + | <p>3 Dmitrienko, D.V., Vrzheshch, E.P., Drutsa, V.L., Vrzheshch, P.V. Red fluorescent protein DsRed: Parametrization of its chromophore as an amino acid residue for computer modeling in the OPLS-AA force field. Biochemistry (Moscow) 2006, 71(10) 1133-1152.</p> |
| + | <br> |
| + | <p>4 Jorgensen, W. L.; Tirado-Rives, J. The OPLS Potential Functions for Proteins. Energy Minimizations for Crystals of Cyclic Peptides and Crambin. J. Am. Chem. Soc. 1988, 110 (6), 1657–1666.</p> |
| + | <br> |
| + | <p>5 Waterhouse, A., Bertoni, M., Bienert, S., Studer, G., Tauriello, G., Gumienny, R., Heer, F.T., de Beer, T.A.P., Rempfer, C., Bordoli, L., Lepore, R., Schwede, T. SWISS-MODEL: homology modelling of protein structures and complexes. Nucleic Acids Res. 2018, 46(W1), W296-W303.</p> |
| + | <br> |
| + | <p>6 Jorgensen, W. L.; Madura, J. D. Temperature and Size Dependence for Monte Carlo Simulations of TIP4P Water. Mol. Phys. 1985, 56 (6), 1381–1392.</p> |
| <br> | | <br> |
− |
| |
− | <div class="collapse" id="collapseExample">
| |
− |
| |
− | <div class="column full_size judges-will-not-evaluate">
| |
− | <h3>★ ALERT! </h3>
| |
− | <p>This page is used by the judges to evaluate your team for the <a href="https://2018.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2018.igem.org/Judging/Awards"> award listed below</a>. </p>
| |
− | <p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2018.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
| |
− | </div>
| |
− |
| |
− |
| |
− | <div class="clear"></div>
| |
− |
| |
− |
| |
− | <div class="column full_size">
| |
− | <h1> Modeling</h1>
| |
− |
| |
− | <p>Mathematical models and computer simulations provide a great way to describe the function and operation of BioBrick Parts and Devices. Synthetic Biology is an engineering discipline, and part of engineering is simulation and modeling to determine the behavior of your design before you build it. Designing and simulating can be iterated many times in a computer before moving to the lab. This award is for teams who build a model of their system and use it to inform system design or simulate expected behavior in conjunction with experiments in the wetlab.</p>
| |
− |
| |
− | </div>
| |
− | <div class="clear"></div>
| |
− |
| |
− | <div class="column full_size">
| |
− | <h3> Gold Medal Criterion #3</h3>
| |
− | <p>
| |
− | Convince the judges that your project's design and/or implementation is based on insight you have gained from modeling. This could be either a new model you develop or the implementation of a model from a previous team. You must thoroughly document your model's contribution to your project on your team's wiki, including assumptions, relevant data, model results, and a clear explanation of your model that anyone can understand.
| |
− | <br><br>
| |
− | The model should impact your project design in a meaningful way. Modeling may include, but is not limited to, deterministic, exploratory, molecular dynamic, and stochastic models. Teams may also explore the physical modeling of a single component within a system or utilize mathematical modeling for predicting function of a more complex device.
| |
− | </p>
| |
− |
| |
− | <p>
| |
− | Please see the <a href="https://2018.igem.org/Judging/Medals"> 2018
| |
− | Medals Page</a> for more information.
| |
− | </p>
| |
− | </div>
| |
− |
| |
− | <div class="column two_thirds_size">
| |
− | <h3>Best Model Special Prize</h3>
| |
− |
| |
− | <p>
| |
− | To compete for the <a href="https://2018.igem.org/Judging/Awards">Best Model prize</a>, please describe your work on this page and also fill out the description on the <a href="https://2018.igem.org/Judging/Judging_Form">judging form</a>. Please note you can compete for both the gold medal criterion #3 and the best model prize with this page.
| |
− | <br><br>
| |
− | You must also delete the message box on the top of this page to be eligible for the Best Model Prize.
| |
− | </p>
| |
− |
| |
− | </div>
| |
− |
| |
− |
| |
− | <div class="column third_size">
| |
− | <div class="highlight decoration_A_full">
| |
− | <h3> Inspiration </h3>
| |
− | <p>
| |
− | Here are a few examples from previous teams:
| |
− | </p>
| |
− | <ul>
| |
− | <li><a href="https://2016.igem.org/Team:Manchester/Model">2016 Manchester</a></li>
| |
− | <li><a href="https://2016.igem.org/Team:TU_Delft/Model">2016 TU Delft</li>
| |
− | <li><a href="https://2014.igem.org/Team:ETH_Zurich/modeling/overview">2014 ETH Zurich</a></li>
| |
− | <li><a href="https://2014.igem.org/Team:Waterloo/Math_Book">2014 Waterloo</a></li>
| |
− | </ul>
| |
− | </div>
| |
− | </div>
| |
− |
| |
− | </div> <!--collapse-->
| |
| | | |
| </div> | | </div> |