/*
 * Theme Name: Kostic Labs
 * Theme Author: Md. Tahmid Hossain	
 * Theme URI: http://www.tahmid.info
 * Author URI: http://www.tahmid.info
 * Version: 1.0.0
 */

    @import url('https://fonts.googleapis.com/css?family=Roboto');

 	
	@font-face {  
		font-family: 'ChivoBold'; 
		src: url('fonts/Chivo-Bold.otf');    
		font-weight: normal;  
		font-style: normal;
	}

	
	*{
		color:#201f1f;
		font-family: 'Open Sans', sans-serif;
		font-size: 14px;
		letter-spacing: 1px
	}

    .latoTest {
        font-family: 'Roboto', sans-serif;
        font-weight: 900;
    }
	
	
	h1,h2,h3,h4,h5{
		color:#201f1f;
		letter-spacing: 1px;
		text-transform: none;
		font-weight: 400;
		line-height: 1.4em
	}

	h1{
		font-size: 60px;
	}

	h2{
		font-size: 36px;
	}

	h3{
		font-size: 32px;
	}

	h4{
		font-size: 25px;
	}

	h5{
		font-size: 18px;
	}

	p{
		line-height:30px;
		font-size: 16px;
		color: #201f1f;
		letter-spacing: 1px;
	}
	
	body{
		
	}
	
	a:hover{
		text-decoration:none;
	}
	
	.centered{
		text-align:center;
	}
	
	.uppercase{
		text-transform:uppercase;
	}

	.nocase{
		text-transform: none;
	}

	.gray{
		background:#fafafa;
	}

	.white{
		color:#fff !important;
	}

	.orange{
		color: #e94e18 !important;
	}

	.red{
		color: #f05f40 !important
	}
	
	.bold{
		font-weight:600 !important;
	}

	.semibold{
		font-weight: 400;
	}

	.light{
		font-weight:300 !important;
	}

	
	img{
		max-width:100%;
	}

	.pad0{
		padding:0px !important;
	}

	.nomargin{
		margin:0px;
	}

	.btn{
		padding:15px 30px;
		color:#fff;
		display: inline;
		transition:0.4s all;
		-webkit-transition:0.4s all;
		-moz-transition:0.4s all;
		-o-transition:0.4s all;
		border-radius: 0px;
		border-radius: 5px;
	}

	.btn-fill{
		background:#47BB74;
		color:#fff;
	}

	.btn:hover{
		background:#39aa64;
		border-color: #39aa64;
		color:#fff;
	}

	.block{
		display:block;
	}

	.theme-color{
		color:#fa2543;
	}

	.row-fluid{
		height: auto;
		overflow: hidden;
	}

	/** Navbar **/

	@media screen and (min-width: 768px){
		.navbar-default .navbar-collapse, .navbar-default .navbar-form {
		    border: 0px;
		}

		.navbar-default {
		    background-color: transparent;
		    border: 0px;
		}

		.navbar-default .navbar-nav > li > a{
			color:#cbcbcb;
			margin-right:1px;
			line-height:67px;
			letter-spacing: 1px;
			text-transform: uppercase;
			transition:0.4s all;
			-webkit-transition:0.4s all;
			-moz-transition:0.4s all;
			-o-transition:0.4s all;
		}

		.nav > li > a {
		    padding: 0px 21px !important;
		    font-size: 14px;
		}

		.navbar-default .navbar-nav > li > a:hover, 
		.navbar-default .navbar-nav > .active > a, 
		.navbar-default .navbar-nav > .active > a:hover, 
		.navbar-default .navbar-nav > .active > a:focus {
		    color: #fff;
		    background: transparent;
		}

		.navbar {
		    min-height: 0px;
		    margin-bottom: 0px;
		    border: 0px;
		    float: right
		}


	}

	.navbar{
		margin-bottom: 0px;
	}

	.cover{
		background-position: center center;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.font48{
		font-size: 48px;
	}

	.font24{
		font-size: 24px;
	}

	ul, menu, dir {
	    display: block;
	    list-style-type: disc;
	    -webkit-margin-before: 0;
	    -webkit-margin-after: 0;
	    -webkit-margin-start: 0px;
	    -webkit-margin-end: 0px;
	    -webkit-padding-start: 0px;
	}

	/*
	* Common	*/


	
	#header {
	    background: #000008;
	    padding-top: 10px;
	    padding-bottom: 10px;
	}

	#navigation{

	}
	
	#hero{
	    padding-top:15px;    
	}
	
	#hero .container{padding-top:70px;}

	#hero-logo{
		padding-top: 70px;
		padding-bottom: 70px;
	}

	#logo{
		padding-top: 15px;
		padding-bottom: 15px;
	}
	
	#hero-harvard{
		margin-bottom: 100px;
	}


	#learn{
		background: #121214;
		padding-top: 70px;
		padding-bottom: 85px;
	}

	#learn p{
		font-size: 24px;
	}

	#articleCarousel{
		background:rgba(232,232,232,.94);
		padding-top: 50px;
		padding-bottom: 50px;
		margin-top: 100px;
		margin-bottom: 60px;
	}

	#articleCarousel .item a img{
		margin-bottom: 20px;
	}

	.carousel-control.right, .carousel-control.left{
		background: transparent;
	}

	.carousel-control {
	    position: absolute;
	    top: 0;
	    bottom: 0;
	    left: -101px;
	    width: 101px;
	    height: 113px;
	    opacity: 1;
	    top: 50%;
	    margin-top: -56px;
	}

	.carousel-control.right{
		right: -101px;
	}

	#news{
		background-image:url('img/baby.jpg');
		padding:100px 0px;
		background-position: center center;
		background-size:cover;
		background-repeat: no-repeat;
	}

	#contact{
		background-image:url('img/contact2.jpeg');
		background-color: white;
		padding:80px 0px;
		background-position: center center;
		background-size:cover;
		background-repeat: no-repeat;
	}

	#contact p{
		font-size: 18px;
	}

	#name{
		padding-left: 35px;
		margin-bottom: 30px;
	}

	#hire{
		padding-left: 35px;
		margin-top: 30px;
	}

	#address{
		background: url('img/address.png') no-repeat top left;
		padding-left: 50px;
	}

	#join-us{
		padding-top: 90px;
		padding-left: 50px;
	}

	#join-us h2{
		margin-bottom: 30px;
	}



	#hero{
		background-image: url('img/hero.jpg');
		background-size: cover;
		background-position: center center;
		background-attachment: fixed;
		padding: 20px 0px 40px;
	}


	.section-title{
		margin-bottom: 50px;
	}

	.section{
		padding:80px 0px;
	}

	select{
		padding: 15px 20px;
		width: 270px;
		border:1px solid #DBDBDB;
		border-radius: 6px;
		margin-bottom: 20px;
		background: #ffffff; /* Old browsers */
		background: -moz-linear-gradient(top,  #ffffff 0%, #ffffff 47%, #f4f4f4 100%); /* FF3.6-15 */
		background: -webkit-linear-gradient(top,  #ffffff 0%,#ffffff 47%,#f4f4f4 100%); /* Chrome10-25,Safari5.1-6 */
		background: linear-gradient(to bottom,  #ffffff 0%,#ffffff 47%,#f4f4f4 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f4f4f4',GradientType=0 ); /* IE6-9 */

		
	}


	/*Footer*/


	#footer{
		padding:40px 0px 25px;
		color:#fff;
		border-top: 3px solid #f0f0f0;
		background:#fff;
	}

	#social-row{
		margin-bottom: 15px;
	}

	.social{
		width: 138px;
    	margin: 0 auto 30px;
    	display: block;
	}

	.social li{
		list-style: none;
		float: left;
	}

	.social li a{
		display: block;
		border:1px solid #adadad;
		border-radius: 50%;
		height:36px;
		width: 36px;
		text-align: center;
		margin: 5px;
		transition: 0.4s all;
		-moz-transition: 0.4s all;
		-o-transition: 0.4s all;
		-webkit-transition: 0.4s all;
	}

	.social li a i{
		color: #333333;
		font-size: 20px;
		line-height: 36px
	}

	.social li a:hover{
		background:#e7e7e7;
	}

	#footer-top{
		padding-top: 10px;
		padding-bottom: 10px;
	}

	#footer-bottom{
		padding-top: 35px;
		padding-bottom: 35px;
		border-top: 1px solid #E9E9E9;
		border-bottom: 1px solid #E9E9E9;
		margin-top: 20px;
		margin-bottom: 40px;
	}

	.footer-links li{
		float: left;
		list-style: none;
	}

	.footer-links li a{
		font-size: 14px;;
		padding: 20px;
		color: #1a1a1a;
		line-height: 60px;
	}


	.footer-logos{
		float: none;
		list-style: none;
		width: 492px;
        margin: 0 auto;
	}

	.footer-logos li{
		float: left;
		margin-left: 30px;
	}

	.footer-logos li a img {
	    max-height: 60px;
	}
	
	input[type="text"],input[type="email"],textarea,input[type="tel"]{
		border:1px solid #e0e0e0;
		padding:4px 15px;
		border-radius: 3px;
		width: 100%;
	}


	textarea{
		height: 200px;
	}
	

	::-webkit-input-placeholder {
	   color: #34383c;
	}

	:-moz-placeholder {
	   color:#34383c;  
	}

	::-moz-placeholder { 
	   color: #34383c;  
	}

	:-ms-input-placeholder {  
	   color: #34383c;  
	}


	/*
	*
	*Research
	*
	*/

	.research-section{
		padding-top: 100px;
		padding-bottom: 100px;
	}

	.research-section span.research-section p{
		font-size: 18px;
	}

	.research-section h1{
		margin-top: 5px;
		line-height: 48px;
		margin-bottom: 35px;
	}

	#analysis{
		background-image: url('img/analysis.jpg')
	}

	#engineering{
		background-image: url('img/engineering.jpg')
	}

	#validation{
		background-image: url('img/validation.jpg')
	}

	.page-head, #page-header{
		padding-top:60px;
		padding-bottom: 60px
	}

	#page-header{
		background: url('img/validation.jpg');
		text-align: center;
		background-position: center center;
		background-size: cover;
		background-attachment: fixed;
	}

	.page-head h1{
		font-size: 60px;
		margin: 0px;
		line-height: 60px;
		padding: 0px;
	}


	#publication-header{
		background-image: url('img/publications_2.jpg');
		background-position: center center;
	}
	
	#photo-header{
		background-image: url('img/validation.jpg');
		background-position: center center;
	}

	#pub-header{
		background: #323232
	}

	#pub-header span{
		line-height: 55px;
	}
	
	.row.publication{
		padding-top: 20px;
		padding-bottom: 25px;
	}

	#pagination a, #pagination span {
        padding: 6px 12px;
        background: #e94e18;
        color: #fff;
        border-radius: 4px;
        margin: 2px;
        transition:0.4s all;
        -webkit-transition:0.4s all;
        -moz-transition:0.4s all;
    }
    
    #pagination{
    	margin-top: 30px;
    }
    
    #pagination span,#pagination a:hover{
        background:#222;
        color:#fff;
    }

	.grey{
		background: #f8f8f8;
		border-top: 1px solid #d9d9d9;
		border-bottom: 1px solid #d9d9d9;
	}


	/*
	* Team
	*/

	.team{
		display: block;
	}

	.img-overlay {
	    position: absolute;
	    left: 0px;
	    top: 0px;
	    right:0px;
	    bottom: 0px;
	    opacity: .4;
	    background: #000;
	    transition: opacity .25s ease-in-out;
	    background: -webkit-linear-gradient(rgba(0,0,0,.0), rgba(0,0,0,.6)); /* For Safari 5.1 to 6.0 */
	    background: -o-linear-gradient(rgba(0,0,0,.0), rgba(0,0,0,.6)); /* For Opera 11.1 to 12.0 */
	    background: -moz-linear-gradient(rgba(0,0,0,.0), rgba(0,0,0,.6)); /* For Firefox 3.6 to 15 */
	    background: linear-gradient(rgba(0,0,0,.0), rgba(0,0,0,.6)); /* Standard syntax (must be last) */
	    opacity: 1
	}

	.team:hover .img-overlay{
		opacity: .3;
	}
	

	.team .info{
		position: absolute;
	    bottom: 0px;
	    width: 100%;
	    text-align: center;
	}

	.team .info h2{
		margin-bottom: 0px;
		font-size: 26px !important;
	}
	
	.team .info img{
	    width: 70% !important;
	    height: 1px !important;
	}
	
	.team .info .font24 {
	    font-size: 20px !important;
	}

	#arancha-details, #tchavkin-details, #tao-details, #marsha-details, #jluber-details, #matthew-details, #kostic-details, #btierney-details, #imishra-details, #zyang-details, #rbrown-details{
		display: none;
	}

	.team-details{
		padding: 30px 40px;
		background: #fff;
	}

	.team-details h2 .outer{
		line-height: 50px;
		padding-bottom: 15px;
		padding-right: 15px;
	}

	.font36{
		font-size: 36px
	}

	.team-close{
		display: block;
	    position: absolute;
	    top: 30px;
	    right: 30px;
	}

	.team-profile-links{
		width: 100%;
		display: block;
		height:auto;
		overflow: hidden;
		margin-top: 40px;
		margin-bottom: 40px;
	}

	.team-profile-links li{
		float: left;
		font-weight: 600;
		list-style: none;
		margin-right: 20px;
	}

	.team-profile-links li a i{
		color: #e94e18
	}

	.background li{
		margin-bottom: 16px;
		list-style-position: inside;
	}


	/*
	* Join Us
	*/

	.close{
		color: #111 !important;
	    font-size: 48px !important;
	    opacity: 1 !important;
	    font-weight: 300;
	    margin-top: -15px !important;
	}

	.modal-body {
	    position: relative;
	    padding: 30px 25px 25px;
	}

	.modal-body h4{
		margin-top: 0px;
	}

	.modal-title{
		margin-top: 20px;
	}

	.modal-header{
		border-bottom: 0px;
	}

	.modal-content{
		border-radius: 0px;
		background: #f7f7f7;
	}

	#dashed{
		height:1px;
		border-bottom: 1px dashed #b2b2b2;
		max-width: 610px;
		margin-top: 30px;
		margin-bottom: 30px;
	}

	.modal{
		top: 100px;
	}

	.admin{
		border-bottom:1px solid #59a3a0
	}


	/*
	* Pull out menu
	*/

	#sfm-sidebar .sfm-menu li>a span{
		color: #fff
	}

	@media screen and (min-width: 768px){
		.hidden-sm{
			display: none;
		}

		#contact-form{
			padding-right: 50px;
		}

		.modal-dialog {
		    width: 700px;
		}
	}


	@media screen and (max-width: 767px){

		.fl-right{
			float: none;
		}

		.navbar-default {
		    background-color: #47BB74;
		    border-color: #47BB74;
		}

		#header{
			padding-bottom: 0px;
		}

		div#logo a {
		    width: 100%;
		    display: block;
		    text-align: center;
		}

		.navbar-default .navbar-toggle {
		    border-color: #fff;
		    margin-top: 5px;
		    margin-bottom: 4px;
		}

		.navbar-default .navbar-toggle .icon-bar {
		    background-color: #fff;
		}

		button.navbar-toggle:hover {
		    background: #222 !important;
		}

		.navbar-default .navbar-nav > li > a {
		    color: #fff;
		}

		.navbar-default .navbar-nav > li > a:hover, 
		.navbar-default .navbar-nav > li > a:focus {
		    color: #fff;
		    background:rgba(0,0,0,.1);
		}

		.navbar{
			min-height: 40px;
		}

		.navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
		    color: #fff;
		    background:rgba(0,0,0,.1);
		}

		#contact{
			background: #E7E7E7
		}

		#contact .call{
			color: #1a1a1a !important;
		}
	}

	@media screen and (max-width: 460px){
		.footer-links li,.footer-logos li{
			width: 100%;
			text-align: center;
		}

		.footer-logos li{
			margin-bottom: 20px;
			float: left;
			margin-left: 0px;
		}

		#address{
			background: none;
		}

		#pub-header span{
			line-height: 25px;
		}

		#hero-logo {
		    padding-top: 20px;
		    padding-bottom: 50px;
		}

		#hero-harvard{
			margin-bottom: 80px;
		}

		#name{
			padding-left: 15px;
		}

		#address{
			padding-left: 30px;
		}

		#join-us {
		    padding-top: 40px;
		    padding-left: 30px;
		}
	}

    ul{
        padding-left:0px;
        margin-left:0px;
    }
    
    
    /* Side Navigation */
    
    .menu-button{margin-left:30px}
    
    .menu-button i, .closebtn i{font-size:30px; color:#fff}
    
    .sidenav {
	    height: 100%; 
	    width: 275px; 
	    position: fixed;
	    z-index: 1; 
	    top: 0;
	    left: -275px;
	    background-color: #313439; 
	    overflow-x: hidden; 
	    padding-top: 65px; 
	    transition: 0.5s all;
	    -webkit-transition: 0.5s all;
	    -moz-transition: 0.5s all;
	    -o-transition: 0.5s all; 
	}

	.sidenav a {
	    text-decoration: none;
	    color: #fff;
	    display: block;
	    transition: 0.4s all;
	    -webkit-transition: 0.4s all;
	    -moz-transition: 0.4s all;
	    -o-transition: 0.4s all;
	}

	#mySidenav li a:hover,.current-menu-item a{
		background: #47BB74;
		color: #fff;
	}

	#mySidenav li {
	    text-align: center;
	    border-bottom: 1px solid #555;
	    color: #fff;
	}

	#mySidenav li a{
		color: #fff;
		font-size: 16px;
		padding: 12px 30px;
	}

	.closebtn {
	    position: absolute;
	    top: 0px;
	    right: 15px;
	    font-size: 40px;
	    margin-left: 50px;
	    color:#fff;
	}

	#main {
	    transition: margin-left .5s;
	    -webkit-transition: margin-left .5s;
	    -moz-transition: margin-left .5s;
	    -o-transition: margin-left .5s;
	    padding: 0px;
	    position: relative;
	    z-index: 10;
	    height: auto;
	    overflow: hidden
	}


	@media screen and (max-height: 450px) {
	    .sidenav {padding-top: 15px;}
	    .sidenav a {font-size: 18px;}
	}