basic php site
[carveJwlIkooP6JGAAIwe30JlM.git] / web / vers.css
diff --git a/web/vers.css b/web/vers.css
new file mode 100644 (file)
index 0000000..5135df7
--- /dev/null
@@ -0,0 +1,193 @@
+body {
+       font-family: 'Roboto Condensed', sans-serif;
+       color: #CCC;
+}
+
+h1, h2 {
+       color: #FFF;
+       display: inline;
+       font-size: 38px;
+}
+
+h3 {
+       color: #FFF;
+       display: inline;
+}
+
+body {
+       background-image:url('resource/img/background.png');
+       background-repeat: repeat;
+       background-size: auto;
+       background-attachment: fixed;
+       padding-left: 0px;
+}
+
+a{
+       text-decoration:none;
+       color:#CCC;
+}
+
+
+.right{
+       position: absolute;
+       right: 0;
+       bottom:0;
+
+       padding-right: 32px;
+}
+
+.gallery-sqr {
+       font-size:0;
+}
+
+.gallery-sqr > div > img {
+       width: 100%;
+}
+
+.gallery-sqr > div {
+       width: 100%;
+       display: inline-block;
+       box-sizing: border-box;
+       padding: 3px;
+       
+       position: relative;
+}
+
+.gallery-big > img {
+       width: 100%;
+}
+
+/* Content Wrapper */
+.content {
+       margin: auto;
+       width: 98%;
+       
+       box-shadow: 0px 0px 13px 3px rgba(0,0,0,0.5);
+       
+       background-image:url('resource/img/wnoise.png');
+       background-repeat: repeat;
+       background-size: auto;
+       padding-left: 0px;
+       color:#FFF;
+       border: 1px solid #000;
+       position: relative;
+       min-height: 700px;
+}
+
+.subcontent {
+       padding: 8px;
+}
+
+.navside {
+       background-color: #171717;
+       color: #EEE;
+       padding: 0px;
+       width: 200px;
+       float: left;
+       height: 100%;
+       position: absolute;
+       box-shadow: inset 0 0 18px #111;
+}
+.navitem {
+       background-color: #222;
+       padding: 8px;
+       box-shadow: inset -20px 0 10px -20px #111;
+}
+.navitem:hover{
+       background-color: #444;
+}
+.navside > .navselect {
+       background-color: #111;
+}
+
+.realcontent {
+       margin-left: 201px;
+}
+.realcontent > p {
+       font-size: 19px;
+}
+
+
+.nav {
+       background-color: #171717;
+       font-size: 0;
+       color: #EEE;
+       padding: 0px;
+}
+.nav > div {
+       background-color: #222;
+       display: inline-block;
+       padding: 0px;
+       font-size: 26px;
+       padding-right: 30px;
+       padding-left: 30px;
+}
+.nav > .navselect {
+       background-color: #111;
+}
+.superbar {
+       background-color: #111;
+       font-size: 20px;
+}
+
+.header {
+       padding: 8px;
+       background-color: #111;
+}
+
+/* Overlay */
+.overlay {
+       font-size:15px;
+       width: 100%;
+       height: 100%;
+       position: absolute;
+       top: 0;
+       left: 0;
+       padding: 15px;
+       box-sizing: border-box;
+       
+       transition: opacity 0.3s linear;
+
+color: #FFF;
+
+opacity: 0.7;
+       background-color: rgba( 0, 0, 0, 0.05 );
+
+user-select: none;
+}
+.overlay:hover{
+       opacity: 0.9;
+       border: 1px solid #888;
+}
+.overlay > h1{
+       bottom: 0;
+       position: absolute;
+}
+
+/* Desktop Fixups */
+@media only screen and (min-width: 768px) {
+       .gallery-sqr > div {
+               width: 50%;
+       }
+       
+       .content {      
+               width: 90%;
+       }
+       
+       .overlay {
+               opacity: 0.0;
+               background-color: rgba( 0, 0, 0, 0.3 );
+       }
+}
+
+/* Big man monitors */
+@media only screen and (min-width: 1200px) {
+       .gallery-sqr > div {
+               width: 25%;
+       }
+       
+       .content {      
+               width: 80%;
+       }
+}
+