html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}


body {font-weight:200;
	color:#000;
	background-color:#ffcccc/*#7ca2a2*/;
	font-family: Courier New;
	font-size: 10px;
	line-height: 1.5em;
 Overflow-y:auto;
overflow-x: hidden; 
margin:0px;}


p {
	margin:0 0 .75em 0} 
a {
	color: #000;
	text-decoration:none;}
a:hover {
	color: #fff; 
	text-decoration:none;
	z-index: 1;}





#contain {position:absolute;

	width:100%;
	z-index: 0;}
	
@media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){
#contain { width:90%;
  margin-left: 5px;
  left:0;
	margin-top:30px;
	z-index: 0;}
}
  
#side {
position: fixed;
	text-align: center;
	margin-left:80px;
	margin-top:200px;
	width:160px;
	z-index: 1;}


	
#side img {width:132px;}

#name {
	position: relative;
	font-size: 9px;
	margin-left: 0px;
	margin-top: 6px;
	padding-bottom: 20px;
}

@media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){
#side { position:absolute;
	text-align: center;
	margin-left:50px;
	margin-top:10px;
	width:160px;}
}

      @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
 #side {position:absolute ;
	text-align: center;
	margin-left:30px;
	margin-top:10px;
	width:160px;}

}



#categ{ 
	text-align: left;
	margin-top:20px;
	margin-left:10px;
	font-size: 13px;
	font-weight: 10;
	letter-spacing:0.1px;
	text-decoration:blink;

	}
	
@media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
#categ a {border-bottom-color: black;
border-bottom-style: dotted;
border-bottom-width: 1px;}
a:hover {color: #fff;}
}
  
.language-switch {
    position: fixed;
right:30px;
Top:30px;
    white-space: nowrap;
font-size: 13px;
	font-weight: 10;
	letter-spacing:0.1px;
	text-decoration:blink;
  }

.description{
	position: relative;
	width: 500px;
	font-size: 10px;
	margin-left: 0px;
	margin-top: 8px;
	padding-bottom: 20px;
	
}

#letter { position:relative;
	padding:10px;
	
	width: 160px;

	font-size: 9px;}
	
	#letter a {float:left;
	padding:15px;
	padding-top:6px;
	}
      
/*----------info page------------*/     


#info-menu {position:fixed;
margin-top:50px;
	margin-left: 950px;	
float: right;
	z-index: 0;
	font-size: 13px;
	 	}
#info-menu div {padding-bottom: 10px;
	 	}

#info-container{ margin-top:50px;
margin-left: 300px;	
	padding-left:20px;

    font-size: 11px;  }

#info-img 	{display: block;
	z-index: 10; }
#info-img img { width:600px;}

#contacts-txt { display: none;
z-index: 1000;

	position:fixed;
	width:400px;}

#about-txt { display: none;
	position:;
	width:600px;}
#about-txt img { 
	padding-top:20px;
	width:600px;}

#EPL-list { display: none;
	position:;
	width:600px;}

#EPL-list p { padding-bottom:20px; }



   @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
 #info-container  {  
 width:90%;
 max-width:600px;
	margin-left: 20px;	
	padding-top:20px;
Z-index:10;
 }

#info-img 	{;}
	#info-img img { position:absolute;
		max-width:400px;
		width:85%;padding-top: 20px;}

#contacts-txt { position:absolute;
	max-width:500px;
	width:100%;
	padding-top: 0px;}
	
#about-txt { position:absolute;
	max-width:400px;
	width:80%;padding-top: 20px;}
#about-txt img { max-width:400px;
	width:100%;}
	
#EPL-list { width:100%;padding-top: 20px;}

#info-menu {position:absolute;
	margin-top: 30px;
	margin-left: 40px;	
float: none;}

	
	#info-menu div {padding-right: 20px;
float: left;}
	#info-menu a {border-bottom-color: black;
