/******************************************************************
Site Name: 
Author: 

Stylesheet: Main Stylesheet

Here's where the magic happens. Here, you'll see we are calling in
the seperate functions for each media query. The base mobile 
stylesheet is called in the header, so here we're working up from 
there. To edit the css, just find the corresponding LESS file.
******************************************************************/
/*
Base.css contains the main mobile styles and is called in the 
header. This way mobile devices get ONLY the styles that apply
to them. No muss, no fuss.

normalize.css and the mixins are also called within that base file 
*/


/******************************************************************
AVERAGE VIEWING SIZE 
This is the average viewing window. So Desktops, Laptops, and 
in general anyone not viewing on a mobile device. Here's where
you can add resource intensive styles.
******************************************************************/
@media only screen and (min-width: 482px) {
  /* styles in 481up.scss */
  /******************************************************************
  Site Name: 
  Author: 
  
  Stylesheet: 481px and Up Stylesheet
  
  This stylesheet is loaded for larger devices. It's set to 
  481px because at 480px it would load on a landscaped iPhone.
  
  ******************************************************************/
  /*********************
  GENERAL STYLES
  *********************/
  /*********************
  LAYOUT & GRID STYLES
  *********************/
  /*********************
  HEADER SYTLES
  *********************/
  /*********************
  NAVIGATION STYLES
  *********************/
  /* .menu is clearfixed inside mixins.less */
  .menu {
  }
    .menu ul {
    }
      .menu ul li {
      }
        .menu ul li a {
        }

  /* end .menu */
  /*********************
  POSTS & CONTENT STYLES
  *********************/
  /* post content */
  .post-content {
    /* at this larger size, we can start to align images */ }
    .post-content img {
      margin-right: 1.5em;
      display: inline;
      float: left; }
    .post-content .alignleft, .post-content img.alignleft {
      margin-right: 1.5em;
      display: inline;
      float: left; }
    .post-content .alignright, .post-content img.alignright {
      margin-left: 1.5em;
      display: inline;
      float: right; }
    .post-content .aligncenter, .post-content img.aligncenter {
      margin-right: auto;
      margin-left: auto;
      display: block;
      clear: both; }
	img.alignleft {
	  float:left;max-width: 150px;
	  padding: 0 30px 0 0;
	}
  /* end .post-content */
  .wp-caption {
  }

  /******************************************************************
  COMMENT STYLES
  ******************************************************************/
  /* h3 comment title */
  #comments {
  }

  .commentlist {
  }
    .commentlist li {
    }
      .commentlist li ul.children {
      }

  /* end .commentlist */
  /******************************************************************
  COMMENT FORM STYLES
  ******************************************************************/
  .respond-form form input[type=text],
  .respond-form form input[type=email],
  .respond-form form input[type=url],
  .respond-form form textarea {
  }

  /*********************
  SIDEBARS & ASIDES
  *********************/
  .widget ul li {
    /* deep nesting */ }

  /*********************
  FOOTER STYLES
  *********************/
 
/* end of media query */
 }
