From fecf71cee65a9b0d993f82548a6f79fa076381f4 Mon Sep 17 00:00:00 2001
From: Ove Klykken <ove@gaslightmedia.com>
Date: Fri, 16 May 2014 20:58:09 +0000
Subject: [PATCH] added rules for videos and images app

---
 styles.css | 196 ++++++++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 194 insertions(+), 2 deletions(-)

diff --git a/styles.css b/styles.css
index 3a3bde8..162f816 100644
--- a/styles.css
+++ b/styles.css
@@ -9,7 +9,8 @@ body {
 	font-size: 16px;
 	font-size: 1.6rem;
 	font-family: 'Source Sans Pro', sans-serif;
-	background: url(assets/debut_dark.png);
+	background-image: url(assets/debut_dark.png);
+    background-attachment: fixed;
     }
 /* glm framework */
 .glmTxtImg {
@@ -32,6 +33,9 @@ body {
 	margin-bottom: 0;
 	*zoom: 1;
     }
+img {
+    border: 0;
+    }
 /* Clearfix */
 .clearfix:before, .clearfix:after {
     content: " ";
@@ -46,6 +50,9 @@ body {
 	margin: 0 auto;
 	position: relative;
 	}
+.slides {
+    width: 1090px;
+    }
 .rHeader  {
 	background: url(assets/bgHeader.png) repeat-x;
     }
@@ -92,8 +99,11 @@ nav a {
     padding-bottom: 19px;
     border-bottom: 3px solid black;
     }
+#inside .slides {
+    height: 140px;
+    background: url(assets/topInside.png) no-repeat center top;
+    }
 #hHlines {
-    margin-top: 19px;
 	color: #263c3c;
     }
 #hHlines ul,
@@ -193,6 +203,7 @@ nav a {
 /* Toolbox */
 #category {
 	margin-bottom: 2em;
+    margin-top: 1em;
 	}
 .imageright,
 .imageleft {
@@ -223,6 +234,14 @@ a:hover {
 #toolbox h1 {
 	margin-top: 0;
 	}
+#category li,
+.listing li {
+    list-style-type: none;
+    background-image: url(assets/bullet2.png);
+    background-repeat: no-repeat;
+    background-position: 0px 3px;
+    padding-left: 20px;
+    }
 /* footer */
 .row.rFooter {
 	background: #364759;
@@ -287,3 +306,176 @@ footer p i {
 .xls    { background-image: url(images/file-ext/xls.gif);}
 .zip    { background-image: url(images/file-ext/zip.png);}
 .rar    { background-image: url(images/file-ext/rar.gif);}
+/* Video Gallery */
+
+
+ul#videoGallery {
+    display: block;
+    width: 100%;
+    overflow: hidden;
+    margin: 0;
+    padding: 0;
+    list-style-type: none;
+}
+ul#videoGallery li {
+    display: block;
+    float: left;
+    width: 200px;
+    margin-right: 20px;
+    margin-bottom: 20px;
+    padding: 0;
+    border: 1px solid #DDDFDD;
+    background: #FDFDFF;
+    border-radius: 3px;
+    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.05);
+    -moz-box-shadow:    1px 1px 3px rgba(0, 0, 0, 0.05);
+    box-shadow:         1px 1px 3px rgba(0, 0, 0, 0.05);
+    }
+ul#videoGallery li:nth-child(3n+4) {
+    clear: left;
+    background: red;
+    }
+
+ul#videoGallery li a {
+    position: relative;
+    z-index: 10;
+    display: block;
+    overflow: hidden;
+    text-decoration: none;
+    margin: 10px;
+    }
+ul#videoGallery li a img {
+    display: block;
+    width: 170px;
+    padding: 4px;
+    }
+ul#videoGallery li a span.vidtitle {
+    display: block;
+    position: relative;
+    /* padding: 5px 30px 0 0; */
+    padding-right: 20px;
+    margin: 10px;
+    color: #777;
+    font-size: 12px;
+    min-height: 27px;
+}
+ul#videoGallery li a:hover span.vidtitle {
+    color: #29ABE2;
+    text-decoration: none;
+}
+ul#videoGallery li a span.vidtitle span.play {
+    display: block;
+    position: absolute;
+    z-index: 11;
+    width: 25px;
+    height: 27px;
+    right: 0;
+    top: 5px;
+    background: url(assets/video_overlay.png)0 0 no-repeat;
+}
+ul#videoGallery li:hover a span.vidtitle span.play {
+    background-position: 0 -27px;
+}
+
+/* Image Library */
+#photo_wrapper, #photo_cats_wrapper {
+    clear: left;
+    margin-top: 20;
+}
+#photo_wrapper h3, #photo_cats_wrapper h3 {
+    font-size: 20px;
+    font-weight: normal;
+    color: #2783B7;
+    padding: 30px 0 0 0;
+}
+#photo_wrapper p, #photo_cats_wrapper p {
+    display: block;
+    width: 100%;
+    overflow: hidden;
+    margin: 0;
+    padding: 5px;
+    color: #333;
+}
+.gallery {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    width: 100%;
+    clear: both;
+}
+#photo_wrapper .gallery, #photo_cats_wrapper .gallery {
+    margin: 20px 0 0 0;
+}
+.gallery:after {
+    clear: both;
+    content: ".";
+    display: block;
+    height: 0;
+    visibility: hidden;
+    }
+.gallery li {
+    display: block;
+    float: left;
+    /* width: 22%; */
+    /* margin: 0 1.5% 24px 1.5%; */
+    margin: 0;
+    padding: 0;
+    border: 1px solid #CCC;
+    background: #F5F5F5;
+    border-radius: 3px;
+    margin: 0 20px 20px 0;
+    
+
+}
+/* .gallery li:nth-child(4n-3) {
+    clear: left;
+    width: 22.75%;
+    margin: 0 3% 24px 0;
+}
+.gallery li:nth-child(4n-2) {
+    width: 22.75%;
+    margin: 0 3% 24px 0;
+}
+.gallery li:nth-child(4n-1) {
+    width: 22.75%;
+    margin: 0 3% 24px 0;
+}
+.gallery li:nth-child(4n) {
+    width: 22.75%;
+    margin: 0 0 24px 0;
+}
+*/
+.gallery li a {
+    display: block;
+    overflow: hidden;
+    padding: 10px;
+    text-decoration: none;
+}
+.gallery li a img {
+    display: block;
+    width: 100%;
+    border: 1px solid #CFC4A7;
+}
+span.phototitle {
+    display: block;
+    width: 100%;
+    padding: 0 5px;
+    color: #777;
+    font-size: 12px;
+    text-align: center;
+    text-decoration: none;
+}
+.gallery li:hover {
+    border: 1px solid #7BBDE1;
+    background: #EDF2F8;
+}
+.gallery li:hover a img {
+    border: 1px solid #7BBDE1;
+}
+.gallery li:hover span.phototitle {
+    color: #7BBDE1;
+    text-decoration: none;
+}
+.gallery li {
+    background-image: none !important;
+    }
\ No newline at end of file
-- 
2.17.1