@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,700');

body, html {height:100%;}
body.movable {position:relative;}
body {word-wrap:break-word;background:#7c1111;font-family:Source Sans Pro;}
img {max-width:100%;height:auto;}
a {text-decoration:none;outline:none !important;-webkit-transition: all 100ms ease-in-out;-moz-transition: all 100ms ease-in-out;-ms-transition: all 100ms ease-in-out;-o-transition: all 100ms ease-in-out;transition: all 100ms ease-in-out;}

#top {padding:5px 3px;position:fixed;bottom:15px;right:15px;display:none;cursor:pointer;z-index:10;}
#top img {height:40px;width:40px;opacity:.5;}
#top img:hover {opacity:1;}

#navigation-wrapper {width:auto;background:#fff;position:fixed;right:auto;top:0;bottom:0;z-index:9999;}
	#navigation-wrapper > ul {margin:0;padding:0;}
	#navigation-wrapper > ul > li {list-style:none;display:block;vertical-align:middle;position:relative;border-bottom:solid 1px #873232;}
	/*#navigation-wrapper > ul > li:last-child {border:none !important;}*/
	#navigation-wrapper > ul > li > a {display:block;text-decoration:none;padding:12px 15px;font:400 15px 'Source Sans Pro';color:#7c1111;}
	#navigation-wrapper > ul > li:hover > a, #navigation-wrapper > ul > li > a.active {background:#7c1111;color:#fff;}

	#navigation-wrapper ul ul {display:none;padding:0;position:absolute;background:#f0f0f0;z-index:9;right:calc(100%);top:0;}
	#navigation-wrapper ul ul li {list-style:none;text-align:left;float:left;position:relative;border:0;width:15em;}
	#navigation-wrapper ul ul li a {text-decoration:none;color:#000;padding:12px 15px;font:400 15px 'Source Sans Pro';display:block;}
	#navigation-wrapper ul ul li:hover a {color:#fff;}
	#navigation-wrapper ul ul li:hover {background:#7c1111;}
	
	#navigation-wrapper ul ul ul {position:absolute;left:15em;top:0;}
	
	/*#navigation-wrapper p {padding:10px 15px;font:bold 12px 'Source Sans Pro';color:#ddd;border-bottom:dotted 1px #ddd;margin:0;text-transform:uppercase;}*/

/*dear programmer pakicopya nalang itong side navigation sa library.css*/
#sideNavigation {-webkit-box-shadow:3px 0 10px 0 rgba(0,0,0,.3);box-shadow: 3px 0 10px 0 rgba(0,0,0,.3);position:fixed; left:-250px; z-index:500; background:#333; height:100%; width:250px; overflow:auto;}
	#sideNavigation.right {left:auto; right:-250px;}
	#sideNavigation ul {margin:0; padding:0; background:#333;}
	#sideNavigation li {list-style:none; position:relative;}
	#sideNavigation a {display:block;padding:1em 2em 1em 1em;text-decoration:none;font:400 15px 'Source Sans Pro';color:#fff;}
	#sideNavigation a:hover, #sideNavigation a.active {}
	#sideNavigation ul ul {display:none;}
	#sideNavigation li span {position:absolute;right:.5em;top:1.3em;width:30px;}
	.sideNavTrigger {width:30px;display:none;margin-right:12px;position: absolute;top: 0;right: 15px;z-index: 9999;}
	body.movable {position:relative;}
	body.moved {left:250px;}
	body.moved.right {left:auto; right:250px;}
	#sideNavigation.right.moved {left:auto; right:0;top:0;}
	#sideNavigation.moved {left:0;}

.hamburger {padding:15px 0 15px 0;}
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width:40px;background: #fff;}

.camera_caption {position:relative;text-align:center;top:30%;}
.camera_caption > div {position:absolute;top:0;left:0;right:0;width:60%;margin:0 auto;display:none;}

#main {position:fixed;z-index:999;left:0;right:0;bottom:0;background:rgba(124,17,17,.9);}
.logo-wrapper {padding:15px 0;}
.logo-wrapper img {width:175px;}

.logo-subpage {padding:15px;}
.logo-subpage img {width:200px;}

.footer-content {padding:15px 0 0 0;}
.footer-content h1 {font:bold 14px 'Source Sans Pro';color:#fff;margin:0 0 8px 0;padding:0 0 5px 0;border-bottom:dotted 1px #fff;text-transform:uppercase;}
.footer-content p {font:300 13px 'Source Sans Pro';color:#fff;margin:0;padding:0;}
.footer-content span {margin-right:10px;}

.copyrights {padding:15px;}
.copyrights p {font:300 12px 'Source Sans Pro';color:#fff;margin:0;padding:0;}

/************** SUB BANNER FOOTER **************/

#footer-wrapper {padding:2em 0;}
.footer-nav ul {margin:0;padding:0;}
.footer-nav ul li {display:table-cell;list-style:none;border-right:solid 1px #fff;padding:0 8px;line-height:0;}
.footer-nav ul li a {font:normal 13px 'Source Sans Pro';color:#fff;}
.footer-nav ul li:first-child {padding-left:0;}
.footer-nav ul li:last-child {border-right:none;}

.footer-links p {font:normal 13px 'Source Sans Pro';color:#fff;margin:0;padding:0;}
.footer-contact p {font:normal 13px 'Source Sans Pro';color:#fff;margin:0;padding:0;}

.subpage {padding:8% 2em;background:#fff;}

#camera_wrap_2 {margin-bottom:2em;}

.subpage-wrap {padding:0 0 2em 0;position:relative;background:#fff;}
.subpage h1 {color:#7c1111;margin:0 0 1em 0;padding:0;text-transform:uppercase;font:bold 25px 'Source Sans Pro';}
.subpage p {color:#18bc9c;margin:0 0 1em 0;padding:0;font:normal 15px 'Source Sans Pro';}

.sidenav {margin-bottom:2em;}
.sidenav > ul {margin:0;padding:0;}
.sidenav li {list-style:none;}
.sidenav a {color:#7c1111;display:block;padding:6px 12px;text-decoration:none;font:normal 15px 'Source Sans Pro';}
.sidenav a.active, .sidenav a:hover {background:#7c1111;color:#fff;}

.news-content {border-top:solid 1px #fff;padding-bottom:12px;border-bottom:solid 1px #ddd;margin-bottom:10px;}
.news-wrapper > a {text-decoration:none;}
.news-wrapper > a:hover > h1 {background:#999;color:#fff;}
	h1.title-news {padding:12px 15px;font:400 15px 'Source Sans Pro';color:#7c1111;text-transform:capitalize;margin:0 0 15px 0;}
	.date {font:400 13px 'Source Sans Pro';color:#666;padding:0;margin:0;}
		/*.date span.day {font:400 17px 'Source Sans Pro';padding:10px;background:#999;color:#fff;float:left;margin:0 10px 5px 0;}
		.date span.month {font:400 10px 'Source Sans Pro';display:block;text-transform:uppercase;padding-top:5px;color:#999;}
		.date span.year {font:400 10px 'Source Sans Pro';display:block;color:#7c1111;}*/
		p.news-title {font:700 17px 'Source Sans Pro';color:#7c1111;margin:0 0 10px 0;padding:0;display:block;}
		p.news-text {font:400 13px 'Source Sans Pro';color:#7c1111;padding:0;margin:0 0 5px 0;text-align:justify;}
		.news-content a {font:400 13px 'Source Sans Pro';color:#7c1111;}

.beyond-btn {margin-top:2em;text-align:center;}
.beyond-btn a {text-decoration:none;display:block;font:700 16px 'Source Sans Pro';text-transform:capitalize;background:#7c1111;color:#fff;margin:15px 0;padding:6px 15px;border:solid 4px rgba(0,0,0,0.4);}

@media only screen and (max-width:1366px) {
	#navigation-wrapper ul ul {right:right:calc(100%);}
	#navigation-wrapper {width:20% !important;right:0;}
	p.news-title {font-size:15px;}
	p.news-text {font-size:13px;}
	.news-content a {font:700 12px 'Source Sans Pro';}
	#navigation-wrapper > ul > li > a {padding:10px 15px;font-size:13px}
	#navigation-wrapper ul ul li a {padding:9px 15px;font-size:13px;}
	.beyond-btn {margin:0;}
}

@media only screen and (max-width:1024px) {
	#navigation-wrapper {display:none;}
	.sideNavTrigger {display:block;}
	#main {position:relative;top:0;}
	.logo-wrapper {padding:15px 0;}
	.logo-wrapper img {width:150px;}
	#navigation-wrapper > ul {margin:0;}
	#navigation-wrapper > ul > li {display:block;border:none;}
	#navigation-wrapper > ul > li > a {font-size:13px;padding:5px 15px;}

	.footer-content h1 {font-size:12px;}
	.footer-content p {font:10px;}
	.footer-content {padding:1em 0;}
	.copyrights p {font-size:10px;}

	#footer-wrapper, .footer-contact {text-align:center !important;}
	.footer-links {margin-bottom:2em;}
	.footer-nav ul li {display:inline-block;}

	.subpage {padding-top:60%;}
	.sidenav {border-top:solid 2px #ddd;padding-top:2em;}

	.subpage-wrap h1 {margin-bottom:16px;}
}

@media only screen and (max-width:767px) {
	#main {position:relative;top:0;}
	.logo-wrapper {padding:15px 0;}
	.logo-wrapper img {width:150px;}
	#navigation-wrapper > ul {margin:0;}
	#navigation-wrapper > ul > li {display:block;border:none;}
	#navigation-wrapper > ul > li > a {font-size:13px;padding:5px 15px;}

	.footer-content h1 {font-size:12px;}
	.footer-content p {font:10px;}
	.footer-content {padding:1em 0;}
	.copyrights p {font-size:10px;}

	#footer-wrapper, .footer-contact {text-align:center !important;}
	.footer-links {margin-bottom:2em;}
	.footer-nav ul li {display:inline-block;}

	.subpage {padding-top:60%;}
	.sidenav {border-top:solid 2px #ddd;padding-top:2em;}

	.subpage-wrap h1 {margin-bottom:16px;}
}