@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/

img, object, embed, video {
	max-width: 100%;
}
/* IE 6 does not support max-width so default to width 100% */
.ie6 img {
	width:100%;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	10;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

/* Mobile Layout: 480px and below. */

.gridContainer {
	position:absolute;
	width: 100%;
	height: 100%;
}

.clear {
	clear: both;
}

.no-margin {
	margin-bottom:0px !important;
}

.container, .container-header {
	width: 960px;
	margin: 0 auto 0 auto;
}

.container-index {
	top:300px;
}

.container-news, .container-header, .container-video, .container-fb-shop, .container-footer, .container-video, .container-sponzorji {
	margin: 0 auto 0 auto;
}

.container-news, .container-fb-shop, .container-footer {
	width: 1170px;
}

.container-video {
	padding:100px 0 120px 0;
	width: 900px;
}

.container-sponzorji {
	width: 100%;
	height: 55px;
}

.content {
	padding: 100px 0 130px 0;
}

.content-discography-info {
	padding: 100px 0 90px 0;
}


/******************************************************************************
 * INDEX
 *****************************************************************************/
#index, #index-rocks-off, #banner-news {
	position:relative;
	height: 70%;
	width: 100%;
	background-attachment: fixed; background-position: center 80%; background-repeat: no-repeat; background-size: cover;
	background-image: url(../images/bg-maryrose-resnicen-svet-cd.jpg);
}

#banner-news {height: 300px; background-image: url(../images/bg-maryrose-resnicen-svet-drevo.jpg); background-position: center -150px;  background-size: cover; }
#index-rocks-off {height: 100%; background-image: url(../images/bg-maryrose-rocks-off.jpg); }


#index-2 {
	position:relative;
	background-attachment: fixed; background-position: center 80%; background-repeat: no-repeat; background-size: cover;
	background-image: url(../images/bg-maryrose-resnicen-svet-cd.jpg);
	height: 634px;

}

#index-2-rocks-off {
	position:relative;
	background-attachment: fixed; background-position: center 80%; background-repeat: no-repeat; background-size: cover;
	background-image: url(../images/bg-maryrose-rocks-off.jpg);
	height: 634px;

}


#cd-index-banner {
	position:absolute;
	bottom:120px;
	width: 100%;
}


#novi-cd-banner-content {    
	width: 1170px;
	margin: 0 auto 0 auto;
	padding-top:80px;
}

#novi-cd-banner-slika {
	width: 567px;
	float:left;
}

#novi-cd-banner-tekst {
	margin-top: 100px;
	margin-left: 80px;
	width: 505px;
	float: left;
}


.scroll-puscica {
	position:absolute;
	width: 40px;
	height: 25px;
	background-image: url(../images/puscica_scroll.png);
	margin-top: 20px;
	left: calc(50% - 20px);
	-webkit-animation: mover 1s infinite  alternate;
    animation: mover 1s infinite  alternate;
}

@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}

@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}



#sponzorji {
    position: relative;
	text-align:center;
	width:100%;
	background-color: #000;
	padding: 20px 0 20px 0;
	border-top:dashed;
	border-top-color: #5A5A5A;
	border-top-width: thin;
	border-bottom:dashed;
	border-bottom-color: #5A5A5A;
	border-bottom-width: thin;
}

.sponzorji-slika {
	margin: 0 30px 0 30px;
	height:100%;
}


.index-gradient {
	position:relative;
	width: 100%;
	height: 100%;
background: rgb(0,0,0);
background: linear-gradient(180deg, rgba(0,0,0,0.7) 0%, rgba(0,0,0,1) 100%);
}


.index-gradient-2 {
	position:absolute;
	width: 100%;
	height: 40%;
	bottom:0px;
background: rgb(0,0,0);
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.7) 100%);
}



/******************************************************************************
 * GLAVA
 *****************************************************************************/
