Template:Greece/CSS

/* The Navigation Menu */

• , #HQ_page p, #HQ_page table, #HQ_page tr, #HQ_page td{

  font-family: Century Gothic;

}

1. bodyContent{ overflow-x: hidden; }

@media screen and (max-width: 1220px){ html{ overflow-x: hidden; } }

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.8;

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;

}

1. 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;

}

/* Display Subcategory Section */

1. display_box{

       display: none;
       position: relative;
       background-color: #ffffff;
       margin: 800px 0px 0px 0px;
       z-index: 1000;
       min-height: 100px;
       overflow: hidden;
       width: 100%;
       height: 800px;

}

/* Loading Div 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-color: #ffffff;

/*background: url(https://static.igem.org/mediawiki/2017/f/fc/GreeKom_paper.jpeg);*/

       transition: display 3s ease-in-out;
       -webkit-transition: display 3s ease-in-out;
       -moz-transition: display 3s ease-in-out;
       -ms-transition: display 3s ease-in-out;
       -o-transition: display 3s ease-in-out;
    }

    #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%);
    }

    #back_to_top{
       display: none;
       background-image: url();
       background-position: -4px -7px;
       background-repeat: no-repeat;
       background-size: 115%;
       border-radius: 60px;
       margin: -80px 0px 0px 0px;
       right: 10px;
       width: 55px;
       height: 55px;
       position: absolute;
       z-index: 1000;
    }

/* */ /* */ /* */

@media screen and (min-width: 1025px) and (max-width: 1535px){ .content_article{ padding: 0px 5% 0px 48%; } } @media screen and (min-width: 1536px) and (max-width: 1590px){ .content_article{ padding: 0px 4% 0px 45%; } } @media screen and (min-width: 1591px) and (max-width: 1630px){ .content_article{ padding: 0px 4% 0px 43%; } } @media screen and (min-width: 1631px) and (max-width: 1675px){ .content_article{ padding: 0px 4% 0px 42%; } } @media screen and (min-width: 1676px) and (max-width: 1720px){ .content_article{ padding: 0px 4% 0px 41%; } } @media screen and (min-width: 1721px) and (max-width: 1770px){ .content_article{ padding: 0px 4% 0px 40%; } } @media screen and (min-width: 1771px) and (max-width: 1825px){ .content_article{ padding: 0px 4% 0px 39%; } } @media screen and (min-width: 1826px) and (max-width: 1920px){ .content_article{ padding: 0px 4% 0px 38%; } }