border-bottom-style: dotted;
border-bottom-width: 1px;}

}
 
	 
/*----	 @media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){
.imginfo {
	margin-left: 40px;	
	padding:20px;
	padding-bottom:0px;
	padding-top:300px;
	float: left;
		z-index: 0;
	 } }

      @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
.imginfo {position:absolute ;
	text-align: center;
	margin-left:20px;
	width:150px;
	padding-top:300px;
	float: left;
		z-index: 0;}

}

.imginfo img { width:400px;}
    @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
.imginfo img{
	width:170px;}

}

#imginfo{ display: block;}	


.imginfo-text 	{ width: 160px;
margin-left:750px;
	padding-top:20px;

	 }
	 
	 
	 	 @media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){
.imginfo-text {

margin-left:490px;
	padding-top:300px;
	 } }
	 
	 	 	 @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
.imginfo-text {

margin-left:230px;
	padding-top:300px;
	 } 
	 

.imginfo-text a {border-bottom-color: black;
border-bottom-style: dotted;
border-bottom-width: 1px;}
a:hover {color: #fff;}
}
  

	 

	 
 #about-text
      { display: 
	float: left;
	margin-top:-500px;
      margin-left: -430px;
      width: 400px;
      text-align: justify;               
      text-align-last: left;
      }
      
      
      
      #about-text img  {width: 400px;
      padding-top:20px;
      }
      
      
@media only screen and (max-width : 1000px),
only screen and (max-device-width : 1000px){
 #about-text
      {	float: left;
      margin-left: -430px;
       width: 400px;
      } }
      
      
 @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
 #about-text
      {	float: left;
      margin-left: -190px;
       width: 170px;
      } 
#about-text img  {width: 280px;

      }    
      
      
      }

#click3 { display :;} 
#contacts-content { display :none;} ----*/

/*----------info page end------------*/          




/*----------list pages------------*/   
      
#list-container{ position:relative;
	margin-left: 300px;	
     width:80%; 
z-index: 0;

repeat(auto-fit, minmax(300px, 400px));
  gap: 16px;
  Padding-top: 100px;


}



      

  

   @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
 #list-container  {  
width: auto;
    margin-left: 20px;
    margin-right: 20px;	

 }}
 
 
 
      
#list {float: right;  
}
#list img {padding-bottom:30px;

  width:250px;
  margin-top:-270px;

}

 #list img:hover { 
  opacity: 50%;
Color:#ffcccc/*#7ca2a2*/;
}
    

   @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
 #list  {float:left;
 ; }
 
 #list img {padding-bottom:30px;

  width:250px;
  margin-top:-270px;

  
}
}

  
#list-description
      {     float:left;
width:250px;


padding-top:100px;
margin-top: 120px;
margin-left:20px;
        
padding-bottom:40px;

	
}




  @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
 
 #list-description 
   {    width:250px;


padding-top:100px;
margin-top: 120px;
margin-left:20px;
        
padding-bottom:40px;}

}
 
      
 /*----------list pages end------------*/  
 
      
/*----------project------------*/  
      #project-container{ position:relative;
	margin-left: 300px;
Margin-top: 50px;	
     width:920px;  z-index: 0;}
      
      

  
 @media only screen and (max-width :1280px),
only screen and (max-device-width : 1280px){
   #project-container  {   
Margin-top:30px;  width:100%; 
	margin-left: 20px;	
	padding-top:0px;
}}
 
  /*--------@media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
 #project-container  {width:100%; 
	margin-left: 20px;	
	padding-top:0px;
 }}
 ---------*/  
 
 
#project-title{
	position: relative;
	width: 690px;
	font-size: 11px;
	text-weight: 900 ;
	margin-left: 20px;
	padding-bottom: 20px;
	
}
    @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
   	#project-title{width:95%;} }

  
#project {   
	position: relative;
	font-size: 11px;
	margin-top: 30px;
	margin-left:20px;
        }
        
#project img { width: 900px;
	 padding-bottom: 30px;}




    @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
   	#project {width:95%;} 
	#project img {width:90%; } 
 
 }
 /*---
    @media only screen and (max-width : 1100px),
only screen and (max-device-width : 1100px){
   	#project {width:95%;} 
    #project img {width:90%; } }
 
    @media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
   #project {width: 95%;} 
   #project img {width: 90%; } }

---*/


 #project-text-container
      {position: relative; width :900px;
      padding-left:20px;

	
}

 #project-text
      { position: relative;
      display :none;
      width :850px;
      padding-left:20px;
      text-align: justify;
       text-justify:inter-word;

	
}


 @media only screen and (max-width : 1280px),
