Team:ATOMS-Turkiye/asoImage

From 2014.igem.org

Revision as of 18:57, 17 October 2014 by Mfatih (Talk | contribs)

(diff) ← Older revision | Latest revision (diff) | Newer revision → (diff)

/* General */

body {

 font-family: "Calibri", sans-serif;

}

div.bx-wrapper {

 margin-bottom: 50px;

}

.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {

 text-align: center;
 width: 90%;

}

a:hover, a:visited, a:link, a:active {

 color: red;
 text-decoration: underline;

}

div#bodyContent {

 background: rgba(21, 83, 100, 0.2);

}

div#top-section a:link{

 text-decoration: none;

}

div#top-section a:visited{

 text-decoration: none;

}

div#top-section a:hover{

 text-decoration: none;

}

div#top-section a:active{

 text-decoration: none;

}

div#content { margin-top: -19px !important; }

/* Navigation Link Bar */

div.navLR {

 position: relative;
 width: 100%;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 12px;
 margin-top: 12px;

}

div.navLR::after {

 content: " ";
 display: table;
 clear: both;

}

a.navLinkLeft {

 float: left;
 text-decoration: none;
 font-family: "Khmer UI", sans-serif;
 color: rgb(192,0,0);
 text-shadow: 1px 1px 5px #000000;
 font-size: 24px;  
 margin: 12px;
 background: url("") left center no-repeat;
 background-size: auto 100%;
 padding-left: 40px;

   padding-top: 10px;
   padding-bottom: 10px;

} a.navLinkDoubleLeft {

 float: left;
 text-decoration: none;
 font-family: "Khmer UI", sans-serif;
 color: rgb(192,0,0);
 text-shadow: 1px 1px 5px #000000;
 font-size: 24px;  
 margin: 12px;
 background: url("") left center no-repeat;
 background-size: auto 100%;
 padding-left: 70px;

   padding-top: 10px;
   padding-bottom: 10px;

}

a.navLinkRight {

 float: right;
 text-decoration: none;
 font-family: "Khmer UI", sans-serif;
 color: rgb(192,0,0);
 text-shadow: 1px 1px 5px #000000;
 font-size: 24px;  
 margin: 12px;
 background: url("") right center no-repeat;
 background-size: auto 100%;
 padding-right: 40px;

   padding-top: 10px;
   padding-bottom: 10px;

} a.navLinkDoubleRight {

 float: right;
 text-decoration: none;
 font-family: "Khmer UI", sans-serif;
 color: rgb(192,0,0);
 text-shadow: 1px 1px 5px #000000;
 font-size: 24px;  
 margin: 12px;
 background: url("") right center no-repeat;
 background-size: auto 100%;
 padding-right: 70px;

   padding-top: 10px;
   padding-bottom: 10px;

}

/* Headings */

h0, h1, h2, h3, h4, h5, h6 {
 font-family: "Khmer UI", sans-serif !important;

}

h0 {

 font-size: 40px !important;
 margin: 50px !important;
 color: rgb(192,0,0) !important;
 border-bottom: solid rgb(192,0,0) 4px !important;
 text-shadow: 1px 1px 5px #000000 !important;
 padding-bottom: 12px !important;

}

h1 {

 color: rgb(192,0,0) !important;
 border-bottom: solid rgb(192,0,0) 4px !important;
 text-shadow: 1px 1px 5px #000000 !important;
 font-size: 36px !important;
 padding-bottom: 12px !important;
 margin-top: 12px !important; 
 margin: 18px !important;

}

h2 {

 color: rgb(192,0,0) !important;
 text-shadow: 1px 1px 5px #000000 !important;
 font-size: 24px !important;  
 margin: 12px !important;

}

h3 {

 color: rgb(192,0,0) !important;
 font-size: 18px !important;  
 margin: 9px !important;

}

h4 {

 color: rgb(192,0,0);
 font-size: 14px;

}

h5 {

 color: rgb(192,0,0);
 font-size: 14px;

}

h6 {

 color: rgb(192,0,0);
 font-size: 14px;

}

/* Main content of pages */

div.asoContent {

 padding: 20px;
 z-index: 1;
 background: white;
 position: relative;
 margin-right: auto;
 margin-left: auto;
 margin-top: 12px;
 margin-bottom: 12px;
 width: 1000px;
 -webkit-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75);
 -moz-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75);
 box-shadow: 0px 0px 12px 2px rgba(30,123,148,0.75);

}

/* Red bordered*/

