:root {
    --background-neg-dark: rgb(18, 0, 0);
	--background-neg-light: rgb(25, 25, 0);
	--foreground-neg-light: rgb(254, 152, 0);
	--foreground-neg-dark: rgb(110, 54, 0);
	}
@font-face {
    font-family: 'BrushUp';
    src: url('../fonts/Brush Up.eot');
    src: url('../fonts/Brush Up.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Brush Up.woff2') format('woff2'),
        url('../fonts/Brush Up.woff') format('woff'),
        url('../fonts/Brush Up.ttf') format('truetype'),
        url('../fonts/Brush Up.svg#BrushUp') format('svg');
    font-weight: normal;
    font-style: normal;
	}

@font-face {
    font-family: 'BrushUp';
    src: url('../fonts/Brush Up Too.eot');
    src: url('../fonts/Brush Up Too.eot?#iefix') format('embedded-opentype'),
        url('../fonts/Brush Up Too.woff2') format('woff2'),
        url('../fonts/Brush Up Too.woff') format('woff'),
        url('../fonts/Brush Up Too.ttf') format('truetype'),
        url('../fonts/Brush Up Too.svg#BrushUpToo') format('svg');
    font-weight: bold;
    font-style: normal;
	}
	
@font-face {
    font-family: 'TheCatHasAHat';
    src: url('../fonts/TheCatHasAHatRegular.eot');
    src: url('../fonts/TheCatHasAHatRegular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/TheCatHasAHatRegular.woff2') format('woff2'),
        url('../fonts/TheCatHasAHatRegular.woff') format('woff'),
        url('../fonts/TheCatHasAHatRegular.ttf') format('truetype'),
        url('../fonts/TheCatHasAHatRegular.svg#TheCatHasAHatRegular') format('svg');
    font-weight: normal;
    font-style: normal;
   /* font-display: swap;*/
}



@keyframes fadeIn {
    from {opacity: 0;}
    to {opacity: 100;}
	}

@keyframes fadeOut {
    from {opacity: 100;}
    to {opacity: 0;}
	}
/*
@keyframes fadeInMB {
    from {opacity: 1;}
    to {opacity: 1;}
	}

@keyframes fadeOutMB {
    from {opacity: 0.1;}
    to {opacity: 0.5;}
	}
*/
@keyframes fadeInModal {
    0% {opacity: 0;}
    35% {opacity: 1;}
	100% {color: rgb(254, 152, 0); opacity:1;}
	}
@keyframes colorInModal {
    0% {opacity: 0;}
    50% {opacity: 1;}
	100% {opacity: 0;}
	}

@keyframes fadeColorToLight {
    from {color: rgb(110, 54, 0);}
    to {color: rgb(254, 152, 0);}
	}

@keyframes fadeColorToDark {
    from {color:rgb(254, 152, 0);}
    to {color: rgb(110, 54, 0);}
	}
		
html, body {

	}
body {
	/*display:none;*/
	/*background: linear-gradient(rgb(18, 0, 0),rgb(25, 25, 0));*/
	background: linear-gradient(rgb(25, 25, 0),rgb(100, 50, 0));
   background-attachment: fixed;
   overflow: hidden;
   position:relative;
   width: 100%;
   height: 100%;
  }
#mravinjak{
	width: 100%;
	height: 100vh;
	position: relative;
	overflow: hidden;
	margin-left: auto;
	margin-right: auto;
}
.navbar, 
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover{
	background-color: transparent;
	border:0;
	margin-bottom:0;
}
.navbar-default .navbar-nav a,
#lightSwitchOn {
	opacity:1;
}

.navbar .navbar-nav {
  /*display: inline-block;*/
  float: none;
  vertical-align: top;
  background-color: transparent;
  /*margin-top:20px;*/
}


.navbar .navbar-collapse {
  text-align: center;
}
  
