body {
font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
color: #c4bd97;
background-image: url('../images/tausta.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center top;
background-color: #000;
font-size: 18px;
text-shadow: -2px 2px #000;
background-size: 100%;
}

article {
padding: 0 230px;
text-align: center;
}

.onlymobile {
	border: 1px solid black;
	display: none;
}

.musiikki article {
padding: 50px;
}

.musiikki h2 {
font-size: 30px;
margin-bottom: 14px;
}

.musiikki .albumcover {
padding: 0 70px;	
}

.shop span {
	padding: 0 20px;
}

.album span {
margin-right: 8px;	
white-space: nowrap;
font-size: 17px;
}

.logo {
text-align: center;
border: 0;
}

#logo {
max-width: 550px;
width: 100%;
height: auto;
margin-top: 30px;
margin-bottom: 40px;
}

.slicknav_menu {
	display:none;
}



nav {
    display: table;
    table-layout: fixed;
    width: 90%;
	margin-left: 5%;
	margin-bottom: 180px;
	text-align: center;
}

nav ul {
    display: table-row;
    margin: 0;
    padding: 0;
}

nav ul li {
    list-style: none;
    display: table-cell;
    text-align: center;
}

nav ul li a {
display: block;
border: 1px solid red;
background-color: #000;
margin: 0 4%;
padding-top: 3px;
padding-bottom: 3px;
}

.tilaa .albumcover {
width: 110px;	
float: left;
margin-right: 40px;
margin-bottom: 20px;
}

.tilaa h2 {
margin-bottom: 8px;
}

.tilaa nav,.musiikki nav {
	margin-bottom: 80px;
}

form {
text-align: left;
margin-top: 30px;
}

form p {
	font-size: 16px;
}

form * {
	vertical-align: top;
}

label {
width: 30%;
border: 1px solid red;
background-color: #000;
padding: 6px;
}

label.cb {
width: 40px;
text-align: center;
}

input[type=checkbox] {

}

input, textarea {
width: 60%;
border: 1px solid red;
background-color: #000;
padding: 6px;

}

input[type=submit] {
	width: 200px;
}


nav a:hover {
border: 1px solid red;
}

nav a,  nav a:visited, nav a:active, nav a:focus {
color: #c4bd97;
text-decoration: none;
}

nav a:hover {
color: #b42020;	
text-decoration: none;
}

nav a.currentPage {
color: #b42020;	
}





a, a:visited, a:active, a:focus {
color: #b42020;	
}

a:hover {
color: #b42020;	
text-decoration: underline;
}

hr {
border: 0;
height: 1px;
background: #c4bd97;
}


.icon {
height: 30px;
width: auto;
}

.itemNav img {
width: 70px;
height: auto;
}

.albumpic {
float: left;
margin: 0 10px 30px 0;
}

.credits {
font-size: 70%;
}

.column {
float: left;
width: 50%;
}

h1,h2 {
font-weight: bold;
}

h1 {
font-size: 30px;
}

h2 {
font-size: 20px;
margin-bottom: 0;
}

.thumb-box .thumbs li:hover img {
    opacity: 1;
    -moz-transition: opacity 0.2s;
    -o-transition: opacity 0.2s;
    -webkit-transition: opacity 0.2s;
    transition: opacity 0.2s;
}
.thumb-box .thumbs li img.active {
    border-color: red;
    opacity: 1;
}
.thumb-box .thumbs li img {
    width: 100%;
    opacity: .8;
    -moz-transition: opacity 0.32s;
    -o-transition: opacity 0.32s;
    -webkit-transition: opacity 0.32s;
    transition: opacity 0.32s;
    border-top: 4px solid transparent;
}

.thumb-box .thumbs li {
    text-align: center;
}

.thumb-box .thumbs {
    overflow: hidden;
    *zoom: 1;
}

.thumb-box li {
    list-style: none;
}

.thumb-box {
    padding: 1.4em 0 1em;
    margin-left: -1%;
    width: 102%;
}

.thumb-box .thumbs li {
    float: left;
    width: 15%;
	height: 60px;
    text-align: center;
	margin: 10px;
    padding: 0 1%;
	overflow: hidden;
}

.sy-slide > a {
	
}

.sy-slide > a > img {
	margin: 0 auto;
	width: auto;
	max-width: 100%;
}


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

	article {
	padding: 0 85px;
	}



	nav {
margin-bottom: 100px;
	}


}
 
@media only screen and (max-width : 922px) { 

	.musiikki .albumcover {
	padding: 0;
		
	}

	article {
	padding: 0 10px;
	}
	
		nav {
margin-bottom: 60px;
	}	

} 
 
 @media only screen and (max-width : 768px) { 

	body {
		background-size: auto;
	}
 
	#menu {
		display:none;
	}
	
	nav {
	margin-bottom: 0px;
	}
	
	
		.musiikki .albumcover {
	width: 100%;
	height: auto;
		
	}
	
	.slicknav_nav a {
		color: #c4bd97 !important;
		
	}
	
	.slicknav_menu {
		display:block;
		background-color: rgba(0,0,0,0.6) !important;
	}
	
	.slicknav_nav a:hover {
		background-color: rgba(0,0,0,0.6) !important;
	
	}
	
	.slicknav_menu .slicknav_icon-bar {
    background-color: #c4bd97  !important;
	}	
	

	
	#logo {
		margin-bottom: 15px;
	}


 }
 
 
@media only screen and (max-width : 400px) { 
	.onlymobile {
	ddisplay: block;
	}
	
label.cb {
display: inline-block;
margin-bottom: 14px;
}
	
label {
width: 100%;
display: block;
background-color: transparent;
border: 0px;
padding-bottom: 0px;
}

input, textarea {
width: 100%;
display: block;
margin-bottom: 1em;
}

input[type=submit] {
width: 100%;
}


} 

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



}