fixed ie stylesheet

library/css/ie.css

@@ -10,12 +10,13 @@ Here, we import all the styles the standard stylesheet gets, only
 without the media queries. No need to worry about editing anything!
 
 ******************************************************************/
-/*
+/******************************************************************
+IMPORTS & DEPENDENCIES
 Remember, all the BASE styles are called already since IE can
 read those. Below, we need to import only the stuff IE can't
 understand (what's inside the media queries). We also need to
 import the mixins file so SASS can understand the variables.
-*/
+******************************************************************/
 /******************************************************************
 Site Name:
 Author:
@@ -41,14 +42,16 @@ http://sachagreif.com/sass-color-variables/
 /*********************
 TYPOGRAPHY
 *********************/
+/* i imported this one in the functions file so bones would look sweet. don't forget to remove it for your site.
+*/
 /******************************************************************
 Site Name:
 Author:
 
-Stylesheet: Mixins & Constants Stylesheet
+Stylesheet: Mixins Stylesheet
 
-This is where you can take advantage of Sass' great features:
-Mixins & Constants. I won't go in-depth on how they work exactly,
+This is where you can take advantage of Sass' great features: Mixins.
+I won't go in-depth on how they work exactly,
 there are a few articles below that will help do that. What I will
 tell you is that this will help speed up simple changes like
 changing a color or adding CSS3 techniques gradients.
@@ -56,90 +59,12 @@ changing a color or adding CSS3 techniques gradients.
 A WORD OF WARNING: It's very easy to overdo it here. Be careful and
 remember less is more.
 
-******************************************************************/
-/*********************
-CLEARFIXIN'
-*********************/
-.clearfix {
-  zoom: 1; }
-  .clearfix:before, .clearfix:after {
-    content: "";
-    display: table; }
-  .clearfix:after {
-    clear: both; }
-
-/*********************
-TOOLS
-*********************/
-* {
-  -webkit-box-sizing: border-box;
-  -moz-box-sizing: border-box;
-  box-sizing: border-box; }
-
-.image-replacement {
-  text-indent: 100%;
-  white-space: nowrap;
-  overflow: hidden; }
-
-/*********************
-TYPOGRAPHY
-*********************/
-/* 	To embed your own fonts, use this syntax
-	and place your fonts inside the
-	library/fonts folder. For more information
-	on embedding fonts, go to:
-	http://www.fontsquirrel.com/
-	Be sure to remove the comment brackets.
-*/
-/*	@font-face {
-    	font-family: 'Font Name';
-    	src: url('library/fonts/font-name.eot');
-    	src: url('library/fonts/font-name.eot?#iefix') format('embedded-opentype'),
-             url('library/fonts/font-name.woff') format('woff'),
-             url('library/fonts/font-name.ttf') format('truetype'),
-             url('library/fonts/font-name.svg#font-name') format('svg');
-    	font-weight: normal;
-    	font-style: normal;
-	}
-*/
-/*
-use the best ampersand
-http://simplebits.com/notebook/2008/08/14/ampersands-2/
-*/
-span.amp {
-  font-family: Baskerville,'Goudy Old Style',Palatino,'Book Antiqua',serif !important;
-  font-style: italic; }
-
-.text-left {
-  text-align: left; }
-
-.text-center {
-  text-align: center; }
-
-.text-right {
-  text-align: right; }
-
-.alert-help, .alert-info, .alert-error, .alert-success {
-  margin: 10px;
-  padding: 5px 18px;
-  border: 1px solid; }
-
-.alert-help {
-  border-color: #e8dc59;
-  background: #ebe16f; }
-
-.alert-info {
-  border-color: #bfe4f4;
-  background: #d5edf8; }
-
-.alert-error {
-  border-color: #f8cdce;
-  background: #fbe3e4; }
-
-.alert-success {
-  border-color: #deeaae;
-  background: #e6efc2; }
+Helpful:
+http://sachagreif.com/useful-sass-mixins/
+http://thesassway.com/intermediate/leveraging-sass-mixins-for-cleaner-code
+http://web-design-weekly.com/blog/2013/05/12/handy-sass-mixins/
 
+******************************************************************/
 /*********************
 TRANSITION
 *********************/
@@ -195,42 +120,25 @@ upon your base.scss styles.
 NAVIGATION STYLES
 *********************/
 /* .menu is clearfixed inside mixins.scss */
-.menu {
-  /* end .menu ul */ }
-  .menu ul {
-    /* end .menu ul li */
-    /* highlight current page */
-    /* end current highlighters */ }
-    .menu ul li {
-      /*
-      plan your menus and drop-downs wisely.
-      */ }
-      .menu ul li a {
-        /*
-        you can use hover styles here even though this size
-        has the possibility of being a mobile device.
-        */ }
+.menu { /* end .menu ul */ }
+.menu ul { /* end .menu ul li */ /* highlight current page */ /* end current highlighters */ }
+.menu ul li { /*
+plan your menus and drop-downs wisely.
+*/ }
+.menu ul li a { /*
+you can use hover styles here even though this size
+has the possibility of being a mobile device.
+*/ }
 
 /* end .menu */
 /*********************
 POSTS & CONTENT STYLES
 *********************/
 /* entry content */
-.entry-content {
-  /* at this larger size, we can start to align images */ }
-  .entry-content .alignleft, .entry-content img.alignleft {
-    margin-right: 1.5em;
-    display: inline;
-    float: left; }
-  .entry-content .alignright, .entry-content img.alignright {
-    margin-left: 1.5em;
-    display: inline;
-    float: right; }
-  .entry-content .aligncenter, .entry-content img.aligncenter {
-    margin-right: auto;
-    margin-left: auto;
-    display: block;
-    clear: both; }
+.entry-content { /* at this larger size, we can start to align images */ }
+.entry-content .alignleft, .entry-content img.alignleft { margin-right: 1.5em; display: inline; float: left; }
+.entry-content .alignright, .entry-content img.alignright { margin-left: 1.5em; display: inline; float: right; }
+.entry-content .aligncenter, .entry-content img.aligncenter { margin-right: auto; margin-left: auto; display: block; clear: both; }
 
 /* end .entry-content */
 /*********************
@@ -260,8 +168,7 @@ GENERAL STYLES
 /*********************
 LAYOUT & GRID STYLES
 *********************/
-.wrap {
-  max-width: 1140px; }
+.wrap { width: 760px; }
 
 /*********************
 HEADER STYLES
@@ -269,77 +176,36 @@ HEADER STYLES
 /*********************
 NAVIGATION STYLES
 *********************/
-.nav {
-  background: #eee;
-  border: 0;
-  /* end .menu ul li */
-  /* highlight current page */
-  /* end current highlighters */ }
-  .nav li {
-    float: left;
-    position: relative;
-    /*
-    plan your menus and drop-downs wisely.
-    */
-    /* showing sub-menus */ }
-    .nav li a {
-      border-bottom: 0;
-      /*
-      you can use hover styles here even though this size
-      has the possibility of being a mobile device.
-      */ }
-      .nav li a:hover, .nav li a:focus {
-        background-color: #dedede; }
-    .nav li ul.sub-menu,
-    .nav li ul.children {
-      margin-top: 0;
-      border: 1px solid #ccc;
-      border-top: 0;
-      position: absolute;
-      display: none;
-      z-index: 8999;
-      /* highlight sub-menu current page */ }
-      .nav li ul.sub-menu li,
-      .nav li ul.children li {
-        /*
-        if you need to go deeper, go nuts
-        just remember deeper menus suck
-        for usability. k, bai.
-        */ }
-        .nav li ul.sub-menu li a,
-        .nav li ul.children li a {
-          padding-left: 10px;
-          border-right: 0;
-          display: block;
-          width: 180px;
-          border-bottom: 1px solid #ccc; }
-        .nav li ul.sub-menu li:last-child a,
-        .nav li ul.children li:last-child a {
-          border-bottom: 0; }
-    .nav li:hover ul {
-      top: auto;
-      display: block; }
+.nav { border: 0; /* end .menu ul li */ /* highlight current page */ /* end current highlighters */ }
+.nav li { float: left; position: relative; /*
+plan your menus and drop-downs wisely.
+*/ /* showing sub-menus */ }
+.nav li a { border-bottom: 0; /*
+you can use hover styles here even though this size
+has the possibility of being a mobile device.
+*/ }
+.nav li a:hover, .nav li a:focus { color: white; text-decoration: underline; }
+.nav li ul.sub-menu, .nav li ul.children { margin-top: 0; border: 1px solid #ccc; border-top: 0; position: absolute; display: none; z-index: 8999; /* highlight sub-menu current page */ }
+.nav li ul.sub-menu li, .nav li ul.children li { /*
+if you need to go deeper, go nuts
+just remember deeper menus suck
+for usability. k, bai.
+*/ }
+.nav li ul.sub-menu li a, .nav li ul.children li a { padding-left: 10px; border-right: 0; display: block; width: 180px; border-bottom: 1px solid #ccc; }
+.nav li ul.sub-menu li:last-child a, .nav li ul.children li:last-child a { border-bottom: 0; }
+.nav li:hover ul { top: auto; display: block; }
 
 /* end .nav */
 /*********************
 SIDEBARS & ASIDES
 *********************/
-.sidebar {
-  margin-top: 2.2em; }
-
-.widgettitle {
-  border-bottom: 2px solid #444;
-  margin-bottom: 0.75em; }
-
-.widget {
-  padding: 0 10px;
-  margin: 2.2em 0; }
-  .widget ul li {
-    margin-bottom: 0.75em;
-    /* deep nesting */ }
-    .widget ul li ul {
-      margin-top: 0.75em;
-      padding-left: 1em; }
+.sidebar { margin-top: 2.2em; }
+
+.widgettitle { border-bottom: 2px solid #444; margin-bottom: 0.75em; }
+
+.widget { padding: 0 10px; margin: 2.2em 0; }
+.widget ul li { margin-bottom: 0.75em; /* deep nesting */ }
+.widget ul li ul { margin-top: 0.75em; padding-left: 1em; }
 
 /* links widget */
 /* meta widget */
@@ -360,24 +226,25 @@ you'll probably need to do quite a bit
 of overriding here if you styled them for
 mobile. Make sure to double check these!
 */
-.footer-links ul li {
-  /*
-  be careful with the depth of your menus.
-  it's very rare to have multi-depth menus in
-  the footer.
-  */ }
+.footer-links ul li { /*
+be careful with the depth of your menus.
+it's very rare to have multi-depth menus in
+the footer.
+*/ }
 
 /* end .footer-links */
 /******************************************************************
-Site Name: 
-Author: 
+Site Name:
+Author:
 
 Stylesheet: Desktop Stylsheet
 
 This is the desktop size. It's larger than an iPad so it will only
-be seen on the Desktop. 
+be seen on the Desktop.
 
 ******************************************************************/
+.wrap { width: 1040px; }
+
 /*
 you can call the larger styles if you want, but there's really no need
 */

library/scss/ie.scss

@@ -20,14 +20,14 @@ understand (what's inside the media queries). We also need to
 import the mixins file so SASS can understand the variables.
 ******************************************************************/
 
-@import "variables"; // import variables
-@import "mixins"; // import mixins
-@import "ie_grid"; // import grid
+@import "partials/variables"; // import variables
+@import "partials/mixins"; // import mixins
+@import "partials/ie_grid"; // import grid
 
 // import everything inside media queries
-@import "481up";
-@import "768up";
-@import "1030up";
+@import "breakpoints/481up";
+@import "breakpoints/768up";
+@import "breakpoints/1030up";
 
 /*
 you can call the larger styles if you want, but there's really no need