Template:Greece/CSS/notebook3

/* Docs sample */

• {

  font-family: Century Gothic;

}

1. canvas{

position:absolute; width: 960px; height: 600px; margin:30px 0px 0px 260px; }

1. book-zoom{

-webkit-transition: -webkit-transform 1s; -moz-transition: -moz-transform 1s; -ms-transition: -ms-transform 1s; -o-transition: -o-transform 1s; transition: transform 1s; }

.animated{ -webkit-transition:margin-left 0.2s ease-in-out; -moz-transition:margin-left 0.2s ease-in-out; -o-transition:margin-left 0.2s ease-in-out; -ms-transition:margin-left 0.2s ease-in-out; transition:margin-left 0.2s ease-in-out; }

.sample-docs{ position:absolute; margin-top:20px; width:945px; height:600px; }

.sample-docs .page{ width:471px; height:600px; background:white;

-webkit-box-shadow:0 0 20px rgba(0,0,0,0.2); -moz-box-shadow:0 0 20px rgba(0,0,0,0.2); -ms-box-shadow:0 0 20px rgba(0,0,0,0.2); -o-box-shadow:0 0 20px rgba(0,0,0,0.2); box-shadow:0 0 20px rgba(0,0,0,0.2); }

.sample-docs .hard{ background-image:url(); background-size:cover; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; }

.sample-docs .p2{ background-position:-471px 0; }

.sample-docs .p62{ background:-webkit-gradient(linear, left top, right top, color-stop(0.95, #fff), color-stop(1, #dadada)); background-image:-webkit-linear-gradient(left, #fff 95%, #dadada 100%); background-image:-moz-linear-gradient(left, #fff 95%, #dadada 100%); background-image:-ms-linear-gradient(left, #fff 95%, #dadada 100%); background-image:-o-linear-gradient(left, #fff 95%, #dadada 100%); background-image:linear-gradient(left, #fff 95%, #dadada 100%); }

.sample-docs .p63{ background-position:-942px 0; }

.sample-docs .p64{ background-position:-1413px 0; }

.sample-docs .even .gradient{ position:absolute; top:0; left:0; width:100%; height:100%; background-position:right top; background-repeat: repeat-y; z-index:10000; }

.sample-docs .odd .gradient{ position:absolute; top:0; left:0; width:100%; height:100%; background-position:left top; background-repeat: repeat-y; z-index: 10000; }

.sample-docs .page-wrapper{ -webkit-perspective:2000px; -moz-perspective: 2000px; -ms-perspective: 2000px; perspective: 2000px;

border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; -o-border-radius: 20px; }

.sample-docs .loader{ background-image:url(http://users.auth.gr/komodromo/iGEM%20Greece%202017/Flipbook/pages/loader.gif); width:22px; height:22px; position:absolute; top:280px; left:219px; }

.sample-docs .shadow{ -webkit-transition: -webkit-box-shadow 0.5s; -moz-transition: -moz-box-shadow 0.5s; -o-transition: -webkit-box-shadow 0.5s; -ms-transition: -ms-box-shadow 0.5s; /* -webkit-box-shadow:0 0 10px #ccc; -moz-box-shadow:0 0 10px #ccc; -o-box-shadow:0 0 10px #ccc; -ms-box-shadow:0 0 10px #ccc; box-shadow:0 0 10px #ccc; */ }

.sample-docs .tabs{ width:942px; height:22px; top:-22px; position:relative; z-index:1; }

.sample-docs .tabs > div{ width:461px; height:22px; float:left; }

.sample-docs .tabs .left{ position: relative; z-index:1000; height:500px; width:110px; margin: 22px 0px 0px -110px; }

.sample-docs .tabs .right{ position: relative; z-index:1000; height:500px; width:110px; margin: 22px 0px 0px 945px; }

.sample-docs .tabs .right .pages_div{ padding: 10px 0px 0px 0px; width: 90px; height: 40px; background-repeat: no-repeat; background-position: center; z-index: -1000; }

.sample-docs .tabs .right #page_4{ margin:80px 0px 0px 0px; background-image: url('https://static.igem.org/mediawiki/2017/5/58/GreeKom_bookmark.png'); }

.sample-docs .tabs .right #page_12{ margin: 40px 0px 0px 0px; background-image: url('https://static.igem.org/mediawiki/2017/7/76/GreeKom_bookmark2.png'); background-position: -45px -38px; }

.sample-docs .tabs .right #page_34{ margin: 255px 0px 0px -120px; /*background-image: url('../pics/post_it.png');*/ height: 250px; width: 250px; overflow: hidden; }

.sample-docs .tabs .right #page_34 #secondLink{ position: absolute; margin: -115px 0px 0px 150px; z-index: 1000; /* Safari */ -webkit-transform: rotate(-55deg);

/* Firefox */ -moz-transform: rotate(-55deg);

/* IE */ -ms-transform: rotate(-55deg);

/* Opera */ -o-transform: rotate(-55deg);

/* Internet Explorer */ filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2.5); }

.sample-docs .tabs a{ position:relative; display:block; margin: 0px; padding: 5px; color: black; font: bold 14px; text-shadow: 1px 1px 0 #ddd; color: #333; line-height: 30px; text-decoration: none; /*-webkit-border-image: url(../pics/tab-off.png) 5 20 5 20 repeat stretch; border: 1px solid #be3636; border-width: 0px 0px 0px 2px; -webkit-box-shadow: 6px -4px 28px -9px rgba(181,174,181,1); -moz-box-shadow: 6px -4px 28px -9px rgba(181,174,181,1); box-shadow: 6px -4px 28px -9px rgba(181,174,181,1); */ z-index:1000; }

.sample-docs .tabs .on, .sample-docs .tabs .on:hover{ cursor:default; font-size: 15px; text-shadow: 1px 1px 0 #747070; }

.sample-docs .tabs a:hover{ /*color:black; -webkit-border-image: url(../pics/tab-hover.png) 5 20 5 20 repeat stretch; */ text-decoration: none; cursor:pointer; font-size: 15px; text-shadow: 1px 1px 0 #747070; }