@font-face {
			font-family: "Boss";
			  src: url(/fonts/franklin.ttf);
*			font-style: normal;
			font-weight: normal;
	}

	@font-face {
			font-family: "Boss";
			src: url("/fonts/gothic.ttf");
*			font-style: normal;
			font-weight: bold;
	}

	
@font-face {
  font-family: 'FontAwesome';
  font-style: normal;
  src: url('/fonts/fontawesome.ttf');
}


	
html { min-height: 100%; margin:0px; padding:0px; position: relative; }

body {COLOR: white; height: 100%;  font-family: Boss, Verdana, Arial, Helvetica; font-size: 18px; margin: 0px; padding:120px 0px 0px 0px; background-color: #65108d; box-sizing: border-box; }

a {COLOR: white; font-weight: normal; text-decoration: underline; }
a:hover {COLOR: white; font-weight: normal; text-decoration: none; }

a.sub {COLOR: #ff8080; font-size: 13px; font-weight: normal; text-decoration: none; }
a.sub:hover {COLOR: #ff0000; font-size: 13px; font-weight: normal; text-decoration: none; }

#header {

display: block;
position: fixed;
top: 0px;
left: 0px;
width: 100%;
height: 120px;
background: #65108d;
z-index: 110;  


}

#headerinner {

display: block;
position: relative;
width: 1000px;
height: 120px;
text-align: left;
margin: 0px auto;
background-image: url(/images/header.svg);
background-position: 0% 0%;
background-size: contain;
background-repeat: no-repeat;
padding: 0px 0px 0px 50px;
box-sizing: border-box;


}


#headerinner::before {

content: "";
display: inline-block;
min-height: inherit;
height: 100%;
vertical-align: middle;

}



#logo {

display: inline-block;
position: relative;
width: 250px;
height: 100px;
margin: 0px 30px 0px 0px;
vertical-align: middle;

}

#phone {

display: inline-block;
position: relative;
vertical-align: middle;
text-align: left;
font-size: 18px;
color: white;
text-decoration: none;

}

#phone::before {

display: inline-block;
position: relative;
vertical-align: middle;
font-size: 30px;
color: white;
content: '\f095';
font-family: FontAwesome;
margin: -5px 5px 0px 0px;

}

#menu {

display: inline-block;
position: relative;
text-align: left;
margin: 0px 20px 0px 0px;

}


#menu ul
{
list-style: none;
margin: 0px;
}


#menu li {

display: inline-block;
position: relative;
box-sizing: border-box;
margin: 0px 5px;
padding: 10px 10px 10px 10px;
height: 34px;
background: #419ED8;
border-radius: 20px;
box-sizing: border-box;
transition: 1s;

}

#menu li a {

color: white;
font-size: 14px;
text-decoration: none;
font-weight: bold;

}


#menu li:hover, #menu li.active {

background: white;

}

#menu li:hover a, #menu li.active a {

color: #419ED8;

}








#page {

display: block;
position: relative;
width: 100%;
max-width: 1300px;
text-align: left;
margin: 20px auto 0px auto;

}

#leftmenu {

display: inline-block;
vertical-align: top;
position: relative;
width: 200px;
text-align: left;
margin: 0px 40px 0px 0px;

}

#content {

display: inline-block;
vertical-align: top;
position: relative;
width: calc(100% - 250px);
text-align: left;
margin: 0px;
padding: 0px 0px 70px 0px;

}


a.cityblockbutton, a.cityblockbuttonopened {

display: block;
position: relative;
box-sizing: border-box;
width: 200px;
margin: 5px 0px;
padding: 3px 10px 0px 20px;
height: 34px;
background: white;
border-radius: 20px;
box-sizing: border-box;
color: #419ED8;
font-size: 14px;
text-decoration: none;
font-weight: bold;

}

a.cityblockbutton::before, a.cityblockbuttonopened::before {

  content: "";
  display: inline-block;
  min-height: inherit;
  height: 100%;
  vertical-align: middle;


}


a.cityblockbutton::after {display: block; content: ''; position: absolute; top: 15px; right: 8px; width: 16px; height: 16px; box-sizing: border-box; border: 8px solid; border-top-color:  #65108d; border-right-color: transparent; border-left-color: transparent; border-bottom-color: transparent; }

a.cityblockbuttonopened::after {display: block; content: ''; position: absolute; top: 7px; right: 8px; width: 16px; height: 16px; box-sizing: border-box; border: 8px solid; border-top-color:  transparent; border-right-color: transparent; border-left-color: transparent; border-bottom-color: #65108d; }

a.cityblockbutton span, a.cityblockbuttonopened span {

  display: inline-block;
  vertical-align: middle;
  line-height: 1   

}




#cityblock
{

display: none;
visibility: hidden;
width: 200px;
max-height: 300px;
list-style: none;
margin: 5px 0px;
background: white;
box-sizing: border-box;
padding: 5px;
border-radius: 5px;
overflow-y: auto;
overflow-x: hidden;


}


#cityblock li {

display: block;
position: relative;
margin: 5px 0px 0px 30px;
line-height: 1;
color: black;
font-size: 18px;
font-weight: bold;


}

#cityblock li.letter {

display: inline-block;
margin: 15px 0px 5px 0px;
line-height: 1;
color: white;
background: #65108d;
padding: 5px;
font-size: 18px;
font-weight: bold;


}


