@charset "utf-8"; 

@font-face 		{
				font-family: Days; /* Гарнитура шрифта */
				src: url(Fonts/Days.otf); /* Для IE5-8 */}
@font-face		{font-family: Myriad Pro; /* Гарнитура шрифта */
				src: url(Fonts/MyriadPro-Regular.otf); /* Для IE5-8 */
								}
 
/* Стандартные стили для ссылок*/
							   
/* По умолчанию, первая шапка*/

h1			{									
				text-decoration:none;
				font-family:Days;
				font-size:1.5vw;
				display:inline;
				font-weight: normal;
				color:black;
				}  
				
h2			{									
				text-decoration:none;
				font-family:Days;
				font-size:1.5vw;
				display:inline;
				font-weight: normal;
				color:black;
				}  
h3			{									
				text-decoration:none;
				font-family:Days;
				font-size:1em;
				display:inline;
				font-weight: normal;
				color:black;
				} 


a			{	
				
				color:#000000;
				text-decoration:none;
				font-family:Myriad Pro,Calibri;
				font-size:1em;
				transition: 0.5s;
				font-weight:400;
				}  		
				
				a:hover		{
				font-size:1em;
				color: #3db3e3;	  
				text-decoration:none;
				font-family:Myriad Pro, Calibri;
				}
				
a.blue			{	
				color:#3db3e3;
				text-decoration:none;				
				font-family:Myriad Pro,Calibri;
				font-size:1em;
				font-weight:bold;
				}  		
a.blue:hover			{	
				color:#000000;
				text-decoration:underline;
				font-family:Myriad Pro,Calibri;
				font-weight:bold;
				font-size:1em;
				transition: 0.5s;
				}  

a.mailto			{	
				font-size:1em;
				color:#000000;
				text-decoration:none;
				font-family:Days;
				}  					
				
a.mailto:hover  {
				font-size:1em;
				color:#3db3e3;
				text-decoration:none;
				font-family:Days;
				}  	
				
a img 			{border: none; 
				}
				
a.gray			{									
				text-decoration:none;
				font-family:Days;
				font-size:1.5vw;
				display:inline;
				font-weight: normal;
				color:#CCC;
				} 
a.gray:hover			{									
				text-decoration:none;
				font-family:Days;
				font-size:1.5vw;
				display:inline;
				font-weight: normal;
				color:#3db3e3;
				} 
				
	

				
@media screen and (max-width: 1024px) {				
a			{	
				color:#000000;
				text-decoration:none;				
				font-family:Myriad Pro,Calibri;
				font-size:1em;
				}  		
a:hover			{	
				color:#3db3e3;
				text-decoration:none;
				font-family:Myriad Pro,Calibri;
				font-size:1em;
				}  		
				
			
a img 			{border: none; 				}

 h1			{									
				text-decoration:none;
				font-family:Days;
				font-size:1.2em;
				display:inline;
				font-weight: normal;
				color:black;
				} 
 
			
}






/* Модальное окно */

.modalDialog {
		position: fixed;
		font-family: Arial, Helvetica, sans-serif;
		top: 0;
		right: 0;
		bottom: 0;
		left: 0;
		background: rgba(0,0,0,0.8);
		z-index: 99999;
		-webkit-transition: opacity 400ms ease-in;
		-moz-transition: opacity 400ms ease-in;
		transition: opacity 400ms ease-in;
		display: none;
		pointer-events: none;
	}

	.modalDialog:target {
		display: block;
		pointer-events: auto;
	}

	.modalDialog > div {
		width: 500px;
		position: relative;
		margin: 10% auto;
		padding: 5px 20px 13px 20px;
		border-radius: 10px;
		background: #fff;
		
	}

	.close {
		background: #606061;
		color: #FFFFFF;
		line-height: 25px;
		position: absolute;
		right: -12px;
		text-align: center;
		top: -10px;
		width: 24px;
		text-decoration: none;
		font-weight: bold;
		-webkit-border-radius: 12px;
		-moz-border-radius: 12px;
		border-radius: 12px;
		-moz-box-shadow: 1px 1px 3px #000;
		-webkit-box-shadow: 1px 1px 3px #000;
		box-shadow: 1px 1px 3px #000;
	}

#index { 
  display: grid;
  grid-template-areas: 
    "logo header header con"
    "cat1 cat2 cat3 cat4"
	"cat5 cat6 cat7 cat8"
	"tilion eq eq eq"
	"news news news news"
	"new new new new"
	"mrkt mrkt mrkt mrkt"
    "footer footer footer footerend";
  grid-template-rows: 75px 30vw 30vw 170px auto auto 250px 50px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  height: 100vh;
  font-size:  12pt;
  max-width: 88vw;
  margin: auto; 
  }
  