.highlight {

 border: solid rgb(192,80,80) 3px;
 border-radius: 20px;
 padding: 20px;

}

div.withImage2 {

 float: none;
 margin-top:30px
 border-radius: 3px;
 padding: 8px;
 margin: 14px;
 width: 800px;
 margin-left: auto;
 margin-right: auto;

}

div.withImage2 img {

  width: 100%;
  border: solid rgb(30,123,148) 4px;
  height: 100%;
  margin-bottom: 4px;
  display: block;

}

div.withImage {

 float: right;
 border: solid rgb(30,123,148) 4px;
 border-radius: 3px;
 padding: 8px;
 margin: 14px;

}

div.withImage img {

 width: 400px;
 height: auto;
 margin-bottom: 4px;
 margin-right: auto;
 margin-left: auto;

}

div.withImageCentered {

 float: none;
 border: solid rgb(30,123,148) 4px;
 border-radius: 3px;
 padding: 8px;
 margin: 14px;
 width: 800px;
 margin-left: auto;
 margin-right: auto;

}

div.withImageCentered img {

 width: 100%;
 height: 100%;
 margin-bottom: 4px;
 display: block;

}

div.justImage {

 float: center;  
 width: 750px;
 height: auto;
 margin-bottom: 4px;
 margin-right: auto;
 margin-left: auto;
 margin-top:20px;
 margin-bottom: 50px;
 text-decoration: none;
 -webkit-text-fill-color: #002bb8;
 text-align:center

}

div.justImage img {
width:inherit;
padding: 3px;
height: auto;
margin-right: auto;
margin-left: auto;
border: solid rgb(30,123,148) 4px;
border-radius: 3px;

}

/* Three columns */

.col-header {

 color: rgb(192,0,0);
 font-size: 24px;

} .three-col {

 position: relative;
 width: 100%;
 padding: 40px;

} .three-col .col1 {

 float: left;
 width: 33%;
 padding: 24px;
 background: #fff;

}

.three-col .col2 {

 width: 34%;
 margin-right: 33%;
 margin-left: 33%;
 padding: 24px;
 background: #fff;
 border-style: solid;
 border-width: 4px;
 -moz-border-image: url() 7 8 8 repeat stretch;
 -webkit-border-image: url() 7 8 8 repeat stretch;
 -o-border-image: url() 7 8 8 repeat stretch;
 border-image: url() 7 8 8 fill repeat stretch;
 border-top: 0;
 border-bottom: 0;
 font-size: 12px !important;
 max-height: 999999px;

}

.three-col .col3 {

 float: right;
 width: 33%;
 padding: 24px;
 background: #fff;

}

/*BX Slider*/

.bxslider span {

    cursor: pointer;

}

.bx-wrapper {

    margin-bottom: 10px;
    margin-top: 0px;

}

.bx-wrapper .bx-viewport {

 left: 0;

}

/*Right menu*/

rightmenu

{

 list-style: none;
 float: right;
 width: 240px;
 margin: 0px;
 padding: 0;
 display: inline-block;
 -webkit-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75);
 -moz-box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75);
 box-shadow: 0px 0px 12px 2px rgba(0,0,0,0.75);

}

rightmenu li {

 list-style: none;
 margin: 0;
 padding: 0;
 background: rgb(164,0,0);
 line-height: 50px;
 border-style: solid;
 border-width: 0px 0px 3px;
 -moz-border-image: url() 3 26 3 27 stretch repeat;
 -webkit-border-image: url() 3 26 3 27 stretch repeat;
 -o-border-image: url() 3 26 3 27 stretch repeat;
 border-image: url() 3 26 3 27 stretch repeat;

}

rightmenu li:last-child {

 border-bottom: 0;

}

rightmenu a {

 font-weight: bold;
 font-family: "Khmer UI", sans-serif;
 color: #ffffff;
 display: block;
 text-align: center;
 text-decoration: none;
 margin: 0;
 padding-top: 0px;
 height: 50px;
 background: rgb(164,0,0);

}

rightmenu a:hover {

 background: rgb(160,40,40);

}

/* new right menu */

rightmenunew

{

 background: #ffffff;
 list-style: none;
 float: right;
 width: 240px;
 margin: 0px;
 padding: 0;

}

rightmenunew img

{

 width: 240px;
 height: auto;

}

rightmenunew li {

 list-style: none;
 margin: 0;
 padding: 0;

}

rightmenunew li a {

 display: block; 
 margin: 0;
 padding-top: 0px;

}