.cbp-af-header, .header-subpage {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9998;
	height: 90px;
	overflow: hidden;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.cbp-af-header .cbp-af-inner, .cbp-af-inner {
	width:100%;
	margin:auto;
}

.cbp-af-header nav, .header-subpage nav {
	display: inline-block;
	position: absolute;
}

 /* We just have one-lined elements, so we'll center the elements with the line-height set to the height of the header */
.cbp-af-header nav a, .header-subpage nav a {
	line-height: 90px;
}

.cbp-af-header nav, .header-subpage nav {
	right:5%;
}

.cbp-af-header nav a, .header-subpage nav a {
	font-family: 'Oswald', sans-serif;
	font-size: 16px;
	color: #FFF;
	font-weight: 400;
	font-style: normal;
	margin: 0 8px 0 8px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	-webkit-font-smoothing: antialiased;
} 

.cbp-af-header nav a {
	color: #FFF;
} 

.cbp-af-header nav a:hover {
	color: #FFF;
	text-decoration: line-through;
} 


/* Transitions and class for reduced height */
.cbp-af-header h1,
.cbp-af-header nav a {
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.cbp-af-header.cbp-af-header-shrink {
	top: 0px;
	height: 90px;
	position: fixed;
	background-color:rgba(0,0,0,0.90);
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}

.cbp-af-header.cbp-af-header-shrink nav a {
	line-height: 90px;
	color:#FFF;
}

.cbp-af-header.cbp-af-header-shrink nav a:hover {
	color:#FFF;
}

.head_black {
	position: fixed; 
	width: 100%;
	height: 90px;
	z-index: 1;
}

.head_logo {
	position:absolute;
	width: 334px;
	height: 81px;
	margin-top: 0px;
	left:5%;
}

.cbp-af-header.cbp-af-header-shrink .head_logo {
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-o-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out;
}


/******************************************************************************
 * NEWS - INDEX
 *****************************************************************************/
#news, #subpage {
	position:relative;
	width: 100%;
	background-color: #0a0b0a;
}

#subpage {
	min-height:300px;
}

.news-list-item, .disc-list-item {
	position:relative;
	padding: 0 10px 0 10px;
	float:left;
}

.news-list-item-index {
	position:relative;
	padding: 0 20px 0 20px;
	float:left;
}

.stolp-3-novice {
	width: calc(33.33% - 40px);
    margin-bottom: 30px;
}

.stolp-4 {
	width: calc(25% - 20px);
    margin-bottom: 30px;
}


.stolp-2 {
	width: calc(50% - 60px);
    margin-bottom: 30px;
}

.row {
	margin-left: -15px;
    margin-right: -15px;
}

.news-image, .news-image-index {
	overflow: hidden;
    height: 170px;
    background: #000;
    padding-left: 0px;
    padding-right: 0px;
}

.news-image-index {height: 200px;}


.news-image img {
	width: 100%;
}

.news-text {
	overflow: hidden;
    height: 200px;
    background: #1b1e21;
    padding: 17px;
}

.view_more a, .view_more a:link, .view_more a:hover {
	float: right;
	color: #959391;
	font-family: 'Oswald', sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: 400;
	line-height: 0px;
	margin-top: 30px;
}

.view_more a:hover {color: #FFF;}

/******************************************************************************
 * VIDEO - INDEX
 *****************************************************************************/
#video {
	position:relative;
	width: 100%;
	background-attachment: fixed; background-position: center 30%; background-repeat: no-repeat; background-size: cover;
	background-image: url(../images/bg-maryrose-2.jpg);
}

.black-gradient {
	background: rgba(0,0,0,0.80);
	width: 100%;
}

.videoWrapper, .videoWrapper-subpage {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	height: 0;
}

.videoWrapper-subpage {
	padding-bottom: 56.25%; /* 16:9 */
	margin-bottom:30px;
}

.videoWrapper iframe, .videoWrapper-subpage iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}


/******************************************************************************
 * FB IN SHOP - INDEX
 *****************************************************************************/
#fb-shop {
	position:relative;
	width: 100%;
	background-color:#0a0b0a;
}
.fb-widget, .shop {
	padding: 0 85px 0 0;
	float: left;
	width: 500px;
}

.shop {
	width: 585px;
	padding: 0 0 0 0px;
}

/******************************************************************************
.shop img {
	width: 100%;
}
 *****************************************************************************/
/******************************************************************************
 * DISKOGRAFIJA
 *****************************************************************************/

.stolp-disc-list-item, .news-subpage-list-item {
	position:relative;
	padding: 0 30px 0 30px;
	float:left;
}