#wiki { 
  display: grid;
  grid-template-areas: 
    "logo header header con"
    "title title title title"
	"desc desc desc desc"
    "footer footer footer footerend";
  grid-template-rows: 75px 8vh auto 50px;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  height: 100vh;
  font-size:  12pt;
  max-width: 90vw;
  margin: auto; 
}

 
 #Mrkt-grid {
  display: grid; 
  grid-template-rows: auto ;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  margin-top:50px;	 
}

 #New-grid {
  display: grid; 
  grid-template-rows: auto ;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-gap: 20px;
  margin-top: 100px;	
  text-align: left;
  font-family: Myriad Pro, Calibri;
}

   
 /* Stack the layout on small devices/viewports. */
@media screen and (max-width: 1024px) {

	
#index { 
  display: grid;
    grid-template-areas: 
	  "eqmob eqmob"
	  "logo logo"
	  "header header"
	  "cat1 cat2"
	  "cat3 cat4"
	  "cat5 cat6"
	  "cat7 cat8"
	  "tilionmob tilionmob"
	  "con con";
  grid-template-rows: 10vw 20vw 2.5em 65vw 60vw 60vw 60vw 40vw 7em;
  grid-template-columns: 1fr 1fr;
  max-width: 96vw; 
 }
 
#wiki { 
  display: grid;
      grid-template-areas: 
	  "logo logo"
	  "header header"
	  "title title"
	  "desc desc"
	  "tilionmob tilionmob"
	  "con con";
  grid-template-rows: 20vw 2.5em auto auto 40vw 7em;
  grid-template-columns: 1fr 1fr;
  max-width: 96vw; 
}
 

#pageEqmob {
 grid-area: eqmob;
 text-align:center;
 padding: 10px 20px 0px 10px;
 font-family:Days;
 font-size:2.5vw;
}

#pageTitle {
  grid-area: title;
  text-align:center;
  font-size: 1.2em;
  font-family:Days;  
  padding-top:5vw;
  padding-left: 5vw;
  } 
 
 #pageLogo {
 grid-area: logo;
 text-align:center;
 padding: 2vw;
  
}

 #pageLogo2 {
    visibility: hidden;
    display: none;
}


 #pageHeader {
	grid-area: header;
	text-align: center;
	position: sticky;
    top: 0;  
    z-index:1;
    opacity:0.9;
	margin-left: -2vw;
    margin-right: -2vw;
	border-bottom: solid 2px #cde0ef;
    background: white;
    opacity:0.9;
	line-height: 2.5em;
}

a.header {
	  font-family:Myriad Pro;  
	  font-size: 3.5vw;
	  color:black;
}

#pageDesc {
  grid-area: desc;
  text-align:center;
  font-size: 1.2em;
  font-family:Myriad Pro;  
  padding:5vw;
  margin-top: 2vw;
  } 

#pageMrkt {
    visibility: hidden;
    display: none;
}

#pageNews {
    visibility: hidden;
    display: none;
}

#pageNew {
    visibility: hidden;
    display: none;
}


#pageFooter {
    visibility: hidden;
    display: none;
}

#pageFooterend {
    visibility: hidden;
    display: none;
  }
  
#pageCon{
  grid-area: con;
  font-family:Myriad Pro;
  text-align:center;
  padding: 2em;
}
#pageEq{
  visibility: hidden;
  display: none;
}

#pageCat1 {
  grid-area: cat1;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  margin-top: 5vw;
  }
#pageCat2 {
  grid-area: cat2;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  margin-top: 5vw;
  } 
#pageCat3 {
  grid-area: cat3;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  } 
#pageCat4 {
  grid-area: cat4;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  }
#pageCat5 {
  grid-area: cat5;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  } 
#pageCat6 {
  grid-area: cat6;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  } 
#pageCat7 {
  grid-area: cat7;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  } 
#pageCat8 {
  grid-area: cat8;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
   } 
  #pageTilionmob {
  padding-top: 10vh;
  margin-bottom: 2vh;
  grid-area: tilionmob;
  text-align:center;
  } 
  
    #pageTilion {
	 visibility: hidden;
    display: none;
  } 
 
}
  
@media all and (min-width: 1024px) {
	
#pageEqmob {
    visibility: hidden;
    display: none;
  }
	
#pageLogo {
  grid-area: logo;
  border-bottom: solid 2px #cde0ef;
  margin-left:-5vw; 
  padding: 10px 10px 10px 5vw;
  text-align:center;
  top: 0;  
  z-index:10;
  background: white;
}