.mraveBrojimFont {
    font-family: 'BrushUp';
    /*font-weight: bold;*/
    font-style: normal;
	margin-top:0;
	margin-bottom:0;
	}
#mraveBrojimLogoTekst{
	font-size:48px;
	letter-spacing:8px;
	color: rgb(254, 152, 0) !important;
	padding: 0;
	}
	
#mraveBrojimEmail a {
        text-decoration:none;
        font-family:'TheCatHasAHat';
    	font-size: 16px;
    	letter-spacing:8px;
    	color: rgb(254, 152, 0);
    	/*color:red;*/
    
}

#mraveBrojimLogoTekst.lightOn,#mraveBrojimEmail a.lightOn{
	animation-name: fadeColorToDark;
    animation-duration: 2s;	 
	animation-timing-function: ease-in;
	animation-fill-mode:both;
	/*animation-name: fadeOut;*/
    /*animation-duration: 1s;	 */
	/*animation-delay:3s;*/
	/*animation-timing-function: ease-out;*/
	/*opacity:0.7;*/
	/*animation-fill-mode:both;*/
	/*color: rgb(110, 54, 0);*/
}
#mraveBrojimLogoTekst.lightOff,#mraveBrojimEmail a.lightOff{
	/*animation-name: fadeColorToLight;
    animation-duration: 0.5s;	 
	animation-timing-function: ease-in;
	color: rgb(254, 152, 0);
	opacity:1;*/
	animation-name: fadeIn;
    animation-duration: 2s;	 
	animation-delay:1s;
	animation-timing-function: ease-in;
	animation-fill-mode:both;
	opacity:1;
}
#mraveBrojimEmail a:hover{
    font-size:18px;
 }

img.mrav {
  position: absolute;
  width: 20px;
  height: 20px;
  opacity: 0.6;
  z-index:2000;
 }

#R1S1, #R2S1, #R3S1{
	width:30px;
	height:30px;
}

#container{
	color : rgb(110, 54, 0);
	padding:0px;
	position: relative;
	transform-origin: top;
	/*padding-top: 260px;*/
	/*z-index: -10;*/
}
		

#pageContent {
	position : relative;
	color : rgb(110, 54, 0);
	
}

.vertical-center {
  min-height: 100%;  /* Fallback for browsers do NOT support vh unit */
  min-height: 100vh; /* These two lines are counted as one :-)       */
  display: flex;
  align-items: center;
	}
.fill { 
    min-height: 100%;
    height: 100%;
	}
#mbCanvas{
	position : fixed;
	width: 100%;
	height: 100%;
	/*z-index: 1;*/
	}

#zaglavljeRow{
	z-index:1000;
	margin-left:0;
	margin-right:0;
}
	
#mbCanvas.lightOn, img#lightSwitchOn.lightOn {
	animation-name: fadeIn;
    animation-duration: 1000ms;	 
	animation-timing-function: ease-in;
	opacity:1;
	}
#mbCanvas.lightOff, img#lightSwitchOn.lightoff{
	animation-name: fadeOut;
    animation-duration: 0.5s;	 
	animation-timing-function: ease-in;	
	opacity: 0;
	}
#lightSwitch{
	display: inline-block;
	margin:auto;
	}
img#logo-5{
	padding-top:40px;
	}
img#lightSwitch{
	/*z-index:1000;	*/
	}
img#lightSwitchOn{

	/*z-index:1000;*/
	}

div#logotip , div#emailadresa, div#logoTekst {
	z-index:-200;
	}

div#logotip.lightOn, div#emailadresa.lightOn, div#logoTekst.lightOn {
	z-index: 1;
	}
#wrapper{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	}
#modal-1 {
	position: fixed;
	top: 50%;
	left: 50%;
	width: 50%;
	max-width: 530px;
	min-width: 320px;
	height: auto;
	font-size: 36px;
	transform: translateX(-50%) translateY(-50%);
	/*transform: translateX(-50%);*/
	opacity:0;
	color:rgb(110, 54, 0);
	/*font-size: 36px;*/
	/*z-index: 2000;
	visibility: hidden;
	backface-visibility: hidden;
	*/
	z-index:200;
	}