#cityblock li.letter:after {

content: '';
left: 30px;
bottom: 0px;
position: absolute;
display: block;
width: 130px;
height: 3px;
background: #65108d;


}



#cityblock li a {

color: black;
font-size: 14px;
text-decoration: none;
font-weight: normal;

}


#cityblock li a.active {

color: #ef7f1a;

}

#form { text-transform: none; }

#form a { 

font-size: 10px; 
line-height: 1;    
display: inline-block;
vertical-align: middle;
width: 170px;
margin: 0px 0px 0px 10px;

}



div.feedicon {

width: 100px;    
display: inline-block;
position: relative;
vertical-align: top;
margin: 0px 20px 20px 0px;
font-size: 70px;
color: #acdadd;
font-family: FontAwesome;
text-align: left;

}

div.small {

font-size: 30px;

}



div.feedtext {

width: 600px;
display: inline-block;
position: relative;
vertical-align: top;
margin: 0px 00px 20px 0px;
font-size: 16px;
color: white;
text-align: left;
padding-top: 10px;

}

div.feedtext img {

margin: 5px;
border: none;
float: right;

}

div.feedtext:after {
    content: "";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}


div.feedanswer {

font-size: 14px;

}

a.arrow {

display: block;
position: absolute;
bottom: 5px;
font-size: 70px;
color: #acdadd;
font-family: FontAwesome;
text-decoration: none;

}

#prev {

left: 0px;

}


#next {

right: 0px;

}

#maingalery {

width: 100%;
text-align: left;

}

#maingalery img {

max-height: calc(100% - 200px);
max-width: 100%;
/*width: 100%;*/
/*border-radius: 30px;*/


}





p {COLOR: white; text-align: left;  font-size: 14px; margin: 15px 0px; line-height: 1.5;}



p.j {COLOR: white; text-align: justify;  font-size: 14px; margin: 10px 5px 10px 5px; line-height: 1.5; }
p.l {COLOR: #acdadd; text-align: left;  font-size: 15px; font-weight: bold; margin: 10px 5px 10px 5px; line-height: 1.5;  }
p.c {COLOR: white; text-align: center; font-size: 15px; font-weight: normal; margin: 15px 5px 15px 5px; line-height: 1.5;  }
p.r {COLOR: white; text-align: right;  font-size: 14px; font-style: italic; margin: 10px 5px 10px 5px; line-height: 1.5; }

a.pages { COLOR: white; font-size: 10px; text-decoration: underline; font-weight: normal; }
a.pages:hover { COLOR: #808080; font-size: 10px; text-decoration: none; font-weight: normal; }

a.nav { font-size: 12px; text-decoration: none; }
a.nav:hover { font-size: 12px; text-decoration: underline; }


ul {margin: 10px 0px 0px 25px; padding: 0px 0px 0px 2px}
li { COLOR: white; text-align: left;  font-weight: normal; font-size: 16px; margin: 0px 0px 0px 15px; }


div.pages {COLOR: white; text-align: right;  font-size: 10px; margin: 2px 2px 8px 2px; font-weight: bold;}

img.section { border-style: none; border-width: 0px; border-color: white; max-width: 100%; }

img.gal { transition: 0.5s; border: 5px solid #65108d; box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.33); transform-style: preserve-3d; transform: perspective(1000px) rotate3d(0,0,0,0); z-index: 2; margin: 20px; max-width: 100%; }
img.gal:hover { box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.2); transform: perspective(400px) rotate3d(3,0,0,10deg); }


HR {

	color: white;
	background: white;
   height:           18px;
   border-width:     0px;
   padding:          0px;
   margin:           20px 0px 40px 0px;;
   width:            99%;
}



h1 {
	COLOR: white;
	font-size: 22px; 
   	margin: 20px 0px 10px 0px;
	font-weight: normal;
	text-align: center;
	

    }


   
    
h2 {
	COLOR: white;
	font-size: 20px; 
	font-weight: normal;
	margin: 20px 0px 5px 0px;
	position: relative;
	text-align: center;
	
}	



h3 {
	COLOR: white;
	font-size: 18px; 
	font-weight: bold;
   	margin: 5px 0px;
	text-align: left;
	
	}

h4 {
	COLOR: white;
	font-size: 16px; 
	font-weight: bold;
	text-align: left;
   	margin: 5px 0px;
    }

INPUT, TEXTAREA { outline:none; }




    
INPUT {

font-family: Boss, Verdana, Arial, Helvetica;
width: 200px;
height: 34px;
box-sizing: border-box;
border-radius: 20px;
border:  1px solid #acdadd;
text-align: left;
color: black;
font-size: 13px;
padding: 0px 10px;
background: white;
margin: 5px 0px;


   }

INPUT.box2 {

width: 15px;
height: 15px;
border-radius: 0px;
border: none;
padding: 0px;
margin: 5px 5px 5px 0px;

   }

   
   
INPUT[type="button"] {
  
text-align: center;
color: white;
background: #ef7f1a;
text-transform: uppercase;
transition: 1s;
cursor: pointer;

  
}

INPUT[type="button"]:hover {

background: #ef7f1a;
border: 1px solid #ef7f1a;

}  


TEXTAREA {

font-family: Boss, Verdana, Arial, Helvetica;
   
width: 200px;
height: 200px;
box-sizing: border-box;
border-radius: 20px;
border:  1px solid #acdadd;
text-align: left;
color: black;
font-size: 15px;
background: white;
margin: 5px 0px;
padding: 10px;


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

body { padding: 0px; font-size: 14px; }
        

#header {

display: block;
position: relative;
width: 100%;
height: inherit;
background: #65108d;
box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.33);

}

#headerinner {

display: block;
position: relative;
width: 100%;
height: inherit;
text-align: center;
padding: 10px 0px;
background-image: none;


}

