body {
	margin: 0;
	padding: 0;
	width: 100%;
	height: auto;
	color: #303030;
	overflow-x: hidden;
	font-family: 'GothamRounded',Arial;
}

/* font */
footer label, footer span{ font-weight: normal;}
span.title, p.title,h2,h3,h4,h5,h6 { font-weight: 600;}
h1, p,a,label,li,small,input[type='submit'],table {font-weight: normal;}

/*h1 { font-size: 25px;}*/
h1 { font-size: 30px; margin-bottom: 20px;}
/*h2 { font-size: 17px;}*/
h2 { font-size: 16px; margin-bottom: 20px; text-transform: uppercase;} /* should be 20 as per design */

/*a,.btn,.menu,input[type='submit'] {	font-size: 16px;}*/
a,.btn,.menu,input[type='submit'] {	font-size: 14px;}
p,li,label,button, h4, #footer { font-size: 14px;}

button .btn {color: #782716;}
/*p.title {	font-weight: bold;}*/
.white {color: #fff;}
.yellow {color: #ffc20e;}
.brown {color: #782716;}
.dark-brown { color: #3b0001}
.dark-gray {color: #303030;}
.gold-layer {background-color: #ffc20e;}
.white-layer {background-color: #fff;}
.gray-layer {background-color: #f4f4f4;}
/* ver A */
.menu, #footer { color: #fff; }
/* ver B */
.menu .content, #footer .content { color: #9d9d9d; /*light gray*/}
.fa, .glyphicon { margin-right: 7px; }

.btn.action-btn{
	background-color: #6e3729;
	color: #fff;
	border-color: transparent;
}
.btn.action-btn:hover {
	background-color: #50291f;
	color: #fff;
}
.btn.action-btn:focus {
	background-color: #ffc20e;
}

.btn.yellow-btn{
	background-color: #ffd207;
	color: #fff;
	border-color: transparent;
}
.btn.yellow-btn:hover {
	background-color: #ffdb36;
	color: #fff;
}
.btn.yellow-btn:focus,
.btn.yellow-btn:active {
	background-color: #ffd61d;
}

.content-header { color: #3b0001;}
.small-hr {
	width: 60px;
    height: 6px;
    margin-bottom: 2em;
}

.flex {	display: flex;}
.hidden {display: none;}

select.form-control {
    border-radius: 0px;
	border: 1px solid #e2e2e2;
}
.form-control{
	border-radius: 0px;
	border: 1px solid #e2e2e2;
}
.has-error .form-control:focus,
#login select:focus,
#login input:focus,
.form-control:focus{
	box-shadow: 0 0 5px rgba(255, 210, 5, 1);
	box-shadow: 0 0 5px rgba(255, 210, 5, 1);
	border: 1px solid rgba(255, 210, 5, 1);
}
.has-error .form-control {
    border-color: #a94442;
    /*-webkit-box-shadow: inset 0 1px 1px #a94442;*/
    /*box-shadow: inset 0 0 5px #a94442;*/
}
a {	color: #782716;}
a:hover {color: #ffc20e;text-decoration: none;}
a:focus {text-decoration: none;}


/* PAGES */
.chunk h1 { text-align: center; color: #3b0001; margin-bottom: 28px;}	
.chunk h2:after {     margin-top: 20px; margin-bottom: 0px; }	
.chunk h1:after {     margin: 20px auto 0 auto; }
.chunk h2:after,	
.chunk h1:after {	
	content: " "; 
	display: block; 
	color: #ffc20e; 
    position: relative;
    padding-bottom: 6px; 
    width: 60px;
    background-color: #ffc20e;
}
.chunk { padding-bottom: 2em; margin-top: 2em;}
.chunk img {
  max-width: 100%;
  height: auto;
}
.chunk p {
	text-align: justify;
    word-break: break-word;
}
/* PAGES */
.required:before {
    content: "*";
    color: red;
    position: relative;
    left: -2px;
    font-size: 14px;
    top: -4px;
}


.currency:before {
	content: "Php ";
}

.error-msg {
    color: #a94442;
    font-size: 12px;
}
.btn-warning.action-btn {
	background-color: #757575;
}
.btn-warning.action-btn:hover { 
	background-color: #545454;
}
#mechanics .gold-layer.inverse { background-color: #fff; }
#mechanics .white-layer.inverse { background-color: #ffc20e; }

/* general padding */
.how-to-reg {	padding: 2em 0 3em 2em;}
.how-to .info,
.check { padding-bottom: 3em;  padding-top: 2em;}
#transaction section,
#mechanics section,
#login section,
#contact-us section,
#notice section, 
#promos-body section,
#events-body section {
    min-height: 300px;
    padding-bottom: 2em;
    padding-top: 2em;
}
footer { padding: 3em 0 0 0;}
.page-wrapper,
.default-wrapper { padding-top: 67px; }
.subnav-wrapper { padding-top: 117px; }

@media (max-width: 977px) { 
	.subnav-wrapper, 
	.page-wrapper,
	.default-wrapper { padding-top: 50px; }
}
@media (max-width: 800px) { 
	h1 { font-size: 23px;}
	h2 { font-size: 15px;}
	
	a,.btn,.menu,input[type='submit'] {	font-size: 14px;}
	p,li,label,button, h3, h4, #footer { font-size: 14px;}

	.how-to-reg {	padding: 1em 1em 2em 1em;}
	.how-to .info,
	.check { padding-bottom: 2em;  padding-top: 1em;}
	#transaction section,
	#mechanics section,
	#login section,
	#contact-us section,
	#notice section, 
	#promos-body section,
	#events-body section { padding-bottom: 1em; padding-top: 1em;}
}