#pageLogo2 {
  grid-area: logo;
  border-bottom: solid 2px #cde0ef;
  margin-left:-5vw; 
  padding: 10px 10px 10px 5vw;
  text-align:center;
  position: sticky;
  top: 0;  
  z-index:9;
  background: white;
  opacity:0.85;  
  top: -2em;  
}


  #pageTilion {
 grid-area: tilion;
  text-align:center;
  padding-top:10px;
  animation: show 3s;}
  
@keyframes show {

from {opacity: 0;} to {opacity: 1;}
}
  

#pageHeader {
  grid-area: header;  
  padding-top: 2.8em;
  text-align: center;
  border-bottom: solid 2px #cde0ef;
  position: sticky;
  top: -2em;  
  z-index:1;
  background: white;
  opacity:0.85;
}



#pageCon{
  grid-area: con;
  margin-right:-5vw;
  text-align: right;
  padding-right: 5vw;
  padding-top: 5px;
  border-bottom: solid 2px #cde0ef;
  top: 0;  
  z-index:10;
  background: white;
}

#pageCon2{
  grid-area: con;
  margin-right:-5vw;
  text-align: right;
  padding-right: 5vw;
  padding-top: 5px;
  border-bottom: solid 2px #cde0ef;
  position: sticky;
  top: 0;  
  z-index:9;
  top: -2em;  
  background: white;
  opacity:0.85;
}

 #pageTitle {
  grid-area: title;
  text-align:left;
  font-size: 3vw;
  font-family:Days;  
  padding-top: 2vh;  
  color:#CCC;
  } 
  
#pageDesc {
  grid-area: desc;
  text-align:center;
  font-size: 1em;
  font-family:Myriad Pro;  
  padding: 2vh 10vw 0 10vw; 
  margin-top:2vh;
  } 

  
 #pageBackmob {
  visibility: hidden;
    display: none;
}

#pageEq {
  grid-area: eq;
  color:#FFFFFF;	 
  font-family:Myriad Pro, Calibri;
  text-decoration:none;	
  font-size:1em; 
  background: #3db3e3;
  text-align: left;
  padding: 20px 5vw 10px 10px;  
  margin-right:-5vw;
    animation: show 3s;
}

#pageMrkt{
  grid-area: mrkt;
  position:relative;
  font-family:Myriad Pro, Calibri;
  text-decoration:none;	
  font-size:1em; 
  text-align: center; 
}

#pageMrkt img {
	max-width:100%;
		-webkit-transition: opacity 1s ease-in-out;
		-moz-transition: opacity 1s ease-in-out;
		-o-transition: opacity 1s ease-in-out;
		transition: opacity 1s ease-in-out;
	}
#pageMrkt img.top:hover {
		opacity:0;
	}
	
#pageNews{
  grid-area: news;
  font-family:Myriad Pro, Calibri;
  text-decoration:none;	
  font-size:1em; 
  text-align: center; 
}

#pageNew{
  grid-area: new;
  font-family:Days;
  text-decoration:none;	
  font-size:1em; 
  text-align: left;   
  margin-top:20px;
}


#pageFooter {
  grid-area: footer;
  text-align: left;
  padding-top: 15px;
  background: #3db3e3;
  margin-left: -10%;
  padding-left: 5%;
}

#pageFooterend {
  grid-area: footerend;
  font-size: 0.8em;
  font-family:Days;
  }

#pageCat1 {
  grid-area: cat1;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 5vh 10px 10px 10px;
  }
#pageCat2 {
  grid-area: cat2;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 5vh 10px 10px 10px;
  }
#pageCat3 {
  grid-area: cat3;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 5vh 10px 10px 10px;
  }
#pageCat4 {
  grid-area: cat4;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 5vh 10px 10px 10px;
  }
#pageCat5 {
  grid-area: cat5;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  }
#pageCat6 {
  grid-area: cat6;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  }
#pageCat7 {
  grid-area: cat7;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  }
#pageCat8 {
  grid-area: cat8;
  font-size: 1em;
  font-family:Myriad Pro;
  text-align:center;
  padding: 10px;
  }
#pageTilionmob {
 display:none;
    visibility: hidden;
  }
  
img.gray    	{-webkit-filter: grayscale(100%);
				-moz-filter: grayscale(100%);
				-ms-filter: grayscale(100%);
				-o-filter: grayscale(100%);
				filter: grayscale(100%);
				filter: gray; /* IE 6-9 */
				transition: 1.75s;
				}
img.gray:hover	 {
				-webkit-filter: none;
				-moz-filter: none;
				-ms-filter: none;
				-o-filter: none;
				filter: none;
				filter: none; /* IE 6-9 */
				transform: scale(1.05);
				transition: 0.75s;		
				}	
}