
/* -- 
PALETTE:
Blue: #253370
Red: #e21d38

-- */




body {
	font: 80%/1.4 Arial, Helvetica, sans-serif;
	background: #42413C;
	margin: 0;
	padding: 0;
	color: #000;
}

/* ~~ Element/tag selectors ~~ */
ul, ol, dl {
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin: 0 15px 15px 15px;	
	color: #333;
	}
h1 {color: #253370;}
	
#heading {margin: 20px 30px 10px 10px; font-size: 180%; position: absolute; top: 110px; left: 20px; color: #253370; }	
#logo {background: url(../images/NPP_Logo.png) left top no-repeat; display: block; 
       position: absolute; width: 300px; height: 101px; left: 20px; top: 20px; z-index: 10000;}	

a img {
	border: none;
}

a:link {
	color: #253370;
	text-decoration: underline; 
	}
a:visited {
	color: #253370;
	text-decoration: underline;
}
a:hover, a:active, a:focus {
	text-decoration: none;
}


/* -- layout elments -- */
 
.content {

	padding: 10px 0;
}


.container {
	width: 100%;
	max-width: 960px;
	background: #FFF url(../images/bg.jpg);
	margin: 5px auto;
	-webkit-border-radius: 5px 5px 5px 5px;
	border-radius: 5px 5px 5px 5px;
	-webkit-box-shadow: 5px 5px 5px 0 #000;
	box-shadow: 5px 5px 5px 0 #000;}


#header-block 	{ display:block; position: relative; max-height: 100px; height: 100px;}
#menu-block 	{ display:block; position: relative; max-height: 100px; height: 100px;
                  background: url(../images/NPP_menubg.png) right bottom no-repeat;
 				  border-bottom: solid 1px #253370;
					-webkit-box-shadow: 0 5px 5px 0 #999;
					box-shadow: 0 5px 5px 0 #999;}


/* -- navigational elements -- */
nav#topmenu {}
nav#topmenu ul {
  display: block;
  clear: both;
  width: 100%;
  position: absolute;
  margin: 55px 0 0 0;}
nav#topmenu ul li {float: right; width: auto; list-style: none; padding: 0; margin: 0;  position:relative;}
nav#topmenu ul li a {font-family: Arial, Helvetica, Sans Sans-Serif; display:block; width: auto; 
                     height: auto; font-size: medium; text-decoration: none; text-align: center; 
					 padding: 3px 25px 3px 25px; margin: 0 10px 0 0; color: #fff; background: #253370; 
					 border: solid 1px #253370;
					 -webkit-border-radius: 5px 5px 5px 5px;
	                 border-radius: 5px 5px 5px 5px;
					 }
nav#topmenu ul li a:hover {background-color: #253370;
					       border: solid 1px #3C51B5;}

nav#topmenu ul li ul {display:none;}
nav#topmenu ul li:hover ul {display:block; width: auto; position:absolute; margin:0 0 0 -40px; left: 30px; z-index: 30000;}
nav#topmenu ul li:hover ul li {display:block; float: none; width:auto; margin: 3px 0 0 10px; }
nav#topmenu ul li:hover ul li a {
					 border: solid 1px #3C51B5;
					 }
nav#topmenu ul li:hover ul li a:hover {background-color: #3C51B5;
					       border: solid 1px #3C51B5;}
			
.menuActive {background-color: #3C51B5 !Important;
			 border: solid 1px #3C51B5 !Important;}

nav#topmenu select {font-size: 200%; color: #1992d1; 
				appearance:none;
				-moz-appearance:none;
				-webkit-appearance: none; background:#FFF; margin: 50px 0 0 0;}
nav#topmenu select {display: none;}

#home-block 	{}
#home-block img {width: 100%;}

#homepage-news {width: 100%;}
#homepage-news div {width: 210px; display: inline-table; }
#homepage-news div img {margin: 0 20px 0 30px;}

#content-block 	{ display:block; position: relative; min-height: 300px; margin: 0; padding: 50px;
					background: #fff url(../images/NPP_bodybg.png) right  bottom no-repeat;}
#footer-block 	{ display:block; position: relative; min-height: 250px; margin: 0; 
					background: url(../images/NPP_footerbg.png) left top no-repeat; border-top: solid 1px #253370;}
#footer {width: 100%;}
					
#contact 		{ display: block; float: left; padding: 30px 20px 20px 40px }
#footer #contact ul {width: 100%; }
#footer #contact ul li {white-space:nowrap; list-style: none; padding: 0; margin: 0; color: #fff; font-weight: bold;}
#footer #contact ul li a { color: #fff; font-weight: bold;}

#extra 			{ display: block; float: right; padding: 30px 40px 20px 40px }
#footer #extra ul {width: 100%; }
#footer #extra ul li {white-space:nowrap; list-style: none; padding: 0; margin: 0; color: #253370; font-weight: bold;}
#footer #extra ul li a { color: #253370; font-weight: bold; text-decoration:none;}



#icon-address,
#icon-phone,
#icon-email {
	background-image: url(../images/icons.jpg);
	background-repeat: no-repeat;
	height: 30px;
	width: 30px;
	display: block;
	float: left;
	margin: 0 5px 0 5px;}

#icon-address {	background-position: -108px -75px;}
#icon-phone   {	background-position: -9px -75px;}
#icon-email   {	background-position: -42px -75px;}

/* Media */

    @media (max-width: 735px) {
  	#extra 	{display: none !Important;}
	}	
	
    @media (max-width: 825px) {
  	#heading {display: none !Important;}
	}	

	
    @media (max-width: 480px) {
  	nav#topmenu 	{display: inline-block; width: 100%;  background-color: transparent;}
  	nav#topmenu ul  { display: none; }
  	nav#topmenu select { display: inline-block; width: 100%; color: #000;  font-size: 1.9em;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;}
	}	
	
