/*
Theme Name: Musik
Theme URI: http://www.wptema.se/musik
Author: Carolina Nymark
Author URI: http://www.wptema.se
Description: A responsive music theme with two widget areas, logo upload, sticky posts custom header and threaded comments. Includes Swedish translation.
Version: 1.4
Tags: white, blue, threaded-comments, custom-menu, sticky-post, translation-ready, post-formats, custom-header, two-columns, one-column, right-sidebar, left-sidebar, editor-style, featured-images
Text Domain: musik

License: GNU General Public License (GPL), v2 (or newer)
License URI: http://www.gnu.org/licenses/gpl-2.0.html
*/

html {
	-webkit-text-stroke: 1px rgba(0,0,0,0.1);
	-webkit-font-smoothing: antialiased;
}

body {
	margin:0;
	font-family: 'Open Sans', sans-serif;
	line-height: 1;
}

body.custom-background{
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	 background-size: cover;
}

a{
	text-decoration:none; 
	color:#6699ff;
}

.wrapper {
	margin:0 auto;
	/*width:960px;*/
	width:90%;	
	clear:both;
}

/* =Header
-------------------------------------------------------------- */
#header{
	margin-top:3.2em; 
	position:relative;
}
.site-title {
	font-size: 3.8em;
	font-weight: bold;
	margin:0;
	font-family: 'Oswald', sans-serif;
	display:block;
}

.site-description {
	font-size: 2.1em;
	line-height:2.15em;
	font-weight: bold;
	margin-top:0.8em;
	font-family: 'Open Sans Condensed', sans-serif;
	width:100%;
}

table{margin:4px 4px 10px 4px; border-collapse:collapse;}
td{border:1px solid #f5f5f5; padding:4px;}
th{background:#f5f5f5;}


/* =Header Menu
-------------------------------------------------------------- */
.main-navigation {
	margin-top:2em; 
	display: block;
	float: left;
	width: 100%;
	font-size: 1.5em;
	position:relative;
	z-index:9999;
	font-family: 'Oswald', sans-serif;
	background: url(images/70.png);
}
.main-navigation a{
	color:#fff;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding-left: 0;
}
.main-navigation li {
	float: left;
	position: relative;
}
.main-navigation a {
	display: block;
	line-height: 2em;
	margin-right: 0.7em;
	margin-left:0.7em;
	padding-bottom:6px;
}

.main-navigation ul li ul li{
	float: left;
	position: relative;
	border-bottom:1px solid #999;
}

/*sub menu level 2*/
.main-navigation ul ul {
	display: none;
	font-size:0.8em;
	float: left;
	position: absolute;
	top: 2.8em;
	line-height: 4em;
	left: 0;
	z-index: 99999;
	width:170px;
	padding-right:1em;
	clear:both;
	background: #666;
}
.main-navigation ul ul a {
	line-height: 1em;
	padding: .5em 0 .5em 1em;
	width:167px;
	margin:0;
}

/* sub menu level 3-5*/
.main-navigation ul ul ul,
.main-navigation ul ul ul ul,
.main-navigation ul ul ul ul ul
 {
	display: none;
	font-size:1em;
	float: left;
	position: absolute;
	top:0;
	line-height: 4em;
	left:185px;
	z-index: 99999;
	width:170px;
}

.main-navigation ul li:hover > ul {
	display: block;
}

/* Small menu */
.menu-toggle{display: none;}

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

	.menu-toggle,
	.main-navigation.toggled .nav-menu {
		display: block;

	}

	.main-navigation ul {
		display: none;
	}	

	.menu-toggle{
		margin:13px; 
		display: inline-block;
		z-index:9999; 
	}

	.menu-toggle{display: block;}
		
	.main-navigation  ul li{
		width:100%;
		float: left;
		position: relative;
	}
	.main-navigation ul li ul.sub-menu{
		display:none;
	}
}

#header img{
position:relative;
z-index:7;
margin:0;
padding:0;
border:0;
}