rightmenunew li a:hover {

 background: url("https://2014.igem.org/File:ATOMS-Turkiye_right_1_mouse.png");
 opacity: 0.75;

}

/*

3column news

/

cont .shwnews {

   width: 1000px;
   margin: 0 auto;
   overflow: hidden;

}

cont .shwnews a {

   text-decoration: none;
   outline: 0;

}

cont .shwnews ul {

   display: block;
   width: 1000px;
   padding: 0 0 0 0;
   color: #fff;

}

cont .shwnews ul li {

   width: 300px;
   height: 300px;
   margin: 10px 20px 0px 5px;
   padding: 5px;
   background: #fff;
   border: 1px solid #ccc;
   float: left;

}

cont .shwnews ul li div {

   width: 288px;
   height: 288px;
   position: relative;

}

cont .shwnews ul li img {

   width: 288px;
   height: 288px;

}

cont .shwnews ul li b {

   width: 288px;
   height: 60px;
   padding: 10px 6px;
   font-size: 14px;
   /* background: url(op5.png) repeat; */
   background-color: #000;
   position: absolute;
   left: 0;
   bottom: 0px;
   z-index: 3;
   font-size: 12pt;
   opacity:0.7;
   line-height:22px;

}

cont .shwnews ul li a {

   background: url(fix.gif) repeat;
   position: absolute;
   z-index: 4;

}

cont .shwnews ul li a.lnk {

   width: 288px;
   height: 288px;
   padding: 37px 5px 10px 10px;
   line-height: 17px;
   color: #fff;
   position: absolute;
   left: 0;
   top: 0;
   z-index: 4;
   transition: background-color .2s ease-out 0s;

}

cont .shwnews ul li a.lnk strong {

   display: block;
   margin-bottom: 20px;
   line-height: 20px;
   font-size: 18px;

}

cont .shwnews ul li a.lnk span {

   display: none;
   width: 288px;
   height: 288px;
   line-height: 18px;

}

cont .shwnews ul li a.tit {

   height: 18px;
   line-height: 20px;
   padding: 0 8px;
   color: #fff;
   font-size: 12px;
   font-weight: 700;
   right: 0;
   top: 0;
   z-index: 5;

}

cont .shwnews ul li.one a.tit {

   background: #9e1d0a;

}

cont .shwnews ul li.two a.tit {

   background: #264ea0;

}

cont .shwnews ul li.thr a.tit {

   background: #1877b6;

}

cont .shwnews ul li.one a.lnk:hover {

   background: #9e1d0a;

}

cont .shwnews ul li.two a.lnk:hover {

   background: #264ea0;

}

cont .shwnews ul li.thr a.lnk:hover {

   background: #1877b6;

}

cont .shwnews ul li a.lnk:hover span {

   display: block;

}

/* FourImg */

fourimg {

 width: 800px;
 margin-right: auto;
 margin-left: auto;
 margin-top: 16px;
 margin-bottom: 16px;

}

fourimg a {

 background: black;
 display: block;

}

fourimg img {

 width: 200px;
 height: 225px;

}

fourimg img:hover {

 opacity: 0.6;

}

/* Auxin */

.technology{ /*header of 2nd demo*/

 cursor: pointer;
 color: rgb(192,0,0) !important;
 border-bottom: solid rgb(192,0,0) 2px !important;
 text-shadow: 0px 0px 1px #000000 !important;
 font-size: 24px !important;
 padding-bottom: 6px !important;
 margin-top: 12px !important;
 margin: 18px ;
 margin-left: 70px !important;

} div.thelanguage {

 float: none;
 margin-top:30px
 border-radius: 3px;
 padding: 8px;
 margin: 14px;
 width: 800px;
 margin-left: auto;
 margin-right: auto;

} }

div.thelanguage img {

  width: 50%;
  border: solid rgb(30,123,148) 4px;
  height: 50%;
  margin-bottom: 4px;
  display: block;

}

.openlanguage{ /*class added to contents of 2nd demo when they are open*/ color: #225323; }

.closedlanguage{ /*class added to contents of 2nd demo when they are closed*/ color: #4E754F; } a.collapseLink {

 color: rgb(192,0,0) !important;
 text-shadow: 0px 0px 1px #000000 !important;
 margin: 12px !important;  
 font-size: 18px !important;  
 text-decoration:none

}

/* Figures */

/* Blue Border */

.blueborder td {

 border: solid rgb(30,123,148) 4px;
 border-radius: 3px;
 padding: 20px;
 text-align: center;
 margin: 1px;
 height: 100%;

}

.blueborder img {

 width: 100%;

}