/* A Free Design by Srdjan Karanovic  */



*
{
  margin: auto  auto;               /*bitan deo za centriranje elemenata na bilo kom ekranu*/

}



body {
	background:  url(images/pozadina4.jpg) ;
	// background: orange;	 rgb(210,118,24);
	text-align: left;
	font: 12px Arial, Helvetica, sans-serif;
	font-size: 18px;
      /*	font-weight: bold;  */                          /* opcija za podebljanje slova*/
	color:  rgb(138,239,181); 
	margin:0px;
/*  http://westciv.com/tools/gradients/index.html   */

}




#naslovTop {

	background: rgba(228,111,29,0.3); 	black;	url(images/pozadina7.jpg);
	width: 900px;
	height: 100px;
	margin:auto auto;	
	margin-top: 20px;
	margin-bottom: 20px;
	//padding: 10px;

	border: solid rgb(218,100,29) 3px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

box-shadow: 0px 5px 10px  black;  rgb(188,51,19);
}

#naslovTop h1 {
	width: 100%;
	font-family:  'Poiret One', cursive;  'Oswald', sans-serif;   'Indie Flower', cursive; 	'Montserrat', sans-serif;
	font-size:45px;
	color: white;
	margin-top:15px;
	text-shadow: 0px 5px 15px green;
}


#naslovTop h2 {
	width: 100%;
	text-align: center;
	font-family:  'Poiret One', cursive;  'Oswald', sans-serif;   'Indie Flower', cursive; 	'Montserrat', sans-serif;
	font-size:20px;
	color: white;
	margin-top:5px;
	cursor: pointer;

	-webkit-transition:	150ms;
  	-moz-transition:	150ms;
   	-ms-transition:	150ms;
   	-o-transition:	150ms;
    	transition:    	150ms;
}



#naslovTop h2:hover {
	color: rgb(238,131,39);	orange;
	text-shadow: 0px 3px 5px black;
}




#naslovTopGuitarNeck {
	//display: none;
	background: rgba(228,111,29,0.3); 	black;
	//width: 900px;
	//height: 100px;
	margin:auto auto;	
	margin-top: 20px;
	margin-bottom: 20px;
	//padding: 10px;
	cursor: pointer;

	border: solid rgb(218,100,29) 3px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

box-shadow: 0px 5px 10px  black;  rgb(188,51,19);
}


#naslovTopGuitarNeck1 {
	//background: rgba(228,111,29,0.3); 	black;
	width: 0px;
	height: 0px;
	overflow: hidden;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-right:30px; 
	float:right;

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	border-right: 0px;
	border-left:   0px;
	
	opacity: 0;

}



.textcontent1                       /* Beli text  */
{
font-family:  'Poiret One', cursive;   'Oswald', sans-serif;	'Montserrat', sans-serif;	'Indie Flower', cursive; 	  		
font-size:17px;
font-style: italic;
color: white;
margin-top:15px;
padding: 20px;
text-shadow: 0px 2px 3px black;
margin-left:20px;
//font-family: arial; 'Ubuntu', sans-serif;
font-weight: normal;  
text-align:left;                    /*podesava text levo desno ili u centru elementa*/
word-spacing:2px;               /*povecava ili smanjuje distancu izmedju reci*/
letter-spacing:1px;              /*povecava il smanjuje distancu izmedju slova*/
text-transform: none;          /*sluzi za kontrolisanje slova i moze imati vrednosti: NONE, CAPITALIZE-podesava da prvo slovo svake reci bude veliko, UPPERCASE- podesava da sva slova budu velika, LOWERCASE-podesava da sva slova budu mala. */
text-indent:60px;                /*uvlaci prvu liniju texta*/
line-height:15px;                 /*podesava distancu izmedju linija texta*/
text-direction:ltr;                /*podesava smer pisanja slova u textu. Moze imati vrednosti ltr(left to right) ili   rtl (right to left)  */
}