.header-image{
position:relative;
z-index:6; 
margin-bottom:-2px;
padding:0;
border:0;
}

#header .header-logo {
	float:left; 
	margin-right:10px; 
	margin-bottom:10px; 
	margin-right:25px; 
	border:none; 
}
.sidebar-logo {border:none; margin-bottom:10px; margin-left:29px; margin-top:19px;}
.footer-logo {
	float:left; 
	margin-right:10px; 
	margin-bottom:10px;  
	margin-right:25px; 
	margin-left:0; 
	border:none;
}

/* Full width if the sidebar is inactive: */
.no-sidebar .wrapper #container{width:100%;}
.no-sidebar .wrapper #container .post,
.no-sidebar .wrapper #container .type-page,
.no-sidebar .wrapper #container .type-attachment{width:100%;}

.no-sidebar .wrapper .header-image{visibility:hidden; height:0px;}

/* Float the content to the right if the sidebar is to the left!*/
.left-sidebar .wrapper #container{float:right;}
.left-sidebar .wrapper #container .post,
.left-sidebar .wrapper #container .type-page,
.left-sidebar .wrapper #container .type-attachment{float:right; margin:0;}

.left-sidebar .wrapper #rightsidebar {margin-left:0px;}

/* Keep posts and stickies in place if there is a sidebar: */
#container{ 
	width:70%;
	clear:both;
	margin:0;
	padding:0;
	float:left;
}

/* =Content
-------------------------------------------------------------- */
.post,
.type-page,
.type-attachment
{
	line-height: 1.5;
	margin:0;
	width:100%;
	padding:2em;
	background:#fff;
	color:#333;
	font-family:Verdana,Georgia,Serif;
	-ms-word-wrap: break-word;
	word-wrap: break-word;
	/*overflow:hidden;*/
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;    
	box-sizing: border-box;         
}


.post-title, .archive-title{
	display:block;
	line-height:1.5;
	padding-bottom:0.5em;
	padding-top:0;
	margin:0;
	clear:both;
	color:#000;
	font-family: 'Oswald', sans-serif;
	font-size:2.3em;
}
.archive-title{
	padding-bottom:0.5em;
}