.stolp-3, .stolp-disc-cd {
	width: calc(33.33% - 60px);
    margin-bottom: 30px;
}

.stolp-2_3 {
	width: calc(66.66% - 60px);
    margin-bottom: 30px;
}

.row-disc, .row-news, .row-video {
	margin-left: -30px;
    margin-right: -30px;
}

.disc-song p {
	margin-top:-6px;
}

.disc-image, .disc-title {
	overflow: hidden;
    padding-left: 0px;
    padding-right: 0px;
}

.disc-image img {
	width: 100%;
}

#discography-info {
	position:relative;
	width: 100%;
	background-color: #1b1e21;
}

#discography-video {
	position:relative;
	width: 100%;
	background-color: #0a0b0a;
}

span.lyrics a {
    background: url(../images/icon-lyrics.png) no-repeat scroll 0 center transparent;
    display: inline-block;
    height: 18px;
    text-indent: -1000em;
    width: 15px;
	margin-left:10px;
}

span.lyrics a:hover {
    background: url(../images/icon-lyrics-2.png) no-repeat scroll 0 center transparent;
}

/******************************************************************************
 * KONCERTI
 *****************************************************************************/
#koncerti_row {
    padding: 5px;
    width: 1170px;
	height:46px;
    border-bottom: dashed;
    border-bottom-color: #5A5A5A;
    border-bottom-width: thin;
}

#koncerti_datum, #koncerti_datum h3 {
	font-size:20px;
    width: 200px;
    padding: 5px 0px 0px 10px;
    vertical-align: top;
    text-align: left;
    float: left;
	line-height: 24px;
}

#koncerti_kraj {
	width: 200px;
    padding: 12px 0px 0px 0px;
    vertical-align: top;
    text-align: left;
    float: left;
}


#koncerti_dogodek {
	width: 430px;
    padding: 12px 0px 0px 0px;
    vertical-align: top;
    text-align: left;
    float: left;
}

#koncerti_vstopnice {
	width: 130px;
    padding: 13px 15px 5px 0px;
    vertical-align: top;
    text-align: left;
    float: right;
}

.button-vstopnice {
	font-family: 'Oswald', sans-serif;
	font-size: 13px;
	text-align: center;
	padding: 7px 25px;
	letter-spacing: 1px;
	color: #FFF;
	background-color:#1b1e21;
	text-align: center;
	align-items: center;
	text-transform: uppercase;
	font-weight: 500;
	-webkit-font-smoothing: antialiased;
}

.button-vstopnice:hover {
	color: #1b1e21;
	background-color:#FFF;
	-webkit-font-smoothing: antialiased;
}




/******************************************************************************
 * SHOP
 *****************************************************************************/
.gumb-kosarica a, .gumb-kosarica a:link {
	float:left;
	color: #FFF;
	background: #1b1e21;
	font-family: 'Oswald', sans-serif;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 17px;
	font-weight: 400;
	line-height: 0px;
	margin-top: 20px;
	padding:30px 40px 30px 40px;
}

.gumb-kosarica a:hover {color: #1b1e21; background: #FFF;}

.primer-velikosti a {
	float:left;
	border:#c9c9c9 solid thin;
	font-family: "gotham-mediumgotham-medium", sans-serif;
	font-size: 13px;
	text-align: left;
	color: #c9c9c9;
	font-weight: 400;
	line-height: 0px;
	margin-right: 10px;
	padding:20px 25px 20px 25px;
	float:left;
}

.primer-velikosti {
	margin-right: 40px;
	float:left;
}

.šifra-artikla {
	float:left;
	color: #c9c9c9;
	border-top-color:#c9c9c9;
	border-top-width:1px;
	border-top-style:dotted;
	border-bottom-color:#c9c9c9;
	border-bottom-width:1px;
	border-bottom-style:dotted;
	font-family: "gotham-mediumgotham-medium", sans-serif;
	font-size: 11px;
	text-align: left;
	font-weight: 400;
	line-height: 0px;
	margin-right: 10px;
	margin-top:50px;
	padding:12px 10px 12px 10px;
}

.šifra-artikla a {
	color: #c9c9c9;
}

/******************************************************************************
 * NOGA
 *****************************************************************************/
#footer {
	position:relative;
	width: 100%;
	height:120px;
	background-color:#000;
}