/******************************************************************
TABLET & SMALLER LAPTOPS
This is the average viewing window. So Desktops, Laptops, and 
in general anyone not viewing on a mobile device. 
******************************************************************/
@media only screen and (min-width: 768px) {
  /* styles in 768up.scss */
  /******************************************************************
  Site Name: 
  Author: 
  
  Stylesheet: Tablet & Small Desktop Stylesheet
  
  Here's where you can start getting into the good stuff.
  This size will work on iPads, other tablets, and desktops.
  So you can start working with more styles, background images,
  and other resources. You'll also notice the grid starts to
  come into play. Have fun!
  
  ******************************************************************/
  /*********************
  GENERAL STYLES
  *********************/
  /********************
  WORDPRESS BODY CLASSES
  style a page via class
  ********************/
  /*********************
  LAYOUT & GRID STYLES
  *********************/
  .wrap {
	    max-width: 960px; 
	}

  /***** Grid Options down here, where they are usable ******/
  /* This is using the 1140 Grid System: http://cssgrid.net/ */
  .onecol {
    width: 4.85%; }

  /* grid_1  */
  .twocol {
    width: 13.45%; }

  /* grid_2  */
  .threecol {
    /*width: 22.05%; }*/
 	width: 29.5%; }
  /* grid_3  */
  .fourcol {
    width: 30.75%; }

  /* grid_4  */
  .fivecol {
    width: 39.45%; }

  /* grid_5  */
  .sixcol {
    width: 45.5%; }
    /*width: 48%; }*/

  /* grid_6  */
  .sevencol {
    width: 56.75%; }

  /* grid_7  */
  .eightcol {
    width: 65.4%; }

  /* grid_8  */
  .ninecol {
    width: 74.05%; }

  /* grid_9  */
  .tencol {
    width: 82.7%; }

  /* grid_10 */
  .elevencol {
    width: 91.35%; }

  /* grid_11 */
  .twelvecol {
    width: 100%; }

	.frontcol:nth-child(odd) {
		clear:both;
	}
	.sixcol:nth-child(odd) {
		clear:both;
	}

  /* grid_12 */
  /* layout & column defaults */
  .onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {
    float: left;
    position: relative;
    margin-right: 3.8%; }

  /* adding float to large column */
  .twelvecol {
    float: left;
    position: relative; }

  /* default styles & fixes */
  .last {
    margin-right: 0;
    float: right; }

  /*********************
  HEADER SYTLES
  *********************/
h1,
.h1 {
}
.logo-h1 {
  font-weight: 500;
  font-size: 2.85em;
  line-height: 2.2em;
  clear:both;
}
.site-desc { 
	padding: 0 0 10px 0;
}
p#site-desc {
	line-height: 1.5em;
}
#inner-header {
	background: url(../../images/logo.png) top right no-repeat;
}
  /*********************
  NAVIGATION STYLES
  *********************/
  /* .menu is clearfixed inside mixins.less */