#headerinner::before {

content: "";
display: block;
position: absolute;
height: 1px;
width: 1px;
top: 0;
left: 0;

}

#logo {

display: block;
position: relative;
max-width: 90%;
margin: 0px auto 10px auto;


}

#phone {

display: block;
text-align: center;
font-size: 15px;
color: white;
text-decoration: none;

}

#phone::before {

font-size: 20px;
margin: -3px 7px 0px 0px;

}



#menu {

display: block;
position: relative;
text-align: center;
margin: 0px auto 10px auto;

}

#menu li {

margin: 5px;
padding: 2px 10px 5px 10px;
height: 24px;
border-radius: 12px;

}


#menu li a {

font-size: 12px;

}







#page {

display: block;
position: relative;
width: 100%;
text-align: center;
margin: 20px auto;

}


#leftmenu {

display: block;
max-width: 200px;
width: 100%;
text-align: center;
margin: 0px auto 20px auto;

}

#content {

display: block;
width: 90%;
max-width: 750px;
text-align: left;
margin: 0px auto;
padding: 0px 5px 70px 5px;
box-sizing: border-box;

}

a.cityblockbutton, a.cityblockbuttonopened {

max-width: 200px;
width: 100%;

}



#main {

width: 100%;
text-align: center;

}

#mainleft, #mainright {

max-width: 300px;
min-width: 150px;
width: 40%;
width: calc(50% - 25px);
text-align: center;
margin: 5px;

}


#main div.balloon {
    
width: 100%;
height: inherit;
padding: 100px 0px;
font-size: 12px;
background-size: contain;

}    


#main div.fish {
    
max-width: 200px;
width: 100%;
height: inherit;
padding-top: 60%;
background-size: contain;

}  

#main a.mbutton {

height: 50px;
margin: 3px;
padding-top: 20px;
font-size: 15px;

}

#main a.mbutton1, #main a.mbutton2, #main a.mbutton3, #main a.mbutton4 {


max-width: 120px;
width: 100%;
margin: 5px;
border-radius: 25px;


}


#main div.icon {

font-size: 30px;
margin: 10px;

}

#main div.icon span.legend {

font-size: 15px;
margin: 5px;

}

#main div.icon span.counter {

font-size: 20px;
margin: 5px;

}


div.feedicon {

width: 50px;    
display: inline-block;
position: relative;
vertical-align: top;
margin: 0px 10px 20px 0px;
font-size: 40px;
color: #acdadd;
font-family: FontAwesome;
text-align: left;

}

div.small {

font-size: 30px;

}



div.feedtext {

width: calc(100% - 70px);
margin: 0px 0px 10px 0px;
font-size: 14px;
padding-top: 5px;

}


div.feedicon img {

width: 100%;    
    
}    

div.feedline {

display: block;
height: 20px;
width: 100%;
clear: both;

}    

div.feedanswer {
 
font-size: 12px;

}






}