116 lines
		
	
	
		
			2.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			116 lines
		
	
	
		
			2.4 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
|     html {
 | |
|         scroll-behavior: smooth;
 | |
|     }
 | |
|     
 | |
|     header{
 | |
|         position: fixed;
 | |
|         margin: 0 auto;
 | |
|         left: 0;
 | |
|         top: 0;
 | |
|  
 | |
|         width: 100%;
 | |
|         z-index: 2;
 | |
|     }
 | |
| 
 | |
|     .prevHeader{
 | |
|         background-color:  var(--headerBoxColor);
 | |
|         overflow: hidden;
 | |
|     }
 | |
| 
 | |
|     .postHeader{
 | |
|         height: calc(var(--boxHeight) * 0.3);
 | |
|         background-color: var(--postHeaderBoxColor);
 | |
|         border-bottom-left-radius: 1vw;
 | |
|         border-bottom-right-radius: 1vw;
 | |
|     }
 | |
|     
 | |
|     body{
 | |
|         background-color: var(--bodyBoxColor);
 | |
|     }
 | |
| 
 | |
|     .vologdaDescription{
 | |
|         position:relative;
 | |
|         margin: auto;
 | |
|         margin-top: 10%;
 | |
| 
 | |
|         width: var(--blockSize);
 | |
| 
 | |
|         text-align: center;
 | |
| 
 | |
|         background-color:  var(--vologdaBoxColor);
 | |
|         border-radius: 1vw;
 | |
|         overflow: hidden;
 | |
|     }
 | |
| 
 | |
|     .vologdaPlace{
 | |
|         position:relative;
 | |
|         margin: auto;
 | |
| 
 | |
|         width: var(--blockSize);
 | |
|         margin-top: 6vw;
 | |
|         height: 25%;
 | |
| 
 | |
|         text-align: center;
 | |
| 
 | |
|         background-color:  var(--vologdaBoxColor);
 | |
|         border-radius: 1vw;
 | |
|         overflow: hidden;
 | |
|     }
 | |
| 
 | |
|     .vologdaMap{
 | |
|         position:relative;
 | |
|         margin: auto;
 | |
|         margin-top: var(--vologdaBoxMargin);
 | |
| 
 | |
|         width: var(--blockSize);
 | |
|         height: 30vw;
 | |
| 
 | |
|         text-align: center;
 | |
| 
 | |
|         background-color:  var(--vologdaBoxColor);
 | |
|         overflow: hidden;
 | |
| 
 | |
|         -moz-border-radius: 1vw 1vw 1vw 1vw; /* Firefox */
 | |
|         -webkit-border-radius: 1vw 1vw 1vw 1vw; /* Safari, Chrome */
 | |
|         -khtml-border-radius: 1vw 1vw 1vw 1vw; /* KHTML */
 | |
|         border-radius: 1vw 1vw 1vw 1vw; /* CSS3 */
 | |
|     }
 | |
| 
 | |
|     footer{
 | |
|         position:relative;
 | |
| 		margin: auto;
 | |
| 
 | |
|         margin-top: calc(var(--boxHeight) * 1.5);
 | |
|         width: 70%;
 | |
|     }
 | |
| 
 | |
| 
 | |
|     .prevFooter{
 | |
|         height: calc(var(--boxHeight) * 0.4);
 | |
| 
 | |
|         border-top-right-radius: 1vw;
 | |
|         border-top-left-radius: 1vw;
 | |
|         background-color:  var(--postHeaderBoxColor);
 | |
|     }
 | |
| 
 | |
|     .postFooter{
 | |
| 		border-bottom-right-radius: 1vw;
 | |
|         border-bottom-left-radius: 1vw;
 | |
|         background-color:  var(--headerBoxColor);
 | |
|      
 | |
|         text-align: center;
 | |
|         overflow: hidden;
 | |
|     }
 | |
|  
 | |
|     :root {
 | |
|         --headerBoxColor:rgb(177, 250, 250);
 | |
|         --postHeaderBoxColor:rgb(175, 238, 238);
 | |
| 
 | |
|         --bodyBoxColor:rgb(255, 255, 255);
 | |
| 
 | |
|         --vologdaBoxMargin: 6vw;
 | |
|         --blockSize: 50vw;
 | |
|         --vologdaBoxColor: rgb(177, 250, 250);
 | |
| 
 | |
|         --boxHeight: 3.1vw;
 | |
|     } | 