/* reset mobile menu items */
	#mheader, #header-title  {
		display: none; 
	}
	.dropmenu, #touch-menu, p#logo, p#site-desc {
		display:inline;
	}
	#touch-menu { -webkit-box-shadow: #333 0px 4px 4px;}
	#header-menu {position: absolute; top: 0; right: 0; margin: 0; padding: 0;}
	#header-menu a {height: 45px; display: block; background: url(../../images/droparrow.png) 0 0; width: 30px; margin: 0; padding: 0;}
	#header-menu .open {background-position: 0 -45px;}
	.dropmenu {width: 100%;position: relative;z-index: 1;margin: 0;padding: 0;border-top: 1px solid #1b1b1b;font-size: 16px;background-color: #2c2c2c;opacity: 0.95;}
	.dropmenu ul {position: relative;list-style-type: none;margin: 0;padding: 0;font-weight:normal;}
	.dropmenu a {display: block;text-shadow: #000 -1px -1px 1px;color: #d2d2d2;margin: 0;width: auto;padding: 6px 18px 6px 18px;text-decoration:none;text-align: left;}
	.dropmenu ul li ul li {padding-left:0px;}
	.sub-menu {border: none;padding: 0;text-align: left;margin: 0;}

	/* start menu */

	.menu {
		background: -radial-gradient(circle, #6c0283, #28055d);
		/* Firefox 3.6+ */ 
		background: -moz-radial-gradient(circle, #6c0283, #28055d);
		/* Safari 4-5, Chrome 1-9 */
		background: -webkit-gradient(radial, center center, 0, center center, 460, from(#6c0283), to(#28055d));
		/* Safari 5.1+, Chrome 10+ */
		background: -webkit-radial-gradient(circle, #6c0283, #28055d);
	}
	.menu ul {
		line-height: 1.0;
		margin-top: 0;
	}
	.menu ul li {
		float: left;
		position: relative;
	}
	.menu ul li a {
		color: #fff;
		display: block;
		line-height: 1.0;
		text-decoration: none;
		padding: 0.8em 1em 0.8em;
		background-color: transparent; 
		border-bottom: 0;
	}
	.menu ul li a:hover, .menu ul li a:focus {
		color: #ffffff;
		background-color: #28055d; 
	}
	.menu ul li ul.sub-menu,
	.menu ul li ul.children {
		width: 200px;
		border: 1px solid #ccc;
		border-top: 0;
		position: absolute;
		display: none;
		z-index: 8999;
	}
	.menu ul li:hover ul {
		top: auto;
		display: block; 
	}
	.menu ul li ul.sub-menu li,
	.menu ul li ul.children li {
		/*background-color: #6c0283;*/
	}

	.menu ul li ul.sub-menu li a,
	.menu ul li ul.children li a {
		color: #fff;
		background-color: #6c0283;
		padding: 0.8em 1em 0.8em;	  
		border-right: 0;
		display: block;
		width: 180px;
	}
	.menu ul li ul.sub-menu li:last-child a,
	.menu ul li ul.children li:last-child a {
		border-bottom: 0; 
	}

	.menu ul li ul.sub-menu li a:hover,
	.menu ul li ul.children li a:focus {
		color: #ffffff;
		background-color: #28055d; 
	}
	.current-menu-item, 
	.current-menu-item a, 
	.current-menu-ancestor, 
	.current-menu-parent {
		background-color: #28055d !important; 
	}
	.menu-item-home {
		display:none;
	}


  /* end .menu */
  /*********************
  POSTS & CONTENT STYLES
  *********************/

  /* post content */
  .post-content {
    /* at this larger size, we can start to align images */ }

  /* end .post-content */
  .wp-caption {
    /* images inside wp-caption */ }
    .post-content .alignleft, .post-content img.alignleft {
      margin-right: 1.5em;
      display: inline;
      float: left; }
    .post-content .alignright, .post-content img.alignright {
      margin-left: 1.5em;
      display: inline;
      float: right; }
    .post-content .aligncenter, .post-content img.aligncenter {
      margin-right: auto;
      margin-left: auto;
      display: block;
      clear: both; }
	img.alignleft {
	  float:left;max-width: 150px;
	  padding: 0 20px 0 0;
	}
	img.size-full {
		clear: both;
		float: left;
		max-width: 100%;
		min-width:90%;
		margin: 0 50px 0 0;
	}
	.togglebio {
		opacity:0.5;
		width: 11px;
		height: 10px;
		margin-left: 6px;
		display:inline-block;
		overflow: hidden;
		background: url(../../images/arrows-div.png) no-repeat 2px -102px; /* 8-bit indexed alpha png. IE6 gets solid image only */
	}
	.bioUp {
		background: url(../../images/arrows-div.png) no-repeat -9px -102px; /* 8-bit indexed alpha png. IE6 gets solid image only */
	}
	.post-content h2 {
		font-size: 1.125em;
	}
  /******************************************************************
  PAGINATION STYLES
  ******************************************************************/
	#pagination {
		margin: 20px 0;
		width: 100%;
		padding: 8px;
		font-size: 0.9em;
	}
  /******************************************************************
  COMMENT STYLES
  ******************************************************************/
  /* h3 comment title */
  #comments {
    /* number of comments span */ }

  .commentlist {
  }
    .commentlist li {
    }
      .commentlist li ul.children {
      }

  /* end .commentlist */
  /******************************************************************
  COMMENT FORM STYLES
  ******************************************************************/
  input { 
	border: 1px solid #ccc;
	padding: 3px;
  }
  .respond-form form input[type=text],
  .respond-form form input[type=email],
  .respond-form form input[type=url],
  .respond-form form textarea {
   }

  /*********************
  SIDEBARS & ASIDES
  *********************/
#sidebar {
  border: none;
  padding: 20px 0 0 0;	
}
  .sidebar {
   }

  h4.widgettitle {
	text-align: center;
	padding: 0, 8px 16px 8px !important;
    /*border-bottom: 1px solid #eee;*/
    margin-bottom: 8px; }

  .widget {
    padding: 2 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 .menu {
			background: transparent;
			margin: 0; padding: 0;
			display: block;
		}
		#sidebar .menu a {
			width: 100%;
			color: #6c0283;
			margin: 0px 0 4px 0;
		}
		#sidebar .menu a:hover, 
		#sidebar .menu a:focus {
			color: #28055d;
		}		
		#sidebar .menu ul {
			line-height: 1.0;
			margin: 0;
		}
		#sidebar .menu ul li {
/*			float: none;
			position: relative;
*/		}
		#sidebar .menu ul li a {
			line-height: 1.0;
			padding: 0 0 0 12px;
			border: 0;
			background:transparent;
		}
		#sidebar .menu ul li ul.sub-menu,
		#sidebar .menu ul li ul.children {
			border: 0;
		}
		#sidebar .menu ul li:hover ul {
			top: auto;
		}
		#sidebar .menu ul li ul.sub-menu li a,
		#sidebar .menu ul li ul.children li a {
			padding: 0.8em 1em 0.8em;	  
		}
		#sidebar .menu ul li ul.sub-menu li:last-child a,
		#sidebar .menu ul li ul.children li:last-child a {
		}

		#sidebar .menu ul li ul.sub-menu li a:hover,
		#sidebar .menu ul li ul.children li a:focus {
		}

	.sidewidget {
		margin: 0; padding: 8px;
		background-color: #eee; color: #444444;
		/*border: 1px solid #eee;*/
	}


  /* text widget */
  /*********************
  FOOTER STYLES
  *********************/

	.footerwidget {
		float: left;
/*		width: 18%;*/
	    width: 19.0%; 
		/*margin-right: 3.8%;*/
		/*width: 29.5%; */	
		/*margin: 0 1%;*/
	}

}
/* end of media query */
/******************************************************************
DESKTOP 
This is the average viewing window. So Desktops, Laptops, and 
in general anyone not viewing on a mobile device. 
******************************************************************/
@media only screen and (min-width: 1030px) {
  /* styles in 1030up.scss */
  /******************************************************************
  Site Name: 
  Author: 
  
  Stylesheet: Just larger than iPad
  
  This is the desktop size. It's larger than an iPad so it will only
  be seen on the Desktop. 
  
was 1140px
  
  ******************************************************************/
  .wrap {
    max-width: 960px; } }
