SI13/ECO-SWARAJ/Earthly/2stylesheet.css

@font-face {
    font-family: wfdtf;
    src: url(Fonts/wftfs-Regular.otf);
}

@font-face {
    font-family: p10;
    src: url(Fonts/Pioneer10.otf);
}

#banner{
    position:absolute; top:0; right:-20;
}

a{
    color:#A36BFF;
    text-decoration: none;
}
a:hover{
    color:white;
}
a.link:hover{
    color:white;
}
a.link{
    font-family: wfdtf;
    color: #A36BFF;
    font-size: 20pt;
}
a.link2{
    font-family: wfdtf;
    color: #FF6400;
}

html {
    overflow: -moz-scrollbars-vertical; 
    overflow-y: scroll;
}

body{
    background-image: url(005oraopac.png);
    background-color:#8A5159;
    background-position: top;
    background-repeat:no-repeat;;
    background-size: cover;
    color:#FF6400;
    font-family:arial;
}

.cursor{
     cursor:url(cursor.png), auto;
}

#upper{
    width: 90%;
    height: 250px;
    color: #A36BFF;
    float: left;
}
#uppersec{
    width: 90%;
    height: 150px;
    float: left;
    color: #FF6400;
    text-align:left;
}
#uppersym{
    width: 10%;
    height: 400px;
    float: left;
    font-size:20pt;
}
#sympad{
    padding:10%;
    width:90%;
    height:90%;
}
.h1{
    font-family: p10;
    font-size: 80pt;
    text-align: left;
    float:left;
}
.titlesym{
    font-family: wfdtf;
    color: #A36BFF;
    font-size:80pt;
    float:left;
    line-height:95%;
    
}
#block2{
    width:30%;
    height:1000px;
    float:left;
}
#intro{
    width: 100%;
    height: 350px;
    float:left;
    font-size: 15pt;
    text-transform: uppercase;
    font-family: p10;
    overflow: scroll;
    color:#A36BFF;
}
#padintro{
    padding-left: 15px;
}
#block2imgsize{
    height:600px;
}
#imgsize{
    
}
.002{
    width:0%;
    height:0%;
}

#toggleImage{
    cursor: pointer;
    width: 100%;
    max-height:600px;
    float:left;
}
#space{
    height:1000px;
    width:2%;
    float:left;
}
#maintext{
    width: 68%;
    height: 1000px;
    float:left;
    columns: 2;
    overflow: scroll;
    text-align:justify;
    font-size: 15pt;
    line-height: 150%;
}
#padmain{
    padding-left: 15px;

}
#figure{
    width:100%;
    display:block;
    background:#A36BFF;
}
#fig1{
    font-size: 10pt;
}
#space2{
    width:100%;
    height:100px;
    float:left;
}
.lineright {
    border-right: 1px solid #FF6400;
    padding: 0 10px;
}
h4{
    font-size:18pt;
    color: #A36BFF;
    font-family: p10;
}
#references{
    width:50%;
    float:left;
    height:500px;
    overflow: scroll;
    overflow-wrap: break-word;
    word-wrap: break-word;
    padding-top:10px;
    columns:2;
}
#padref{
    padding: 15px; 
}
#bio{
    width:50%;
    height:500px;
    overflow: scroll;
    float:left;
    padding-top:10px;
}
#padbio{
    padding: 15px;
}
#footnotes{
    width:100%;
    float:left;
    height:600px;
    overflow: scroll;
    overflow-wrap: break-word;
    word-wrap: break-word;
    columns:3;
    padding: 15px;
}
#padfoot{
    padding: 15px;
}
#counter{
    float: left;
    
}
@media only screen and (max-width: 3000px){
    #padbio {
        column-count:2;
    }
}
@media only screen and (max-width: 1000px){
    #padbio {
    column-count:1;
    }
}
@media only screen and (max-width: 1000px){
    #intro{
    height: 600px;
    }
}
@media only screen and (max-width: 1000px){
    #maintext{
    column-count:1;
    }
}
@media only screen and (max-width: 1000px){
    #block2imgsize{
    height:400px;
    }
}
@media only screen and (max-width: 1000px){
    #references{
    columns:1;
    }
}