#modal-1.lightOn {
	
	animation-name: fadeInModal;
    animation-duration: 8s;	 
	animation-delay:3s;
	animation-timing-function: ease-out;
	animation-fill-mode:both;
	
	}

.font-mono {font-family: "Courier New", Courier, monospace;}
.letter-spacing-8 {letter-spacing: 8px;}
.letter-spacing-4 {letter-spacing: 4px;}
.center{text-align: center;}

#pageContent{
	display: none;
	/*margin-top: 70px*/;
}

@media (min-width:1400px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
		max-width: 1320px;
	}
}
@media (min-width:1200px) {
	.container, .container-lg, .container-md, .container-sm, .container-xl {
		max-width: 1140px;
	}
}
@media (min-width:992px) {
	.container, .container-lg, .container-md, .container-sm {
		max-width: 960px;
	}
}


@media (min-width:768px) {
	.container, .container-md, .container-sm {
		max-width: 720px;
	}
}

@media (min-width:576px) {
	.container,	.container-sm {
		max-width: 600px;
	}
}


.container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl {
    width: 100%;
    padding-right: var(--bs-gutter-x,.75rem);
    padding-left: var(--bs-gutter-x,.75rem);
    margin-right: auto;
    margin-left: auto;
}

.bg-light{
	background: transparent !important;
}




/*#carouselImagePageIndicators img, */
#lyricsPage img{
	border-radius:55px;
}
/*
nav li.active::after {
    background: url('../images/logo_icon.png');
    width: 80px;
    height: 62px;
    display: block;
    content: "";
    background-repeat: no-repeat;
    background-position: center center;
}
*/
nav {
	padding-top:5px;
	
}
.nav-item:hover{
	opacity: 0.7;
}

.flex-container {
  display: flex;
  flex-wrap: nowrap;
}

.flex-container .nav-item{
	width: 100%;
}

.flex-container .nav-item img{
	width: 100%;
}

.flex-container .nav-item img{
	padding:10px;
}

.flex-container .nav-item.active {
	/*padding:0px;	*/
}
.flex-container .nav-item.active img{
	border-radius:15px;
	background-image: radial-gradient(farthest-side at 60% 55%, rgba(254,200,100,0.5),rgba(110, 54, 0, 0.6));
	padding:7px;
}

.flex-container .nav-item.active.lightOn img{
	/*border-radius:15px;*/
	background-image: radial-gradient(farthest-side at 60% 55%, rgba(200,100,0,0.5),rgba(254, 200, 100, 0.4));
	/*padding:7px;*/
}

#pageContent {
	display:table-cell;
	vertical-align:middle;
}

#pageContent >:nth-child(1) {
	/*margin-top:50px; modal dialog u pageContent */
}

#modalContainer {
	height: 92px;
}

#modal-2 {
	display: none;
}
/* image page */

#carouselImagePageIndicators, #carouselLyricsPage {
	animation-name: fadeIn;
    animation-duration: 1s;	 
	animation-delay:1s;
	animation-timing-function: ease-in;
	animation-fill-mode:both;
	opacity:1;
}

.carousel-control-prev-icon,
.carousel-control-next-icon {
  height: 60px;
  width: 60px;
  /*outline: black;*/
  /*background-size: 100%, 100%;*/
  /*background-color:red;*/
  /* border-radius: 50%; */
  /* border: 5px solid black; */
  /* background-image: none; */
}

.carousel-control-next-icon:after
{
 /* content: '>';
  font-size: 100px; */
  /*color: rgb(254,125,0);*/
}

.carousel-control-prev-icon:after {
  /* content: '<';
  font-size: 100px; */
  color: rgba(254,125,0,1);
}