.copyright {
	float:left;
	width:600px;
	margin-top: 50px;
}

.social-icon {
	position:relative;
	float:right;
	width: 300px;
	margin-top: 48px;
}
.social-icon-fb, .social-icon-youtube, .social-icon-myspace, .social-icon-soundcloud, .social-icon-instagram {
	float: right;
	background-repeat: no-repeat;
	background-position: center top;
	height: 25px;
	width: 25px;
	margin-left: 25px;
	cursor: pointer;
}
.social-icon-fb {background-image: url(../images/icon-facebook.png);}
.social-icon-youtube {background-image: url(../images/icon-youtube.png);}
.social-icon-myspace {background-image: url(../images/icon-myspace.png);}
.social-icon-soundcloud {background-image: url(../images/icon-soundcloud.png);}
.social-icon-instagram {background-image: url(../images/icon-instagram.png);}


.social-icon-fb:hover, .social-icon-youtube:hover, .social-icon-myspace:hover, .social-icon-soundcloud:hover, .social-icon-instagram:hover {
	background-position: center -25px;
}




.button {
	font-family: 'Oswald', sans-serif;
	font-size: 18px;
	color: #FFF;
	text-align: center;
	border: 2px solid #FFF;
	padding: 0.65em 2.1em;
	text-align: center;
	align-items: center;
	text-transform: uppercase;
	font-weight: 300;
}

.button-2, .button-3 {
	font-family: 'Oswald', sans-serif;
	font-size: 15px;
	color: #959391;
	text-align: center;
	border-top: 2px solid #959391;
	border-bottom: 2px solid #959391;
	padding: 10px 30px;
	text-align: center;
	align-items: center;
	text-transform: uppercase;
	font-weight: 500;
	letter-spacing: 5px;
	-webkit-font-smoothing: antialiased;
}

.button-2:hover {
	color: #FFF;
	border-top: 2px solid #FFF;
	border-bottom: 2px solid #FFF;
}


.button-3 {
	font-size: 13px;
	text-align: center;
	padding: 5px 20px;
	letter-spacing: 2px;
}


.button-pozicija-center {
	text-align: center;
	margin-top: 60px;
}


@media only screen and (max-width: 1015px) {
.gridContainer {
	width: 100%;
	height: 100%;
}


}


@media only screen and (min-width: 1020px) {
.gridContainer {
	width: 100%;
	height: 100%;
}

}


@media only screen and (min-width: 1260px) {
.gridContainer {
	position:absolute;
	width: 100%;
	height: 100%;
} 

}



@media only screen and (min-width: 1500px) {
.gridContainer {
	position:absolute;
	width: 100%;
	height: 100%;
}

}




