/*
 Theme Name:   HelsinkiUni 2017
 Theme URI:
 Description:  Blog theme for University of Helsinki based on Twenty Seventeen
 Author:       Jere Majava
 Author URI:   http://twitter.com/jjmajava
 Template:     twentyseventeen
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html
 Tags:
 Text Domain:  helsinkiuni2017
*/

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i&subset=latin-ext');

/* Page layout */

@media screen and (min-width: 48em) {

    .blog:not(.has-sidebar) #primary article, .archive:not(.page-one-column):not(.has-sidebar) #primary article, .search:not(.has-sidebar) #primary article, .error404:not(.has-sidebar) #primary .page-content, .error404.has-sidebar #primary .page-content, body.page-two-column:not(.archive) #primary .entry-content, body.page-two-column #comments {
        width: 64%;
        }

		.wrap,
		.single-featured-image-header {
			max-width: 1264px !important;
			padding-left: 3em;
		   	padding-right: 3em;
		}
		body.page article.page .entry-header,
		body.blog #secondary {
			width: 32% !important;
		}
		body.page article.page .entry-content,
		.page-two-column .panel-content .recent-posts,
		body.blog #primary {
			width: 64% !important;
		}
		body.page article.post .entry-header-media,
		body.page article.post .entry-content {
			width: 100% !important;
		}
		.site-content {
			padding-top: 3em !important;
		}

/* Featured image single post layout (layout and styling) */
		body.single.has-featured-image .custom-header-media,
		body.single.has-featured-image .site-description,
		body.single.has-featured-image #secondary {
					display: none !important;
		}
		body.single.has-featured-image .site-branding {
			background-color: #f8f8f8;
			padding: 0.5em 0 0 !important;
		}
		body.single.has-featured-image .site-title {
			padding-bottom: 0 !important;
		}
		body.single.has-featured-image .site-description {
			color: #222 !important;
		}

		body.single.has-featured-image .site-title a {
			background-color: transparent !important;
			padding: 0 !important;
			color: #222 !important;
			font-size: 1.875rem !important;
		}


		body.single.has-featured-image #primary {
			width: 100%;
		}
		body.single.has-featured-image .entry-header {
			float: left;
			width: 32%;
		}
		body.single.has-featured-image .entry-header .entry-title {
			font-size: 2.5rem !important;
		}
		body.page .entry-content,
		body.single.has-featured-image .entry-content,
        #comments {
			float: right;
			width: 64% !important;
		}

}

/* Comments styling */



/* Global Text elements */

body #page,
button,
input,
select,
textarea {
	font-family: 'Open Sans',Helvetica,Arial,sans-serif, Nimbus Sans L !important;
}
body #page, button, input, select, textarea, li, dt, dd, th, td {
	color: #666 !important;
	line-height: 1.6em;
}
article p {
	margin: 0 0 1.5rem 0;
}
.entry-content > p:first-child {
	margin-top: 0;
}
blockquote p {
	margin: 0 0 .5rem 0;
}
blockquote {
  color: #979797 !important;
  line-height: 1.1em  !important;
  border-left: 10px solid #979797 !important;
	padding: 0 25px !important;
	margin: 0 0 1.5rem 0;
}
blockquote,
blockquote p {
	font-size: 1.25rem;
	line-height: 1.5em;
	font-style: normal !important;
}

h1, h2, h3, h4, h5, h6 {
	font-weight: bold !important;
	letter-spacing: -0.05em !important;
	color: #424242 !important;
}
.site a:link, .site a:visited {
  color: #0098d0 !important;
}
.site a:hover, a:focus, a:active {
  color: #005479 !important;
}
a:link, a:hover, a:focus, a:active {
	box-shadow: none !important;
	-moz-box-shadow: none !important;
	text-decoration: none !important;
	border-bottom: none !important;
}
/* Lists */

article ul,
article ol {
	margin-top: 1.5rem;
	margin-bottom: 1.5rem;
}
article li ul,
article li ol {
	margin-top: 0;
	margin-bottom: 0;
}

/* Tables */
table {
	margin: 1.5rem 0;
    border-collapse: collapse;
}
th {
	border-bottom-width: 1px !important;
}
td, th {
	padding: 0.7em 0.9em;
	font-size: 0.875rem;
	vertical-align: top !important;
}

/* Form elements */
button, input , textarea {
	border-radius: 0 !important;
}
label {
	color: #767676 !important;
	font-weight: 300 !important;
	font-size: 1.1rem !important;
}
input.submit,
input[type=submit],
.site a.button,
.site a.next, .site a.prev {
	color: #fff !important;
	background-color: #0098d0 !important;
	font-weight: 600 !important;
	font-size: 0.9375rem !important;
}
.site a.button,
.site a.next, .site a.prev {
	padding: 10px 12px;
}