/* end of media query */
/******************************************************************
LARGE VIEWING SIZE 
This is for the larger monitors and possibly full screen viewers.
******************************************************************/
@media only screen and (min-width: 1240px) {
  /* styles in 1240up.scss */
  /******************************************************************
  Site Name: 
  Author: 
  
  Stylesheet: Super Large Monitor Stylesheet
  
  ******************************************************************/ }
/* end of media query */
/******************************************************************
PRINT STYLESHEET
******************************************************************/
/******************************************************************
PRINT STYLESHEET

******************************************************************/
@media print {
  * {
    background: transparent !important;
    color: black !important;
    text-shadow: none !important;
    filter: none !important;
    -ms-filter: none !important; }

  a, a:visited {
    color: #444 !important;
    text-decoration: underline;
    /* show links on printed pages */
    /* show title too */ }
    a:after, a:visited:after {
      content: " (" attr(href) ")"; }
    a abbr[title]:after, a:visited abbr[title]:after {
      content: " (" attr(title) ")"; }

  .ir a:after,
  a[href^="javascript:"]:after,
  a[href^="#"]:after {
    content: ""; }

  pre, blockquote {
    border: 1px solid #999;
    page-break-inside: avoid;
}

  thead {
    display: table-header-group; }

  tr, img {
    page-break-inside: avoid; }

  img {
    max-width: 100% !important; }

  @page {
    margin: 0.5cm; }

  p, h2, h3 {
    orphans: 3;
    widows: 3; }

  h2,
  h3 {
    page-break-after: avoid; }

  /* hide content not required in print */
  .sidebar,
  .page-navigation,
  .wp-prev-next,
  .respond-form,
  nav {
    display: none; } 
}