.quantity {
  position: relative;
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button
{
  -webkit-appearance: none;
  margin: 0;
}

input[type=number]
{
  -moz-appearance: textfield;
}

/*  oblika.css      */

.naslovna_vrstica {
	font-family: 'Oswald', sans-serif;
	font-size: 16px;
	color: #FFF;
	font-weight: 400;
	font-style: normal;
	padding-top:18px;
	padding-bottom:18px;
	padding: 18px 0px 18px 15px;
	text-align:left;
	background-color:#1b1e21;
	text-transform: uppercase;
	-webkit-font-smoothing: antialiased;
}

.naslovna_vrstica_zadnja
{
background-color:#1c434b;
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color:#999;
height:30px;
border-right:solid;
border-right-color:#666;
border-right-width:1px;
border-bottom:solid;
border-bottom-color:#666;
border-bottom-width:1px;
text-align:left;

}
.uredi
{
padding-left:4px;
border-left:solid;
border-left-color:#666;
border-left-width:1px;
border-bottom:solid;
border-bottom-color:#666;
border-bottom-width:1px;

}


.naslov_glava
{
font-family:Verdana, Geneva, sans-serif;
font-size:18px;
font-weight:bold;
color:#000;
padding-left:10px;}


.brisi {
	padding: 10px 6px 10px 6px;
	border-bottom:solid #1b1e21 4px;
}
.vrstica a:link {
	text-decoration: none;
	color: #3ea9bf;
}
.vrstica a:visited {
	text-decoration: none;
	color: #3ea9bf;
}
.vrstica a:hover {
	text-decoration: none;
	color:#828282;
}
.vrstica a:active {
	text-decoration: none;
	color: #333;
}

.vrstica, .vrstica_normal, .vrstica_desno, .vrstica_desno_normal, .vrstica_zadnja, .vrstica_zadnja_desno {
	font-family: "gotham-mediumgotham-medium", sans-serif;
	color:#c9c9c9;
	font-size: 14px;
	padding: 26px 0px 26px 15px;
	border-bottom:solid #1b1e21 4px;
	text-align:left;
}


.vrstica_desno {
text-align:right;
}


.vrstica_zadnja_desno {
text-align:right;
font-weight:bold;
}


.vrstica_disabled
{
font-family:Arial, Helvetica, sans-serif;
color:#2483B0;
font-size:14px;
padding-left:6px;
border-left:solid;
border-left-color:#666;
border-left-width:1px;
border-bottom:solid;
border-bottom-color:#666;
border-bottom-width:1px;
text-align:left;
font-weight:bold;
/*background-color:#666;*/

}

.plus-postnina, .skupaj-placilo {
	font-family: "gotham-mediumgotham-medium", sans-serif;
	color:#c9c9c9;
	font-size: 13px;
	text-align:right;
}

.skupaj-placilo {
	font-size: 16px;
}

.skupaj-znesek {
	font-family: 'Oswald', sans-serif;
	font-size: 22px;
	color: #FFF;
	font-weight: 500;
	text-transform: uppercase;
	padding-left:30px;
	-webkit-font-smoothing: antialiased;
}


.button {
	margin-top:0px;
	font-family: 'Oswald', sans-serif;
	font-size:15px;
	font-weight:bold;
	color:#fff;
	background-color:#1b1e21;
	border:none;
	border-width:1px;
	border-color:#1b1e21;
	padding-bottom:4px;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 16px;
	font-weight: 400;
	line-height: 0px;
	margin-top: 20px;
	padding:30px 35px 30px 35px;
	-webkit-font-smoothing: antialiased;
}

.button:hover {
	color:#000;
	background-color:#fff;
	cursor:pointer;
}

.brisibuttonimage {
	background-image: url(../images/delete-normal.png);
	background-repeat: no-repeat;
	background-position: center center;
	border: none;
	background-color:transparent;
	margin-left:18px;

}

.brisibuttonimage:hover {
	background-image: url(../images/delete-hover.png);
	cursor:pointer;
}


.uredibuttonimage {
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
    background-image: url(images/edit.png);
	background-color:transparent;
	background-repeat: no-repeat;
	width:25px;
	height:20px;
	background-position: center center;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;

}

.uredibuttonimage:hover
{
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
 /*   background-image: url(images/editroll.gif);*/
	background-repeat: no-repeat;
	width:25px;
	height:20px;
	background-position: center center;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	cursor:pointer;
	background-color:transparent;
		
}

.izdelekid {
	font-family:Tahoma, Geneva, sans-serif;
	color:#06C;
	font-weight:bold;
	font-size:12px;
}
	
.postavke {
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
text-align:right;
padding-right:10px;
color:#666;
}

.edit_brez_bg {
font-family:Arial, Helvetica, sans-serif;
color:#666;
font-size:12px;
}

.edit {
font-family:Tahoma, Geneva, sans-serif;
color:#666;
font-size:12px;
}

.edit_narocilo {
font-family:Tahoma, Geneva, sans-serif;
color:#666;
font-size:14px;
}


.validacija {
font-family:Arial, Helvetica, sans-serif;
color:#999;
font-size:9px;
}
	
.postavke_narocilo {
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
text-align:right;
padding-right:10px;
color:#666;
}

#kolicina {
	width: 30px;
    padding: 8px 6px;
    font-size: 14px;
    border: #959391 solid 1px;
    background-color: #000;
    color: #FFF;
    text-align: center;
}

#velikost {
	width: 70px;
    height: 35px;
	font-size: 14px;
    border: #959391 solid 1px;
    background-color: #000;
    color: #FFF;
    text-align: center;
}