html, body {
   height:100%;
    font: 100% cambria, helvetica, arial, sans-serif;
    margin: 0;
    padding: 0;
}

#container {        
 background: #fff;    
 margin: auto;
    width: 840px; 
	min-height:840px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
  box-shadow:
   0 1px 4px rgba(0, 0, 0, .3),
   -35px 0 20px -23px rgba(0, 0, 0, .8),
   35px 0 20px -23px rgba(0, 0, 0, .8),
   0 0 40px rgba(0, 0, 0, .1) inset;
}


.scrollTop{
	background:url('images/arrows5.png') 0 0 no-repeat;
	width:50px;
	height:70px;
	bottom:10px;
	left:10%;
}
.scrollTop:hover{ background-position:0 -76px; }




.div1{    
    width: 20%;
	box-sizing: border-box;
  height: inherit;
   background:#fff;
    float: left;

}





/*Часы*/
#clock {
  font-family: cambria;
  font-size: 28px;
  font-weight: bold;
  color: #081d32;
  float:left;
  margin-left: 18%;
  margin:42px auto 35px 25px;
}

/*Календарь*/
#cal {
  margin-top:25px;	
}



.div2{    
    width: 80%;
	 box-sizing: border-box;

	 font-family: calibri;
    min-height: 840px;
    background: #fff;   
    margin-left: 20%;
	padding:5px 20px 5px 20px; 
}



.div2 h1 { 
 font-family: cambria;
  font-size: 28px;
  font-weight: bold;
  color: #081d32;
  border-bottom: 2px solid #42688d;
  padding-bottom: 5px;
}



.div2 p { 
text-align:justify;
}


.div2 a { 
	 font-family: calibri;
   color: #081d32;
	text-decoration: underline;
    font-weight: normal;
    -moz-transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out; 
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;
}

.div2 a:hover { 
  color: #42688d;
}

.footer{
	 
    clear: left;
	 color: #6f6f6f;
	 text-align:center;
    background: #1f2e3d;
    height: 50px;
	padding:20px; 
	 box-shadow:
   0 1px 4px rgba(0, 0, 0, .3),
   -35px 0 20px -23px rgba(0, 0, 0, .8),
   35px 0 20px -23px rgba(0, 0, 0, .8),
   0 0 40px rgba(0, 0, 0, .1) inset;
}

#header {
text-align:center;
background-image: url("images/111.jpg");
     margin: auto;
display: block;
width: 840px;
height: 207.5px;
-moz-transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out; 
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;
		 box-shadow:
   0 1px 4px rgba(0, 0, 0, .3),
   -35px 0 20px -23px rgba(0, 0, 0, .8),
   35px 0 20px -23px rgba(0, 0, 0, .8),
   0 0 40px rgba(0, 0, 0, .1) inset;
	}

#header:hover {
text-align:center;
background-image: url("images/333.jpg");
    margin: auto;
display: block;
width: 840px;
height: 207.5px;
-moz-transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out; 
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;}


a {
    color: #111;
    font-weight: bold;
    text-decoration: none;
    -moz-transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out; 
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;
}

a:hover {
    color: #555;    
}




/*============================*/
/* Main Navigation
/*============================*/
#nav {    
 font-family: cambria;       
	top: 207.5px; 
 margin: 0 auto 0 auto; 
	height: 50px;
    line-height: 50px;            
    width: 840px;
	 box-shadow:
   0 1px 4px rgba(0, 0, 0, .3),
   -45px 0 20px -23px rgba(0, 0, 0, .8),
   45px 0 20px -23px rgba(0, 0, 0, .8),
   0 0 40px rgba(0, 0, 0, .1) inset;
	
}

#nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#nav li {    
    background: #333;
    background-image: -o-linear-gradient(bottom, #09253a 0%, #11516f 100%);
    background-image: -moz-linear-gradient(bottom, #09253a 0%, #11516f 100%);
    background-image: -webkit-linear-gradient(bottom, #09253a 0%, #11516f 100%);
    background-image: -ms-linear-gradient(bottom, #09253a 0%, #11516f 100%);    
    background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0, #09253a),color-stop(1, #11516f));    
    background-image: linear-gradient(bottom, #09253a 0%, #11516f 100%);
    float: left;
    position: relative;
    width: 20%;    
}



#nav a {                
    border-right: 1px solid #07182a;
    border-left: 1px solid #175b77;
    color: #fff;
    display: block;
    font-size: 14px;
    height: 50px;
    overflow: hidden;
    text-align: center;
    text-shadow: 0 -1px 0 #000;    
    -webkit-box-shadow: inset 0 0 10px transparent;
    -moz-box-shadow: inset 0 0 10px transparent;
}

#nav a:after {
    background: rgba(255,255,255,.07);
    content: "";
    height: 25px;
    left: 0;
    position: absolute;
    width: 100%;
}

#nav li:hover > a {
    background: #081d32;
    border-left-color: #051422;
    color: #fff;
    text-shadow: 0 1px 0 #000;
    -webkit-box-shadow: inset 0 0 10px #111;
    -moz-box-shadow: inset 0 0 10px #111;
    box-shadow: inset 0 0 10px #111;
}
#nav span {
    position: relative;    
}

#nav a:active span {
    color: #dbf7ff;
    position: relative;
    top: 1px;
}

#nav li:first-child a {
    border-left: none;    
}

#nav li:last-child a {
    border-right: none;    
}

.dropdown > a span:after {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #ccc;
    content: "";
    right: -13px;
    position: absolute;
    top: 3px;
}

.dropdown:hover > a span:after {
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    content: "";
    right: -15px;
    position: absolute;
    top: 6px;
}

/*============================*/
/* Sub Navigation
/*============================*/
#nav ul ul {
    opacity: 0;
    position: absolute;
    top: 50px;
    visibility: hidden;
    width: 0;
    -moz-transition: all 300ms ease-out;
    -webkit-transition: all 300ms ease-out; 
    -ms-transition: all 300ms ease-out; 
    transition: all 300ms ease-out;
}

#nav ul li:hover ul {
    opacity: 1;
    visibility: visible;
    width: 100%;
}

#nav ul ul li {
    background: #d5e5ee;
    float: none;    
    line-height: 0;
    width: 100%;            
}

#nav ul ul li:nth-child(odd) {
    background: #ccdbe4;    
}

#nav ul ul li:first-child, #nav ul ul li:first-child a { 
    -webkit-border-radius: 0; 
    -moz-border-radius: 0; 
    border-radius: 0; 
}
#nav ul ul li:last-child, #nav ul ul li:last-child a { 
    -webkit-border-radius: 0 0 3px 3px; 
    -moz-border-radius: 0 0 3px 3px; 
    border-radius: 0 0 3px 3px; 
}

#nav ul ul li a {
    border-right: none;
    border-left: none;
    border-top: 1px solid #fff;
    color: #121720;
    font-size: 12px;
    height: 36px;
    line-height: 36px;
    padding: 0 0 0 15px;
    text-align: left;
        text-shadow: 0 -1px 0 #eee;
}

#nav ul li ul li a:after {
    background: rgba(0,0,0,.02);
    content: "";
    height: 18px;
    left: 0;
    position: absolute;
    top: 19px;
    width: 100%;
}

#nav ul ul li a:hover {
    background: #f8f8f8;
    color: #121720;
	    text-shadow: 0 -1px 0 #eee;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
}

#nav ul ul a:active span {
    color: #111;
    position: relative;
    top: 1px;
}