/* ==========================================================================
   Base
   ========================================================================== */

body {
	margin-bottom: 50px;
	background-image: url("/assets/img/bg.png");
	background-repeat: repeat-x;
	font-family: "Titillium",sans-serif;
	font-weight: 300;
}

body.home {
}

.twitter-timeline {
	margin-top: 0px;
	opacity: .6;
}

.twitter-timeline:hover {
	opacity: 1;
}

a.external:before {
	color: #416071;
	content: "➡ ";
	font-size: 17px;
	line-height: 0;
}

#loading {
	background: none repeat scroll 0 0 #fff;
	height: 100%;
	top: 0;
	left: 0%;
	margin-left: 0px;
	margin-top: 0px;
	opacity: 1;
	position: fixed;
	top: 0%;
	width: 100%;
	z-index: 2;
}

#loading img {
	position: absolute;
	width: 50px;
	height: 50px;
	top: 50%;
	left: 50%;
	margin-left: -25px;
	margin-top: -25px;
}

#masonryContainer {
	position: relative;
}

#masonryContainer .box {
	width: 213px;
	margin: 10px;
	float: left;
}

blockquote p {
	font-size: inherit;
	color: #666;
}

/* =============================================================================
   Header
   ========================================================================== */

.brand img {
	height: 30px;
}

/* Fixed Topbar Navigation */
body.top-navbar { padding-top: 60px; }
body.admin-bar .navbar-fixed-top { top: 28px; }

.dropdown-menu .active > a, .dropdown-menu .active > a:hover {
	color: #fff !important;
}

#nav-main .menu-articles > a {
	background-image: url("/assets/img/articles.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    background-size: 20px auto;
    padding-left: 37px;
}

#nav-main .menu-projects > a {
	background-image: url("/assets/img/bulb.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    background-size: 14px auto;
    padding-left: 30px;
}

#nav-main .menu-about > a {
	background-image: url("/assets/img/user.png");
    background-position: 10px 10px;
    background-repeat: no-repeat;
    background-size: 17px auto;
    padding-left: 32px;
}


/* ==========================================================================
   Content
   ========================================================================== */

#content {
	margin-top: 20px;
}

.page-header {
	background: url("/assets/img/stripes.png") repeat scroll 0 0 transparent;
	padding-left: 20px;
	padding-top: 5px;
}

.page-header h1 {
	font-weight: bold;
	color: #666;
}

.page-subheader {
	background: url("/assets/img/stripes.png") repeat scroll 0 0 transparent;
	padding-left: 20px;
	padding-top: 0px;
}

.post {
	  border-bottom: 1px dotted #999;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.52;
    margin-bottom: 20px;
    padding-bottom: 10px;
}

.post li {
    font-size: 18px;
    font-weight: 300;
    line-height: 1.52;
}

.post h1 {
	font-weight: 300;
}

.post h2 {
	font-size: 26px;
    font-weight: 300;
    line-height: 48px;
}

.post h3, .post h4, .post h5, .post h6 {
	font-size: 23px;
    font-weight: 300;
    line-height: 45px;
}

.postListThumb {
	float: left;
  width: 200px;
  height: 210px;
  margin-top: 10px;
  margin-right: 20px;
  margin-bottom: 40px;
  background: #fff;
}

.postListThumb img {
	width: 100%;
	height: 100%;
}

.about .tag {
	background: none repeat scroll 0 0 #EFEFEF;
    border: 1px solid #999999;
    border-radius: 5px 5px 5px 5px;
    display: inline-block;
    margin: 0 10px 10px 0;
    padding: 3px 7px;
}



/* ==========================================================================
   Primary Content
   ========================================================================== */

#main {
}

/* ==========================================================================
   Projects Page
   ========================================================================== */

.projectProgress {
	float: left;
	margin: 0px 7px 0 0;
}

.project {
	margin: 0;
	padding: 30px 0;
	border-top: 2px dotted #afafaf;
}

.project .span3 .btn {
	display: block;
	margin-bottom: 10px;
}

.project img.projectThumb {
	border: 0px solid #fff;
	margin-bottom: 10px;
}

.project .projectDescription p {
	text-align: justify;
}

.project .projectResources {
	padding-top: 40px;
}

.project h3 {
	margin: 0;
}

.project img.span8 {
	border: 1px solid #afafaf;
	margin-bottom: 8px;
	margin-left: 4px;
	margin-right: 4px;
}

