|
|
| Line 7: |
Line 7: |
| | <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script> | | <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script> |
| | <meta name="viewport" content="width=device-width, initial-scale=1.0"> | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| − | | + | {{Greece/CSS}} |
| | <script> | | <script> |
| | $( document ).ready(function() { | | $( document ).ready(function() { |
| Line 127: |
Line 127: |
| | <div id='display_box'></div> | | <div id='display_box'></div> |
| | | | |
| − | <!-- Display_Box (the b@st@rd) -->
| |
| | <style> | | <style> |
| − | #display_box{
| |
| − | display: none;
| |
| − | position: absolute;
| |
| − | background-color: #ffffff;
| |
| − | margin: 800px 0px 0px 0px;
| |
| − | z-index: 1000;
| |
| − | width: 100%;
| |
| − | height: 800px;
| |
| − | }
| |
| − | </style>
| |
| − |
| |
| − |
| |
| − | <!-- The Navigation Menu -->
| |
| − | <style>
| |
| − | *{
| |
| − | font-family: Century Gothic;
| |
| − | }
| |
| − |
| |
| − | body{ background: #ffffff }
| |
| − |
| |
| − | a{
| |
| − | text-decoration: none;
| |
| − | color: #000000;
| |
| − | }
| |
| − | a:visited{ text-decoration:none; }
| |
| − | a:link{ text-decoration:none; }
| |
| − | a:hover{ text-decoration:none; }
| |
| − | a:active{ text-decoration:none; }
| |
| − |
| |
| − | .clearfix:after {
| |
| − | display:block;
| |
| − | clear:both;
| |
| − | }
| |
| − | .menu_wrap {
| |
| − | position:absolute;
| |
| − | margin: 0px;
| |
| − | text-align:center;
| |
| − | height: 84px;
| |
| − | width: 100%;
| |
| − | -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | background: #ffffff;
| |
| − | opacity:0.6;
| |
| − | z-index:1000;
| |
| − | /*border:1px solid black;*/
| |
| − | }
| |
| − |
| |
| − | .menu {
| |
| − | position:relative;
| |
| − | width: 100%;
| |
| − | margin: -5px 0px 0px 0px;
| |
| − | z-index: 1000;
| |
| − | height: 84px;
| |
| − | -webkit-box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | -moz-box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | box-shadow: 0px 1px 3px rgba(0,0,0,0.2);
| |
| − | }
| |
| − |
| |
| − | .menu li {
| |
| − | position:relative;
| |
| − | padding: 0px;
| |
| − | margin-right: 3%;
| |
| − | margin-left: 3%;
| |
| − | list-style: none;
| |
| − | height: 35px;
| |
| − | /*border-right: 1px solid #428bca;*/
| |
| − | display:inline-block;
| |
| − | }
| |
| − |
| |
| − | .menu a{
| |
| − | transition:all linear 0.25s;
| |
| − | color:#868383;
| |
| − | font-size:15px;
| |
| − | font-family:Century Gothic;
| |
| − | font-size: 17px;
| |
| − | }
| |
| − |
| |
| − | .menu li:hover > a{
| |
| − | text-decoration:none;
| |
| − | color:#000000;
| |
| − | }
| |
| − | .menu > ul > li {
| |
| − | float:left;
| |
| − | margin-left:8px;
| |
| − | display:inline-block;
| |
| − | position:relative;
| |
| − | font-size:18px;
| |
| − | line-height:30px;
| |
| − | }
| |
| − |
| |
| − | .menu ul li a {
| |
| − | padding:4px 25px;
| |
| − | display:inline-block;
| |
| − | text-shadow:0px 1px 0px rgba(0,0,0,0.3);
| |
| − | }
| |
| − |
| |
| − | /* Logo */
| |
| − |
| |
| − | .logo{
| |
| − | position:absolute;
| |
| − | margin: -17px 0px 0px -46px;
| |
| − | width: 150px;
| |
| − | height: 83px;
| |
| − | /*border: 1px solid grey;*/
| |
| − | text-align:left;
| |
| − | /*box-shadow:0px 1px 3px rgba(0,0,0,0.2);*/
| |
| − | z-index:1000;
| |
| − | }
| |
| − |
| |
| − | #just_to_align{
| |
| − | position:absolute;
| |
| − | right: 5%;
| |
| − | width: 100%;
| |
| − | margin: 23px 10px 0px 0px;
| |
| − | /*border: 1px solid black;*/
| |
| − | text-align:right;
| |
| − | }
| |
| − |
| |
| − | .li_indiv{
| |
| − | position:relative;
| |
| − | text-align:center;
| |
| − | margin:0px 35px 0px 0px;
| |
| − | /*word-wrap: break-word;*/
| |
| − | /*border:1px solid black;*/
| |
| − | }
| |
| − |
| |
| − | .li_indiv a{
| |
| − | position:relative;
| |
| − | top:5px;
| |
| − | }
| |
| − |
| |
| − | div #sideMenu a #home_logo img{
| |
| − | display:none;
| |
| − | }
| |
| − |
| |
| − | .background_box{
| |
| − | position:fixed;
| |
| − | display: none;
| |
| − | margin-top: -100px;
| |
| − | width:100%;
| |
| − | height:100%;
| |
| − | z-index: 100;
| |
| − | }
| |
| | | | |
| | .circlez{ | | .circlez{ |
| Line 283: |
Line 138: |
| | | | |
| | .opace{ opacity: 0.8; } | | .opace{ opacity: 0.8; } |
| − | </style>
| |
| − |
| |
| − | <!--Responsive stylesheets-->
| |
| − | <!--DEFAULT PROPERTIES ARE INHERITED FROM 1920px - 1080px RESOLUTION-->
| |
| − |
| |
| − | <style>
| |
| − |
| |
| − | /* DEFAULT PROPERTIES ARE INHERITED FROM 1535px WIDTH*/
| |
| − |
| |
| − | /* < 1024px Resolution Desktop Screen */
| |
| − |
| |
| − | /* < 1366px Resolution Desktop Screen*/
| |
| − |
| |
| − | @media screen and (min-width: 1025px) and (max-width: 1367px) {
| |
| − |
| |
| − | .menu_wrap{
| |
| − | position:relative;
| |
| − | margin:-5px 0px 0px 0px;
| |
| − | width: 1348px;
| |
| − | height: 85px;
| |
| − | /*No left or right margins - menu wides fullscreen*/
| |
| − | }
| |
| − |
| |
| − | .menu{
| |
| − | position:absolute;
| |
| − | width: 1348px;
| |
| − | margin: -83px 0px 0px 0px;
| |
| − | }
| |
| − |
| |
| − | .menu > ul > li{
| |
| − | margin-left:12px;
| |
| − | }
| |
| − | .menu li{
| |
| − | margin-right: 35px;
| |
| − | margin-left: 35px;
| |
| − | }
| |
| − |
| |
| − | #just_to_align{
| |
| − | right: 60px;
| |
| − | margin: 17px 10px 0px 0px;
| |
| − | }
| |
| − | .logo{
| |
| − | margin: -23px 0px 0px -52px;
| |
| − | }
| |
| − | }
| |
| − |
| |
| − | @media screen and (min-width: 1367px) and (max-width: 1921px){
| |
| − |
| |
| − | .logo{
| |
| − | margin: -18px 0px 0px -48px;
| |
| − | }
| |
| − |
| |
| − | .menu li {
| |
| − | margin-right: 4%;
| |
| − | margin-left: 4%;
| |
| − | }
| |
| − |
| |
| − | @media screen and (min-width: 1367px) and (max-width: 1770px){
| |
| − | .menu li{
| |
| − | margin-right: 3%;
| |
| − | margin-left: 3%;
| |
| − | }
| |
| − | }
| |
| − |
| |
| − | @media screen and (min-width: 1770px) and (max-width: 1921px){
| |
| − |
| |
| − | .menu_wrap{ margin: -12px 0px 0px 0px; }
| |
| − |
| |
| − | .menu{ margin: -83px 0px 0px 0px; }
| |
| − |
| |
| − | #just_to_align{ margin: 13px 10px 0px 0px; }
| |
| − |
| |
| − | }
| |
| − |
| |
| − | }
| |
| − | </style>
| |
| − |
| |
| − | <!--Loading Div Style-->
| |
| − | <style>
| |
| − | #loading-background{
| |
| − | position: fixed;
| |
| − | width:100%;
| |
| − | height:100%;
| |
| − | top: 0;
| |
| − | left: 0;
| |
| − | display: block;
| |
| − | /*margin: -17px 0px 0px 0px;*/
| |
| − | z-index: 10000;
| |
| − | text-align: center;
| |
| − | zoom: 35%;
| |
| − | background: url(https://static.igem.org/mediawiki/2017/f/fc/GreeKom_paper.jpeg);
| |
| − | }
| |
| | | | |
| − | #loading-gif{
| |
| − | position: absolute;
| |
| − | z-index: 10000;
| |
| − | height: 250px;
| |
| − | -webkit-transform: translate(-50%, 320%);
| |
| − | -moz-transform: translate(-50%, 320%);
| |
| − | -ms-transform: translate(-50%, 320%);
| |
| − | -o-transform: translate(-50%, 320%);
| |
| − | transform: translate(-50%, 320%);
| |
| − | }
| |
| | </style> | | </style> |
| | | | |