.post a:hover{color:#000; text-decoration:underline;}

.post-title a:hover, .archive-title a:hover{text-decoration:none;}

.crumbs{
	font-size:0.9em;
	clear:both;
	margin-bottom:1.3em;
}
.crumbs i{opacity:0.3;}
.crumbs a{opacity:1.0;}
	
.crumbs a:hover{
	text-decoration:none;
}
.meta {
	clear: both;
	padding:1em; 
	width:100%;
	margin-top:5px;
	margin-bottom:5px;
	margin-left:0;
	font-size:14px;
	line-height:16px;
}
.format-link .post-title,
.format-aside .post-title,
.format-status .post-title,
.format-link .crumbs,
.format-aside .crumbs,
.format-status .crumbs {
	display:none;
}
.format-link,
.format-status{
	min-height:30px;
}

.attachment_nav_clear{float:right; clear:both; margin:4px;}
.fullimg{width:100%; float:left; clear:both; margin:6px;}

/*author info
-------------------------------------------------------------- */
.author-info {
	color:#6699ff;
	clear:both;
	font-size:1em;
	line-height: 20px;
	overflow: hidden;
	min-height:45px;
	margin:0;
	padding-left:4px;
	padding-top:16px;
	padding-bottom:0;
}
.author-info .author-link{
	padding-top:6px;
}
.author-info.author-link a {
	color:#6699ff;
}
.author-info .author-avatar {
	float:left;
	height:60px;
	width:60px;
	margin:10px;
}
.author-info .author-description {
	float:left;
	margin:10px;
	font-size:1em;
}
.author-info h2 {
	font-size:1.2em;
	font-weight:bold;
	margin:0;
}

/* Stickies*/
.sticky,
.whitetop{
	position:relative;
	z-index:7;
	float:left;
	width:100%;
	padding:2em;
	background:#f5f5f5; 
	color:#666;
	margin:0 0 25px 0;
	-webkit-box-sizing: border-box; 
	-moz-box-sizing: border-box;    
	box-sizing: border-box;         
}

.sticky .crumbs, 
.sticky .meta{display:none;}

.search-post
{
	margin:0;
	clear:both;
	overflow:hidden;
	padding:1em;
	min-height:5px;
	background:#f5f5f5; 
	color:#666;
	position:relative;
}

/* Navigation 
----------------------------------------*/
.more-link {
	color:#666;
	clear:both;
	padding-top:3px;
}
.page-link {
	color:#666;
	clear:both;
	padding-top:3px;
	padding-bottom:12px;
}
.page-link a{
	color:#666;
}

.page-link a:hover,
.more-link a:hover{
	text-decoration:underline;
}
.older-posts,
.newer-posts{
	font-family: 'Oswald', sans-serif;
	background:#fff;
	color:#666;
	min-width:170px;
	padding:6px;
	min-height:15px;
	margin:0;
	margin-top:30px;
	margin-bottom:25px;
	-ms-word-wrap: break-word;
	word-wrap: break-word;
	word-break: break-all;
	padding:1em;
}

.newer-posts{
	float:right;
}
.older-posts{
	float:left;
}
.older-posts a,
.newer-posts a,
.paged-comments{
	color:#666;
}
.older-posts a:hover,
.newer-posts a:hover,
.paged-comments a:hover{
	color:#6699ff;
}

.paged-comments{
	background:#fff;
	color:#666;
	width:140px; 
	padding:1em; 
	margin-bottom:25px;
	margin-top:25px;
	min-height:15px;
	font-family: 'Oswald', sans-serif;
}

/* =Images and objects
-------------------------------------------------------------- */

@media \0screen {
  img, object{
  	width: auto; /* for ie 8 */
  }
}

img,
object {
     max-width: 100%;
	 height: auto;
}

a img {border: none;}
p img {margin: 0.5em;}

img.size-auto,
img.size-full,
img.size-large,
img.size-medium,
.attachment img,
.widget-area img {
	max-width: 100%; 
	height: auto;
}

.attachment-thumbnail{	
	border-radius:2px;
	}
	
.type-attachment .attachment-thumbnail{margin:8px;}

img.alignleft {
	margin-right: 1em;
}
img.alignright {
	margin-left: 1em;
}

.wp-caption {
	padding: 5px;
	text-align: center;
	max-width:100%;
	}

.wp-caption img {
	margin: 5px;
}
dl.gallery-item, .wp-caption, .wp-caption-text {
	color:#6699ff;
	font-size:0.9em;
}

.gallery-caption {}
.wp-smiley {
	margin: 0;
}

.gallery {
	margin-bottom: 1.5em;
}

.gallery-item {
	display: inline-block;
	text-align: center;
	vertical-align: top;
	width: 100%;
	margin:0.4%;
}


.gallery-columns-2 .gallery-item {
	max-width: 48%;
}

.gallery-columns-3 .gallery-item {
	max-width: 31.33%;
}

.gallery-columns-4 .gallery-item {
	max-width: 23%;
}

.gallery-columns-5 .gallery-item {
	max-width: 17%;
}

.gallery-columns-6 .gallery-item {
	max-width: 14.66%;
}

.gallery-columns-7 .gallery-item {
	max-width: 12.28%;
}

.gallery-columns-8 .gallery-item {
	max-width: 10.5%;
}

.gallery-columns-9 .gallery-item {
	max-width: 9.11%;
}




object{margin:15px;}

blockquote{border-left:3px solid #6699ff; padding:5px 0 5px 10px;}

/* =Comments
-------------------------------------------------------------- */
#comments {
	clear: both;
	width:100%;
	margin:0;
	padding:0;
}
#comments .navigation {
	padding:0 0 18px 0;
}