input.submit:hover,
input.submit:focus,
input.submit:active,
input[type=submit]:hover,
input[type=submit]:focus,
input[type=submit]:active,
.site a.button:hover,
.site a.button:focus,
.site a.button:active,
.site a.next:hover,
.site a.next:focus,
.site a.next:active,
.site a.prev:hover,
.site a.prev:focus,
.site a.prev:active {
	background-color: #005479 !important;
}
.wp-custom-header-video-button {
	border: none !important;
}
input.search-field {
	height: 40px !important;
	box-sizing: border-box !important;
	border: 1px solid #ddd !important;
	font-size: 0.75rem !important;
	padding: 1px 12px !important;
	line-height: 2.125rem !important;
	color: #767676 !important;
}
input.search-field:focus {
	border: 2px solid #0098d0 !important;
}
input::-webkit-input-placeholder {
	color: #979797 !important;
}
input:-moz-placeholder { /* Firefox 18- */
	color: #979797!important;
}
input::-moz-placeholder {  /* Firefox 19+ */
	color: #979797 !important;
}
input:-ms-input-placeholder {
	color: #979797 !important;
}


/* Search */

button.search-submit {
	padding: 0 0.5rem !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	background-color: #0098d0 !important;
}
svg.icon-search {
	color: #fff !important;
	height: 0.9375rem !important;
}

/* Header image */

/* SMALLER HEADER!! */
body.home .custom-header {
 	height: 66vh !important;
	min-height: 500px !important;
}



/* Header and top menu */


.home .custom-header-media {
    /* Firefox */
    max-height: -moz-calc(100%) !important;
    /* WebKit */
    max-height: -webkit-calc(100%) !important;
    /* Opera */
    max-height: -o-calc(100%) !important;
    /* Standard */
    max-height: calc(100%) !important;
}

#ribbon {
	width: 100%;
	background-color: rgb(34, 34, 34);
}
.home #ribbon {
  background-color: transparent;
  position: absolute;
  z-index: 4;
  top: 0;
}
#ribbon h2 {
  margin: 0;
	padding: 4px 30px;
}
#ribbon h2 a {
  text-transform: uppercase !important;
	font-size: 0.9375rem;
	letter-spacing: -0.75px;
	color: #fff !important;
	height: 70px;
	line-height: 70px;
	align-items: center;
	text-shadow: 0 0 4px rgba(0,0,0,.1);
}
#ribbon h2 a img.hy-logo {
	margin-right: 11px;
	vertical-align: middle;
}
.home .site-branding {
	min-height: 205px;
}

#masthead {
	background-color: #fff !important;
}
.site .site-title a {
  text-transform: uppercase !important;
	font-size: 3.125rem;
	line-height: 1em !important;
	font-weight: bold !important;
	letter-spacing: -0.05em !important;
	color: #fff !important;
	text-shadow: 2px 2px 4px rgba(0,0,0,.2);
}
.site-description {
	display: inline-block;
	color: #fff !important;
	font-size: 1.125rem !important;
	font-weight: 600 !important;
	opacity: 1 !important;
	text-shadow: 2px 2px 4px rgba(0,0,0,.2);
}

@media screen and (min-width: 48em) {
	.home .site-title a {
		font-size: 4rem;
	}
	.home .site-title {
		padding-bottom: 30px !important;
	}
	.home .site-description {
		padding-bottom: 20px
	}

}

@media screen and (max-width: 500px) {
  .home .site-branding {
	  text-align: center;
		margin-bottom: 30px !important;
	}
	.home .site .site-title a {
		font-size: 3rem;
  }
}

/*.navigation-top > */ .wrap {
	padding-top: 0.2em !important;
	padding-bottom: 0.2em !important;
}
.menu-scroll-down {
    display: none !important;
}
#top-menu a {
	font-size: 0.9375rem;
	text-transform: uppercase !important;
	font-weight: bold !important;
	letter-spacing: 0.01em !important;
}
#top-menu .sub-menu  {
/*    border-color: #eee; */
}
#top-menu .sub-menu a {
	text-transform: none !important;
  background-color: #fff !important;
}
#top-menu .sub-menu a:hover {
    background-color: #fff !important;
}
.site-header .navigation-top a.menu-scroll-down {
	top: 0.1rem !important;
}
#top-menu .sub-menu > li > a > svg {
}

/* Fron tage with panels */
.wrap { }

/* Blog */

body.blog header.page-header {
	display: none;
}

/* Entry content */

.entry-title {
	text-transform: none !important;
}
body.page .entry-title,
body.page-two-column .entry-title {
	font-size: 2.5rem !important;
}
body.page article.post h2.entry-title {
	font-size: 1.625rem !important;
}

.single .type-post h1.entry-title {
font-size: 2.5rem !important;
}
body.page .entry-title,
body.has-featured-image .entry-title {
	line-height: 1em;
}
.site .entry-title a {
  color: #424242 !important;
}
.site .entry-title a:hover,
.site .entry-title a:focus,
.site .entry-title a:active {
color: #005479 !important;
}

