Changed css

Author: dabit3

css/style.css

@@ -151,16 +151,50 @@ line-height: 60px;
 
 .main-container-h3 {
 	color: rgba(255,255,255,.9);
-	border-bottom: 1px solid rgba(255,255,255,.9);
-
 	margin:0 auto;
 	font-weight: 300;
 	padding-top: 20px;
 	padding-bottom: 10px;
-	font-size: 36px;
-	width:96px;
+	float:left;
+	letter-spacing:2px;
+	font-size:26px;
+}
+
+.line1 {
+	margin-right:25px;
+	opacity:.9;
+	float:left;
+	padding-top:28px;
+}
+
+.line2 {
+	margin-left:25px;
+	opacity:.9;
+	float:left;
+	padding-top:28px;
 }
 
+.line-holder {
+	padding-top:12px;
+	width: 435px;
+	margin: 0 auto;
+}
+
+.line-holder-2 {
+	width:514px;
+	margin: 0 auto;
+	padding-top:22px;
+
+}
+
+.line-holder-3 {
+	width:474px;
+	margin: 0 auto;
+	padding-top:22px;
+}
+
+
+
 .main-container-p {
 	color: rgba(255,255,255,.9);
 	font-size: 20px;
@@ -194,18 +228,21 @@ line-height: 60px;
 
 .third-container-h3 {
 
+	
 	color: #000000;
-	border-bottom: 1px solid #000000;
 	margin:0 auto;
 	font-weight: 300;
 	padding-top: 20px;
 	padding-bottom: 10px;
-	font-size: 36px;
-	width:190px;
+	float:left;
+	letter-spacing:2px;
+	font-size:26px;
+
+	
 }
 
 .three-under {
-	border-top: 1px solid #ddd;
+	border-top: 1px solid #000000;
 padding-top: 15px
 }
 
@@ -215,12 +252,12 @@ padding-top: 15px
 }
 
 .three-link a {
-	color: #C6C6C6;
+	color: #000000;
 	text-decoration:none;
 }
 
 .three-link a:hover {
-	color: #253E71;
+	color: #c6c6c6;
 }
 
 .three-big {
@@ -241,13 +278,13 @@ padding-top: 15px
 .fourth-container-h3 {
 
 	color: #253E71;
-	border-bottom: 1px solid #253E71;
 	margin:0 auto;
 	font-weight: 300;
 	padding-top: 20px;
 	padding-bottom: 10px;
-	font-size: 36px;
-	width:146px;
+	float:left;
+	letter-spacing:2px;
+	font-size:26px;
 }
 
 .sponsor {
@@ -508,6 +545,8 @@ nav {
 	width:270px;
  }
 
+
+
 .main-container-2 {
 	width:auto;
 	margin:0px 20px;
@@ -613,5 +652,63 @@ nav {
 
 }
 
+@media only screen and (min-width: 0px) and (max-width: 900px) {
+
+.line-holder, .line-holder-2 {
+	width:100% !important;
+}
+
+.line-holder  {
+	padding-top:5px;
+}
+
+.line-holder-3 {
+	width:90% !important;
+}
+
+.line-holder-2 {
+	padding-top:5px;
+}
+
+.line-holder-3 {
+	padding-top:5px;
+}
+
+.line-holder h3 {
+	border-bottom:1px solid rgba(255, 255, 255, .8);
+}
+
+.line-holder-2 h3 {
+	border-bottom:1px solid #000000;
+}
+
+.line-holder-3 h3 {
+	border-bottom:1px solid #253E71;
+}
+
+.line1, .line2 {
+	display:none !important;
+	visibility: hidden !important;
+	height:0px;
+	overflow: hidden;
+	opacity:0 !important;
+}
+
+.main-container-h3, .third-container h3, .fourth-container-h3 {
+	width:100%;
+	text-align:center;
+}
+
+}
+
+@media handheld, screen and (max-width: 900px) {
+	.line1, .line2 {
+		display:none !important;
+		visibility: hidden !important;
+		height:0px;
+		overflow: hidden;
+		opacity:0 !important;
+	}
+}
 
 

images/blueline.png

@@ -29,7 +29,7 @@
 			<a href="#" class="aboutus"><h3 >ABOUT</h3></a>
 			<a href="mailto:hello@developers.ms"><h3 class="contactus">CONTACT</h3>	</a>
 			<a href="mailto:hello@developers.ms?subject=Submit a talk" title="Submit a talk"><h3 class="giveatalk" >GIVE A TALK</h3></a>
-			<a target="_blank" href="http://www.meetup.com/Jackson-Area-Web-and-Mobile-Developers/"><h3>JOIN THE MEETUP</h3></a>
+			<a target="_blank" href="http://www.meetup.com/Jackson-Area-Web-And-App-Developers/"><h3>JOIN THE MEETUP</h3></a>
 			<a href="#" class="usefullinks"><h3  >USEFUL LINKS</h3></a>
 			<a href="https://twitter.com/jacksondevs" target="_blank"><h3><i class="fa fa-twitter"></i></h3></a>
 		</section>
@@ -64,7 +64,12 @@ <h2 class="main-container-h2">Meet other local Developers to network, share know
 
 	<div class="second-container">
 		<section class="main-container-2">
-			<h3 class="main-container-h3" id="aboutustarget">About</h3>
+			<div class="line-holder">
+				<img class="line1" src="images/lin2.png" alt="">
+					<h3 class="main-container-h3" id="aboutustarget">About</h3>
+				<img src="images/lin2.png" alt="" class="line2">
+			</div>
+			<div class="clearfix"></div>
 			<p class="main-container-p">This group is for professional web designers and developers looking to network with others in the industry, learn about new or emerging technologies, and for anyone looking to learn web development (beginner to advanced).</p>
 			<p class="main-container-p">We talk design for the web, share experiences with use of different tools &amp; languages, critique web sites, talk industry, business, employment news, and share motivations and inspirations. This group is intended to become a hub for all today's technologies that make up the Internet as we know it. </p>
 			<p class="main-container-p">
@@ -75,10 +80,13 @@ <h3 class="main-container-h3" id="aboutustarget">About</h3>
 
 	<div class="third-container">
 		<div class="third-container-3">
-			<h3 class="third-container-h3" id="usefullinkstarget">
-				Useful Links
-			</h3>
-			<p class="three-link first-mobile-three-link"><a target="_blank" href="https://developer.mozilla.org/en-US/"><span class="three-big">Mozilla Developer Network</span></a></p>
+			<div class="line-holder-2">
+				<img class="line1" src="images/darkline2.png" alt="">
+					<h3 class="third-container-h3" id="usefullinkstarget">Useful Links</h3>
+				<img src="images/darkline2.png" alt="" class="line2">
+			</div>
+			<div class="clearfix"></div>
+			<p style="margin-top:35px;" class="three-link first-mobile-three-link"><a target="_blank" href="https://developer.mozilla.org/en-US/"><span class="three-big">Mozilla Developer Network</span></a></p>
 			<p class="three-link">The Mozilla Developer Network (MDN) provides information about Open Web technologies including HTML, CSS, and APIs for both Web sites and HTML5 Apps.
 			</p>
 			<p class="three-link three-under"><a href="http://codepen.io/" target="_blank"><span class="three-big">Codepen</span></a></p>
@@ -87,14 +95,27 @@ <h3 class="third-container-h3" id="usefullinkstarget">
 			<p class="three-link">Hacker News caters to programmers and entrepreneurs, delivering content related to computer science and entrepreneurship. It is run by Paul Graham's investment fund and startup incubator, Y Combinator.</p>
 			<p class="three-link three-under"><a href="http://www.css-tricks.com" target="_blank"><span class="three-big">CSS-Tricks</span></a></p>
 			<p class="three-link">Dedicated to the world of CSS and related technologies. Snippets, videos, tricks and tutorials</p>
-			<p class="three-link three-under"><a href="http://www.codecademy.com/"><span class="three-big">Code Academy</span></a></p>
+			
+			<p class="three-link three-under"><a href="http://www.github.com/" target="_blank"><span class="three-big">GitHub</span></a></p>
+			<p class="three-link">GitHub is a Git repository web-based hosting service, which offers all of the distributed revision control and source code management (SCM) functionality of Git as well as adding its own features</p>
+	
+			<p class="three-link three-under"><a href="http://www.codecademy.com/" target="_blank"><span class="three-big">Code Academy</span></a></p>
 			<p class="three-link">Learn how to code.</p>
+
 		</div>
 	</div>
 
 	<div class="fourth-container-wrapper">
+		
 		<div class="fourth-container">
-			<h3 class="fourth-container-h3">Sponsors</h3>
+			<div class="line-holder-3">
+				<img class="line1" src="images/blueline2.png" alt="">
+					<h3 class="fourth-container-h3" id="">Sponsors</h3>
+				<img src="images/blueline2.png" alt="" class="line2">
+			</div>
+			
+			<div class="clearfix"></div>
+			
 			<section class="sponsor-container-section">
 				<div class="sponsorcontainer">
 					<div class="sponsor sponsorone" >
@@ -167,5 +188,6 @@ <h4>
 <script src="bower_components/jquery/dist/jquery.min.js"></script>
 <script src="http://cdnjs.cloudflare.com/ajax/libs/gsap/1.14.2/TweenMax.min.js"></script>
 <script src="js/main.js"></script>
+<script src="js/resize.js"></script>
 </body>
 </html>

images/blueline2.png

@@ -1,9 +1,22 @@
 $(document).ready(function() {
-	
+
+
+
 $(function() {
     FastClick.attach(document.body);
 });
 
+var w = window.innerWidth;
+var line1 = $('.line1'), 
+		line2 = $('.line2');
+
+
+if (w <= 900) {
+	line1.css('display', 'none');
+	line2.css('display', 'none');
+	console.log("Hidden");
+};
+
 var open = false,
 		sponsor1open = false,
 		sponsor2open = false,
@@ -161,4 +174,8 @@ $('#hamburger').click(function() {
 
 		});
 
+		if (navigator.userAgent.indexOf('Safari') != -1 && navigator.userAgent.indexOf('Chrome') == -1) {
+			$(".navleft h3").css('font-weight', '300', 'important')
+		}
+
 });