#sadrzaj1{
	
	background: rgba(228,111,29,0.3); 	black;
	width: 1200px;
	height: 600px;
	margin:auto auto;	
	margin-top: 120px;
	margin-bottom: 120px;
	//padding: 10px;

	border: solid rgb(218,100,29) 3px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

box-shadow: 0px 5px 10px   rgb(188,51,19);

}



#leviMeni {
	background: url(images/pozadina7.jpg);	 rgb(228,111,29); 	black;
	width: 250px;
	height: 350px;
	margin-top: 20px;
	margin-bottom: 20px;
	margin-left: 30px;
	//padding: 10px;
	float: left;

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

 box-shadow: 0px 3px 5px   black;	rgb(188,51,19);
	
}


#leviMeni a{
	text-decoration: none;
	color: white;
	font-family:   'Oswald', sans-serif;  'Poiret One', cursive;   'Indie Flower', cursive; 	'Montserrat', sans-serif;
	font-size:15px;
	margin:25px;
	text-shadow: 0px 2px 4px black;

	-webkit-transition:	150ms;
  	-moz-transition:	150ms;
   	-ms-transition:	150ms;
   	-o-transition:	150ms;
    	transition:    	150ms;
}



#leviMeni a:hover{
	text-decoration: none;
	color:	white;	rgba(258,151,59,1);	orange;
	font-family:   'Oswald', sans-serif;  'Poiret One', cursive;   'Indie Flower', cursive; 	'Montserrat', sans-serif;
	font-size:20px;
	margin:15px;
	cursor: pointer;
}





.sadrzajStranice1 {
	display: none;
	background: url(images/pozadina7.jpg);	 rgb(228,111,29); 	black;
	width: 850px;
	height: 550px;
	float:right:
	margin:auto auto;	
	margin-top: 20px;
	margin-bottom: 20px;
	//padding: 10px;
	overflow: hidden;
	
	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

 box-shadow: 0px 3px 5px   black;
}



.sadrzajStranice2 {
	background:  rgba(228,111,29,0.5); 	black;
	width: 850px;
	height: 550px;
	float:right:
	margin:auto auto;	
	margin-top: 20px;
	margin-bottom: 20px;
	//padding: 10px;
	overflow: hidden;
	

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

	-webkit-transition:	550ms;
  	-moz-transition:	550ms;
   	-ms-transition:	550ms;
   	-o-transition:	550ms;
    	transition:    	550ms;

 box-shadow: 0px 3px 5px   black;
}


.sadrzajStranice2:hover {
	background:  rgba(188,91,29,1);
}



.sadrzaj {
	background:  rgba(228,111,29,0.1);
	width:98%;
	height: 98%; 
	margin:10px;
	overflow-y:scroll;

	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;

	-webkit-transition:	1250ms;
  	-moz-transition:	1250ms;
   	-ms-transition:	1250ms;
   	-o-transition:	1250ms;
    	transition:    	1250ms;


	box-shadow: 0px 0px 0px 	rgb(228,111,29);
}


.sadrzaj:hover {
	//background:  rgba(188,91,29,0.6);	 rgba(218,97,12,1);
	width: 98%;
	height: 98%; 
	margin:10px;
	overflow-y:scroll;
	
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	//box-shadow: -5px -5px 25px 	rgb(228,111,29);
}


.sadrzaj h1{
	font-family:  'Poiret One', cursive;  'Oswald', sans-serif;   'Indie Flower', cursive; 	'Montserrat', sans-serif;
	font-size:30px;
	color: white;
	margin-top:10px;
}





#mojaForma {
	background: rgba(2,2,2,0.3);
	width:90%;
	height: 400px;
	padding: 20px;

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

	z-index:20;

box-shadow: 0px 3px 5px  black;  rgb(188,51,19);

}


