﻿body
{
    font-family: 'Noto Sans', 'Segoe UI', sans-serif;
    font-size:1em;
    line-height:1.5em;
}
a:link, a:visited
{
    text-decoration: none;
    color: #fff;
}
a:hover, a:focus
{
    color: #f0f0f0;
}
h1, h2, h3, h4, h5, h6
{
    margin: 0 0 .5em;
    font-weight: 300;
    text-transform: none;
}
h3
{
    text-align:center;
    font-size:2.5em;
    padding:1em 0 .5em; 
    font-family: "Playfair Display",serif; 
}
p.columns
{
  -webkit-columns: 2 200px;
     -moz-columns: 2 200px;
          columns: 2 200px;
  -webkit-column-gap: 2em;
     -moz-column-gap: 2em;
          column-gap: 2em;
}
#wrapper
{
   	display: block;  /*Fallback*/
    display: -webkit-box;   
    display: -moz-box;     
    display: -ms-flexbox; 
    display: -webkit-flex;
    display: flex;

    min-height: 100vh;
        
    -webkit-box-orient: vertical;
    -moz-box-orient:vertical;
    -webkit-flex-direction: column; /* Safari */
    -ms-flex-direction:column;
    flex-direction: column;
    
    overflow: hidden;
    max-width: 1600px;
    margin: 0 auto;
}
header 
{
	-webkit-flex-shrink: 0;
	-ms-negative-flex:0;
    flex-shrink: 0;
    height:550px;
    text-align: center;
    color:#fff;
}
main
{
	-ms-flex: 1 0 auto;
	-webkit-flex: 1 0 auto;
    flex: 1 0 auto;
}
.top-bg
{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    text-align: center;
    overflow: hidden;
    height: 550px;
}
.top-bg img
{
    position: absolute;
    top:0;
    right: -100%;
    bottom:0%;
    left:-100%;
    margin: auto;
}
/* nav */
#langnav
{
    padding:1em;
    float:right;
    text-align:right;
    width:100%; /*407px;*/
    height:67px;
    background:transparent url('../img/nav_bg.png') no-repeat right top;
    font-size:.8em;
}
#langnav li
{
    display:inline-block;
    padding:0 .75em;
}
#langnav li:not(:first-of-type)
{
    border-left:solid 1px #fff;
}
#langnav li a
{
    color:#fff;
    text-transform:uppercase;
    text-decoration:underline;
}
#langnav li a:hover
{
    padding-bottom:10px;
}
#langnav li a.active
{
    font-weight:700;
    text-decoration:none;
    cursor:default;
}
header .cols-wrapper
{
    clear:right;
}
header h1
{
    font-size: 10em;
    font-weight:100;
    line-height: normal;
    color:#f0f0f0;
    margin: 1em 0 0;
    word-spacing: 1.25em;
    letter-spacing: .05em;
    font-family: 'Bad Script', 'Ruthie', 'Marck Script', 'Times New Roman', cursive;
}
@media (min-width:901px)
{
	html[lang=ru-RU] header h1
	{
	    font-size: 8em;
	    letter-spacing: normal;
	    word-spacing: 1.75em;
	}
}
header h2,
.header-mark
{
    width:12em;
    float:right;
    margin-right: 12.5em;
}
header h2
{
    height:12em;
    border-top:solid 1px #d53838;
    padding-top:2em;
}

@media (max-width:900px)
{
    .top-bg img
    {
        right: -150%;
    }
    header h1
    {
        font-size: 6em;
        line-height:.75em;
        word-spacing: normal;
        margin-top:12%;
        display:block;
        float:left;
        width:50%;
    }
    header h1 span
    {
        display:block;
    }
    .h2-container
    {
    	width:100%;
	}
	header h2,
	.header-mark
	{
    	margin-right: 0;
    	width: 100%;
	}
}
@media (max-width:468px)
{
    #langnav,
    #langnav + div
    {
    	background-color:#000;
	}
    .top-bg
    {
    	height: 400px;
    	top:150px;
    }
    .top-bg img
    {
        right: -200%;
    	left: -180%;
    	height: 400px;
    }
    header h1
    {
    	width:100%;
    	font-size:5em;
    	margin-top: 0;
    	padding: .25em 0 .4em;
    }
	header h1 span
	{
		display:inline;
	}
	.h2-container.cols1x1  > .col1
	{
    	width:100%;
    	padding:0;
	}
	.h2-container.cols1x1  > .col2
	{
		display:none;
	}
	header h2
	{
    	height: auto;
	    padding: 0;
/*	    width: 50%;*/
	    text-align: center;
	    float: none;
	    margin: 0 auto;
    }
}
.top-divider
{
    background:url('../img/line.png') repeat-y center top;
    height:1em;
    width:100%;
    margin-top:-1em;
    opacity:.9;
}
.top-divider > div
{
    position: absolute;
    width: 100%;
    margin-top: -1.75em;
    left:0;
}
.header-mark
{
    height:64px;
    background:url('../img/header_bg.png') no-repeat center bottom;
}
/*framework*/
/***********/
.cols-wrapper
{
/*    display:inline;*/
}
@media (max-width:1000px)
{
    .cols-wrapper
    {
        max-width:100%;
    }
}
.cols1x1,
.cols1x2,
.cols2x1,
.cols1x1x1,
.cols1x1x1x1
{
    display: block;  /*Fallback*/
    display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
    display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
    display: -ms-flexbox;      /* TWEENER - IE 10 */
    display: -webkit-flex;     /* NEW - Chrome, Safari */
    display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    
    -webkit-box-orient: horizontal;
    -moz-box-orient:horizontal;
    -webkit-flex-direction: row; /* Safari */
    -ms-flex-direction:row;
    flex-direction: row;
    
    -webkit-flex-wrap:nowrap;
    -ms-flex-wrap:nowrap;
    flex-wrap:nowrap;
       
    padding:0;
}
.cols1x1 > *,
.cols1x2 > *,
.cols2x1 > *,
.cols1x1x1 > *,
.cols1x1x1x1 > *
{
    margin:0;
    padding:1em 0;
}
.col1
{
    padding-right:2em;
}
.col1 > .col1,
.col2 > .col1
{
    padding-right:.15em;
}
.cols1x1 > .col2,
.cols1x2 > .col2
{
    padding-left:2em;
}
.col1 > .col2,
.col2 > .col2
{
    padding-left:.15em;
}
.cols1x1 > .col1,
.cols1x1 > .col2
{
    width:50%;
}
.cols1x2 > .col2,
.cols2x1 > .col1
{
    width:66%;
}
.cols1x1x1 > *,
.cols1x2 > .col1,
.cols2x1 > .col2
{
    width:33%;
}
.cols1x1x1 > .col3
{
    padding-left:2em;
}
.cols1x1x1x1 > *
{
    width:25%;
}
.clearfix:before,
.clearfix:after
{
    content:" ";
    display:table;
}
.clearfix:after
{
    clear:both;
}
.clearfix
{
    *zoom:1;
}
/*********************/

