style.css

/*
Theme Name:         Government Web template
Theme URI:          http://pcdspo.gov.ph
Description:        Custom WordPress theme for demonstration purporses based on the draft Unified Web Content Policy prepared by the PCDSPO, DOST-ASTI, DOST-ICTO and NCC. Theme is built on HTML5 responsive WordPress framework based on ZURB's Foundation 4.
Version:            4.3
Author:             Jonathan Cuevas, Randy Pallones, John Mark Perocho
Author URI:         http://archondigital.com/

License:            MIT License
License URI:        http://www.opensource.org/licenses/mit-license.php
*/

/* --------------------------------------------------
   Table of Contents
-----------------------------------------------------
:: Customized Adjustments of Foundation for WordPress
:: GWT CSS OVERIDE
:: Styling Basic WordPress Outputs
:: Customize Foundation Style Pagination for WP-Pagenavi
:: Customize for BuddyPress
*/

/* ---------------------------------------------------
   Customized Adjustments of Foundation for WordPress
--------------------------------------------------- */

/* Foundation-specific presentation CSS by ZURB */
	div.reverie-header { margin: 0 0 20px 0; padding: 20px 0 0 0; border-bottom: solid 1px #ccc; }
	div.reverie-header h1 { font-weight: 500; margin-bottom: 0; padding: 0; }
	div.reverie-header h1 a { color: #181818; }
	div.reverie-header h1 a:hover { color: #181818; }

	@media handheld, only screen and (max-width: 767px) {
	header { position: relative; }
	header .subheader { margin-bottom: 0; }
	header .menu-action { float: left; position: relative; top: 1px; margin-top: -12px; }
	header .menu-action .button.small { padding: 8px; }
	header .menu-action .button.small svg { opacity: 0.5; }
	header h1 { font-size: 27px; font-size: 2.7rem; margin-bottom: 18px; }
	header h4 { font-size: 17px; font-size: 1.7rem; }
	}

/* -----------------------------------------
   GWT CSS OVERIDE
----------------------------------------- */
  .row {
    width: 1190px;
    max-width: 100%;

  }
	.top-bar {
		background: rgb(17, 17, 17);
		height: 40px;
		line-height: 40px;
		margin: 0 0 30px;
		padding: 0;
		width: 100%;
	}
	.top-bar-section ul li a:not(.button) {
		padding: 0 15px;
	}
	p {
		font-family: inherit;
		font-weight: normal;
		font-size: 14px;
		line-height: 1.6;
		margin-bottom: 17px;
	}
	.vcard {
		/* display: block; */
		margin: 0 0 1.25em 0;
		border: none;
		padding: 0;
	}
	.container-footer li, .container-footer-govph li, .container-footer p, .container-footer-govph p {
		font-size: .9em;
		color: #666;
	}
	body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, th, td {
		font-size: 13px;
	}
	.top-bar ul > li a:not(.button) {
	font-size: 13px;
	}
	.container-topbar .row, .container-topbar .row .toplayer {
		height: 40px;
	}
	.top-bar ul > li.toggle-topbar a {
	content: "";
	display: block;
	width: 0;
	height: 0;
	border: solid 8px;
	border-color: rgb(255, 255, 255) rgba(255, 255, 255, 0) transparent transparent;
	padding: 0;
	position: absolute;
	top: 50%;
	right: 15px;
	margin-top: 15px;
	}

	.container-banner h1 {
	font-size: 44px;
	}

	h2 a{
	font-size: 37px;
	}

	.nav-previous {
		float: left;
	}

	.nav-next {
		float: right;
	}

	li.search {
		padding: 0 10px;
	}

	#main-nav {
	background-color: rgb(17, 17, 17);
	height: 40px;
	position: relative;
	}

	.main-nav-section ul {
	padding: 0;
	margin: 0;
	}

	.main-nav-section ul li {
	float: left;
	list-style: none;
	}

	.main-nav-section ul li a{
	font-size: 13px;
	display: block;
	width: 100%;
	color: white;
	font-weight: bold;
	text-decoration: none;
	cursor: auto;
	text-align: -webkit-match-parent;
	line-height: 40px;
	margin: 0 10px;
	}

	.main-nav-section > ul > .divider {
	border-bottom: none;
	border-top: none;
	border-right: solid 1px #2b2b2b;
	border-left: solid 1px black;
	clear: none;
	height: 40px;
	width: 0px;
	}

	.seal-mono {
	display: block;
	width: 60%;
	margin: 0 auto;
	}

/* -----------------------------------------
   Styling Basic WordPress Outputs
----------------------------------------- */

	/* Global */
	/* h1, h2, h3, h4, h5 { font-family: Georgia, "Times New Roman", Times, serif /*'Open Sans', "Helvetica Neue", "Helvetica", Arial, Verdana, sans-serif; font-weight: 300; } */

	/* Add Divider for Listed Posts */
	/*.divider { background:url(images/divider.png) no-repeat center top; height:36px; margin:20px 0 27px; }	*/

	/* Add Class for Images */
	img.alignright { float: right; margin: 0 0 18px 18px; }
	img.alignleft { float: left; margin: 0 18px 18px 0; }
	img.aligncenter { display: block; margin: 18px auto; }

	/* Add HTML5 Class for Images */
	figure img {
	height: auto;
/*	border: 1px solid #DDD; */
	margin: 0 auto;
	display: block;
/*	box-shadow: 0px 2px 10px #ddd;
	-moz-box-shadow: 0px 2px 10px #ddd;
	-webkit-box-shadow: 0px 2px 10px #ddd;
	border-image: initial;
*/
	}


	/* Add HTML5 Caption Class for Images */
	figure.figure {	margin: 0 auto;	-webkit-border-radius: 3px;	-moz-border-radius: 3px; display: inline-block; }
	figure.figure figcaption { padding: 8px 10px; font-size: 13px; font-size: 1.3rem; line-height: 18px; color: #555; }
	figure.alignright.figure { float: right; margin: 0 0 18px 18px; }
	figure.alignleft.figure { float: left; margin: 0 18px 18px 0; }

	/* Sidebar Adjustment */
	.sidebar-section { padding-bottom: 10px; padding-top: 20px;	font-size: 13px; font-size: 1.3rem; font-weight: normal; }

	/* Footer Nav */
	.footer-section { padding-bottom: 10px; padding-top: 20px; font-size: 13px; font-size: 1.3rem; font-weight: normal; }
	.footer-nav li { display: block; float: right; padding-left: 3%; margin-bottom: 0; }

	/* Breadcrumb Adjustment */
	ul.breadcrumbs li span { padding-left: 3px; }
	ul.breadcrumbs li a { padding-left: 0; }

	/* Comment Textarea Adjustment */
	#respond textarea { height: 100px; }

/*  -------------------------------------------------------
    Adjust Foundation 3 Pagination Style for WordPress
    ---------------------------------------------------- */

    ul.page-numbers { display: block; height: 24px; margin-left: -5px; }
    ul.page-numbers li {float: left; display: block; height: 24px; color: #999; font-size: 14px; margin-left: 5px; }
    ul.page-numbers li a { display: block; padding: 1px 7px 1px; color: #555; }
    ul.page-numbers li:hover a, ul.page-numbers li a:focus { background: #e6e6e6; }
    ul.page-numbers li.unavailable a { cursor: default; color: #999; }
    ul.page-numbers li.unavailable:hover a,ul.page-numbers li.unavailable a:focus { background: transparent; }
    ul.page-numbers li span.current { background: #2ba6cb; color: #fff; font-weight: bold; cursor: default; display: block; padding: 1px 7px 1px; }

/*  ---------------------------
    :: Customize for BuddyPress
    --------------------------- */

	.padder label + textarea { margin-top: 0; }
	.padder #item-body #message-threads .thread-avatar img { max-width: 50px; }
	ul.item-list.activity-list li.new_blog_post { padding-bottom: 15px; }
    .padder select { display: inline-block; }
    .padder div.item-list-tabs { margin: 25px 0; }
    .padder form#whats-new-form textarea { height: 30px; }
    .padder .button { display: inline; }


/*  --------------------------
    Your Customized Style
    ----------------------- */

@charset "UTF-8";
body {background-color: #fff;}

h2.entry-title a { margin-bottom: 15px; font-size: 22px; }

.container-topbar {	background-color: rgb(17, 17, 17); height: 40px;}

.container-masthead {
	background-color:#142745;
	min-height:140px;
}

.container-banner { /* background-color: #1f3a70; */ background-color: #1f3a70; padding:0; max-height:460px;}

.container-banner h1 { color:#fff; margin:60px 0 30px 0;}

.container-main {
	background-repeat: repeat-x;
	padding-top: 40px;
	padding-bottom: 30px;
	background-color: #fff;
	}

.container-footer, .container-dark {
	padding: 30px 0;
	background-color: #e9e9e9;
	border-top: 1px solid #e1e1e1;
}

.container-footer h6 {
	color: rgb(17, 17, 17);
	font-size: 14px;
}

.container-footer-govph {
	padding: 30px 0;
	background: #e9e9e9;
	color: #666;
	margin-bottom: -200px;
}

.container-footer li, .container-footer-govph li, .container-footer p, .container-footer-govph p { font-size:.9em; color:#666}
.container-footer a, .container-footer-govph a {color:#666;}
.container-footer-govph h6 { color:#666; font-size: 14px; /*text-shadow: 1px 1px 1px rgba(94,94,94,0.2);*/ }

.container-footer .widget-area ul, .container-footer-govph .widget-area ul, .container-footer .widget-area ul.menu, .container-footer-govph .widget-area ul.menu { padding-left: 20px; }

.top-bar > ul .name h1 {
	font-family: Arial, Helvetica, sans-serif;
	display:block;
	font-size:1% !important;
	margin: -1px 0 2px -18px;
}

.top-bar > ul .name h1 a {
	font-size: 18px;
}

h1.logo { margin:20px 0;}

.logo a {
	display:block;
	text-indent:-99999px;
	background-image: url(images/logo-masthead-large.png);
	background-repeat: no-repeat;
	background-position: top left;
	height:100px;
}

.toplayer {z-index:99999999 !important;}

.nomargin { margin:0 !important;}

.tabs dd.active, .tabs li.active {
border-top: 3px solid #142745;
margin-top: -3px;
}

div.orbit-slide {
padding: 5% 10% 5% 30% !important;
max-height: 400px !important;
}

div.orbit-slide.dark {
	background-color:#222;
}
div.orbit-slide.light {
	background-color:#ececec;
}


div.orbit-slide.dark h4 { color:#fff;}
div.orbit-slide.dark p { color:#ececec;}

div.orbit-slide.light h4 { color:#222;}
div.orbit-slide.light p { color:#222;}

/* .single .entry-content p { margin-left:12%;}

.single .entry-content p > img {margin-left:-12%;} */

.single .entry-content blockquote, .single .entry-content blockquote p { margin:30px 0; padding:0; border:none; font-size: 1.2em; font-family:Georgia, "Times New Roman", Times, serif;}


/* Very large display targeting */
@media only screen and (min-width: 1441px) {

}
/* Medium display targeting */
@media only screen and (max-width: 1279px) and (min-width: 768px) {

}

@media only screen and (max-width: 940px)
{
	.top-bar ul > li.name { background: rgb(17, 17, 17);}

	.top-bar ul > li.has-dropdown.moved .back.title h5 a {font-weight: normal;}

	.logo a {
	background-image: url(images/logo-masthead-small.png);
	background-position: center center;
	}


	.single .entry-content p { margin-left:0;}

	.single .entry-content p > img {margin-left:0;}

div.orbit-slide {
background-size:900px !important;
background-repeat:no-repeat;
}
div.orbit-slide p { font-size:12px;}

}

@media only screen and (max-width: 767px)
{
div.orbit-slide {
padding: 2% !important;
max-height: 400px !important;
background-image:none !important;
}
div.orbit-slide h4 { text-align:center; color:#fff;}
div.orbit-slide p { color:#ececec;}
div.orbit-slide a.button.secondary {text-align:center;}

}

/* responsive facebook like box */

/*
Make the Facebook Like box responsive (fluid width)
https://developers.facebook.com/docs/reference/plugins/like-box/
*/

/*
This element holds injected scripts inside iframes that in
some cases may stretch layouts. So, we're just hiding it.
*/

#fb-root {
    display: none;
}

/* To fill the container and nothing else */

.fb_iframe_widget, .fb_iframe_widget span, .fb_iframe_widget span iframe[style] {
    width: 100% !important;
}

/* govph_gallery */
body.govph_gallery {color:#000 !important;}