/* music page */
#musicPageContainer {
	/*margin-top:25px;*/
	padding:30px;
	/*background-color:rgb(255,126,0);
	border-radius:15px;*/
/*	background-image: url("../images/music_page/binary_code.jpg");
	opacity: 0.6;
	border-radius: 15px;*/
}
.musicPageRow {
	padding:0;
	height:100px;
	margin:0px;
}

#musicPageContainer .col-md-6 {
	/*height:100%;*/
	/*background-image: radial-gradient(farthest-side at 60% 55%, rgba(200,100,0,0.5),rgba(254, 200, 100, 0.4));*/
	/*border-radius:25px;*/
}

#musicPageContainer img {
	width:70%;
	padding-left:20px;
	padding-right:20px;
	background-image: radial-gradient(farthest-side at 60% 55%, rgba(254,254,254,0.9),rgba(50, 50, 50, 0.9));
	border-radius:10px;
	border: 4px solid rgb(254,125,0);
	padding: 10px;
	box-shadow: 5px 10px rgba(0,0,0,0.5);
}

#musicPageContainer img:hover{
	opacity: 0.8;
}

#musicPageContainer.lightOn img  {
	background-image: radial-gradient(farthest-side at 60% 55%, rgba(200,100,0,0.9),rgba(254, 200, 100, 0.9));
	
}
/*lyrics page */ 


/*
.carousel-inner > .item {
    position: relative;
    display: none;
    -webkit-transition: 2.6s ease-in-out left;
    -moz-transition: 2.6s ease-in-out left;
    -o-transition: 2.6s ease-in-out left;
    transition: 2.6s ease-in-out left;
}
*/
.carousel-item {
  transition: transform 2.6s ease-in-out;
}

.carousel-fade .active.carousel-item-start,
.carousel-fade .active.carousel-item-end {
  transition: opacity 0s 2.6s;
}

.pressPageContainer{
	text-align:left;
	color: rgb(209,210,211);
	width: 600px;
	padding: 30px;
}
.press_main .row .lightOn{
	
	background-color:rgb(20,10,0);
}

.press_main.row    {
    background-color:rgba(256,128,0,0.7);
    margin:0px;
    margin-bottom:10px;
    border-radius:5px;
}

.press_main.row a:link {
    text-decoration:none;
    color: rgb(222,222,222);
    
}

.press_main.row a:visited {
    text-decoration:none;
    color: rgb(222,222,222);
    
}
.press_content_tekst.col a:link{
    color: rgb(40,20,0);
    }

.press_content_tekst.col a:visited{
    color: rgb(40,20,0);
    }

/*a:hover — when the user hovers their mouse over the link

a:active */

.press_source.row {
    background-color:rgba(160,80,0,0.7);
    color:rgb(209,210,211);
    /*background-color:red;*/
    margin:0px;
    padding:0px;
    border-top-left-radius : 5px;
    border-top-right-radius : 5px;
 }
.press_source_logo.col{
    /*background-color:blue;*/
    margin:0px;
    width:75%;
    float:left;
    flex:none;
    height: 64px;
}

press_download_link col{
    width:30%;
    float:right;
    flex:none;
}

.press_media_title{
    font-weight:bold;
    padding-left:5px;
}
span.press_media_author{
    /*background-color:yellow;*/
    font-style: italic;
}
.press_download_link{
    text-align:right;
}
.press_download_link img{
    display:inline;
}

.press_download_link img{
    margin-top:10px;
}
.press_content_preview {
    height:236px;
    /*background-color:magenta;*/
    margin:0px;
    padding:0px;
}

.press_content_image {
    margin:0px;
    padding:10px;
    overflow: hidden;
}
.press_content_tekst{
	display:inline-block;
	padding:10px;
	white-space: wrap;      /*keep text on one line */
	overflow: hidden;         /*prevent text from being shown outside the border */
	text-overflow: ellipsis;  /*cut off text with an ellipsis*/
}
.press_content_image img{
    width:100%;
    border-radius:5px;
    /*height:100%;*/
}

