html,body{ 
	margin:0px 0px; 				padding:0px 0px;
	background:linear-gradient(#f3faff, #e7f5fe, #dbf0fe, #cfebfd, #c3e7fd, #b7e2fc, #abddfc, #9fd8fb, blue);
}
:root{
	--squre-color:#eee;			--rectangle-color:#F8DEA6;
	--vertical-color:#BDD8C6;		--mini-color:#BDECB4;
}
header{
    width:100%;						height:45px;
    margin:0px 0px;					padding:0px 0px;
    position:fixed;					z-index:10;
    display:flex;					align-items:center;			
   	backdrop-filter:blur(8px);		box-shadow:2px 2px 2px #000000;
   	justify-content:space-between;
}
.header-title{
	margin:17px 10px 8px px;		padding:0px 0px 0px 10px;
    font-size:20px;					font-weight:800;
	color:#000000; 				text-decoration: none;
}
#header-icon{
	padding:0px 0px;				margin:0px 0px;
	cursor:pointer;					display:none;
}
i{	width:40px; 					height:40px;
	margin:0px 0px;					padding:0px 0px;
	font-size:40px; 
	}
.header-bar{
	margin:19px 0px 8px 0px;		padding:0px 0px;
	display:flex;
}
.header-bar a{
	margin:0px 10px;				padding:0px 0px;
	color:#000000;
    font-size:18px;					font-weight:700;
    text-decoration:none;
}
.header-bar a:hover{
	padding:0px 0px 0px 0px; 		margin:0px 10px;
	font-size:18px;					font-weight:700;
	color:blue;	  
}
.header-bar a:last-child{margin-right:12px;}
header li{
 	margin:0px 0px;					padding:0px 0px;
 	list-style-type:none;
}
.header-sub-menu{display:none; 		padding:0px 0px; 	margin:0px 0px;}
.header-bar li:hover .header-sub-menu{
	margin:0px 0px; 				padding:0px 0px;
	font-size:14px; 				font-weight:900;	
    display:block;					position:absolute;
	background:linear-gradient(#f3faff, #e7f5fe, #dbf0fe, #cfebfd, #c3e7fd, #b7e2fc, #abddfc, #9fd8fb);
}
.header-bar li:hover .header-sub-menu ul{
	margin:0px 0px; 				padding:0px 5px 0px 0px;
    display:block; 
}
.header-bar li:hover .header-sub-menu ul li{
	height:32px;
	padding:auto 0px; 				margin:0px auto 0px 5px;
    text-align:left;				border-bottom:1px solid black;	
    background:transparent;
}
.header-bar li:hover .header-sub-menu ul li:last-child{border-bottom:none;}
.home{
    margin:0px 0px;					padding:0px 0px; 
    display:grid;					place-items:center;
}
.containerbox{
    width:100%;						height:100%;
    display:grid;					place-items:center;
}
.containerbox{
    scrollbar-width:nono;			scrollbar-color:transparent transparent;
}
.containerbox::-webkit-scrollbar {width:0px;}
.containerbox::-webkit-scrollbar-thumb {background-color:transparent;}
.mainscreen {
	width:1395px;					height:735px;
	margin:60px 0px 0px 0px; 		padding:1px;
    display:grid;					place-items:center;
    position:relative;				overflow:visible;
    background-color:black;
    grid-template-columns:repeat(1, 1fr);	
    grid-template-rows:repeat(1, 1fr);
}
.mainscreen {
	scrollbar-width:none;			scrollbar-color:transparent transparent;
}
.mainscreen::-webkit-scrollbar {width:0px;}
.mainscreen::-webkit-scrollbar-thumb {background-color:transparent;}
.screens {
	height:724.25px;				width:1386px;
	margin:0px 0px;					padding:2px 2px;
	display:grid;					background:rgba(255, 255, 255, 1);
	row-gap:0.25px;					column-gap:0.25px;
    grid-template-columns: repeat(8, 1fr);	
    grid-template-rows: repeat(5, 1fr);
}
.set{
	width:172.5px; 					height:144px;
	margin:0px 0px;					padding:0px 0px;
    display:grid;					background-color:#eee;
	row-gap:0.25px;					column-gap:0.25px;
    grid-template-columns:repeat(6, 1fr);	
    grid-template-rows:repeat(5, 1fr);
}
.select1{
	width:51.7px;					height:51.7px;/*30*/
	margin:0px 0px;		 			padding:0px 0px;
    grid-column:1/3;				grid-row:1/3;
    background-color:var(--squre-color);
    background-size:cover;/* image command*/
    transition:transform 0.2s;/* image increase command*/
    cursor:pointer;/* image increase command*/
    background-position:center;
}
.select2{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;		
    cursor:pointer;					background-position:center;
}
.select3{
	width:51.7px;					height:51.7px;
    grid-column:4/6;				grid-row:1/3;
    background-color:var(--squre-color);
    background-size:cover;			transition:transform 0.2s;        
    cursor:pointer;					background-position:center;
}  
.select4{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;			
    cursor:pointer;					background-position:center;
}
.select5{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
	cursor:pointer;					background-position:center;
}
.select6{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select7{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select8{
	width:51.7px;					height:51.7px;
    grid-column:2/4;				grid-row:3/5;
    background-color:var(--squre-color);
    background-size:cover;			transition: transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select9{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select10{
	width:51.7px;					height:51.7px;
    grid-column:5/7;       			grid-row:3/5;
    background-color:var(--squre-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select11{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}  
.select12{
	width:23.2px;					height:51.7px;
    grid-column:4/5;				grid-row:4/6;
    background-color:var(--vertical-color);
	background-size:cover;			transition: transform 0.2s;
    cursor: pointer; 				background-position:center;
}
.select13{
	width:51.7px;					height:23.2px;
    grid-column:1/3;				grid-row:5/6;
    background-color:var(--rectangle-color);
    background-size:cover;    		transition:transform 0.2s;
    cursor:pointer; 				background-position:center;
}
.select14{
	width:23.2px;					height:23.2px;
    background-color:var(--mini-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select15{
	width:51.7px;					height:23.2px;
	grid-column:5/7;				grid-row:5/6;
    background-color:var(--rectangle-color);
    background-size:cover;			transition:transform 0.2s;
    cursor:pointer;					background-position:center;
}
.select1:hover {transform: scale(1.5);}
.select2:hover {transform: scale(2.0);}
.select3:hover {transform: scale(1.5);}
.select4:hover {transform: scale(2.0);}
.select5:hover {transform: scale(2.0);}
.select6:hover {transform: scale(2.0);}
.select7:hover {transform: scale(2.0);}
.select8:hover {transform: scale(1.5);}
.select9:hover {transform: scale(2.0);}
.select10:hover{transform: scale(1.5);}
.select11:hover{transform: scale(2.0);}
.select12:hover{transform: scale(2.0);}
.select13:hover{transform: scale(2.0);}
.select14:hover{transform: scale(2.0);}
.select15:hover{transform: scale(2.0);}
.number{
	width:100%;						height:100%;
	color:#000000;
    font-size:12px;					font-weight:700;
    display:grid;					place-items:center;
}  
.about-text p{
	width:1395px;
	margin:0px auto 0px auto;		padding:35px  0px;
	font-size:18px;					font-weight:500;
	text-align:justify;				line-height:2;
}
.about-images{
	width:1395px;
	margin:0px auto 0px auto;		padding:0px  0px;
    display:grid;					place-items:center; 
    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
    grid-gap:1.5rem;
}
.box{
	width:1395px;					height:450px;
	margin:0px 0px;					padding:0px 0px;
	display: flex;					align-items:center;
	background:rgba(255, 255, 255, 0.9);
}
.box img{
    width:450px;					height:400px;
    margin:3px 0px 0px;				padding:0px 0px;
    outline:5px solid #007EE3;	outline-offset:17px;
	object-fit:cover;				box-shadow:5px 5px 5px rgb(0, 0, 0);
}
#image1{margin-left	:25px}
#image2{margin-right:25px}
.box h1{
	margin:0px 50px;				padding:0px 0px;
    font-size:26px;					font-weight: 800;
}
.box p{
	margin:0px 50px;				padding:0px 0px;
	font-size:18px;					font-weight:500;
	text-align:justify;				line-height:2;
    color: #000000;
}
.text p{
	width:1395px;
	margin:0px auto 0px auto;		padding:35px  0px;
	font-size:18px;					font-weight:500;
	text-align:justify;				line-height:2;
}
.main li{list-style-type:none;}
.main{
    display:flex;					flex-wrap:wrap;
}        
.footer{padding:10px 0px;			background-color:#eee}
.col{width:25%;}
.col h4{
	margin: 0px 0px 25px 0px;		padding:0px 20px;					
	color:#000000;				font-size:large;
    position:relative;
}
.col h4::before{
	height:2px;						width:90px;
	left:0;							bottom:-8px;
	margin-left:20px;				content	:"";
	position: absolute;				background: #000000;
}
.col ul li:not(:last-child){margin-bottom:15px;}
.col ul li a{
    color:#000000;
	font-size:18px;					font-weight:700;
	display:block;					text-transform:capitalize;
    transition:.4s;					text-decoration: none;
}
.col ul li a:hover{
    color:#000000;				transform:translateX(-12px);
}
.col .colorindication li{
	font-size:18px; 				font-weight:700;
}
.col .social ul{
	width:220px;					display:flex;
}
.col .social a{
    height:35px;					width:35px;
	margin:5px 5px;
    color:#FFFFFF;
    font-size:15px;
    display:inline-flex;			align-items: center;	justify-content: center;
    border-radius:10px;            
}
.col .social a:hover {transform:translateX(0px);	color:#000000;	background-color:#FFFFFF;}
@media ((max-width:1450px) and (min-width:1050px)){
	header{
		width:100%;					height:45px;
		margin:0px 0px;				padding:0px 0px;
	}
	.home{
		margin:0px 0px;				padding:0px 0px;
	    display:grid;				place-items:center;
	}
	.containerbox{
	    width:100%;					height:100%;
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:1012px;				height:535px;
		margin:60px 0px 0px 0px;	padding:2px;
	    display:grid;				place-items:center;
	    position:relative;			overflow:visible;
	    background-color:#000000;
	    grid-template-columns:repeat(1, 1fr);	
	    grid-template-rows:repeat(1, 1fr);
	}
	.screens {
		height:530px;				width:1007px;
		margin:0px;					padding:2px;
		display:grid;				background: rgba(255, 255, 255, 1);
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns: repeat(8, 1fr);	
	    grid-template-rows: repeat(5, 1fr);
	}
	.set{
		width:125px; 				height:105px;
		margin:0px 0px;				padding:0px 0px;
	    display:grid;	    		background-color:#eee;
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns:repeat(6, 1fr);	
	    grid-template-rows: repeat(5, 1fr);
	}
	.select1 {width: 36px;	 		height: 36px;}/*20*/
	.select2 {width: 15.2px;	 	height: 15.2px;}
	.select3 {width: 36px; 			height: 36px;}  
	.select4 {width: 15.2px;	 	height: 15.2px;}
	.select5 {width: 15.2px; 		height: 15.2px;}
	.select6 {width: 15.2px;	 	height: 15.2px;}
	.select7 {width: 15.2px; 		height: 15.2px;}
	.select8 {width: 36px; 			height: 36px;}
	.select9 {width: 15.2px;	 	height: 15.2px;}
	.select10{width: 36px; 			height: 36px;}
	.select11{width: 15.2px;	 	height: 15.2px;}  
	.select12{width: 15.2px; 		height: 36px;}
	.select13{width: 36px;	 		height: 15.2px;}
	.select14{width: 15.2px;	 	height: 15.2px;}
	.select15{width: 36px; 			height: 15.2px;}
	.number{
		width:100%;					height:100%;
		color:#000000;
	    font-size:10px;				font-weight:500;
	    display:grid;				place-items:center;
	} 
	.about-text p{
		width:1012px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:1012px;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:1012px;				height:600px;
		margin:0px 0px;				padding:0px 0px;
		display: flex;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box img{
	    width:450px;				height:400px;
	    margin:3px 0px 0px;			padding:0px 0px;
	    outline:5px solid #007EE3;outline-offset:17px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin-left	:25px}
	#image2{margin-right:25px}
	.box h1{
		margin:0px 50px;			padding:0px 0px;
	    font-size:26px;				font-weight:800;
	}
	.box p{
		margin:0px 50px;			padding:0px 0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:1012px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:2;
	}
} 	 	
@media ((max-width:1050px) and (min-width:801px)){
	header{
		width:100%;					height:45px;
		margin:0px 0px;				padding:0px 0px;
	}
	.home{
	    margin:0px 0px;				padding:0px 0px;
	    display:grid;				place-items:center;
	}
    .containerbox{
	    width:100%;					height:100%;
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:789px;				height:1055px;
		margin:80px 0px 0px 0px; 	padding:2px 2px;
	    display:grid;				place-items:center;
	   	position:relative;			overflow:scroll;
	    background-color:#000000;
	    grid-template-columns:repeat(1, 1fr);	
	    grid-template-rows:repeat(1, 1fr);
	}
	.screens {
		height:1055px;				width:789px;
		margin:0px 0px;				padding:2px 2px;
		display:grid;				background:rgba(255, 255, 255, 1);
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns:repeat(5, 1fr);	
	    grid-template-rows:repeat(8, 1fr);
	}
	.set{
		width:155px; 				height:130px;
		margin:0px 0px;				padding:0px 0px;
	    display:grid;	    		background-color:#eee;
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns:repeat(6, 1fr);	
	    grid-template-rows:repeat(5, 1fr);
	}
	.select1 {width: 45.9px;	 	height: 45.45px;}
	.select2 {width: 20.2px; 		height: 20.2px;	}
	.select3 {width: 45.9px;	 	height: 45.45px;}  
	.select4 {width: 20.2px; 		height: 20.2px;	}
	.select5 {width: 20.2px; 		height: 20.2px;	}
	.select6 {width: 20.2px; 		height: 20.2px;	}
	.select7 {width: 20.2px;	 	height: 20.2px;	}
	.select8 {width: 45.9px; 		height: 45.45px;}
	.select9 {width: 20.2px;	 	height: 20.2px;	}
	.select10{width: 45.9px;	 	height: 45.45px;}
	.select11{width: 20.2px; 		height: 20.2px;	}  
	.select12{width: 20.2px;	 	height: 45.9px;	}
	.select13{width: 45.9px; 		height: 20.2px;	}
	.select14{width: 20.2px;	 	height: 20.2px;	}
	.select15{width: 45.9px; 		height: 20.2px;	}
	.number{
		width:100%;					height:100%;
		color:#000000;
	    font-size:10px;				font-weight:500;
	    display:grid;				place-items:center;
	} 
	.about-text p{
		width:789px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:100%;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:789px;				height:1300px;
		margin:0px 0px;				padding:0px 0px;
		display:inline;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box-img{display:grid;			place-items:center; }
	.box img{
	    width:450px;				height:450px;
	    margin:25px auto 0px auto;	padding:0px 0px;
	    outline:none;				outline-offset:0px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin-left	:0px}
	#image2{margin-right:0px}
	.box h1{
		margin:25px 50px 0px;		padding:0px 0px;
	    font-size:26px;				font-weight: 800;
	}
	.box p{
		margin:0px 50px;			padding:0px 0px;
		font-size:24px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:789px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:2;
	}
	.col{width: 50%;}
}	
@media ((max-width:800px)and (min-width:700px)){
	header{
		width:100%;					height:45px;
		margin:0px 0px;				padding:0px 0px;
	}
	.header-title{
		margin:21px 10px 8px 12px;	padding:0px;
		font-size:16px;				font-weight:800;
		color:#000000; 			text-decoration: none;
	}
	#header-icon{
		margin:0px 0px; 			padding:0px 0px;
		cursor:pointer;				display: initial;
	}
	i{width:41px; height:41px; font-size:41px; padding:10px 0px; margin:0px 0px;}
	header .header-bar{
		margin:0px 0px;				padding:0px 0px; 
		top:-400px;					left:0;				right:0;
        position:absolute;
        display:flex;				flex-direction:column;	
        text-align:center;
		color:#FFFFFF;			background:rgb(255, 255, 255);         
        transition:.3s;
	}
    header .header-bar.active{top:45px;}
    .header-bar a:last-child{margin-right:0px;}
	.options{padding:10px auto; 	margin:10px auto; }
	.options a{
		margin:0px 0px;				padding:0px 0px;
		font-size:18px; 			font-weight:700;
		display:block;
	}
	.header-bar a:hover{
		padding:0px 0px; 			margin:0px 0px;
		font-size:18px;				font-weight:700;
	}
	.home{
		padding:0px 0px;			margin:0px 0px;
	    display:grid;				place-items:center;
	}
	.containerbox{
	    width:100%;					height:100%;
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:694px;				height:924px;
	    margin:55px 0px 0px 0px; 	padding:1px 1px;
	    align-items:start;
	    background-color:#000000;	overflow:scroll;
	}
	.screens {
		width:690px;				height:920px;				
		margin:0px 0px;				padding:2px 2px;
		display:grid;				background:rgba(255, 255, 255, 1);
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns:repeat(5, 1fr);	
	    grid-template-rows:repeat(8, 1fr);
	}
	.set{
		width:138px; 				height:115px;
		margin:0px 0px;				padding:0px 0px;
	    display:grid;	    		background-color:#eee;
		row-gap:0.25px;				column-gap:0.25px;
		grid-template-columns:repeat(6, 1fr);	
	    grid-template-rows:repeat(5, 1fr);
	}
	.select1{width:40px;			height:40px;		margin:1px 0px 0px 1px;}
	.select2{width:17px;			height:17px; 		margin:1px 0px 0px 1px;}
	.select3{width:40px;			height:40px;		margin:1px 0px 0px 1px;}  
	.select4{width:17px;  			height:17px;		margin:1px 0px 0px 0.5px;}
	.select5{width:17px;			height:17px;		margin:1px 0px 0px 1px;}
	.select6{width:17px;			height:17px;		margin:1px 0px 0px 0.5px;}
	.select7{width:17px;			height:17px;		margin:1px 0px 0px 1px;}
	.select8{width:40px;			height:40px;		margin:1px 0px 0px 0.5px;}
	.select9{width:17px;			height:17px;		margin:1px 0px 0px 1px;}
	.select10{width:40px;	 		height:40px;		margin:1px 0px 0px 0.5px;}
	.select11{width:17px;			height:17px;		margin:1px 0px 0px 1px;}  
	.select12{width:17px;			height:40px;		margin:1px 0px 0px 1px;}
	.select13{width:40px;			height:17px;		margin:1px 0px 0px 1px;}
	.select14{width:17px;			height:17px;		margin:1px 0px 0px 1px;}
	.select15{width:40px;			height:17px;		margin:1px 0px 0px 0.5px;}
	.number{
	    font-size:10px;				font-weight:500;
	    display:grid;				place-items:center;
	}  
	.about-text p{
		width:694px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:100%;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:694px;				height:940px;
		margin:0px 0px;				padding:0px 0px;
		display:inline;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box-img{display:grid;			place-items:center; }
	.box img{
	    width:450px;				height:450px;
	    margin:25px auto 0px auto;	padding:0px 0px;
	    outline:none;				outline-offset:0px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin-left	:0px}
	#image2{margin-right:0px}
	.box h1{
		margin:25px 50px 0px;		padding:0px 0px;
	    font-size:26px;				font-weight: 800;
	}
	.box p{
		margin:0px 50px;			padding:0px 0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:694px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:18px;				font-weight:500;
		text-align:justify;			line-height:2;
	}     
	.col{width:50%;}
}
@media ((max-width:699px)and (min-width:370px)){
	header{
		width:100%;					height:45px;
		margin:0px 0px;				padding:0px 0px;
	}
	.header-title{
		margin:19px 10px 8px 12px;	padding:0px 0px;
		font-size:18px;				font-weight:800;
		color:#000000; 			text-decoration:none;
	}
	#header-icon{
		margin:0px 0px; 			padding:0px 0px;
		cursor:pointer;				display:initial;
	}
	i{width:45px; height:45px; 		font-size:45px; padding:0px 0px;margin:0px 0px;}
	header .header-bar{
		margin:0px 0px;				padding:0px 0px; 			
		top:-400px;					left:0;				right:0;
        position:absolute;			display:flex;				
        flex-direction:column;		text-align:center;
		color:#FFFFFF;			background-color:#f3faff;  
        transition:.3s;
	}
    header .header-bar.active{top:44px; margin:0px 0px;}
    .header-bar a:last-child{margin-right:0px;}
    .header-bar li:hover .header-sub-menu{
		margin:0px 0px; 			padding:0px 0px;	
	}
	.options{padding:10px auto; 	margin:10px auto; }
	.options a{
		margin:0px 0px;				padding:0px 0px;
		font-size:16px; 			font-weight:800;
		display:block;
	}
	.header-bar a:hover{
		padding:0px 0px; 			margin:0px 0px;
		font-size:16px;				font-weight:800;
		color:blue;	  
	}
	.home{	
		margin:0px 0px;				padding:0px 0px;		
	    display:grid;				place-items:center;
	}
	.containerbox{
	    width:100%;					
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:369px;				height:810px;
	    margin:60px 0px 0px 0px; 	padding:0px 0px;
	    background-color:#eee;	
	    outline:1px solid #007EE3;outline-offset:0px;
	    display:grid;				place-items:centre;
	    row-gap:0px;				column-gap: 0px;
	    background-color:#eee;	overflow:scroll;
	    position:relative;
	}
	.mainscreen{
    	scrollbar-width:none;		scrollbar-color:transparent;
	}
	.mainscreen::-webkit-scrollbar {width:6px;}
	.mainscreen::-webkit-scrollbar-thumb {background-color:transparent;}
	.screens {
	    width:365px;    			height:808px;		
		margin:1px auto;			padding:0px 0px;			
		row-gap:0.5px;				column-gap:0.5px;
	    background-color:#eee;
	   	grid-template-columns: repeat(4, 1fr);	
	    grid-template-rows: repeat(10, 1fr);	
	}
	.set{
	    width:90px;					height:80px;		
		margin:0px 0px;				padding:0px 0px;	
		background-color:#eee;		
	}
	.select1{width:24px;			height:26px;		margin:1px 0px 0px 1px;}
	.select2{width:9px;				height:10px; 		margin:1px 0px 0px 1px;}
	.select3{width:24px;			height:26px;		margin:1px 0px 0px 1px;}  
	.select4{width:9.5px;  			height:10px;		margin:1px 0px 0px 0.5px;}
	.select5{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select6{width:9.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.select7{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select8{width:24.5px;			height:26px;		margin:1px 0px 0px 0.5px;}
	.select9{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select10{width:24.5px;	 		height:26px;		margin:1px 0px 0px 0.5px;}
	.select11{width:9px;			height:10px;		margin:1px 0px 0px 1px;}  
	.select12{width:9px;			height:26px;		margin:1px 0px 0px 1px;}
	.select13{width:24px;			height:10px;		margin:1px 0px 0px 1px;}
	.select14{width:9px;			height:10px;		margin:1px 0px 0px 1px;}
	.select15{width:24.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.number{
	    font-size:5px;				font-weight:400;
	    display:grid;				place-items:center;
	}  
	.about-text p{
		width:369px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:369px;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:369px;				height:1100px;
		margin:0px 0px;				padding:0px 0px;
		display:inline;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box-img{display:grid;			place-items:center; }
	.box img{
	    width:329px;				height:300px;
	    margin:25px auto 0px auto;	padding:0px 0px;
	    outline:none;				outline-offset:0px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin		:50px 0px 0px;}
	#image2{margin-right:0px}
	.box h1{
		margin:25px 20px 0px;		padding:0px 0px;
	    font-size:26px;				font-weight: 800;
	}
	.box p{
		margin:0px 20px;			padding:0px 0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:369px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:2;
	}     
	.col{width: 100%;}
	.colorindication li{font-weight:500}
} 
@media ((max-width:369px) and (min-width:341px) ){
	header{
		width:100%;					height:45px;
		margin:0px 0px;				padding:0px 0px;
	}
	.header-title{
		margin:19px 10px 8px 12px;	padding:0px 0px;
		font-size:18px;				font-weight:800;
		color:#000000; 			text-decoration:none;
	}
	#header-icon{
		margin:0px 0px; 			padding:0px 0px;
		cursor:pointer;				display:initial;
	}
	i{width:45px; height:45px; font-size:45px;  padding:0px 0px; margin:0px 0px;}
    header .header-bar{
		top:-400px;					left:0;			right:0;
        position:absolute;
        display:flex;				flex-direction:column;			text-align:center;
		color:#FFFFFF;			background:rgb(255, 255, 255);          
        transition:.3s;
	}
    header .header-bar.active{top:44px; margin:0px 0px;}
    .header-bar a:last-child{margin-right:0px;}
	.options{margin: 10px auto; padding:10px auto; }
	.options a{
		margin:0px 0px;				padding:0px 0px;
		font-size:16px; 			font-weight:700;
		display:block;
	}
	.header-bar li:hover .header-sub-menu{
		margin:0px 0px; 			padding:0px 0px;			
	}
	.header-bar a:hover{
		margin:0px 0px;				padding:0px 0px; 			
		font-size:16px;				font-weight:700;
		color:blue;	  				
	}
	.home{
		margin:0px 0px;				padding:0px 0px;		
	    display:grid;				place-items:center;
	}
	.containerbox{
	    width:100%;					
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:340px;				height:810px;
	    margin:60px 0px 0px 0px; 	padding:0px 0px;
	    background-color:#eee;	
	    outline:1px solid #007EE3;outline-offset:0px;
	    display:grid;				place-items:centre;
	    row-gap:0px;				column-gap: 0px;
	    background-color:#eee;	overflow:scroll;
	    position:relative;
	}
	.mainscreen{
    	scrollbar-width:none;		scrollbar-color:transparent;
	}
	.mainscreen::-webkit-scrollbar {width:6px;}
	.mainscreen::-webkit-scrollbar-thumb {background-color:transparent;}
	.screens {
	    width:333px;    			height:808px;		
		margin:1px 1px 3px 1px;		padding:0px 0px;			
		row-gap:0.5px;				column-gap:0.5px;
	    grid-template-columns: repeat(4, 1fr);	
	    grid-template-rows: repeat(10, 1fr);
	    row-gap:0.5px;				column-gap:0.5px;
	    background-color:#eee;	
	}
	.set{
	    width:90px;					height:80px;		
		margin:0px 0px;				padding:0px 0px;	
		background-color:#eee;		
	}
	.select1{width:24px;			height:26px;		margin:1px 0px 0px 1px;}
	.select2{width:9px;				height:10px; 		margin:1px 0px 0px 1px;}
	.select3{width:24px;			height:26px;		margin:1px 0px 0px 1px;}  
	.select4{width:9.5px;  			height:10px;		margin:1px 0px 0px 0.5px;}
	.select5{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select6{width:9.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.select7{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select8{width:24.5px;			height:26px;		margin:1px 0px 0px 0.5px;}
	.select9{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select10{width:24.5px;	 		height:26px;		margin:1px 0px 0px 0.5px;}
	.select11{width:9px;			height:10px;		margin:1px 0px 0px 1px;}  
	.select12{width:9px;			height:26px;		margin:1px 0px 0px 1px;}
	.select13{width:24px;			height:10px;		margin:1px 0px 0px 1px;}
	.select14{width:9px;			height:10px;		margin:1px 0px 0px 1px;}
	.select15{width:24.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.number{
	    font-size:5px;				font-weight:400;
	    display:grid;				place-items:center;
	}  
	.about-text p{
		width:340px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:340px;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:340px;				height:1150px;
		margin:0px 0px;				padding:0px 0px;
		display:inline;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box-img{display:grid;			place-items:center; }
	.box img{
	    width:300px;				height:250px;
	    margin:25px auto 0px auto;	padding:0px 0px;
	    outline:none;				outline-offset:0px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin		:50px 0px 0px}
	#image2{margin-right:0px}
	.box h1{
		margin:25px 20px 0px;		padding:0px 0px;
	    font-size:26px;				font-weight: 800;
	}
	.box p{
		margin:0px 20px;			padding:0px 0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:340px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}        
	.col{width: 100%;}
	.colorindication li{font-weight:500}
} 
@media ((max-width:340px) ){
	header{
		width:100%;					height:40px;
		margin:0px 0px;				padding:0px 0px;
	}
	.header-title{
		margin:15px 10px 9px 10px;	padding:0px 0px;			
		font-size:16px;				font-weight:700;
		line-height:1.0;			
	}
	#header-icon{
		width:40px;					height:40px;
		cursor:pointer;				display:initial;
		margin:0px 0px;				padding:0px 0px;	
	}
	i{	width:40px; 				height:40px;
		margin:0px 0px;				padding:0px 0px;	
		font-size:40px;}
    header .header-bar{
		top:-400px;					left:0;		right:0;
		margin:39.5px 0px 0px;		padding:0px 0px;
        position:absolute;
        display:flex;				flex-direction:column;			text-align:center;
		background:#f3faff;   
		color:#FFFFFF;         	transition:.3s;
	}
    header .header-bar.active{top:0px;}
    .header-bar a:last-child{margin-right:0px;}
	.options{padding:0px 0px; 	margin:10px 0px; }
	.options a{
		margin:0px 0px;				padding:0px 0px;
		font-size:16px; 			font-weight:700;
		display:block;				line-height:1.0;
	}
	.header-bar li:hover .header-sub-menu{
		margin:0px 0px; 			padding:0px 0px;			
	}
	.header-bar a:hover{
		margin:0px 0px;				padding:0px 0px; 			
		font-size:16px;				font-weight:700;
		color:blue;	  				
	}	
	.containerbox{
	    width:100%;					height:100%;
	    display:grid;				place-items:center;
	}
	.mainscreen {
		width:310px;				height:810px;
	    margin:50px 0px 0px 0px; 	padding:0px 0px;
	    background-color:#eee;	
	    outline:1px solid #007EE3;outline-offset:0px;
	    display:grid;				place-items:centre;
	    row-gap:0px;				column-gap: 0px;
	    background-color:#eee;	overflow:scroll;
	    position:relative;
	}
	.mainscreen{
    	scrollbar-width:none;		scrollbar-color:transparent;
	}
	.mainscreen::-webkit-scrollbar {width:6px;}
	.mainscreen::-webkit-scrollbar-thumb {background-color:transparent;}
	.screens {
	    width:333px;    			height:808px;		
		margin:1px 1px 3px 1px;		padding:0px 0px;			
		row-gap:0.5px;				column-gap:0.5px;
	    row-gap:0.5px;				column-gap:0.5px;
	    background-color:#eee;
	   	grid-template-columns: repeat(4, 1fr);	
	    grid-template-rows: repeat(10, 1fr);	
	}
	.set{
	    width:90px;					height:80px;		
		margin:0px 0px;				padding:0px 0px;	
		background-color:#eee;		
	}
	.select1{width:24px;			height:26px;		margin:1px 0px 0px 1px;}
	.select2{width:9px;				height:10px; 		margin:1px 0px 0px 1px;}
	.select3{width:24px;			height:26px;		margin:1px 0px 0px 1px;}  
	.select4{width:9.5px;  			height:10px;		margin:1px 0px 0px 0.5px;}
	.select5{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select6{width:9.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.select7{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select8{width:24.5px;			height:26px;		margin:1px 0px 0px 0.5px;}
	.select9{width:9px;				height:10px;		margin:1px 0px 0px 1px;}
	.select10{width:24.5px;	 		height:26px;		margin:1px 0px 0px 0.5px;}
	.select11{width:9px;			height:10px;		margin:1px 0px 0px 1px;}  
	.select12{width:9px;			height:26px;		margin:1px 0px 0px 1px;}
	.select13{width:24px;			height:10px;		margin:1px 0px 0px 1px;}
	.select14{width:9px;			height:10px;		margin:1px 0px 0px 1px;}
	.select15{width:24.5px;			height:10px;		margin:1px 0px 0px 0.5px;}
	.number{
	    font-size:5px;				font-weight:400;
	    display:grid;				place-items:center;
	}  
	.about-text p{
		width:310px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	}
	.about-images{
		width:310px;
		margin:0px auto 0px auto;	padding:0px  0px;
	    display:grid;				place-items:center; 
	    grid-template-rows:repeat(auto-fit,minmax(220px,auto));
	    grid-gap:1.5rem;
	}
	.box{
		width:310px;				height:1020px;
		margin:0px 0px;				padding:0px 0px;
		display:inline;				align-items:center;
		background:rgba(255, 255, 255, 0.9);
	}
	.box-img{display:grid;			place-items:center; }
	.box img{
	    width:290px;				height:250px;
	    margin:25px auto 0px auto;	padding:0px 0px;
	    outline:none;				outline-offset:0px;
		object-fit:cover;			box-shadow:5px 5px 5px rgb(0, 0, 0);
	}
	#image1{margin		:50px 0px 0px;}
	#image2{margin-right:0px}
	.box h1{
		margin:25px 10px 0px;		padding:0px 0px;
	    font-size:26px;				font-weight: 800;
	}
	.box p{
		margin:0px 10px;			padding:0px 0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:1.8;
	    color: #000000;
	}
	.text p{
		width:310px;
		margin:0px auto 0px auto;	padding:35px  0px;
		font-size:16px;				font-weight:500;
		text-align:justify;			line-height:2;
	}       
	.col{width: 100%;}
	.colorindication li{font-weight:500}
}