#comments-title{
	padding:1em;
	text-decoration:none;
	font-family: 'Oswald', sans-serif;
	font-weight:bold;
	color:#000;
	font-size: 1.5em;
}
.commentlist {
	list-style:none;
	margin:0;
	padding:0;
}
.commentlist .children {
	list-style:none;
	margin:0;

}
.commentlist .children .comment-body{
	background: url(images/20w.png);
}

.comment-body{
	font-size:1.2em;
	padding:1em;
	min-height:5px;
	line-height:1.5;
	margin-bottom:4px;
	background: url(images/20.png);
	color:#fff;
	overflow:hidden;
	-ms-word-wrap: break-word;
	word-wrap: break-word;
}
.comment-body p {
	margin:0;
	padding:0;
}
.comment-body a{
	color:#fff;
	text-decoration:none;
}
.comment-meta{
	margin-bottom:20px;
	margin-top:20px;
	font-size:0.8em;
}
.comment-author {
	margin:0;
	padding:0;
	font-weight:bold; 
	font-size:1em;
}
.comment-author a{
	color:#fff;
}
.commentlist .avatar {
	margin-right:10px;
}

.comment-edit-link{
	color:#fff;
	font-size:.9em;
}
/*.bypostauthor .comment-author {}
.bypostauthor .comment-body {
	border-left:2px solid #6699ff;
}
*/
.comment-reply-link{}

.comment-form-comment label {margin-right:6px;}

.comment-reply-title{font-size:2em;}

.reply  a{
	background:#6699ff;
	padding:1em;
	float:right;
	font-weight:bold;
	font-size:.6em;
	color:#fff;
	text-decoration:none;
}
.reply a:hover{
	color:#fff;
}
.children li.depth-5 .reply{
	visibility:hidden;
}
.commentlist .even {}
.nopassword,.nocomments {
	/*display: none;*/
}
.pingback {
	color:#6699ff;
}
.pingback a{
	text-decoration:none;
}

/* Comments form
-------------------------------------------------------------- */

input[type=submit] {
	margin:3px;
	padding:3px;
}

#respond {
	overflow:hidden; 
	position:relative; 
	background: url(images/40.png);
	color:#fff;
	padding:2em;
	margin-bottom:30px;
}
#cancel-comment-reply-link{
	font-size:.9em;
	font-weight:normal;
}
#respond a{
	color:#ccc;
}
#respond p{
	margin:0;
}
#respond .logged-in-as{
	padding-bottom:6px;
	font-size:.9em;
}
#respond .logged-in-as a{
	color:#ccc;
}
#respond .comment-notes{
	font-size:12px;
	margin-bottom: 1em;
}
#respond .required {
	color:#fff;
	font-weight: bold;
}
#respond label {}

#respond input {
	margin:9px;
}

.comment-form-comment label,
#respond textarea {
	padding:6px;
	width:95%;
	float:left;
	clear:both;
}
#respond .form-allowed-tags {
	margin-top:14px;
	margin-bottom:14px;
	color:#ccc;
	font-size:.9em;
	line-height:1em;
	float:left;
	clear:both;
}

#respond .form-submit {
	margin: 12px 0;
}
#respond .form-submit input {
	font-size:.9em; width: auto;
}

/* =Widgets
-------------------------------------------------------------- */

#rightsidebar{
	float:left;
	width:30%;
	background: url(images/70.png);
	margin:0;
	margin-bottom:25px; /*Adds space between widget and footer if needed */
	padding-left:1em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;   
	box-sizing: border-box;   
}
#rightsidebar ul{
	width:100%;
	margin:0;
	float:left;
	padding:0;
	color:#fff;
}

.widget{
	width:90%;
	list-style: none;
	position:relative;
	z-index:2;
	float:left;
	margin-bottom:25px;
	padding:1em;
	color:#fff;
}

.widgettitle, .widget-title{
	margin-left:9px;
	margin-top:4px;
	margin-bottom:15px;
	font-weight:bold;
	font-family: 'Oswald', sans-serif;
	font-size:1.5em;
}