figure
{
    max-height:12em;
    margin:.5em 0;
    overflow:hidden;
}
figure > img
{
    width:100%;
}
figure.framed
{
    background:url('../img/fig.png') no-repeat 0 0;
    background-size:100% 100%;
    max-height: none;
    padding:1em;
}
/* sections */
section
{
	width: 100%;
	min-height: 30em;
}
.sub-section
{
    padding:1em 0 3em;
    background-color:#f0f0f0;
}
@media (max-width:468px)
{
	.sub-section.first .section-wrapper
	{
		-webkit-box-orient: vertical-reverse;
	    -moz-box-orient: vertical-reverse;
	    -webkit-flex-direction: column-reverse;
	    -ms-flex-direction: column-reverse;
	    flex-direction: column-reverse
	}
	.sub-section.first .section-wrapper .col1,
	.sub-section.first .section-wrapper .col2
	{
		width:100%;
		padding: 1em 2em 0;
		box-sizing:border-box;
	}
}
.sub-section.second
{
    border-top:solid 1px #ccc;
    background-color:#fff;
}
.sub-section.second p
{
    text-align:center;
}
.lead-in h3
{
    text-align:center;
    font-size:2.5em;
    line-height:1em;
    padding:1em 0 .25em;
}
.lead-in p
{
    text-align:center;
    margin-bottom:2em;
    font-size: .88em;
}
@media (min-width:901px)
{
	html[lang=ru-RU] .sub-section .lead-in p
	{
	    font-size: .96em;
	    margin: 0 2em 2em;
	}
}
@media (max-width:900px)
{
	.lead-in
	{
		padding-left:2em;
	}

	.lead-in p
	{
		text-align:justify;
	}
}
@media (max-width:468px)
{
	.lead-in h3
	{
		padding:0 0 .25em;
	}
}
.gallery-container
{
    padding:1em;
    border: solid 1px #be2120;
    margin-bottom:3em;
}
@media (max-width:1000px)
{
	.gallery-container
	{
	    padding:1em .5em;
	}
}
.gallery-container.video
{
    text-align:center;
}
article
{
	width:100%;
	min-height:30em;
}
.section-wrapper
{
    margin:0 auto;
    max-width:960px;
}
.cols-wrapper article p
{
    padding:1em;
}
footer
{
	-webkit-flex-shrink: 0;
	-ms-negative-flex:0;
    flex-shrink: 0;
    background-color:#1a1a1a;
    border-top: solid 1px #be2120;
    color:#fff;
    min-height:400px;
    padding:4em;
}
footer .lead-in h3,
footer .lead-in p
{
    text-align: left;
}
.footer-content div
{
    padding:1em 0;
}
.footer-content h6
{
    color:#fff;
    font-size:2em;
    width:auto;
}
.footer-content .copy
{
    font-size:.85em;
    height:10em;
}
@media (max-width:468px)
{
	footer
	{
    	padding: 1em;
    }
    
	footer .section-wrapper
	{
		-webkit-box-orient: vertical;
	    -moz-box-orient: vertical;
	    -webkit-flex-direction: column;
	    -ms-flex-direction: column;
	    flex-direction: column
	}
	footer .section-wrapper .col1,
	footer .section-wrapper .col2
	{
		width:100%;
		padding:0 2em;
		box-sizing:border-box;
		text-align:center;
	}
footer .lead-in h3,
footer .lead-in p
{
    text-align: center;
    margin-bottom:1em;
}


}
