/*
Theme Name: Jisc corporate
Template: twentytwelve
Description: Jisc corporate theme for official Jisc blogs. Custom options for homepage layout (full posts vs excerpt) and footer text.
Author: Steve Boneham (Jisc Netskills)
Author URI: http://sboneham.com/blog/
Version: 1.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/


@import url("../twentytwelve/style.css");


/*---------------------------------------------------------------------------------

This is a child theme of twentytwelve. It inherits styles from the parent theme, 
unless they are over-ridden in this one.

It is designed as "mobile first" with media queries over-riding default styles 
for larger screen sizes.

$rembase:     14;
$line-height: 24;

* Use a pixel value with a rem fallback for font-size, padding, margins, etc.
	padding: 5px 0;
	padding: 0.357142857rem 0; (5 / $rembase)

* Set a font-size and then set a line-height based on the font-size
	font-size: 16px
	font-size: 1.142857143rem; (16 / $rembase)
	line-height: 1.5; ($line-height / 16)

---------------------------------------------------------------------------------

	1.  Header elements
	2.	Mobile menu
	3.	Post Content
	4.  Links and hovers
	5. 	Sidebar
	6.  Form elements
	7.	Images
	8.	Responsive design

----------------------------------------------------------------------------------- */

/* 1. Header elements */

body.home header.entry-header {
margin-bottom: 32px;
margin-bottom: 2.285714285rem;
}

.site-header {
padding-bottom:14px;
padding-bottom:1rem;
}

h1.site-title {
font-size: 26px;
font-size: 1.85714285714rem;
font-weight:500;
padding-top:5px;
/*padding-top:0.7142857142rem;*/
padding-bottom:6px;
/*padding-bottom:0.5714285714rem;*/
margin-left: 3px;
text-align:left;
}

h1.site-title a {
color:#2e354c;
text-decoration:none;
}

h1.site-title a:hover {
color: #e85e13;
}

#page h2.site-description {
margin-top: 5px;
/*margin-top: 0.5rem;*/
margin-bottom: 7px;
margin-bottom: 0.5rem;
margin-left: 3px;
margin-left: 0.214285rem;
font-size: 16px;
font-size: 1.142857143rem;
font-weight: normal;
color:#2e354c;
text-align:left;
line-height: 1.5;
}

/* Jisc logo */
#page img#logo {
width:61px;
height:34px;
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
clear:both;
}

img.header-image {
margin-top:25px;
}

.site-content article {
border-bottom: none;
}

/* 2. Mobile menu (restyled) */

.main-navigation ul.nav-menu.toggled-on, .menu-toggle {
display: inline;
}

.main-navigation {
padding-top:0;
margin-top:5px;
margin-top:0.3571428571rem;
position:relative;
text-align:right;
top: -35px;
}

.main-navigation ul.nav-menu {
width:100%;
}

button.menu-toggle {
float:right;
padding: 4px 8px;
padding: 0.285714285rem 0.571428571rem;
background-color:#fff;
background-image:none;
border: 1px solid #ccc;
}

.menu-toggle:hover, 
button:hover, 
input[type="submit"]:hover, 
input[type="button"]:hover {
color: #5e5e5e;
background-color: #ebebeb;
background-image: none;
border: 1px solid #ccc;
}

button.menu-toggle:active,
button.menu-toggle.toggled-on,
button:active {
	color: #757575;
	background-color: #e1e1e1;
	border: 1px solid #ccc;
}

.main-navigation div {
padding-top:20px;
padding-left:5px;
}

.main-navigation ul.nav-menu  {
text-align:left;
padding-top:10px;
padding-top:0.7142857142rem;
margin-left:0;
padding-left:5px;
}

.main-navigation li {
font-size:14px;
font-size:1.0rem;
line-height: 1.714285714;
border-bottom:1px solid #e6e6e6;
padding-bottom:5px;
margin-top: 14px;
margin-top: 1rem;
}

