


/* DESKTOP ======================================================= */

@media #{$large-and-up} {

	/*  GENERAL */
	.qt-spacer-xl {
		margin-top: 10rem;
	}
	.qt-spacer-l {
	margin-top: 6rem;
	}
	.qt-spacer-m {
		margin-top: 2.8rem;
	}
	.qt-spacer-s {
		margin-top: 1.4rem;
	}

	.qt-vertical-padding-l {
		padding: 6rem 0 4rem 0;
	}
	.qt-vertical-padding-m {
		padding: 2.8rem 0 2rem 0;
	}

	.qt-vertical-padding-s {
		padding: 1.4rem 0;
	}


	/*  TITLES */

	$qt-font-scale-desk: 1.414rem;
	$qt-titles-scale-desk: 1.414;
	$qt-titles-base-desk: 16px;
	$qt-titles-lineheight-desk: 1.05;



	@keyframes mbarmnuA { 
		0% { width: 11px;}  
		10% { width: 20px;}  
		50% { width: 5px; }
		100% { width: 20px; }  
	}
	@keyframes mbarmnuB {  
		0% { width: 14px;}  
		25% { width: 25px;}  
		50% { width: 10px; }
		75% { width: 3px; }
		100% { width: 8px; }  
	}
	@keyframes mbarmnuC {  
		0% { width: 10px;}  
		25% { width: 18px;}  
		50% { width: 5px; }
		75% { width: 23px; }
		100% { width: 3px; }  
	}




	h1, h2, h3, h4, h5, h6 {
		font-family: 'Oswald', sans-serif;
		font-weight: 700;
		line-height: 1.05em;
		letter-spacing: 0.05em;
		text-transform: uppercase;
		text-rendering: geometricPrecision;
	}
	h6 {
		font-size: 13px;;
	}
	h5 {
		font-size: $qt-titles-base-desk;
	}
	h4 {
		font-size: 1.414rem;
	}
	h3 {
		font-size: 2rem;
	}
	h2 {
		font-size:  2.827rem;
	}
	h1 {
		font-size: 4rem;
	}



	blockquote { 
		padding: 1rem 1rem 1rem  5rem;
		min-height: 5rem;
		&::before {
		    width:3rem;
		    position:absolute;
	  	}
	}

	.qt-ellipsis {
		&.qt-t {
			line-height: 1.05em;
			height: 1.05em; /* Fallback for non-webkit */
		}
	}
	

	/* Menu desktop
    ========================================================================== */
    .qt-logo-text {
		font-size:  $qt-titles-base-desk * (2 * $qt-titles-scale-desk);
		line-height: 2 * $qt-font-scale;
	}
	.qt-menubar-top {
		font-family: 'Oswald', sans-serif;
		line-height: 30px;
		font-weight: 300;
		ul {
			li {
				display: inline;
				
				a {
					padding: 0 0.5rem;
					i.qt-socialicon {
						font-size: 20px;

						top: 5px;
						position: relative;
					}

				}
				&.right a {
	   				padding: 0 ;
	   				margin: 0;
	   			}
			}
		}
	}
	.qt-menubar {
		line-height: 3 * $qt-font-scale-desk;
		height:3 * $qt-font-scale-desk;
		.brand-logo {
			position: relative;
		}
		ul.qt-desktopmenu {
			> li {
				line-height: 3 * $qt-font-scale-desk;
				height:3 * $qt-font-scale-desk;
				display: inline-block;
				float: left;
				position: relative;
				 &::after {
					display: block;
					width: 4px !important;
					height: 17px;
					border-bottom: 2px solid $qt-text-color-negative;
					position: absolute;
					left: 0;
					top: $qt-font-scale-desk;
					content: " ";
					margin-top: 0px;

					animation: mbarmnuA 0.5s forwards;
					animation-duration: 1.8s;
					animation-iteration-count: 0; 
					opacity: 0.6;
				}
				


				> a {
					padding: 0 ( 1.4rem );
					line-height: 3 * $qt-font-scale-desk;
					&::before, &::after {
						display: block;
						width: 13px !important;
						height: 8px;
						border-top: 2px solid $qt-text-color-negative;
						border-bottom: 2px solid $qt-text-color-negative;
						position: absolute;
						left: 0;
						top: $qt-font-scale-desk;
						content: " ";
						margin-top: 3px;

						animation: mbarmnuB 0.5s forwards;
						animation-duration: 1.8s;
						animation-iteration-count: 0; 
						opacity: 0.6;
					}
					&::after {
						// display: none;
						animation: mbarmnuC 0.8s forwards;
						animation-iteration-count: 0; 						 
						animation-duration: 1s;
						width: 20px !important;
						margin-top:6px;
					}

				}

				&.right {
					border-left: 1px solid rgba(255,255,255,0.38);
					
				}

				&.right , &.right > a, .brand-logo , &.qt-logo-link {
					&::after, &::before {	
						display: none;
					}
				}
				&:hover {
					&::after , > a::after, > a::before {
						animation-iteration-count: infinite; 
						opacity: 1;
					}
					

				}



				ul {
					position: absolute;
					display: none;
				    margin-top: 1px;
				    min-width:300px;
				    li {
				    	display: block;
				    	width: 100%;
				    	
				    	a {
				    		display: inline-block;
				    		width: auto;
				    		float: left;
				    		line-height: 1.5 *  $qt-font-scale-desk;
				    		padding: 0  1rem ;
				    	}
				    	
				    }
				    &::after {
				    	display: block;
				    	clear: both;
				    	width: 100%;
				    }
				}
				&::after {
			    	display: block;
			    	clear: both;
			    	width: 100%;
			    }
				&:hover {
					ul {
						display: block;
					}
				}

			}
		}
	}

	/* Page header
    ========================================================================== */
	.qt-pageheader {
		padding: 6rem  0;

	}
	

	/* 12.07. Share page
   ========================================================================== */
	.qt-sharepage {
		width: 100%;
		display: block;
		overflow: normal;
		li { 
			display: block;
			float: none;
			width: 100%;
			line-height: 2em;
			height: auto;
			a, .qt-thareicon {
				display: block;
				width: 100%;
				padding: 10px   0;
				opacity: 1;
				line-height: 1.8em;
				height: auto;

			}
		}

	}


	/* Content
   ========================================================================== */
   .qt-the-content {
		line-height: 1.9em;
		.qt-post-author {
			.qt-post-author-link {
				padding-top: 0;
			}
		}
	}

	

	/* Comments
   ========================================================================== */
	.qt-comment-respond {
		padding: 3rem;
	}


	/* Slick slider (desktop for slidk-slider.scss)
   ========================================================================== */

	.qt-slickslider-container {

		.slick-slider {
			
			&.qt-slickslider-single {
				.qt-item {
					max-width: $qt-max-container-size;
					width: $qt-max-container-size;
					.qt-part-archive-item {
						&.qt-part-item-post-hero {
							.qt-item-header {
								.qt-header-mid {
									padding: 80px 0;
									min-height: 580px;
								}
							}
							margin-bottom: 0;
						}
					}
				}
				.slick-dots {
					bottom: 10px;
				}
			}

			&.qt-slickslider-multiple {
				.qt-item {
					max-width: $qt-max-container-size;

					.qt-part-archive-item {

						&.qt-vertical {
							.qt-item-header {
								.qt-header-mid {
									min-height: 390px;
									height: 390px;
									padding: 0 1rem;;
									.qt-item-title {
										font-size: 2rem;
									}
								}
							}	
						}
					
					}
				}
			}
			.slick-dots {
				bottom: 40px;
			}

		}

		
		.slick-arrow {
			position: absolute;
			border: none;
			display: block;
			top: 0;
			left: 0;
			z-index: 100;
			height: 100%;
			width: 150px;
			cursor: pointer;
			background: -moz-linear-gradient(left, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); /* FF3.6-15 */
			background: -webkit-linear-gradient(left, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* Chrome10-25,Safari5.1-6 */
			background: linear-gradient(to right, rgba(0,0,0,1) 0%,rgba(0,0,0,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#00000000',GradientType=1 ); /* IE6-9 */
			outline: none;
			color: transparent;
			font-size: 0;
			opacity: 1;
			transition: opacity 0.3s;
			// display: none;
			&:hover {
				opacity: 1;
			}
			&.slick-next {
				left: auto;
				right: 0;
				background: -moz-linear-gradient(left, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 2%, rgba(0,0,0,1) 100%);
				background: -webkit-linear-gradient(left, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 2%,rgba(0,0,0,1) 100%); 
				background: linear-gradient(to right, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 2%,rgba(0,0,0,1) 100%);
				filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000',GradientType=1 );
				&::after {
					content: "\56";
				}
			}
		}
		
	}




	/* Show contents
   ========================================================================== */
	.qt-show-contents .qt-contents .qt-show-tagline .qt-title {
    font-size: 94px; padding: 0; margin: -10px 0 0 0; letter-spacing: 0;}

    /* Show schedule */
    .qt-part-show-schedule-day-item .qt-overinfo {
    	transition: top 0.3s ease;
    }
    .qt-part-show-schedule-day-item:hover .qt-overinfo {
    	top: 0%;
    }

    .qt-show-contents {
		.qt-contents {
			padding: 3rem 2.8rem;
			.qt-content-readmore {
				margin-top: 1.4em;
			}
		}
	}


    /* Archive items: base for styling any archive items. Some may differ for size and proportions.
   ========================================================================== */
    .qt-part-archive-item {
    	.qt-item-header {
	    	.qt-header-mid {
				padding: 90px 0;
			}
		}

    	.qt-item-content {
    		padding: 70px;
    	}
    	.qt-item-content-s {
    		padding: 45px;
    	}
    	.qt-item-content-xs {
    		padding: 1.414rem;
    	}

    	/* vertical post
   		========================================================================== */
    	&.qt-vertical {
    		.qt-item-header {
		    	.qt-header-mid {
					padding: 90px 0;
					min-height: 400px;
				}
			}
    	}
    	/* compact
	   ========================================================================== */
		&.qt-compact {
			margin: 0;
			.qt-item-header {
		    	.qt-header-mid {
					padding: 30px 0;
				}
			}
		}

		/* post hero
	   ========================================================================== */
		&.qt-part-item-post-hero {
			.qt-item-header {
		    	.qt-header-mid {
					max-width: 850px;
					margin: 0 auto;
					.qt-the-content {
						max-width: 600px;
						margin: 0 auto;
					}
				}
			}
			margin-bottom: 1rem;
		}
    }




    /* Chart tracklist
    ========================================================================== */
	.qt-chart-tracklist {
		.qt-chart-track {
			.qt-chart-table {
				display: table;
				.qt-position, .qt-titles, .qt-action {
					display: table-cell;
					width: 170px;
				}
				.qt-titles {
					width: auto;
					padding: 0 14px 0 40px;
				}
				.qt-action {
					display: table-cell;
					width:auto;
					padding: 0 20px 0 14px;
					a {
						max-width: 50px;
						float: right;
					}
				}
			}
		}
	}




	
}