.project .row .span3:first-child {
	margin-left: 0px;
}

.project .span8 {
	margin-bottom: 40px;
}

.slider ul.bxslider {
	margin: 0;
}

.slider {
	width: 85%;
	margin-left: 7.5%;
}

.project hr {
	border-bottom: 1px solid #afafaf;
}


/* ==========================================================================
   Home Menu
   ========================================================================== */

#logo {
	display: inline-block;
	width: 40%;
	margin-top: 3%;
	margin-left: 30%;
	margin-bottom: 7%;
}

#introTxt {
	margin-top: 10%;
	font-size: 200%;
	line-height: 170%;
	text-align: center;
	color: #afafaf;
	padding: 0 10% 30px 10%;
}

#introTxt .big {
	font-size: 130%;
	color: #777;
}

#homeMenu {
	width: 100%;
}

.homeMenuBtn {
	background: url("/assets/img/stripes.png") repeat scroll 0 0 transparent;
    color: #666;
    float: left;
    font-size: 250%;
    height: 10%;
    margin-bottom: 20px;
    padding: 4%;
    width: 90%;
}

.homeMenuBtn:hover, .homeMenuBtn:active {
	background: #cfcfcf;
	text-decoration: none;
	color: #333;
}


/* ==========================================================================
   Sidebar
   ========================================================================== */

#sidebar .textwidget {
	margin-bottom: 40px;
}



/* ==========================================================================
   Posts
   ========================================================================== */

.hentry header { }
.hentry time {
	color: #999;
}
.hentry p.byline { }

.hentry footer { }

#comments {
	margin-top: 50px;
	border-top: 3px dotted #999;
}

#respond {
	margin-top: 50px;
	border-top: 3px dotted #999;
}


/* ==========================================================================
   Footer
   ========================================================================== */

#content-info { }



/* ==========================================================================
   WordPress Generated Classes
   See: http://codex.wordpress.org/CSS#WordPress_Generated_Classes
   ========================================================================== */

.aligncenter { display: block; margin: 0 auto; }
.alignleft { float: left; }
.alignright { float: right; }
figure.alignnone { margin-left: 0; margin-right: 0; }



/* ==========================================================================
   Media Queries
   ========================================================================== */

@media (min-width: 1200px) {
  
}

@media (max-width: 979px) {
  /* Fix top padding when using the responsive grid with the fixed topbar */
  body.top-navbar {
    padding-top: 0;
  }
}

@media (min-width:768px) and (max-width: 979px) {
  
  #introTxt .big {
    font-size: 100%;
  }
  
  #masonryContainer .box {
	width: 220px;
  }
  
}

@media (min-width:400px) and (max-width: 768px) {
  
  #logo {
  	width: 45%;
  	margin-left: 27.5%;
  }
  
  #introTxt {
    font-size: 160%;
  }
  
  #introTxt .big {
    font-size: 100%;
  }
  
  #masonryContainer {
  	margin-left: 10%;
  }
  
  #masonryContainer .box {
	width: 220px;
  }
}

@media (max-width: 400px) {
  #logo {
    width: 70%;
    margin-left: 15%;
  }
  
  #introTxt {
    font-size: 160%;
  }
  
  #introTxt .big {
    font-size: 100%;
  }
  
  #masonryContainer .box {
	width: 100%;
	margin: 0;
  }
}

/* -- Begin social sharing buttons
------------------------------------------------------------- */
.ss-share {
  padding-left: 0;
  margin-left: 0;
  margin-top: 40px;
  list-style: none; }

.ss-share-item {
  display: inline-block;
  margin-right: 10px; 
  margin-bottom: 10px;
}

.ss-share-link {
  /* crude button styles */
  text-decoration: none;
  color: #444;
  font-weight: 300;
  padding: .5em .75em .5em 35px;
  background-color: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 2px; }
.ss-share-link:hover, .ss-share-link:active, .ss-share-link:focus {
    color: #000;
    text-decoration: none;
    background-color: #fff; }

[class*="ico-"] {
  display: inline-block;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: 10px center; }

.ico-facebook {
  background-image: url("https://www.facebook.com/favicon.ico"); }

.ico-twitter {
  background-image: url("https://twitter.com/favicons/favicon.ico"); }

.ico-google {
  background-image: url("https://ssl.gstatic.com/s2/oz/images/faviconr2.ico"); }