/*******************************************************************************
Slate Theme for GitHub Pages
by Jason Costello, @jsncostello
*******************************************************************************/


/*******************************************************************************
MeyerWeb Reset
*******************************************************************************/

ol, ul {
  list-style: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}




.outer {
  width: 100%;
}

.inner {
  position: relative;
  margin: 0 auto;
}

#header_wrap {
  background: #212121;
  background: -moz-linear-gradient(top, #373737, #212121);
  background: -webkit-linear-gradient(top, #373737, #212121);
  background: -ms-linear-gradient(top, #373737, #212121);
  background: -o-linear-gradient(top, #373737, #212121);
  background: linear-gradient(top, #373737, #212121);
}

#header_wrap .inner {
  padding: 50px 10px 30px 10px;
}




#main_content_wrap {
 
 
}

#main_content {
  padding-top: 40px;
  top:-110px;
}

#footer_wrap {
  background: #212121;
}


        pre {
            margin-bottom: 20px;
        }

         #main_content {
             margin-bottom: 50px;
			top:-110px;
         }

        #masonry {
            overflow: hidden;
        } 

        .filters {
            margin-bottom: 20px;
        }
        
        .card-container {
            margin-bottom: 40px;
			
        }
        
        .card {
            padding: 0px;
            background: #fff;
            padding-bottom: 35px;
            box-shadow: 0 0 23px 3px rgba(0, 0, 0, .10);
			opacity: 0;
			margin-top: 25px;
			margin-bottom: 15px;
				
        }
   
		.card img {
			width: 100%;
			max-width: 100%;	
			margin-bottom: 25px;
		}
		
		.post-time {
			color: #a09d9d;
			font-size: 14px;
			font-weight: 100;
			padding-left:30px;
			padding-right:30px;
			display: block;
		}
		
		.post-title {
			color: #000000;
			font-size: 23px;
			font-weight: 500;
			padding-left:30px;
			padding-right:30px;
			padding-top: 5px;
			display: block;
		}
		
		.post-content p {
			padding-left:30px;
			padding-right:30px;
			color: #a09d9d;
			font-weight: 100;
			line-height: 25px;
			display: block;
			
		}
		
		.post-btn-content {
		
			padding-top: 10px;
			display: block;
			position: absolute;	
			
		}
		
		.masonlink2 {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:33.3333333%;
		}
		
		.threepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:33.3333333%;
		}
		
		.singlepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:37%;
		}
		
		.post-link {
			display: block;
    		padding-top: 4px;
		}
			
		label#postbtn {
			
			background-color: #b5eb46;	
			border-radius: 6px;
			font-size: 20px;
  		    font-weight: 400;
  		    width: 121px;
			padding-top:10px;
			margin-left: -3px;
			box-shadow: none;
			margin-bottom: 4px;	
			margin: 0 auto;
    		display: block;
			padding-left: 12px;
			padding: 12px;
      text-align: center;
			-o-transition:.25s;
 		    -ms-transition:.25s;
 		    -moz-transition:.25s;
 		    -webkit-transition:.25s;
		    transition:.25s;
			
		}
		
		label#postbtn:hover  {
			background-color: #baff2c;
		}
		
		input#postbtn {
			padding-top: 1px;
			padding-bottom: 15px;
			padding-left: 28px;
			font-size: 17px;
			font-weight: normal;
			font-family: 'Deliveroo';
			font-style:italic;
			font-weight: 100;
			width: 560px;
			outline: none;
	  	    display: none;
		}
		
.btn-toolbar {		
margin: 0 auto;
  margin: 0 auto;
    width: 100%;
    position: relative;
	
}

.btn-group { 
float: none!important;
   margin: 0 auto!important;
   padding-bottom:15px;
    display: table;
	
}

label#searchbtn {
	
	background-color: #450063;	
	border-radius: 6px;
	font-size: 19px;
	font-weight: normal;
	width: 119px;
	padding-top:14px;
	margin-left: -3px;
	box-shadow: none;
	margin-bottom: 4px;
	
}

input#searchfield {
	padding-top: 19px;
    padding-bottom: 16px;
    padding-left: 28px;
    font-size: 17px;
    font-weight: normal;
    font-family: 'Deliveroo';
    font-style: italic;
    font-weight: 100;
    width: 560px;
    outline: none;
    border: 1px solid #ccc;
}

input#option5 {
	margin-top: 10px;	
}

.btn-group>.btn:first-child:not(:last-child):not(.dropdown-toggle) { border-radius: 6px; }

.btn-group>.btn:not(:first-child):not(:last-child):not(.dropdown-toggle) { border-radius: 6px; }

.btn-group>.btn:last-child:not(:first-child), .btn-group>.dropdown-toggle:not(:first-child) { border-radius: 8px; }

