@@ -243,253 +243,3 @@ body {
margin-left : 30% ;
margin-right : 30% ;
}
/* Light box */
.fadein {
-webkit-animation : fadein 3s ; /* Safari, Chrome and Opera > 12.1 */
-moz-animation : fadein 3s ; /* Firefox < 16 */
-ms-animation : fadein 3s ; /* Internet Explorer */
-o-animation : fadein 3s ; /* Opera < 12.1 */
animation : fadein 3s ;
}
.fadeout {
-webkit-animation : fadeout .5s ; /* Safari, Chrome and Opera > 12.1 */
-moz-animation : fadeout .5s ; /* Firefox < 16 */
-ms-animation : fadeout .5s ; /* Internet Explorer */
-o-animation : fadeout .5s ; /* Opera < 12.1 */
animation : fadeout .5s ;
-webkit-animation-fill-mode : forwards;
-moz-animation-fill-mode : forwards;
-ms-animation-fill-mode : forwards;
-o-animation-fill-mode : forwards;
animation-fill-mode : forwards;
}
@keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
/* Firefox < 16 */
@-moz-keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
/* Internet Explorer */
@-ms-keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
/* Opera < 12.1 */
@-o-keyframes fadein {
from { opacity : 0 ; }
to { opacity : 1 ; }
}
@keyframes fadeout {
0% { opacity : 1 ; }
99% { opacity : 0 ; }
100% { display : none; visibility : collapse; }
}
/* Firefox < 16 */
@-moz-keyframes fadeout {
0% { opacity : 1 ; }
99% { opacity : 0 ; }
100% { display : none; visibility : collapse; }
}
/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadeout {
0% { opacity : 1 ; }
99% { opacity : 0 ; }
100% { display : none; visibility : collapse; }
}
/* Internet Explorer */
@-ms-keyframes fadeout {
0% { opacity : 1 ; }
99% { opacity : 0 ; }
100% { display : none; visibility : collapse; }
}
/* Opera < 12.1 */
@-o-keyframes fadeout {
0% { opacity : 1 ; }
99% { opacity : 0 ; }
100% { display : none; visibility : collapse; }
}
.close-light-box {
position : fixed;
top : 4px ;
left : calc (100% - 44px );
font-size : 40px ;
}
# light-box-overlay {
position : fixed;
width : 100% ;
height : 100% ;
left : 0 ;
top : 0 ;
background-color : rgba (77 , 32 , 72 , 0.9 );
z-index : 10000 ;
}
.win95-back {
position : fixed;
background-color : # 999999
width : 70% ;
height : 85% ;
left : 15% ;
top : 7.5% ;
box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
-moz-box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
-webkit-box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
z-index : 100000 ;
}
.win95-top {
position : fixed;
background-color : # 000077
left : calc (15% + 7px );
top : calc (7.5% + 7px );
width : calc (70% - 14px );
height : 30px ;
}
.win95-title p {
margin-left : 10px ;
margin-top : -3px ;
color : # ffffff
text-shadow : none;
letter-spacing : 1px ;
font-size : 25px ;
-moz-user-select : -moz-none;
-khtml-user-select : none;
-webkit-user-select : none;
-ms-user-select : none;
user-select : none;
}
.win95-exit {
position : fixed;
left : calc (85% - 37px );
top : calc (7.5% + 10px );
height : 24px ;
width : 24px ;
background-color : # 999999
box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
-moz-box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
-webkit-box-shadow : inset 2px 2px rgba (255 , 255 , 255 , .4 ), inset -2px -2px rgba (0 , 0 , 0 , .4 );
text-align : center;
}
.win95-exit : hover {
background-color : # CCCCCC
cursor : pointer;
}
.win95-exit : active {
background-color : # 666666
box-shadow : inset 2px 2px rgba (0 , 0 , 0 , .4 ), inset -2px -2px rgba (255 , 255 , 255 , .4 );
-moz-box-shadow : inset 2px 2px rgba (0 , 0 , 0 , .4 ), inset -2px -2px rgba (255 , 255 , 255 , .4 );
-webkit-box-shadow : inset 2px 2px rgba (0 , 0 , 0 , .4 ), inset -2px -2px rgba (255 , 255 , 255 , .4 );
}
.win95-exit p {
margin-top : -3px ;
color : # 000000
text-shadow : none;
letter-spacing : 1px ;
font-size : 20px ;
font-weight : bold;
-moz-user-select : -moz-none;
-khtml-user-select : none;
-webkit-user-select : none;
-ms-user-select : none;
user-select : none;
}
.win95-menus {
position : fixed;
top : calc (7.5% + 37px );
left : calc (15% + 14px );
height : 24px ;
-moz-user-select : -moz-none;
-khtml-user-select : none;
-webkit-user-select : none;
-ms-user-select : none;
user-select : none;
}
.win95-menus p {
color : # 000000
text-shadow : none;
letter-spacing : 1px ;
font-size : 24px ;
display : inline;
}
.win95-image {
position : fixed;
left : calc (15% + 7px );
top : calc (7.5% + 71px );
width : calc (70% - 421px );
height : calc (85% - 78px );
text-align : center;
}
.win95-image img {
position : relative;
top : 50% ;
transform : translate (0 , -50% );
max-height : calc (100% - 4px );
max-width : calc (100% - 4px );
margin : auto;
}
.win95-text-div {
position : fixed;
background-color : # ffffff
left : calc (85% - 407px );
top : calc (7.5% + 71px );
width : 400px ;
max-width : 400px ;
height : calc (85% - 78px );
box-shadow : inset 2px 2px # 555555, inset -2px -2px # aaaaaa
-moz-box-shadow : inset 2px 2px # 555555, inset -2px -2px # aaaaaa
-webkit-box-shadow : inset 2px 2px # 555555, inset -2px -2px # aaaaaa
padding : 10px 20px ;
color : # 000000
text-shadow : none;
letter-spacing : 1px ;
overflow-x : hidden;
overflow-y : scroll;
}
.win95-text h1 {
margin-top : 0px ;
margin-bottom : 0px ;
}
.win95-text hr {
border-top : 2px dashed # 000000
}
.win95-text p {
}