#sadrzajIspodForme {
	background: rgba(2,2,2,0.3);
	width:90%;
	height: 400px;
	padding: 20px;
	margin-top: 50px;

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

box-shadow: 0px 3px 5px  black;  rgb(188,51,19);

}


.label {

	font-family:   'Poiret One', cursive;	'Montserrat', sans-serif;	 'Oswald', sans-serif; 	  'Indie Flower', cursive;  
	font-size:20px;
	color: white;

}

.input{
	background: rgba(10,10,10,0.9);
	width:80%;
	height: 30px;
	font-family:   'Poiret One', cursive;
	text-indent:20px;
	font-size: 15px;
	font-weight: 600;
	color: white;

	border: solid rgba(178,80,29,0.7) 1px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	border-right: 0px;
	border-left:   0px;
}

.messageInput{
	background: rgba(10,10,10,0.9);
	width:80%;
	height: 150px;
	font-family:   'Poiret One', cursive;
	text-indent:20px;
	font-size: 15px;
	font-weight: 600;
	color: white;
	overflow-y: hidden;

	border: solid rgba(178,80,29,0.7) 1px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	border-right: 0px;
	border-left:   0px;
}

.messageInput:hover{
	overflow-y: scroll;
}



.posalji {
	background: rgba(0,0,0,0.95);	 rgba(178,80,29,0.5);	rgba(5,5,5,0.9);
	width: 30%;
	height: 30px;
	color: rgb(178,80,29);
	margin: auto auto;
	margin-left: 110px;
	font-family:   'Poiret One', cursive;
	text-align: center;
	font-size: 17px;
	font-weight: 600;
	padding-top: 3px;

	border: solid rgba(228,120,39,0.8) 1px;
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	border-right: 0px;
	border-left:   0px;
	
	-webkit-transition:	550ms;
  	-moz-transition:	550ms;
   	-ms-transition:	550ms;
   	-o-transition:	550ms;
    	transition:    	550ms;
	
}

.posalji:hover {
	background:  rgba(0,0,0,0.3);	 rgba(218,100,29,1);
	height: 35px;
	cursor: pointer;
	color: white;
	font-size: 20px;

	border: solid black 1px;	rgba(228,120,39,1)
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;	
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
	
	border-right: 0px;
	border-left:   0px;
	
}


.videoDiv {
	background: rgba(2,2,2,0.3);
	width:90%;
	height: 200px;
	padding: 20px;
	margin-top: 50px;

	border: solid rgb(218,100,29) 1px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;

box-shadow: 0px 3px 5px  black;  rgb(188,51,19);

	-webkit-transition:	700ms;
  	-moz-transition:	700ms;
   	-ms-transition:	700ms;
   	-o-transition:	700ms;
    	transition:    	700ms;

}


.videoDiv:hover {
	height: 400px;
}

#potvrda{	
	background: rgba(10,10,10,0.8);
	
	width:0px;    80%; 
	height:0px;   600px;	
	margin: auto auto;
	margin-top:0px;	
	overflow:hidden;	

	border: solid black 2px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;	
	border-bottom-right-radius: 10px;
	border-bottom-left-radius: 10px;
	
	border-right: 0px;
	border-left:   0px;
	z-index: -20;
	opacity:0;

	box-shadow: 0px 5px 10px   black;
}

/*------------------------------------ deo za moderan SCROLLBAR --------------------------------*/

::-webkit-scrollbar {
    width: 10px;
    height: 7px;
}


::-webkit-scrollbar-track {
	 background: black; 
    -webkit-box-shadow: inset 0 0 1px   rgb(238,131,39); 
	 border: double gray 1px;
   	 border-radius: 5px;
}
 
::-webkit-scrollbar-thumb {
	background:  rgb(238,131,39);
	border: double black 1px;
   	border-radius: 5px;	
  	-webkit-box-shadow: inset 0 0 5px black; 
}


/*--------------------------------------------------------------------------------------------------*/