.widget ul{
	font-size:.9em;
	padding:0;
	margin:0;
	float:left;
	width:100%;
}
.widget ul li{
	list-style: none;
	font-weight:normal;
	margin-left:9px;
	margin-top:6px;
	margin-bottom:9px;
	padding:0;
	text-align:left;
	color:#6699ff;	
}
#calendar_wrap{
	padding-top:5px;
	font-size:.9em;
	color:#fff;
}

.widget_calendar .widgettitle {
	display:none;
}
table#wp-calendar,
#wp-calendar {
	color:#fff; 
	font-weight:normal;
	padding:5px;
}
#wp-calendar th{color:#6699ff;}
#wp-calendar a {
	color:#6699ff;
	text-decoration:underline;
}
#wp-calendar caption {
	font-family: 'Oswald', sans-serif;
	font-size:18px;
	margin-bottom:8px;
		color:#fff;
}
.tagcloud{
	padding:10px;
}

.widget ul li a,
.tagcloud a {
	color:#6699ff;
}
.textwidget{
	color:#6699ff;
	padding:10px;
	overflow:hidden;
}

.widget_search form, .searchform form {margin-top:3px;}
.widget_search input, .search-post input, #s{
	margin:3px;
	padding:3px;
}

.widget_rss ul li {margin-bottom:25px; width:97%;}
.rssSummary{width:90%;}
.rss-date{width:90%; float:left; clear:both;}

select {
    max-width: 150px !important;
    overflow: hidden;
}
option {
    max-width: 120px !important;
    overflow: hidden;
}

/* =Footer
-------------------------------------------------------------- */

#footer {
	margin:0 auto;
	padding:0;
	width:100%;
	clear:both;	
}
#footer ul{margin:0; padding:0;}

#footer .site-title, #footer .site-title  a{font-size:22px; font-weight:normal; color:#000; display:block;}
#footer .site-description{font-size:20px;}

#footer .widget{
	width:20%; 
	margin:0 2% 25px 0;
	padding:2em;
	background: url(images/70.png);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;   
	box-sizing: border-box;	display:block;
	vertical-align:top;
}

.footer-title{
	width:100%;
	display:block;
	clear:both;
	padding-top:45px;
}

/* Alignment 
-------------------------------------------------------------- */
.alignleft {
	display: inline;
	float: left;
}
.alignright {
	display: inline;
	float: right;
}
.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

/* Text meant only for screen readers */
.screen-reader-text {
	clip: rect(1px, 1px, 1px, 1px);
	position: absolute !important;
	height: 1px;
	width: 1px;
	overflow: hidden;
}

.screen-reader-text:hover,
.screen-reader-text:active,
.screen-reader-text:focus {
	background-color: #f1f1f1;
	border-radius: 3px;
	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
	clip: auto !important;
	color: #21759b;
	display: block;
	font-size: 14px;
	font-size: 1.4rem;
	font-weight: bold;
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000; /* Above WP toolbar */
}	

/* Responsive 
-------------------------------------------------------*/

@media screen and (max-width:1200px){
	#footer .widget{
		width:30%; 
	}
}

@media screen and (max-width:1024px){
	.wrapper{width:90%;}
	#header {background-size:100%;}
}

@media screen and (max-width:800px){
	.site-title {font-size:2.6em;}
	#header{width:100%}
	#header{background:none;}
	#container, #rightsidebar{width:100%;}
	.sticky{width:100%; margin:0;}

	#footer .widget{
		width:100%; 
	}
}

@media screen and (max-width:600px){
	.wrapper{padding:1em; margin:0; width:90%;}
	#header{width:100%}
	.header-logo, .site-title{clear:both;}
	.header-image{display:none;}
	.sticky { width:100%; margin:0; }
	#footer .widget{width:100%;}
	#rightsidebar ul{width:100%; margin:0; margin-top:10px;}
	.left-sidebar .wrapper #rightsidebar{margin-left:0px;}
}