only screen and (max-device-width : 1280px){
   #project-text-container {width: 90%;


 } 
#project-text {width: 87%; } 
 
 }

#click { display :block;} 
#click2 { display :none;} 
 /*---
 @media only screen and (max-width : 1100px),
only screen and (max-device-width : 1100px){
   #project-text-container {width: 90%;


 } 
#project-text {width: 90%; } 
 
 }
@media only screen and (max-width : 850px),
only screen and (max-device-width : 850px){
   #project-text-container {width: 90%;} 
   
  #project-text {width: 90%; } }
  --*/ 

/*----------project end------------*/ 



/*----------slide------------*/

	
#slide { 
	position:relative;
	margin-left: 300px;	

	padding:20px;
	float: left;
	width:600px; z-index: 0;}

#slide img { width:600px;}

	
#slide2 { 
	position:relative;
       
	margin-left: 330px;	
	float: left;
	height:auto;
Width: calc(100% - 420px);
	z-index: 0;}



#slide2 img {
	background-size: cover;
	object-fit: cover;
	height:auto;
	width:95vh; }
       


#slidecontroll{
Floating:right;
	position: relative;
font-size: 12px;
Text-align:right;
	margin-right:0px;
	margin-top: -40px;
	padding-left: 0%;
	
}


/*----------slide SHOW------------*/




.carousel-control.left, .carousel-control.right {
  background-image: none;
}

.img-responsive, .thumbnail > img, .thumbnail a > img, .carousel-inner > .item > img, .carousel-inner > .item > a > img {
  display: block;

  height: auto;
}

/*.carousel-inner > .item {
    
    -webkit-transition: 0.5s ease-in-out left;
    transition: 0.5s ease-in-out left;

}*/



.section-outer {

  padding: 10px 0px;
}



/*----------slide end------------*/


/*----------FORM------------*/

.content { padding: 0 0 100px 20px; display: grid; grid-template-columns: minmax(0, 600px) minmax(150px, 220px); 
column-gap: clamp(28px, 4vw, 0px); align-items: start; font-size: 11px; font-weight:200;}
h1 { margin: 0 0 33px; font-size: 13px; font-weight: normal; }
.intro { margin: 0 0 36px; }
.field { margin: 0 0 22px; }
.field label { display: block; margin-bottom: 7px; font-weight:200;}
.optional { color: #555; }
input, select, textarea, button { font: inherit; color: inherit; }
.field input, .field select, .field textarea { display: block; width: 100%; border: 0; border-bottom: 1px dashed #111; border-radius: 0; padding: 7px 2px 9px; background: transparent; outline-offset: 4px; }
.field textarea { resize: vertical; min-height: 110px; }
input::placeholder, textarea::placeholder { color: #705f5f; opacity: 1; }
select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='black'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 4px center; padding-right: 20px !important; }
select option { color: #000; background: #ffcccc; }
.consent { display: flex; align-items: flex-start; gap: 9px; margin: 30px 0 26px; line-height: 1.5; font-weight:200;}
.consent input { flex: 0 0 auto; margin: 2px 0 0; accent-color: #000; font-weight:200;}
.consent a { text-decoration: underline; text-underline-offset: 2px; font-weight:200;}
button { appearance: none; border: 0; padding: 4px 0; background: none; cursor: pointer; font-size: 13px; }
button:hover, button:focus-visible { color: #fff; }
.note { margin-top: 17px; max-width: 360px; font-size: 10px; }
.trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.details { padding-top: 1px; }
.details p { margin: 0 0 11px; }
.details .divider { margin: 22px 0; }

@media (max-width: 650px) {
  .content { display: block; margin-top: 56px; padding-left: 10px; padding-right: 10px; }
  .column { max-width: 340px; }
  .details { margin-top: 70px; }
  .side nav a { text-decoration: underline dotted; text-underline-offset: 3px; }
}
/*----------FORM end------------*/