/*!
 * Start Bootstrap - Business Casual Bootstrap Theme (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */
 .navbar-fixed-top .navbar-collapse, .navbar-fixed-bottom .navbar-collapse {
    max-height: 100% !important;
}

 .personal-name {
    text-align: center;
 }

 .personal-introduce {
    padding: 0 15px;
 }
 
body {
    margin-top: 50px; /* Required padding for .navbar-fixed-top. Remove if using .navbar-static-top. Change if height of navigation changes. */
}

.cursor-pointer {
    cursor: pointer;
}
 
 summary {
    font-size: 1.25em;
 }
 
.headline {
    padding: 120px 0;
}
.introduce-header {
    display: block;
    width: 100%;
    text-align: center;
    background: url('/image/introduce/title.jpg') no-repeat center center scroll;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    background-size: cover;
    -o-background-size: cover;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Josefin Slab","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-weight: 700;
    letter-spacing: 1px;
}

p {
    font-size: 1.25em;
    line-height: 1.6;
    color: #000;
}

footer {
    background: #fff;
    background: rgba(255,255,255,0.9);
}

footer p {
    margin: 0;
}

@media(min-width:768px) {
	.box {
		margin-bottom: 20px;
		/*padding: 30px 15px;*/
		background: #fff;
		background: rgba(255,255,255,0.9);
	}
}

.featurette-divider {
    margin: 80px 0;
}
@media(max-width:1200px) {
    .featurette-divider {
        margin: 50px 0;
    }
}

@media(max-width:991px) {
    .featurette-divider {
        margin: 40px 0;
    }
}
@media(max-width:768px) {
    .featurette-divider {
        margin: 40px 0;
    }
}

@media(max-width:668px) {
    .featurette-divider {
        margin: 30px 0;
    }
}

@media(max-width:640px) {
    .headline {
        padding: 75px 0 25px 0;
    }
}

@media(max-width:375px) {
    .featurette-divider {
        margin: 10px 0;
    }
}


@media (min-width: 500px) {
	.youtube-video-md{
		width: 500px; height: 500px;
	}
}
@media (min-width: 300px) and (max-width: 499px) {
	.youtube-video-sm{
		width: 300px; height: 300px;
	}
}

.lightbox {
	/** Default lightbox to hidden */
	display: none;

	/** Position and style */
	position: fixed;
	z-index: 999;
	width: 100%;
	height: 100%;
	overflow-x:scroll;
	text-align: center;
	top: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
}

.lightbox img {
	/** Pad the lightbox image */
	max-width: 90%;
	max-height: 80%;
	margin-top: 80px;
}

.lightbox:target {
	/** Remove default browser outline */
	outline: none;

	/** Unhide lightbox **/
	display: block;
}

.category { padding: 10px; border: 1px solid #ebebeb; border-radius: 10px; margin-bottom: 10px; }
.category:hover { border-color: #F5BC21; }
.category .description { height: 50px; overflow: hidden; }

.limit-width-4 {    max-width: 20px;
    overflow: hidden;}
	
.page-header {
    margin: 20px 0 20px;
    border-bottom: 1px solid #eee;
}

.formWithButton {
    width: calc(100% - 50px);
    display: inline-block;
}

.img-center {
    margin: 0 auto;
}

.blog-post-thumbnail {
    max-height: 150px;
}

.post-title {
    margin: 5px 0;
}

.post-subtitle {
    margin: 5px 0;
}

@media(max-width:768px) {
    h2.post-title {
        margin: 5px 0;
        font-size: 22px;
    }
}

.post-meta {
    margin: 0;
    font-size: 14px;
}

.solved-badge {
    float: left;
    z-index: 2;
    position: absolute;
    left: -5px;
    width: 40px;
    height: 40px;
    margin-top: -18px;
}