.main-navigation ul li a {
text-decoration:none;
display:block;
}

.main-navigation li ul li {
padding-left:10px;
border-bottom:none;
}

/* 3. Post content */

div.entry-meta {
font-size:12px;
font-size:0.857142rem;
margin-bottom:15px;
padding-top:2.5%;
line-height:1.7rem;
}

div.entry-meta span img.avatar {
padding-right:4%;
}

span.post-meta {
display:none;
}

span.author-meta {
font-size:14px;
font-size:1rem; 
}

span.post-date {
display:block;
font-size:13px;
}

span.post-date:before {
content:"Published" ;
}

span.category:before, span.tags:before {
-webkit-font-smoothing: sharp;
vertical-align: text-bottom;
font-family: "dashicons";
color: #C3C3C3;
font: normal 17px/1 'dashicons';
padding-right:5px;
}

span.category:before {
content: "\f318";
}

span.tags:before {
content: "\f323";
}

p#post-meta-text {
font-size:12px;
font-size:0.857142rem;
font-weight:bold; 
color: #666; 
margin-bottom:10px; 
padding-top:10px;
}

p {
-moz-hyphens: manual;
-ms-hyphens: manual;
-webkit-hyphens: manual;
hyphens: manual;
}

p.syndicated {
font-size: 13px;
font-size:0.9285714285rem;
color: #757575;
}

p.syndicated:before {
content: "\f504";
-webkit-font-smoothing: sharp;
vertical-align: top;
font-family: "dashicons";
font: normal 18px/1 'dashicons';
padding-right:5px;
color: #757575;
}

p.syndicated a {
text-decoration:none;
}

.entry-header h1.entry-title {
  -moz-hyphens: manual;
  -ms-hyphens: manual;
  -webkit-hyphens: manual;
  hyphens: manual;
  font-size:18px;
  line-height: 1.3333333;
}

.comment-content li, .mu_register li {
margin: 0;
}

textarea {
    overflow: auto;
    vertical-align: top;
    *zoom: 1;
    margin-left: 0;
    margin-bottom: 0;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}

.entry-meta #text-meta {
padding-top:3px;
}

footer.entry-meta {
padding-top:10px;
}

img.alignright, img.alignleft{
float:none;
clear:both;
}

/* 4. Links and hovers */

a {
color:#003659;
}

a:hover, a:focus {
color:#e85e13 !important;
}

.main-navigation li a {
color:#00557f;
}

.widget-area .widget a:hover, .widget-area .widget a:focus {
color:#e85e13;
} 

.widget-area .widget a, .widget-area .widget a:visited  {
color:#00557f;
text-decoration: none;
}


div.entry-meta a, div.entry-meta a:visited {
color:#00557f;
text-decoration: none;
}

/* 5. Sidebar */

aside.widget_recent_entries li, aside.widget_recent_comments li  {
padding-bottom:5px;
}

/* 6. Form elements */

form#setupform p input#signupblog {
margin-top:20px;
}

div.wpcf7 input,textarea {
max-width:95%;
}

.entry-content p.lp-desc {
margin:0;
}

.comment-form p.comment-notes {
line-height: 20px;
}

/* 7. Images */

img.header-image {
box-shadow:none;
}

img.avatar {
height:58px;
width:58px;
float:left;
margin-right:15px;
box-shadow: none;
}

.excerpt-thumb img {
float: none;
margin: 0px 24px 12px 0;
margin: 0 1.714285714rem 0.857142857rem 0;
height: 150px;
width: 150px;
}


/* 8. Responsive design - media queries. */

/* Small tablet portrait and above - min width 600 pixels. */

@media screen and (min-width: 600px) {


body .site {
overflow: visible;
}

.site-header {
padding-bottom:55px;
padding-bottom:3.92857142857rem;
}

.main-navigation li {
border-bottom:none;
}

#page img#logo {
width:103px;
height:57px;
-webkit-box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
-moz-box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
box-shadow: 0px 1px 2px rgba(0,0,0,0.2);
float:left;
}