.pressPageContainer, .aboutPageContainer {
	margin-top:30px;
	margin-bottom:30px;
	padding-top: 0px;
	padding-left:30px;
	padding-right:30px;
	padding-bottom:0px;
	scrollbar-color: rgb(256,128,0) rgb(128,64,0);
	scrollbar-width: thin;
}
/* width */
::-webkit-scrollbar {
  width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  background: rgb(80,40,0);
  border-radius: 10px;  
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background: rgb(160,80,0); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgb(256,128,0); 
	}
  
/* about page */

.aboutPageContainer {
/*background: linear-gradient(rgb(20, 10, 0),rgb(100, 50, 0));*/
/*background-color:rgba(256,128,0,0.7);*/
text-align: justify;
color:rgb(200,100,0);
}
.aboutPageContainer .row {
/*	margin:0px;*/
	padding:5px 15px 5px 15px;
	color:rgb(40,20,0);
	background-color:rgba(256,128,0,0.7);
	border-radius:5px;
	margin-bottom:10px;
}
.aboutPageContainer .row.naslov {
    color:rgb(255,128,0);
    background-color:rgba(160,80,0,0.9);
    font-size:48px;
    letter-spacing:8px;
    text-align:center;
}
.aboutPageContainer img {
	border-radius:5px;
	}

.akcent{
font-weight:bold;
color:rgb(255,128,0);
color:rgb(40,20,0);
letter-spacing:1px;
}

.carousel-fade .carousel-item {
 opacity: 0;
 transition-duration: .6s;
 transition-property: opacity;
}

.carousel-fade  .carousel-item.active,
.carousel-fade  .carousel-item-next.carousel-item-left,
.carousel-fade  .carousel-item-prev.carousel-item-right {
  opacity: 1;
}

.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-right {
 opacity: 0;
}

.carousel-fade  .carousel-item-next,
.carousel-fade .carousel-item-prev,
.carousel-fade .carousel-item.active,
.carousel-fade .active.carousel-item-left,
.carousel-fade  .active.carousel-item-prev {
 transform: translateX(0);
 transform: translate3d(0, 0, 0);
}

.carousel-item img {
    border: 5px solid rgb(255,128,0);
    }
/* lightOffModal */

#lightOffModal .modal-content{
		background-color:rgb(256,128,0);
		border-radius:15px;
		border:1px;
}

#lightOffModal .modal-header {
	background-color:rgb(110,54,0);
	border:0px;
	border-top-left-radius:15px;
	border-top-right-radius:15px;
	color:rgb(256,128,0);
	
}

#lightOffModal .modal-body {
	font-family:'TheCatHasAHat';
    font-size: 16px;
    letter-spacing:8px;
	border:0px;
	padding-bottom:10px;
    /*color: rgb(254, 152, 0);*/
	}
#lightOffModal .modal-body img{
	background-color:rgb(110,54,0);

}
#lightOffModal .modal-footer{
	border:0px;
    /*color: rgb(254, 152, 0);*/
	}

#lightOffModal .modal-body button {
	width:100px;
	background-color:rgb(110,54,0);
	color:rgb(256,128,0);
	border-color:rgb(256,128,0);
	border-radius:5px;
	margin:auto;
	}
	
#lightOffModal .modal-footer button:hover {
	background-color:rgb(140,70,0);
	}
#lightOffModalLabel{
	letter-spacing:8px;
	padding-left:10px;
}

#lightOffModal .modal-footer {
		padding-top:0;
}
/* 404 */
#lostPageContainer {
   width:600px;
}

#lostPageContainer .mraveBrojimFont{
    font-size:60px;
}

#lostPageContainer p{
    font-size:24px;
}


.modal-backdrop
{
    opacity:0.85 !important;
}

.press_main.row:last-child, .aboutPageContainer .row:last-child
    {
    margin-bottom: 0px;   
    }