.btn-primary {
	background-color: #00ccbc;
	border:0;
	margin-right: 40px;
	border-radius: 4px;
	width: 180px;
	height: 57px;
	box-shadow: 0 0 6px 2px rgba(0, 0, 0, .15);
}

.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open .dropdown-toggle.btn-primary {
	background-color: #006e69;
	box-shadow: none;
	-webkitbox-shadow: none;
}	

.btn-name {  
	padding-top: 10px;
    display: block; 
	font-size: 19px;
	font-weight: normal;
	
}

.subfilters {
	
   margin: 0 auto!important;
   margin-bottom:15px;
    display: table;
	padding-top:43px;
	padding-bottom:43px;
	opacity: 0;
}	

/* Effect 1: opacity */
.grid.effect-1 li.animate {
	-webkit-animation: fadeIn 0.65s ease forwards;
	animation: fadeIn 0.65s ease forwards;
}



@-webkit-keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}

@keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}
/*******************************************************************************
Small Device Styles
*******************************************************************************/

@media screen and (min-width: 1600px) {
	
	.masonlink3 {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:37%;
		}
}

@media screen and (max-device-width: 1024px) and (orientation : landscape) {
	
	.threepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:26.333333%;
		}
	
	
	.singlepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:31%;
		}	
	
	.masonlink2 {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:30.3%;
		}	
	
}

@media screen and (max-width: 1180px) {
	
	 label.btn.btn-primary:nth-child(n+5) {
   margin-top:18px;
 }
	
}

@media screen and (max-width: 992px) {
	
	 label.btn.btn-primary:nth-child(n+4) {
   margin-top:18px;
 }
	
}



@media screen and (max-width: 768px) {
	.btn-primary {
	margin-right: 20px;
	border-radius: 4px;
	width: 144px;

	}
	
	.btn-toolbar {
    margin: 0 auto;
    margin: 0 auto;
    width: 94%;
    position: relative;
}
	
	label.btn.btn-primary:nth-child(n+4) {
   margin-top:0px;
 }
	
 label.btn.btn-primary:nth-child(n+5) {
   margin-top:18px;
 }
 
	
	.subfilters {
		padding-top: 23px;
		padding-bottom: 23px;	
		   
	}
	
	.threepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:17%;
		}
		
			
	.singlepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:26%;
		}
		
		.masonlink2 {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:31%;
		}
		
	
	
}

@media screen and (max-width: 691px) {
	
	label.btn.btn-primary:nth-child(n+4) {
   margin-top:0px;
 }
	
 label.btn.btn-primary:nth-child(n+5) {
   margin-top:18px;
 }
	
}

@media screen and (max-width: 43em) {
	
	 label.btn.btn-primary:nth-child(n+4) {
   margin-top:0px;
}
 label.btn.btn-primary:nth-child(n+5) {
   margin-top:0px;
}
	
.threepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:32.33333%;
		}
		
.singlepostlink {
			display:block;
			height: 50px;
			position: absolute;
			z-index: 1;
			padding-left:32.33333%;
		}
	
  body {
    font-size:14px;
  }

  #downloads {
    display: none;
  }

  .inner {
    min-width: 320px;
    max-width: 480px;
  }

  #project_title {
  font-size: 32px;
  }

  h1 {
    font-size: 36px;
  }

  h2 {
    font-size: 24px;
  }

  h3 {
    font-size: 21px;
  }

  h4 {
    font-size: 18px;
  }

  h5 {
    font-size: 14px;
  }

  h6 {
    font-size: 12px;
  }

  code, pre {
    min-width: 320px;
    max-width: 480px;
    font-size: 11px;
  }
  
  .btn-primary {
		
	 background-color: #00ccbc;
    border: 0;
    margin-right: 10px!important;
    border-radius: 4px;
    width: 155px!important;
    height: 57px;
    box-shadow: 0 0 6px 2px rgba(0, 0, 0, .15);
    margin-bottom: 10px!important;	
		
	}
	
.btn-toolbar {
    margin: 0 auto;
    margin: 0 auto;
    width: 100%;
    position: relative;
}
	
	
.btn-group {
	padding-left: 14px;	
}
	
	input#searchfield {
	 padding-top: 18px;
    padding-bottom: 15px;
    padding-left: 28px;
    font-size: 17px;
    font-weight: normal;
    font-family: 'Deliveroo';
    font-style: italic;
    font-weight: 100;
    width: 264px;
    outline: none;
	}
	
	label#searchbtn {
		background-color: #450063;
		border-radius: 6px;
		font-size: 19px;
		font-weight: normal;
		width: 69px!important;
		padding-top: 14px;
		margin-left: -3px;
		box-shadow: none;
		margin-bottom: 4px!important;
	}
	
	.subfilters {
		padding-top: 13px;
		padding-bottom: 13px;	
		    padding-left: 5px;
	}
}