@font-face {
    font-family: opfont;
    src: url(../fonts/Billabong.ttf);
}

body{
	background: #F0F0F3;
	height: 100%;
}

.main-header{
	position: relative;
    min-height: 50px;
	background-color: #FFF;
    border-bottom: 1px solid #dbdbdb;
}

.main-header>.container{
	padding: 26px 20px;
}

.sub-main-header{
	width: 100%;
}
.sub-main-header>img{
	float: left;
	width:40px;
}
.sub-main-header>h2{
	margin-left: 20px;
	padding-left: 20px;
	display: inline;
	font-family: opfont;
	font-size: 3em;
	color: #231F20;
	border-left: 2px solid #231F20; 
}

.navbar{
	border-radius: 0;
}

.p-warning{
	padding: 20px;
}

.container-fluid{
	height: 100%;
}
.container-story{
	/*height: 380px;
	overflow-x: scroll;*/
	margin-bottom: 200px;
}

.ajax_loading{
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	text-align: center;
	padding-top: 100px;
	z-index: 999;
}

footer{
	width: 100%;
	bottom: 0;
	text-align: center;
	border-top: 1px solid #231F20;
	font-family:  opfont;
}
footer>.container{
}

@media (min-width: 320px) and (max-width: 480px) {
 	.navbar-header{
 		text-align: center;
 	}

	.navbar-header>img{
		
		float: none;
	}
	.navbar-header>h2{
	}
	.input-group-lg>.form-control, .input-group-lg>.input-group-addon{
		font-size: 2em;
	}
	.input-group-addon, .input-group-btn{
		width: 3%;
	}
	.input-group-lg>.input-group-btn>.btn{
		    padding: 10px 36px;
	}
}