img.header-image {
box-shadow:none;
margin-top:35px;
}

h1.site-title {
font-size: 42px;
font-size: 3rem;
font-weight:normal;
text-decoration:none;
padding-top:20px;
padding-bottom:12px;
}

#page h2.site-description {
margin-top: 5px;
margin-bottom: 5px;
font-size: 1.21428571rem;
font-size: 17px;
font-weight: normal;
color:#2e354c;
}

#site-navigation ul.nav-menu {
background:#fff !important;
border:none;
text-align:right;
padding-left:0;
}

ul[id*=menu].nav-menu li {
margin-right:20px;
font-size:12px;
padding-right:0;
}

.main-navigation ul.nav-menu, .main-navigation div.nav-menu > ul {
margin-top:10px;
border-bottom: none;
border-top: none;
font-size: 12px;
}

.main-navigation li {
font-size: 12px; 
font-size: 0.875rem; 
margin-right: 20px;
}

#site-navigation {
/*min-width:350px;*/
float:right;
margin-top:30px;
}

.main-navigation div {
padding-top:0;
}

.main-navigation li ul li {
padding:0;
margin:0;
border-bottom: 1px solid #e1e1e1;
text-align:left;
}

.main-navigation li ul li ul li {
border-bottom: 1px solid #e1e1e1;
}

.main-navigation li ul li a {
background-color:#efefef;
padding:5px;
}

.main-navigation li ul li a:hover {
background-color:#e4eaec;
}

button.menu-toggle {
display:none;
}

.site-content {
margin-top:0;
}

article.page {
border:none;
}

header.entry-header h1.entry-title { 
font-size:25px; 
font-size:1.785714285rem; 
font-weight:500;
}

.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
font-weight:600;
}

div.entry-content h2 {
font-size: 18px; 
font-size: 1.28571428rem;
}

div.entry-content ul li {
padding-bottom:0.8571428571rem; 
padding-bottom:12px;
padding-right:1.7142857142rem;
padding-right:24px;
}

div.entry-meta {
display:initial;
}

.excerpt-thumb img {
float: left;
margin-bottom:10px;
}

img.avatar {
height:68px;
width:68px;
}

img.alignright{
float:right;
}

img.alignleft {
float:left;
}

aside.widget li {
padding-left:5px;
}

aside.widget_recent_entries li, aside.widget_recent_comments li {
padding: 5px 10px 5px 5px;
line-height: 1.5 !important;
}

.ms-global-search_form input[type=text] {
width:225px;
}

span.author-meta {
font-size:18px;
font-size:1.285714285rem; 
}

span.post-date {
display:inline;
font-size:18px;
font-size:1.285714285rem; 
}

span.post-date:before {
content:" on";
}

span.post-meta {
display:inline;
}


} /* End media query 600 pixels. */


@media print {

@page {
margin: 1.5cm;
}

.site-header {
padding-top:30px;
padding-bottom:0;
margin-bottom:35px;
}

header.entry-header  {
margin-bottom:20px;
}

header.entry-header h1.entry-title { 
font-size:18px; 
font-weight:500;
padding-top:0;
margin-top:0;
}

h2.site-description {
display:none;
}

img.avatar {
width:48px;
height:48px;
}

.entry-content p, .entry-content ul, .entry-content ol, .entry-content dl, .entry-content li {
font-size:90%;
padding-bottom:0;
margin-bottom:10px;
}

.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
font-weight:500;
}

.entry-content h1 {
font-size:18px; 
margin-top:5px;
margin-bottom:10px;
} 

.entry-content h2 {
font-size:16px; 
margin-top:0px;
margin-bottom:8px;
} 

.entry-content h3 {
font-size:14px; 
} 

.entry-content h4 {
font-size:13px; 
} 

a {
color: #000;
}

}
