html {}
body {/*overflow: hidden;*/ background: #f8f8f8; background-image:url(img/bg5.jpg); background-repeat:no-repeat; background-position: top center; }
a:link { text-decoration:none; }
a:visited { text-decoration:none; }
a:hover { text-decoration:none; }
a:active { text-decoration:none; }
a:focus { text-decoration:none; }
::selection {
background: #ff605b; /* Safari */
color: white;
}
/*********** fadein *****************/
@keyframes fadein {
from {
opacity:0;
}
to {
opacity:1;
}
}
@-moz-keyframes fadein { /* Firefox */
from {
opacity:0;
}
to {
opacity:1;
}
}
@-webkit-keyframes fadein { /* Safari and Chrome */
from {
opacity:0;
}
to {
opacity:1;
}
}
@-o-keyframes fadein { /* Opera */
from {
opacity:0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes fadeup { /* Safari and Chrome */
from { -webkit-transform:translateY(40px);}
to { -webkit-transform:translateY(0px);}
}
/******** fadeout **************/
@keyframes fadeout {
0% { opacity:1; display: block; }
50% { opacity:1; display: block;}
100% { opacity:0; display: none;}
}
@-webkit-keyframes fadeout {
0% { opacity:1; display: block;}
50% { opacity:1; display: block;}
100% { opacity:0; display: none;}
}
@-moz-keyframes fadeout {
0% { opacity:1; display: block; }
50% { opacity:1; display: block;}
100% { opacity:0; display: none;}
}
@-o-keyframes fadeout {
0% { opacity:1; display: block;}
50% { opacity:1; display: block;}
100% { opacity:0; display: none;}
}
/*---------Animations-------------*/
@-webkit-keyframes swing {
0% { margin-top: 0px; margin-left: 0px; -webkit-transform: rotate(0deg); }
25% { margin-top: -2px; margin-left: 3px; -webkit-transform: rotate(-3deg); }
50% { margin-top: 0px; margin-left: 0px; -webkit-transform: rotate(0deg); }
75% { margin-top: -2px; margin-left: -3px; -webkit-transform: rotate(3deg); }
100% { margin-top: 0px; margin-left: 0px; -webkit-transform: rotate(0deg); }
}
@-moz-keyframes swing {
0% { margin-top: 0px; margin-left: 0px; -moz-transform: rotate(0deg); }
25% { margin-top: -2px; margin-left: 3px; -moz-transform: rotate(-3deg); }
50% { margin-top: 0px; margin-left: 0px; -moz-transform: rotate(0deg); }
75% { margin-top: -2px; margin-left: -3px; -moz-transform: rotate(3deg); }
100% { margin-top: 0px; margin-left: 0px; -moz-transform: rotate(0deg); }
}
@-webkit-keyframes rotate1 {
from{
-webkit-transform: rotate(0deg);
}
to{
-webkit-transform: rotate(-360deg);
}
}
@-webkit-keyframes rotate2 {
from{
-webkit-transform: rotate(0deg);
}
to{
-webkit-transform: rotate(360deg);
}
}
@-webkit-keyframes lefttoright {
from{
left: -50%;
}
to{
left: 100%;
}
}
@-webkit-keyframes screencolor {
0% { -webkit-transform:translateX(0px);}
35% { -webkit-transform:translateX(0px);}
70% { -webkit-transform:translateX(240px);}
85% { -webkit-transform:translateX(240px);}
100% { -webkit-transform:translateX(0px);}
}
@-webkit-keyframes waves {
0% {-webkit-transform:translateY(5px);}
50% {-webkit-transform:translateY(0px);}
100% {-webkit-transform:translateY(5px);}
}
@-webkit-keyframes pulsate {
0% { background-color: #f8f8f8; }
50% { background-color: #ff605b;}
100% { background-color: #f8f8f8;}
}
@-webkit-keyframes pound {
from { -webkit-transform: none; }
50% { -webkit-transform: scale(1.4); }
to { -webkit-transform: none; }
}
@-webkit-keyframes heartbeat {
0% {-webkit-transform:scale(1); }
7% {-webkit-transform:scale(1.05); -webkit-box-shadow: 0px 0px 50px #dddddd; }
14% {-webkit-transform:scale(1); }
21% {-webkit-transform:scale(1.05); -webkit-box-shadow: 0px 0px 50px #dddddd; }
35% {-webkit-transform:scale(1); }
}
@-webkit-keyframes
halo{ 0%{opacity:0.5;filter:alpha(opacity=0)}
50%{opacity:1;filter:alpha(opacity=100)}
100%{opacity:0.5;filter:alpha(opacity=0)}
}
/*-----------Scrollbar--------------*/
::-webkit-scrollbar {
width: 8px;
margin-right: 5px;
}
::-webkit-scrollbar-button {
width: 5px;
height:5px;
}
::-webkit-scrollbar-track {
background:#f8f8f8;
border-radius:10px;
}
::-webkit-scrollbar-thumb {
background:#ff605b;
border-radius:10px;
}
::-webkit-scrollbar-thumb:hover {
background:#7d7d7d;
}
/**********************************/
* {
-webkit-transition: all 0.5s ease ;
-moz-transition: all 0.5s ease ;
-ms-transition: all 0.5s ease ;
-o-transition: all 0.5s ease ;
}
.clear { clear: both; }
p{color: #111111; font-size: 16px; line-height: 40px; letter-spacing: 1px; font-weight: 300; font-family: 'Roboto Slab', serif;}
a {text-decoration: none;}
h1 {font-family: 'Dosis', sans-serif; font-size: 62px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 1px; text-align: center; margin-top: -12px;}
h2 {font-family: 'Dosis', sans-serif; font-size: 62px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 1px; text-align: center; margin-top: -12px;}
h3 {font-family: 'Dosis', sans-serif; font-size: 22px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 2px; text-align: center;}
h4 {font-family: 'Dosis', sans-serif; font-size: 24px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #ff605b; letter-spacing: 1px; margin-bottom: 0px;}
h5 {font-family: 'Dosis', sans-serif; font-size: 32px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 1px; margin-bottom: 28px !important;}
h6 {font-family: 'Dosis', sans-serif; font-size: 18px; font-weight:normal; color: #444444; letter-spacing: 1px;}
.center {text-align: center;}
.justify {text-align: justify;}
.left {float: left;}
.right {float: right;}
.headline {font-family: 'Dosis', sans-serif; font-size: 22px; margin-bottom: 16px !important;}
/************************* navi **********************************/
#navi {position: fixed; width: 3px; height: 100%; left: -100px; top: -10px; z-index: 100;
-webkit-transition: all 2s ease ;
-moz-transition: all 2s ease ;
-ms-transition: all 2s ease ;
-o-transition: all 2s ease ;
}
#navi2 {position: relative; margin-top: 340px; margin-left: -77px; height: 700px; width: 50px;}
#naviul {width: 108px; /*background-color: #f3f3f3;*/}
#naviul li {width: 80x; height: 22px; margin-top: 20px; margin-bottom: 20px; color: #555555;
font-family: 'Dosis', sans-serif; font-size: 14px; font-weight:500; letter-spacing:1px; overflow: hidden; padding-left: 27px; padding-top:2px; opacity:0 ;}
li#navi1button1 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button2 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button3 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button4 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button5 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button6 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
li#navi1button7 {background-image: url(img/NAVIUL1.png); background-repeat: no-repeat;}
#naviul li:hover {background-image: url(img/NAVIUL2.png); background-repeat: no-repeat; opacity:1 !important; color: #ff605b; padding-left: 27px;}
#naviul li:active {}
.naviact {background-image: url(img/NAVIUL2.png); background-repeat: no-repeat; opacity:1;}
#anchornavi {float: left; width: 10px; background: yellow; height:5000px; position: relative; opacity: 0;}
#anchor1 {position: absolute; top: 1030px;}
#anchor2 {position: absolute; top: 2140px;}
#anchor3 {position: absolute; top: 8420px;}
#anchor4 {position: absolute; top: 11730px;}
#anchor5 {position: absolute; top: 15460px;}
#anchor6 {position: absolute; top: 18600px;}
#anchor7 {position: absolute; top: 22000px;}
#anchor8 {position: absolute; top: 24260px;}
/************************* inhalt ********************************/
#wrapper {width:1200px; height:28000px; margin: 0 auto; position: relative; /*background-image: url(img/bg.jpg);*/ overflow: visible;}
#section1 {width:100%; height:1080px; position: relative;}
#section2 {width:100%; height:980px; position: relative;}
#section3 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; overflow: visible;}
#section4 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 200px;}
#section5 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 200px;}
#section6 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 260px;}
#section7 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 260px;}
#section8 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 260px;}
#section9 {width:100%; height:auto; position: relative; background: url(img/sectionbg.png) top center no-repeat; margin-top: 260px;}
/********************* Startscreen *****************************/
#headerlogo {position: absolute; width: 904px; height: 611px; background: url(img/headerlogo.jpg); margin-left: 132px; margin-top:80px;
/*animation: fadein 4s;
-moz-animation: fadein 4s; /* Firefox */
/*-webkit-animation: fadein 4s; /* Safari and Chrome */
/*-o-animation: fadein 4s; /* Opera */}
#headline1 {position: relative; margin: 0 auto; margin-top: 574px; font-size: 72px; font-weight:700 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 4px;}
#headline2 {position: relative; margin: 0 auto; margin-top: 8px; font-size: 34px; font-weight:600 ; text-transform: uppercase; opacity: 1; color: #342f36; letter-spacing: 4px;}
a#startbutton {border: 3px solid #ff605b; position: absolute; top: 216px; left: 466px; color: #f3f3f3; text-decoration: none; -moz-border-radius:28px; font-family: 'Dosis', sans-serif;
-webkit-border-radius:28px; border-radius:28px; padding:8px 55px; font-size: 22px; font-weight:500 ; text-transform: uppercase; opacity: 1; background-color: #342f36; letter-spacing: 1px;}
#startbutton:hover {border: 3px solid #342f36; color: #f3f3f3; background-color: #ff605b;
-webkit-box-shadow: 0px 0px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888;}
/******************* Introduction *******************************/
#introduction {position: relative; width: 709px; height: auto; margin: 0 auto; margin-top: 255px; opacity:0;
-webkit-transition: all 2s ease ;
-moz-transition: all 2s ease ;
-ms-transition: all 2s ease ;
-o-transition: all 2s ease ;}
a#continuebutton {border: 3px solid #ff605b; position: absolute; top: 389px; left: 180px; color: #f3f3f3; text-decoration: none; -moz-border-radius:28px; font-family: 'Dosis', sans-serif;
-webkit-border-radius:28px; border-radius:28px; padding:8px 55px; font-size: 22px; font-weight:500 ; text-transform: uppercase; opacity: 1; background-color: #342f36; letter-spacing: 1px;}
#continuebutton:hover {border: 3px solid #342f36; color: #f3f3f3; background-color: #ff605b;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888;}
/******************* DESIGN **************************/
#designteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#designteaser:first-letter, #design0outro:first-letter, #design2outro:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#design0 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 100px; overflow: hidden;}
#design0text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#design0text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#design0graphic {position: relative; width:1050px; height: 450px; margin: 0 auto; margin-top: 70px; margin-bottom: 20px; }
.flip {
-webkit-perspective: 800;
width: 240px;
height: 440px;
position: relative;
margin: 0 8px;;
float: left;
}
.flip .card.flipped {
-webkit-transform: rotatey(-180deg);
}
.flip .card {
width: 100%;
height: 100%;
-webkit-transform-style: preserve-3d;
-webkit-transition: 0.8s;
}
.flip .card .face {
width: 100%;
height: 100%;
position: absolute;
-webkit-backface-visibility: hidden ;
z-index: 2;
}
.flip .card .front {
position: absolute;
z-index: 1;
background: black;
color: white;
cursor: pointer;
}
.flip .card .back {
-webkit-transform: rotatey(-180deg);
background: blue;
background: #ff605b;
color: black;
cursor: pointer;
}
#design0commodity {position: relative; float:left; width:240px; height: 440px; border: 2px solid grey; -webkit-border-radius: 3px; background: url(img/design0commodity.png) top center no-repeat;}
#design0commodity:hover {border: 2px solid #ff605b;}
#design0coin {position: relative; float: left; width:240px; height: 440px; border: 2px solid grey; -webkit-border-radius: 3px; background: url(img/design0coin.png) top center no-repeat;}
#design0paper {position: relative; float: left; width:240px; height: 440px; border: 2px solid grey; -webkit-border-radius: 3px; background: url(img/design0paper.png) top center no-repeat;}
#design0electronic {position: relative; float: left; width:240px; height: 440px; border: 2px solid grey;-webkit-border-radius: 3px; background: url(img/design0electronic.png) top center no-repeat;}
#design0commodityB, #design0coinB, #design0paperB, #design0electronicB {border: 2px solid #ff605b; -webkit-border-radius: 3px;}
#design0commodityB p, #design0coinB p, #design0paperB p, #design0electronicB p {color: white;}
#design0commodityB h4, #design0coinB h4, #design0paperB h4, #design0electronicB h4 {color: white;}
#design0graphic p {position: relative; margin: 0 auto; margin-top: 60px; width: 210px; height: auto; font-size: 12px; font-weight:300; line-height: 18px;}
#design0commodity:hover #design0commodityB {opacity: 1; top: 0;}
#design0coin:hover #design0coinB {opacity: 1; top: 0;}
#design0paper:hover #design0paperB {opacity: 1; top: 0;}
#design0electronic:hover #design0electronicB {opacity: 1; top: 0;}
#design0outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 80px;}
#design1 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 100px; overflow: hidden; opacity: 0; top: 40px;}
#design1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#design1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#design1graphic {position: relative; width:1050px; height: 250px; margin: 0 auto; margin-top: 70px; }
.design1memberM {position: relative; float: left; width: 70px; height: 70px; background: url(img/memberM.png) top center no-repeat; opacity: 0.2;}
.design1memberF {position: relative; float: left; width: 70px; height: 70px; background: url(img/memberF.png) top center no-repeat; opacity: 0.2;}
/*#member1 {background: url(img/member1.png);}
#member2 {background: url(img/member2.png);}
#member3 {background: url(img/member3.png);}
#member4 {background: url(img/member4.png);}
#member5 {background: url(img/member5.png);}
#member6 {background: url(img/member6.png);}
#member7 {background: url(img/member7.png);}
#member8 {background: url(img/member8.png);}
#member9 {background: url(img/member9.png);}
#member10 {background: url(img/member10.png);}
#member11 {background: url(img/member11.png);}
#member12 {background: url(img/member12.png);}
#member13 {background: url(img/member13.png);}
#member14 {background: url(img/member14.png);}
#member15 {background: url(img/member15.png);}*/
.design1memberM:hover, .design1memberF:hover {opacity: 1; -webkit-transform: scale(1.25); }
#design1memberName {position: relative; float: left; height: 150px; width: 350px; margin-top: 50px; margin-left: 65px;}
#design1memberNationality {position: relative; float: left; height: 150px; width: 200px; margin-top: 50px; margin-left: 5px;}
#design1memberOccupation {position: relative; float: left; height: 150px; width: 350px; margin-top: 50px; margin-left: 5px;}
#design1memberName h4, #design1memberNationality h4, #design1memberOccupation h4 {font-size:14px; margin-top: 1px; text-align: center;}
#design1memberName p, #design1memberNationality p, #design1memberOccupation p {text-align: center; /*text-transform: uppercase;*/}
#design1outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px;}
#design1outro:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#design2 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 00px; overflow: hidden; opacity: 0; top: 40px;}
#design2text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px; margin-top: 100px;}
#design2text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#design2graphic {position: relative; width:1050px; height: 450px; margin: 0 auto; margin-top: 45px;}
#design2five {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill5.png); opacity: 0.2; }
#design2ten {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill10.png); opacity: 0.2;}
#design2twenty {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill20.png); opacity: 0.2;}
#design2fifty {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill50.png); opacity: 0.2;}
#design2hundred {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill100.png); opacity: 0.2;}
#design2twohundred {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill200.png); opacity: 0.2;}
#design2fivehundred {position: relative; width: 150px; height: 80px; float: left; background: url(img/designbill500.png); opacity: 0.2;}
#design2five:hover, #design2ten:hover, #design2twenty:hover, #design2fifty:hover, #design2hundred:hover, #design2twohundred:hover, #design2fivehundred:hover {opacity:1 !important; cursor: pointer;}
#design2era {position: relative; float: left; height: 280px; width: 300px; margin-top: 50px; margin-left: 15px; margin-right: 70px; background: url(img/designera0.png); opacity: 1;}
#design2color {position: relative; float: left; height: 280px; width: 300px; margin-top: 50px; margin-left: 5px; background: url(img/designcolor0.png); opacity: 1; }
#design2measure {position: relative; float: left; height: 280px; width: 300px; margin-top: 50px; margin-left: 55px; background: url(img/designmeasure0.png); opacity: 1; }
#design2era h4, #design2color h4, #design2measure h4 {font-size:14px; margin-top: 1px; text-align: center;}
#design2era p, #design2color p, #design2measure p {position: relative; text-align: center; margin-top: 220px; }
#design2outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px;}
#design3 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 40px; overflow: hidden;}
#design3text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; border-top: 2px dotted grey; border-bottom: 2px dotted grey; margin-top: 100px;}
#design3text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#design4 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 20px; overflow: hidden; }
#design4text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#design4text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#design4graphic {position: relative; width:1050px; height: auto; margin: 0 auto; margin-top: 20px; background: url(img/design4winnerbox1.png) top center no-repeat; -webkit-transition: all 2s ease ;}
#design4ages {position: relative; width: 400px; height: auto; float: left;}
.agesbox {position: relative; width: 300px; height: 105px; margin-bottom: 15px; padding-left: 50px;}
#design4abstract {position: relative; width: 400px; height: auto; float: right;}
.abstractbox {position: relative; float: right; width: 300px; height: 105px; margin-bottom: 15px; padding-right: 50px;}
.designerM {position: relative; width: 90px; height: 105px; background: url(img/designerM.png) top center no-repeat; text-align: center;}
.designerF {position: relative; width: 90px; height: 105px; background: url(img/designerF.png) top center no-repeat; text-align: center;}
.designerM h4, .designerF h4 {color: #342f36; position: relative; font-size:14px; font-weight: 300; padding-top: 55px; text-align: center; text-transform: none;}
#design4winner {position: relative; width: 300px; height: 350px; margin: 0 auto; margin-top: -50px; background: url(img/designwinner.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:1s;}
#design4winner h4 {position: relative; padding-top: 265px; text-align: center; text-transform: none;}
#design4winner h4 span {font-size: 24px; font-weight: 400; }
#design4winner p {margin-top: 0px;}
#design4winnerdata1 {position: relative; float: left; width: 250px; height: 300px; margin-top: -150px; margin-right: 10px;
-webkit-transition: all 1s ease ; -moz-transition: all 1s ease ; -ms-transition: all 1s ease ; -o-transition: all 1s ease ;
-webkit-transition-delay:0s; opacity: 0; background: url(img/design4winnerdata1.png) top center no-repeat; -webkit-transform:translateY(40px);}
#design4winnerdata2 {position: relative; float: left; width: 250px; height: 300px; margin-top: 30px; margin-right: 10px;
-webkit-transition: all 1s ease ; -moz-transition: all 1s ease ; -ms-transition: all 1s ease ; -o-transition: all 1s ease ;
-webkit-transition-delay:1s; opacity: 0; background: url(img/design4winnerdata2.png) top center no-repeat; -webkit-transform:translateY(40px);}
#design4winnerdata3 {position: relative; float: left; width: 250px; height: 300px; margin-top: 30px; margin-right: 10px;
-webkit-transition: all 1s ease ; -moz-transition: all 1s ease ; -ms-transition: all 1s ease ; -o-transition: all 1s ease ;
-webkit-transition-delay:2s; opacity: 0; background: url(img/design4winnerdata3.png) top center no-repeat; -webkit-transform:translateY(40px);}
#design4winnerdata4 {position: relative; float: left; width: 250px; height: 300px; margin-top: -150px; margin-right: 10px;
-webkit-transition: all 1s ease ; -moz-transition: all 1s ease ; -ms-transition: all 1s ease ; -o-transition: all 1s ease ;
-webkit-transition-delay:3s; opacity: 0; background: url(img/design4winnerdata4.png) top center no-repeat; -webkit-transform:translateY(40px);}
#design4winnerdata1 h6, #design4winnerdata2 h6, #design4winnerdata3 h6, #design4winnerdata4 h6 {margin-top: 183px; line-height: 25px;}
#designfooter {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px; text-align: justify;}
#designfooter:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#design1, #design2, #design3, #design4 {-webkit-transition: all 1s ease ;
-moz-transition: all 1s ease ;
-ms-transition: all 1s ease ;
-o-transition: all 1s ease ;}
/******************* SUBSTRATE **************************/
#substrateteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#substrateteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#substrategraphic {position: relative; width:1050px; height: auto; min-height: 1500px; margin: 0 auto; margin-top: 20px; -webkit-transition: all 2s ease ;}
#substrate1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px; margin-top: 65px;}
#substrate1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#substrateAtext {position: relative; width: 600px; height: 100px; text-align: center; margin: 0 auto; margin-top: 50px;}
#substrateA {position: relative; width: 1040px; height: 400px; margin: 0 auto; margin-top: -50px; overflow: hidden; }
#substrateA1 {position: absolute; width: 149px; height: 124px; top: 14px; left: 140px; background: url(img/substratecloth1.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:0s;}
#substrateA2 {position: absolute; width: 149px; height: 124px; top: 79px; left: 281px; background: url(img/substratecloth2.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:0.5s;}
#substrateA3 {position: absolute; width: 149px; height: 124px; top: 233px; left: 206px; background: url(img/substratecloth4.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:1s;}
#substrateA4 {position: absolute; width: 149px; height: 124px; top: 233px; left: 071px; background: url(img/substratecloth3.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:1.5s;}
#substrateA5 {position: absolute; width: 149px; height: 124px; top: 79px; left: 012px; background: url(img/substratecloth5.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:2s;}
#substrateA6 {position: absolute; width: 149px; height: 124px; top: 130px; left: 136px; background: url(img/substratecloth6.png) top center no-repeat;
-webkit-transition: all 2s ease ; -webkit-transform: scale(0); opacity: 0; -webkit-transition-delay:2.5s;}
#substrateAA {position: absolute; width: 1040px; height: 400px; top: 0px; left:0; background: url(img/substrateA2.png) top center no-repeat; opacity: 0; -webkit-transition: all 2s ease ; opacity: 0; -webkit-transition-delay:4.5s;}
/*
#substrateA:hover #substrateAA { opacity: 1; }
#substrateA:hover #substrateA1, #substrateA:hover #substrateA2, #substrateA:hover #substrateA3, #substrateA:hover #substrateA4, #substrateA:hover #substrateA5, #substrateA:hover #substrateA6 {-webkit-transform: scale(1); opacity: 1;}
*/
#substrateAtext p, #substrateBtext p, #substrateAB p {font-size: 14px; line-height: 20px;}
#substrateAB {position: relative; width: 600px; height: 100px; text-align: center; margin: 0 auto; margin-top: 50px; }
#substrateAB p {line-height: 30px !important;}
#substrateB{position: relative; width: 650px; height: 450px; background: url(img/substratemouldbg.png) top center no-repeat; margin: 0 auto; margin-top: -50px;}
#substrateB1 {position: absolute; width: 151px; height: 151px; background: url(img/mouldcylinder1.png) top center no-repeat; top: 130px; left: 252px; -webkit-animation: rotate2 2s linear infinite;}
#substrateB2 {position: absolute; width: 302px; height: 20px; background: url(img/mouldwaves.png) top left no-repeat; top: 242px; left: 174px; -webkit-animation: waves 4s ease infinite;}
#substrateB4 {position: absolute; width: 121px; height: 121px; background: url(img/substratemould1.png) top left no-repeat; top: 105px; left: 29px; -webkit-transform: scale(1);}
#substrateB5 {position: absolute; width: 140px; height: 121px; background: url(img/substratemould2.png) top left no-repeat; top: 104px; left: 493px;}
#substrateBtext {position: relative; width: 950px; height: 200px; text-align: center; margin: 0 auto; margin-top: -100px;}
#substrateteaser2 {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 0px; text-align: justify;}
#substrateteaser2:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#substratenode1 {top: 124px; left: 190px;}
#substratenode2 {top: 80px; left: 319px;}
#substratenode3 {top: 112px; left: 453px;}
#cylindermouldp {line-height: 34px !important; color: #ff605b; font-family: 'Dosis', sans-serif; font-size: 20px !important;text-align: center;}
#cylindermouldp span {text-transform: uppercase; font-weight: bold;}
.substrateC {position: relative; float: left; width: 200px; height: 300px; margin-left: 50px; margin-top: 10px;}
.substrateC h6 {margin-top: 183px; line-height: 25px;}
#substrateC1 {background: url(img/substrateicon1.png) top center no-repeat; opacity: 0; -webkit-transform: translateY(30px); -webkit-transition: all 2s ease ;}
#substrateC2 {background: url(img/substrateicon2.png) top center no-repeat; opacity: 0; -webkit-transform: translateY(30px); -webkit-transition: all 2s ease ; -webkit-transition-delay:0.75s;}
#substrateC3 {background: url(img/substrateicon3.png) top center no-repeat; opacity: 0; -webkit-transform: translateY(30px); -webkit-transition: all 2s ease ; -webkit-transition-delay:1.5s;}
#substrateC4 {background: url(img/substrateicon4.png) top center no-repeat; opacity: 0; -webkit-transform: translateY(30px); -webkit-transition: all 2s ease ; -webkit-transition-delay:2.25s;}
/*
#substrate1 {position: relative; width: 1200px; height: 250px; margin: 0 auto; margin-top: 100px; overflow: hidden; opacity: 0; top: 40px;}
#substrate1icon {position: relative; float: left; width: 250px; height:250px; background: url(img/iconbg2.png) top center no-repeat; margin-right: 75px;}
#substrate1text {position: relative; float: left; width: 850px; height:250px;}
#substrate1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#substrate2 {position: relative; width: 1200px; height: 250px; margin: 0 auto; margin-top: 60px; overflow: hidden; opacity: 0; top: 40px;}
#substrate2icon {position: relative; float: left; width: 250px; height:250px; background: url(img/iconbg2.png) top center no-repeat; margin-right: 75px;}
#substrate2text {position: relative; float: left; width: 850px; height:250px;}
#substrate2text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#substrate3 {position: relative; width: 1200px; height: 250px; margin: 0 auto; margin-top: 60px; overflow: hidden; opacity: 0; top: 40px;}
#substrate3icon {position: relative; float: left; width: 250px; height:250px; background: url(img/iconbg2.png) top center no-repeat; margin-right: 75px;}
#substrate3text {position: relative; float: left; width: 850px; height:250px;}
#substrate3text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#substrate4 {position: relative; width: 1200px; height: 250px; margin: 0 auto; margin-top: 60px; overflow: hidden; opacity: 0; top: 40px;}
#substrate4icon {position: relative; float: left; width: 250px; height:250px; background: url(img/iconbg2.png) top center no-repeat; margin-right: 75px;}
#substrate4text {position: relative; float: left; width: 850px; height:250px;}
#substrate4text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
*/
#substratefooter {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 60px; text-align: justify;}
#substratefooter:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#substrate1, #substrate2, #substrate3, #substrate4 {-webkit-transition: all 1s ease ;
-moz-transition: all 1s ease ;
-ms-transition: all 1s ease ;
-o-transition: all 1s ease ;}
/************** PRINTING **********************/
#printteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#printteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#print1 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 100px; top: 40px;}
#print1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#print1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#print1graphic {position: relative; margin: 0 auto; width:1050px; height: 760px; background: url(img/printmap.png) top center no-repeat; margin-top: 70px; }
.printnode {position: absolute; width: 8px; height: 8px; border: 3px solid #ff605b; border-radius: 50%; /*-webkit-animation: pound 2s linear infinite;*/}
.printnode:hover { background-color: #ff605b !important; -webkit-animation:0; cursor: pointer;}
.printloc {position: absolute; width: auto; height: 24px; text-align: center; background-color: #ff605b; padding: 0 10px; -webkit-border-radius: 3px; -webkit-transform:translateY(20px);}
#printloc1 {top: 256px; left: 554px; opacity: 0;}
#printloc2 {top: 395px; left: 192px; opacity: 0;}
#printloc3 {top: 294px; left: 244px; opacity: 0;}
#printloc4 {top: 357px; left: 321px; opacity: 0;}
#printloc5 {top: 426px; left: 237px; opacity: 0;}
#printloc6 {top: 466px; left: 143px; opacity: 0;}
#printloc7 {top: 516px; left: 183px; opacity: 0;}
#printloc8 {top: 571px; left: 169px; opacity: 0;}
#printloc9 {top: 657px; left: 93px; opacity: 0;}
#printloc10 {top: 348px; left: 410px; opacity: 0;}
#printloc11 {top: 418px; left: 490px; opacity: 0;}
#printloc12 {top: 501px; left: 397px; opacity: 0;}
#printloc13{top: 513px; left: 457px; opacity: 0;}
#printloc14 {top: 554px; left: 418px; opacity: 0;}
#printloc15 {top: 612px; left: 583px; opacity: 0;}
.printloc h6 {margin-top: 0px !important; color: #f8f8f8; font-weight: bold;}
#printnode1 {top:220px; left:600px;}
#printnode2 {top:360px; left:260px;}
#printnode3 {top:340px; left:315px;}
#printnode4 {top:400px; left:393px;}
#printnode5 {top:432px; left:386px;}
#printnode6 {top:472px; left:305px;}
#printnode7 {top:522px; left:355px;}
#printnode8 {top:622px; left:235px;}
#printnode9 {top:627px; left:162px;}
#printnode10 {top:394px; left:480px;}
#printnode11 {top:422px; left:470px;}
#printnode12 {top:470px; left:464px;}
#printnode13 {top:480px; left:522px;}
#printnode14 {top:596px; left:483px;}
#printnode15 {top:654px; left:651px;}
#print1location {position: absolute; width:300px; height: 100px; top: 0px; left: 120px; }
#print1location h4, #print1company h4, #print1data h4, #printcode h4 {font-size: 21px;}
#print1location p, #print1company p, #printcode p{margin-top: 10px; line-height: 20px;}
#print1data p {margin-top: 10px; line-height: 28px;}
#print1company {position: absolute; width:300px; height: 100px; top: 100px; left: 120px; }
#print1data {position: absolute; width:300px; height: 100px; top: 100px; right: 80px; text-align: right;}
#printcode {position: absolute; width: 300px; height: 100px; top: 0px; right: 80px; text-align: right;}
#print1outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px;}
#print1outro2 {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 80px;}
#print2 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 100px; overflow: hidden;}
#print2text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#print2text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#print2graphic {position: relative; width:1050px; height: auto; margin: 0 auto; margin-top: 30px; margin-bottom: 20px; }
#print2buttons {position: relative; width: 900px; height: 50px; margin: 0 auto; margin-top: 20px;}
#print2button1, #print2button2, #print2button3, #print2button4 {position: relative; float: left; width: 159px; height:30px; border: 2px solid #ff605b; color: #ff605b; text-decoration: none; -moz-border-radius:9px; font-family: 'Dosis', sans-serif;
-webkit-border-radius:9px; border-radius:9px; text-align: center; font-weight:600 ; text-transform: uppercase; opacity: 1; letter-spacing: 1px; margin-left: 50px; padding-top: 10px; cursor: pointer;}
#print2button1 {background-color: #ff605b; color: #f3f3f3;}
#print2canvas {position: relative; width: 1050px; height: 700px; margin: 0 auto; overflow: hidden; margin-top: 0px;}
/* OFFSETPRINT */
#print2offset {position: absolute; width: 1050px; height: 600px; display: block; background: url(img/print2offsetbg.png) top center no-repeat;}
#print2offset0 {width: 400px; height: 8px; position: absolute; top: 263px; left: -200px; border: 3px solid grey; -webkit-border-radius: 8px; -webkit-animation: lefttoright 8s linear infinite;}
#print2offset1 {width: 120px; height: 120px; position: absolute; top: 60px; left: 70px; background: url(img/print2offset1a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 0.4;}
#print2offset2 {width: 120px; height: 120px; position: absolute; top: 140px; left: 160px; background: url(img/print2offset2a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 0.4;}
#print2offset3 {width: 120px; height: 120px; position: absolute; top: 360px; left: 70px; background: url(img/print2offset1a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 0.4;}
#print2offset4 {width: 120px; height: 120px; position: absolute; top: 280px; left: 160px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 0.4;}
#print2offset5a {width: 50px; height: 50px; position: absolute; top: 30px; left: 360px; background: url(img/print2offset5a.png) -27px -33px no-repeat; }
#print2offset5b {width: 50px; height: 50px; position: absolute; top: 30px; left: 30px; background: url(img/print2offset5a.png) -27px -33px no-repeat; opacity: 0.4;}
#print2offset5c {width: 50px; height: 50px; position: absolute; top: 30px; left: 690px; background: url(img/print2offset5a.png) -27px -33px no-repeat; opacity: 0.4;}
#print2offset5d {width: 50px; height: 50px; position: absolute; top: 450px; left: 30px; background: url(img/print2offset5a.png) -27px -33px no-repeat; opacity: 0.4;}
#print2offset5e {width: 50px; height: 50px; position: absolute; top: 450px; left: 360px; background: url(img/print2offset5a.png) -27px -33px no-repeat; opacity: 1;}
#print2offset5f {width: 50px; height: 50px; position: absolute; top: 450px; left: 690px; background: url(img/print2offset5a.png) -27px -33px no-repeat; opacity: 0.4;}
#print2offset6 {width: 120px; height: 120px; position: absolute; top: 60px; left: 400px; background: url(img/print2offset1a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1;}
#print2offset6:hover {background: url(img/print2offset1b.png);}
#print2offset7 {width: 120px; height: 120px; position: absolute; top: 140px; left: 490px; background: url(img/print2offset2a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 1;}
#print2offset8 {width: 120px; height: 120px; position: absolute; top: 360px; left: 400px; background: url(img/print2offset1a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 1;}
#print2offset9 {width: 120px; height: 120px; position: absolute; top: 280px; left: 490px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1;}
#print2offset10 {width: 120px; height: 120px; position: absolute; top: 60px; left: 730px; background: url(img/print2offset1a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 0.4;}
#print2offset11 {width: 120px; height: 120px; position: absolute; top: 140px; left: 820px; background: url(img/print2offset2a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 0.4;}
#print2offset12 {width: 120px; height: 120px; position: absolute; top: 360px; left: 730px; background: url(img/print2offset1a.png); -webkit-animation: rotate1 2s linear infinite; opacity: 0.4;}
#print2offset13 {width: 120px; height: 120px; position: absolute; top: 280px; left: 820px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 0.4;}
#offsetnode1 {top: 96px; left: 338px;}
#offsetnode1frame { position: absolute; top: 20px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#offsetnode2 {top: 80px; left: 560px;}
#offsetnode2frame { position: absolute; top: 20px; left:720px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#offsetnode3 {top: 203px; left: 633px;}
#offsetnode3frame { position: absolute; top: 300px; left: 720px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#offsetnode2frame h6, #offsetnode1frame h6, #offsetnode3frame h6 {margin-top: 0 !important; color: #ff605b; font-weight: bold;}
#offsetnode2frame p, #offsetnode1frame p, #offsetnode3frame p {margin-top: -10px !important; font-size: 14px; line-height: 22px;}
#offsetnode2frame p span, #offsetnode1frame p span, #offsetnode3frame p span {text-transform: uppercase; color: #ff605b; font-weight: bold;}
/* INTAGLIOPRINT */
#print2intaglio {position: absolute; width: 1050px; height: 600px; top: 0px; left: 0px; display: none; background: url(img/print2intagliobg.png);}
#print2intaglio0 {width: 400px; height: 8px; position: absolute; top: 263px; left: -200px; border: 3px solid grey; -webkit-border-radius: 8px; -webkit-animation: lefttoright 8s linear infinite;}
#print2intaglio1 {position: absolute; width: 200px; height: 200px; top: 60px; left: 424px; background: url(img/print2intaglio1.png); -webkit-animation: rotate1 4s linear infinite; opacity: 1; -webkit-animation-delay:0.3s;}
#print2intaglio2 {width: 120px; height: 120px; position: absolute; top: 277px; left: 467px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1; }
#print2intaglio3a {width: 50px; height: 50px; position: absolute; top: 30px; left: 360px; background: url(img/print2offset5a.png) -27px -33px no-repeat; }
#intaglionode1 {top: 100px; left: 328px;}
#intaglionode1frame {position: absolute; top: 20px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#intaglionode2 {top: 194px; left: 657px;}
#intaglionode2frame { position: absolute; top: 20px; left:720px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#intaglionode3frame { position: absolute; top: 300px; left: 720px; width: 280px; height: 140px; border: 1px solid red; background: url(img/print2intaglionode3.png) 10px center no-repeat; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#intaglionode2frame h6, #intaglionode1frame h6, #intaglionode3frame h6 {margin-top: 0 !important; color: #ff605b; font-weight: bold;}
#intaglionode2frame p, #intaglionode1frame p, #intaglionode3frame p {margin-top: -10px !important; font-size: 14px; line-height: 22px;}
#intaglionode2frame p span, #intaglionode1frame p span, #intaglionode3frame p span {text-transform: uppercase; color: #ff605b; font-weight: bold;}
/* SCREENPRINT */
#print2screen {position: absolute; width: 1050px; height: 600px; top: 0px; left: 0px; display: none; background: url(img/print2screenbg.png);}
#print2screen0 {width: 400px; height: 8px; position: absolute; top: 263px; left: -200px; border: 3px solid grey; -webkit-border-radius: 8px; -webkit-animation: lefttoright 8s linear infinite; }
#print2screen1 {width: 120px; height: 120px; position: absolute; top: 277px; left: 267px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1; }
#print2screen2 {width: 120px; height: 120px; position: absolute; top: 277px; left: 667px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1; }
#print2screen3 {width: 420px; height: 220px; position: absolute; top: 80px; left: 316px; background: url(img/print2screen3.png); }
#print2screen4 {position: absolute; width: 100px; height: 100px; background: url(img/print2screen4.png); top: 134px; left: 366px; -webkit-animation: screencolor 8s linear infinite; }
#print2screen5 {width: 50px; height: 50px; position: absolute; top: 77px; left: 376px; background: url(img/print2offset5a.png) -27px -33px no-repeat; }
#screennode1 {top: 100px; left: 328px;}
#screennode1frame {position: absolute; top: 20px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#screennode2 {top: 194px; left: 687px;}
#screennode2frame { position: absolute; top: 20px; left:735px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#screennode3frame { position: absolute; top: 300px; left: 805px; width: 211px; height: 140px; border: 1px solid red; background: url(img/print2screennode3.png) 10px center no-repeat; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#screennode2frame h6, #screennode1frame h6, #screennode3frame h6 {margin-top: 0 !important; color: #ff605b; font-weight: bold;}
#screennode2frame p, #screennode1frame p, #screennode3frame p {margin-top: -10px !important; font-size: 14px; line-height: 22px;}
#screennode2frame p span, #screennode1frame p span, #screennode3frame p span {text-transform: uppercase; color: #ff605b; font-weight: bold;}
/* RELIEFPRINT */
#print2relief {position: absolute; width: 1050px; height: 600px; top: 0px; left: 0px; display: none; background: url(img/print2reliefbg.png);}
#print2relief0 {width: 400px; height: 8px; position: absolute; top: 263px; left: -200px; border: 3px solid grey; -webkit-border-radius: 8px; -webkit-animation: lefttoright 8s linear infinite; }
#print2relief1 {position: absolute; width:250px; height: 250px; top: 11px; left: 392px; background: url(img/print2relief1.png); -webkit-animation: rotate1 4s linear infinite; opacity: 1; -webkit-animation-delay:-3s;}
#print2relief2 {width: 120px; height: 120px; position: absolute; top: 277px; left: 467px; background: url(img/print2offset2a.png); -webkit-animation: rotate2 2s linear infinite; opacity: 1; }
#print2relief3a {width: 50px; height: 50px; position: absolute; top: 30px; left: 298px; background: url(img/print2offset5a.png) -27px -33px no-repeat; }
#reliefnode1 {top: 119px; left: 295px;}
#reliefnode1frame {position: absolute; top: 0px; width: 224px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#reliefnode2 {top: 194px; left: 657px;}
#reliefnode2frame { position: absolute; top: 20px; left:720px; width: 280px; height: auto; border: 1px solid red; background: f8f8f8; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#reliefnode3frame { position: absolute; top: 300px; left: 720px; width: 280px; height: 140px; border: 1px solid red; background: url(img/print2reliefnode3.png) 10px center no-repeat; z-index: 200; padding: 10px; text-align: center; -webkit-border-radius: 2px; opacity: 0;}
#reliefnode2frame h6, #reliefnode1frame h6, #reliefnode3frame h6 {margin-top: 0 !important; color: #ff605b; font-weight: bold;}
#reliefnode2frame p, #reliefnode1frame p, #reliefnode3frame p {margin-top: -10px !important; font-size: 14px; line-height: 22px;}
#reliefnode2frame p span, #reliefnode1frame p span, #reliefnode3frame p span {text-transform: uppercase; color: #ff605b; font-weight: bold;}
/*************/
#print2canvastext {position: absolute; z-index: 500; width: 850px; height: 150px; bottom: 10px; left: 100px; }
p#print2canvasp {color: #ff605b !important; font-size: 15px; line-height: 23px; letter-spacing: 1px; font-weight: 400; text-align: center; }
p#print2canvasp span {font-weight: bold; color:#ff605b; text-transform: uppercase; line-height: 60px; }
#print2outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px;}
#print2outro2 {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px;}
#printfooter {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 120px; text-align: justify;}
#print1, #print2, #print3, #print4 {-webkit-transition: all 1s ease ;
-moz-transition: all 1s ease ;
-ms-transition: all 1s ease ;
-o-transition: all 1s ease ;}
/************** THE BILL ***********************/
#billteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#billteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#bill1 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 100px; top: 40px;}
#bill1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#bill1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#bill1graphic1 {position: relative; width: 1050px; height: 700px; margin: 0 auto; margin-top: 100px; background: url(img/bill1front.png) top center no-repeat;}
#bill1fronthead {position: absolute; left: 424px; top: 0px; font-size: 36px;}
#bill1backhead {position: absolute; left: 424px; top: 0px; font-size: 36px;}
.billnode {position: absolute; background: url(img/node.png) top center no-repeat; width: 39px; height: 39px; -webkit-transform: scale(0.7);
-webkit-animation: halo 1s ease-out 0s infinite normal; margin-left: -12px; margin-top:-12px;}
.billnode:hover { -webkit-transform: scale(1); -webkit-animation:0; cursor: pointer;}
#billnode1 {top: 613px; left: 249px;}
#billnode1:hover + #billnode1frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode1frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 315px; left: 400px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode1frame img {position: absolute; top: 100px; left: -225px; border: 3px solid #ff605b; width: 150px; height: 126px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode2 {top: 333px; left: 57px;}
#billnode2:hover + #billnode2frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode2frame {position: absolute; width: 500px; height: 300px; border: 3px solid #ff605b; background: #f8f8f8; top: 315px; left: 400px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888; opacity: 0; padding: 15px; padding-left: 40px; padding-right: 40px;
background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#watermarkcontainer {position: absolute; top: -80px; left: -225px; border: 3px solid #ff605b; width: 150px; height: 194px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888; -webkit-border-radius: 3px; overflow:hidden;}
#watermarkcontainer img {position: absolute; top:-50px; left: -30px;}
#billnode3 {top: 73px; left: 841px;}
#billnode3:hover + #billnode3frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode3frame {position: absolute; width: 400px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 110px; left: 230px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode3frame img {position: absolute; top: 23px; left: 560px; border: 3px solid #ff605b; width: 102px; height: 420px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode4 {top: 73px; left: 330px;}
#billnode4:hover + #billnode4frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode4frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 450px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode4frame img {position: absolute; top: 43px; left: -170px; border: 3px solid #ff605b; width: 110px; height: 260px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode5 {top: 73px; left: 461px;}
#billnode5:hover + #billnode5frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode5frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 520px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode5frame img {position: absolute; top: -60px; left: -67px; border: 3px solid #ff605b; width: 17px; height: 429px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode6 {top: 73px; left: 776px;}
#billnode6:hover + #billnode6frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode6frame {position: absolute; width: 400px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 220px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode6frame img {position: absolute; top: -45px; left: 542px; border: 3px solid #ff605b; width: 30px; height: 60px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode7{top: 73px; left: 903px;}
#billnode7:hover + #billnode7frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode7frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 110px; left: 280px; padding: 15px; padding-left: 40px; padding-right: 40px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode7frame1 {position: absolute; top: 43px; left: -170px; border: 3px solid #ff605b; width: 62px; height: 380px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode7frame2 {position: absolute; top: 43px; left: 590px; border: 3px solid #ff605b; width: 62px; height: 380px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode8 {top: 613px; left: 389px;}
#billnode8:hover + #billnode8frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode8frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 520px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode8frame img {position: absolute; top: 115px; left: -186px; border: 3px solid #ff605b; width: 111px; height: 80px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#bill1graphic2 {position: relative; width: 1050px; height: 700px; margin: 0 auto; margin-top: 100px; background: url(img/bill1back.png) top center no-repeat; }
#billnode9 {top: 77px; left: 300px;}
#billnode9:hover + #billnode9frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode9frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 450px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode9frame img {position: absolute; top: -20px; left: -210px; border: 3px solid #ff605b; width: 119px; height: 67px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode10 {top: 77px; left: 651px;}
#billnode10:hover + #billnode10frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode10frame {position: absolute; width: 400px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 190px; left: 50px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode10frame img {position: absolute; top: 22px; left: 575px; border: 3px solid #ff605b; width: 170px; height: 325px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode11{top: 77px; left: 760px;}
#billnode11:hover + #billnode11frame {display: block; opacity: 1; -webkit-transform: scale(1);}
#billnode11frame {position: absolute; width: 500px; height: auto; border: 3px solid #ff605b; background: #f8f8f8; top: 260px; left: 550px; -webkit-border-radius: 3px; padding: 15px; padding-left: 40px; padding-right: 40px;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888; opacity: 0; background: #f8f8f8; text-align: center; /*-webkit-transform: scale(0);*/}
#billnode11frame1 {position: absolute; top: -87px; left: 83px; border: 3px solid #ff605b; width: 250px; height: 50px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billnode11frame2 {position: absolute; top: 131px; left: -121px; border: 3px solid #ff605b; width: 50px; height: 140px; -webkit-border-radius: 3px;
-webkit-box-shadow: 10px 10px 50px #888888; -moz-box-shadow: 10px 10px 50px #888888; box-shadow: 10px 10px 50px #888888;}
#billoutro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 40px; text-align: justify;}
#billoutro:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
/*************** DATA **************************/
/*************** MAGIC OF VALUE ****************/
#valueteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#valueteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#value1 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 50px; top: 40px;}
#value1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#value1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#value1graphic {position: relative; width: 1050px; height: 700px; margin: 0 auto; /*background: url(img/value1bgb.png) top center no-repeat;*/ margin-top: 40px;}
#value1description1 {position: relative; width: 900px; height: 50px; margin: 0 auto; margin-top: 20px; text-align: center; opacity:0; -webkit-transform: translateY(30px);}
#value1description2 {position: relative; width: 900px; height: 50px; margin: 0 auto; margin-top: -20px; text-align: center; opacity:0; -webkit-transform: translateY(30px); -webkit-transition-delay:2s;}
#value1description1 h6, #value1description2 h6 {margin-top: 13px;}
#value1description1 h6 span, #value1description2 h6 span {color:#ff605b; font-weight: bold; text-transform: uppercase; font-size: 24px; margin-left: 5px;}
#value1graphic1{position: absolute; width: 300px; height: 300px; top: 125px; left: 200px; background: url(img/value1a.png) top center no-repeat;
-webkit-transform: scale(1); z-index: 401; -webkit-transition: all 1.5s ease ; -webkit-transition-delay:3s; }
#value1graphic2{position: absolute; width: 300px; height: 300px; top: 125px; left: 550px; background: url(img/value1b.png) top center no-repeat;
-webkit-transform: scale(1); z-index: 402; -webkit-transition: all 1.5s ease ; -webkit-transition-delay:3s;}
.value1row {position: relative; width: 960px; height: 60px; margin: 0 auto;}
.cent {position: relative; float: left; width: 60px; height: 60px; background: url(img/value1c.png) top center no-repeat;}
#row1 {opacity:0; -webkit-transition-delay:5s; margin-top:37px; z-index: 403;}
#row2 {opacity:0; -webkit-transition-delay:6s;}
#row3 {opacity:0; -webkit-transition-delay:7s;}
#row4 {opacity:0; -webkit-transition-delay:8s;}
#row5 {opacity:0; -webkit-transition-delay:9s;}
#row6 {opacity:0; -webkit-transition-delay:10s;}
#row7 {opacity:0; -webkit-transition-delay:11s;}
#row8 {opacity:0; -webkit-transition-delay:12s;}
#row9 {opacity:0; -webkit-transition-delay:13s;}
#cent1 {background: url(img/value1c2.png) top center no-repeat !important;}
#valueteaser2 {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#valueteaser2:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
/*************** ELIMINATION ******************/
#eliminationteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#eliminationteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#elimination1 {position: relative; width: 1200px; height: auto; margin: 0 auto; margin-top: 50px; top: 40px;}
#elimination1text {position: relative; margin: 0 auto; width: 850px; height:140px; text-align: center; background: url(img/textbg.png) top center no-repeat; padding-top: 5px;}
#elimination1text p {font-size: 14px; line-height: 30px; letter-spacing: 1px; font-weight: 300;}
#elimination1graphic {position: relative; width: 1050px; height: 500px; margin: 0 auto; margin-top: 60px; background: url(img/elimination1bg.png) top center no-repeat; }
.elimination1graph {position: absolute; width: 5px; height: 5px; -webkit-border-radius: 3px; background-color: #ff605b; -webkit-transition: all 1s ease ;
-moz-transition: all 1s ease ;
-ms-transition: all 1s ease ;
-o-transition: all 1s ease ;}
.elimination1graphicon {position: absolute; width: 70px; height: 70px; -webkit-border-radius: 10px; left: -75px; top: -25px; text-align: center; overflow: visible;}
.elimination1graph h4 {font-size: 16px; margin-top: 17px; color: #ff605b;}
#elimination1five {top:70px; left: 50px; -webkit-transition-delay:0.2s;}
#elimination1ten {top:130px; left: 50px; -webkit-transition-delay:0.2s;}
#elimination1twenty {top:190px; left: 50px;-webkit-transition-delay:0.4s;}
#elimination1fifty {top:250px; left: 50px;-webkit-transition-delay:0.6s;}
#elimination1hundred {top:310px; left: 50px;-webkit-transition-delay:0.8s;}
#elimination1twohundred {top:370px; left: 50px;-webkit-transition-delay:1s;}
#elimination1fivehundred {top:430px; left: 50px;-webkit-transition-delay:1.2s;}
.elimination1graphEnd {position: relative; width: 70px; height: 70px; left: 80px; top: -34px; float: right; opacity: 0; border: 2px dotted #ff605b; -webkit-border-radius:50%; cursor: pointer;}
#graphEnd1 {background: url(img/graphEnd1.png) top center no-repeat; -webkit-transition-delay:1.5s;}
#graphEnd2 {background: url(img/graphEnd2.png) top center no-repeat; -webkit-transition-delay:2s;}
#graphEnd3 {background: url(img/graphEnd2.png) top center no-repeat; -webkit-transition-delay:2.5s;}
#graphEnd4 {background: url(img/graphEnd4.png) top center no-repeat; -webkit-transition-delay:3s;}
#graphEnd5 {background: url(img/graphEnd5.png) top center no-repeat; -webkit-transition-delay:3.5s;}
#graphEnd6 {background: url(img/graphEnd6.png) top center no-repeat; -webkit-transition-delay:4s;}
#graphEnd7 {background: url(img/graphEnd7.png) top center no-repeat; -webkit-transition-delay:4.5s;}
.enddetail {position: absolute; width: 300px; height: 50px; left: 80px; top:10px; opacity: 0; background: #f8f8f8; }
.enddetail h6 {margin-top: 10px;}
.enddetail h6 span {color:#ff605b; font-weight: bold; text-transform: uppercase; }
.elimination1graphEnd:hover .enddetail {opacity:1;}
#elimination1graphic:hover #elimination1five {width: 109px;}
#elimination1graphic:hover #elimination1ten {width: 136px;}
#elimination1graphic:hover #elimination1twenty {width: 144px;}
#elimination1graphic:hover #elimination1fifty {width: 265px;}
#elimination1graphic:hover #elimination1hundred {width: 455px;}
#elimination1graphic:hover #elimination1twohundred {width: 602px;}
#elimination1graphic:hover #elimination1fivehundred {width: 960px;}
#elimination1graphic:hover .elimination1graphEnd {opacity: 1;}
#elimination1outro {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 85px; text-align: justify;}
/********** EPILOGUE ***********************/
#epilogueteaser {position: relative; width: 900px; height: auto; margin: 0 auto; margin-top: 185px; text-align: justify;}
#epilogueteaser:first-letter {font-size : 60px; font-weight:500; color: #ff605b;}
#endlinks {position: relative; width: 950px; height: auto; min-height: 100px; margin: 0 auto; margin-top: 140px; text-align: center;}
#endlinksul {list-style-type: none; position: relative; width: 750px; margin: 0 auto; margin-top: 40px;}
#endlinksul li {margin-bottom: 50px; float: left; margin-right: 50px;}
.endlink { border: 3px solid #ff605b; position: relative; margin: 0 auto; margin-top: 15px; color: #f3f3f3; text-decoration: none; -moz-border-radius:28px; font-family: 'Dosis', sans-serif;
-webkit-border-radius:28px; border-radius:28px; padding:8px 26px; font-size: 22px; font-weight:500 ; text-transform: uppercase; opacity: 1; background-color: #342f36; letter-spacing: 1px;}
.endlink:hover {border: 3px solid #342f36; color: #f3f3f3; background-color: #ff605b;
-webkit-box-shadow: 10px 10px 50px #888888;
-moz-box-shadow: 10px 10px 50px #888888;
box-shadow: 10px 10px 50px #888888;}
#sources {position: relative; width: 700px; height: auto; min-height: 100px; margin: 0 auto; margin-top: 60px;}
#sources h4 {text-align: center;}
#sourceline {position: relative; width: 100%; height: 4px; -webkit-border-radius: 2px; background-color: #ff605b; margin-top: 180px;}
#sourceul {position: relative; list-style-type: none; margin-top: 50px;}
#sourceul li {margin-bottom: 10px; color: #ff605b !important;}
#sourceul a {color: #ff605b !important; font-family: 'Dosis', sans-serif; font-size: 14px; font-weight:600 ; opacity: 1; color: #342f36; letter-spacing: 2px; text-align: center;}
/**************** Icons ***********************/
.iconchapter {position: relative; width:128px; height:128px; margin: 0 auto; top:-10px; -webkit-border-radius:50%; -webkit-animation: heartbeat 2.6s linear infinite;}
/*.iconchapter:hover {-webkit-transition: all 2.5s ease ;
-moz-transition: all 2.5s ease ;
-ms-transition: all 2.5s ease ;
-o-transition: all 2.5s ease ; transform:rotate(90deg); -ms-transform:rotate(90deg); -webkit-transform:rotate(90deg);}*/
#iconchapter1 {background: url(img/iconbg1.png);}
#section3:hover #iconchapter1 {background: url(img/iconbg1b.png);}
#iconchapter2 {background: url(img/iconbg2.png);}
#section4:hover #iconchapter2 {background: url(img/iconbg2b.png);}
#iconchapter3 {background: url(img/iconbg3.png);}
#section5:hover #iconchapter3 {background: url(img/iconbg3b.png);}
#iconchapter4 {background: url(img/iconbg4.png);}
#section6:hover #iconchapter4 {background: url(img/iconbg4b.png);}
#iconchapter5 {background: url(img/iconbg5.png);}
#section7:hover #iconchapter5 {background: url(img/iconbg5b.png);}
#iconchapter6 {background: url(img/iconbg6.png);}
#section8:hover #iconchapter6 {background: url(img/iconbg6b.png);}
#iconchapter7 {background: url(img/iconbg7.png);}
#section9:hover #iconchapter7 {background: url(img/iconbg7b.png);}
/***************** Hyperlink *******************/
a.hyperlink {font-weight: bold; color: #ff605b; cursor: help; word-wrap: normal; }
a.hyperlink:hover span, a.hyperlink:focus span, a.hyperlink:active span { opacity:1; -webkit-transform: translateY(0px);}
span.hlecb {opacity: 0; position:absolute; left:360px; margin-top:-30px; padding:6px; text-decoration:none;
background-color: #ff605b; -webkit-border-radius: 4px; color: white; padding-left: 15px; padding-right: 15px; -webkit-transform: translateY(30px);}
span.hlecb2 {opacity: 0; position:absolute; left:415px; margin-top:-50px; padding:6px; text-decoration:none;
background-color: #ff605b; -webkit-border-radius: 4px; color: white; padding-left: 15px; padding-right: 15px; -webkit-transform: translateY(30px);}
span.letter {font-size : 60px; font-weight:500; color: #ff605b;}
span.highlight {font-weight: bold; color: #ff605b;}
/*************** Menu **********************/
#menu {width: 25px; height: 25px; position: fixed; z-index: 1002; left: 35px; top: 24px; background: url(img/MENU.png); }
/*************** WIP ***********************/
#wip {width: 200px; height: 200px; position: fixed; z-index: 1001; bottom: 20px; right: 20px; background: url(img/wip.png); }
@-webkit-keyframes pulse
{
0% {-webkit-transform: scale(0); opacity: 0;}
8% {-webkit-transform: scale(0); opacity: 0;}
15% {-webkit-transform: scale(0.1); opacity: 1;}
30% {-webkit-transform: scale(0.5); opacity: 1;}
100% {opacity: 0; -webkit-transform: scale(1);}
}
@-moz-keyframes pulse
{
0% {-moz-transform: scale(0); opacity: 0;}
8% {-moz-transform: scale(0); opacity: 0;}
15% {-moz-transform: scale(0.1); opacity: 1;}
30% {-moz-transform: scale(0.5); opacity: 1;}
100% {opacity: 0; -moz-transform: scale(1);}
}
.pulse_holder
{
display: block;
position: absolute;
top: 100px;
left: 350px;
cursor: pointer;
}
#printnode*:hover .printloc {opacity: 1}
/*.pulse_holder:hover
{
-webkit-transform:scale(1.3);
}*/
.pulse_holder .pulse_marker
{
width: 16px;
height: 16px;
background: #ff605b;
border-radius: 28px;
}
.pulse_holder .pulse_rays
{
margin: 0 auto;
border-radius: 100px;
position: absolute;
right: -26px;
top: -26px;
z-index: 10;
background-color: transparent;
opacity: 0.1;
width: 64px;
height: 64px;
border: 2px solid #ff605b;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-ms-border-radius: 100px;
border-radius: 100px;
/* Giving Animation Function */
-webkit-animation: pulse 2s linear infinite;
-moz-animation: pulse 2s linear infinite;
}
/************* preloader *******************/
.js div#preloader { position: fixed; left: 0; top: 0; z-index: 999; width: 100%; height: 100%; overflow: visible; background: #f3f3f3 url(img/preload.gif) no-repeat center center; opacity: 1;}