.blog .entry-meta {
	margin-bottom: .5rem;
}

.entry-meta *,
.entry-meta a,
.entry-footer *,
.entry-footer a,
.comment-metadata *,
 .comment-metadata a {
	font-size: 0.75rem;
	font-weight: 600 !important;
	color: #979797 !important;
	letter-spacing: normal !important;
}
.site .entry-meta a:hover,
.site .entry-meta a:focus,
.site .entry-meta a:active {
	color: #005479 !important;
}
span.tags-links {
  padding-left: 0 !important;
}
svg.icon-hashtag {
	display: none;
}

.entry-content > *:first-child {
	margin-top: 0 !important;
}

.single .type-post.format-standard .entry-content > p:first-child {
	font-size: 1.2rem;
	font-weight: 600;
	letter-spacing: 0.01em;
	margin-bottom: 2rem;
}
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
	margin: 2rem 0 1rem !important;
	padding: 0 !important;
}

.entry-content ol,
.entry-content ul {
/*  font-size: 1.125rem !important; */
	margin-left: 1.5rem !important;
}

/* Images */
.entry-content a img, .widget a img {
	-webkit-box-shadow: none !important;
  box-shadow: none !important;
}
figcaption {
	font-style: normal !important;
	font-size: 0.875rem !important
}
figure.alignnone {
	position: relative !important;
}
figure.alignnone figcaption{
	position: absolute !important;
	left: 0;
	bottom: 0;
	color: #fff;
	background-color: rgba(0, 0, 0, 0.6);
	margin: 0 !important;
	padding: 0.5rem 1rem !important;
	width: 100%;
}

/* Sticky post */
.blog .sticky svg.icon-thumb-tack {
	display: none;
}


/* Custom front page */

.panel-content {
	padding-top: 1.5em !important;
}


/* Feature image */
.single-featured-image-header {
	margin: 0 auto !important;
	background-color: transparent !important;
	border-bottom: none !important;
	padding-top: 2.5rem;
    max-height: 600px;
    overflow: hidden;
}
.single-featured-image-header img {
    object-fit: fill;
}

/* Comments area */
div.comment-author b {
	font-weight: normal !important;
	font-size: 1.125rem !important;
	color: #767676 !important;
}
img.avatar {
	padding: 0 !important;
	border: none !important;
}
.comment-reply-link {
	font-weight: 600 !important;
}
svg.icon-mail-reply{
  display: none;
}


	
/* Sidebar */

h2.widget-title {
	font-size: 1.3125rem !important;
	margin-bottom: 1em !important;
}

/* Footer */

.site-info a {
	display: none;
}

footer#colophon {
	border-top: none !important;
	background-color: #222 !important;
	color: #fff !important;
  box-shadow: 0px 500px 0px 500px #222;
}
footer#colophon * {
	color: #fff !important;
}
footer#colophon a:hover,
footer#colophon a:focus,
footer#colophon a:active {
	color: #ccc !important;
}
footer#colophon .widget ul li {
	border-bottom: 1px solid #555 !important;
	border-top: none !important;
}
footer#colophon .widget ul li li {
	border-bottom: none !important;
	padding: 0.5rem 0 0 0.75rem !important;
	font-size: 0.75rem;
}

/*  Footer columns */

@media screen and (min-width: 48em) {
  footer#colophon aside.widget-area {
	  float: left !important;
		width: 68% !important;
	}
  footer#colophon .footer-widget-1 {
    width: 47.08% !important;
		float: left !important;
  }
	footer#colophon .footer-widget-2 {
    width: 47.08% !important;
		float: right !important;
  }
	footer#colophon nav.social-navigation {
		width: 28% !important;
		float: right !important;
		clear: none !important;
		padding-top: 2em !important;
	}
  .site-info {
	  clear: both !important;
	}
}


/* Social media button styling */

footer#colophon nav.social-navigation a {
	width: 48px;
	height: 48px;
	border-radius: 0 !important;
	color: #fff !important;
	background-color: #0098d0 !important;
  margin-right: 0 !important;
}
footer#colophon nav.social-navigation a:hover,
footer#colophon nav.social-navigation a:focus,
footer#colophon nav.social-navigation a:active {
	color: #fff;
	background-color: #005479 !important;
}
footer#colophon nav.social-navigation a svg.icon {
	width: 24px;
	height: 24px;
}

/* Mobile adjustments */

.menu-toggle {
	text-align: left !important;
	color: #0098d0 !important;
	text-transform: uppercase !important;
	font-weight: bold !important;
}

button.menu-toggle:hover,
button.menu-toggle:focus,
button.menu-toggle:active {
	color: #005479 !important;
}

/* Adjustments for plugins */

/* WPML, hide credits */
p#wpml_credit_footer {
	display: none;
}

/* Add to Any, square buttons */
.a2a_svg, .a2a_count {
	border-radius: 0 !important;
}