
a 
	{
	color: #000;
	text-decoration: none;
	font-weight: bold;
	}
a:hover 
	{
	color: #ff8000;
	}
header 
	{
	background: #DDD;
	width: 100%;
	height: 76px;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 100;
	}
nav 
	{
	float: right;
	padding: 5px;
	margin-top:10px;
	}
#logo
	{
	margin:0 auto;
	margin-left:5px;
	margin-top:11px;	
	float: left;
	width: 172px;
	height: 54px;
	background: url(logo.svg) no-repeat center;
	display: block;
	}
#menu-icon
	{
	display: hidden;
	width: 40px;
	height: 40px;
	background: #4C8FEC url(menu-icon.png) center;
	}
a:hover#menu-icon 
	{
	background-color: #444;
	border-radius: 4px 4px 0 0;
	}
ul 
	{
	list-style: none;
	}
li 
	{
	display: inline-block;
	float: left;
	padding: 10px;
	}
.current
	{
	color: #ff8000;
	}
/*320x 480 resolution **/
@media only screen and (min-width : 320px) and (max-width : 480px)
	{

	header 
		{
		position: fixed;
		}
	#menu-icon 
		{
		display:inline-block;
		margin-top:10px;
		margin-left:10px;
		}

	nav ul, nav:active ul 
		{ 
		display: none;
		position: absolute;
		padding: 20px;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px;
		}

	nav li 
		{
		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;
		margin-bottom:5px;
		border-radius:2px;
		background:#ff8000;
		}
	nav li a
		{
		color:#000;
		}
	nav li:hover
		{
		background-color:#fff;
		border:2px solid #ff8000;
		color:#000;
		}
	.current
		{
		border:2px solid #fff;
		color: #ff8000;
		}
	.current:hover
		{
		border:2px solid #ff8000;
		background: #fff;
		}
	nav:hover ul 
		{
		display: block;
		}
	.content
		{
		margin-top:0px;
		}
	.second-header-services h1
		{
		font-size:25px;
		}
	.second-header-services p
		{
		font-size:15px;
		}
	.second-header-services a
		{
		font-size:15px;
		padding:4px 8px;
		}
	.content
		{
		margin-top:0px;
		}
	.content-layer-standard-2 h2
		{
		font-size:25px;
		}
	.content-layer-standard-2 a
		{
		font-size:18px;
		padding:8px 10px;
		}
	.list-big
		{
		min-width:260px;
		width:auto;
		min-height:700px;
		height:auto;
		margin-right:20px;
		}
	.list-big h2
		{
		font-size:23px;
		text-align:center;
		}
	.list-big p
		{
		font-size:18px;
		text-align:center;
		}
	.list-big table
		{
		width:220px;
		height:30px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:10px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.screen-shot
		{
		min-width:205px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:205px;
		height:220px;
		}
	
	}


@media only screen and (max-width : 640px)
	{
	.screen-shot-1
		{
		min-width:200px;
		width:auto;
		min-height:200px;
		height:auto;
		font-size:15px;
		}
	p.test1 
		{
		width: 200px; 
		word-break: keep-all;
		}
	header 
		{
		position: fixed;
		}
	#menu-icon 
		{
		display:inline-block;
		margin-top:10px;
		margin-left:10px;
		}

	nav ul, nav:active ul 
		{ 
		display: none;
		position: absolute;
		padding: 20px;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px;
		}

	nav li 
		{
		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;
		margin-bottom:5px;
		border-radius:2px;
		background:#ff8000;
		}
	nav li a
		{
		color:#000;
		}
	nav li:hover
		{
		background-color:#fff;
		border:2px solid #ff8000;
		color:#000;
		}
	.current
		{
		border:2px solid #fff;
		color: #ff8000;
		}
	.current:hover
		{
		border:2px solid #ff8000;
		background: #fff;
		}
	nav:hover ul 
		{
		display: block;
		}
	.content
		{
		margin-top:0px;
		}
	.second-header-services h1
		{
		font-size:25px;
		}
	.second-header-services p
		{
		font-size:15px;
		}
	.second-header-services a
		{
		font-size:15px;
		padding:4px 8px;
		}
	.content
		{
		margin-top:0px;
		}
	.content-layer-standard-2 h2
		{
		font-size:25px;
		}
	.content-layer-standard-2 a
		{
		font-size:18px;
		padding:8px 10px;
		}
	.list-big
		{
		min-width:250px;
		width:auto;
		min-height:300px;
		height:auto;
		margin-left:10px;
		
		}
	.list-big h2
		{
		font-size:23px;
		text-align:center;
		}
	.list-big p
		{
		font-size:18px;
		text-align:center;
		}
	.list-big a
		{
		font-size:15px;
		text-align:center;
		}
	.list-big table
		{
		width:220px;
		height:30px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:10px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.matrix2-service
		{
		margin:0 auto;
		margin-left:17px;
		}
	.screen-shot
		{
		min-width:205px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:205px;
		height:220px;
		}
	}

	
@media only screen and (min-width : 641px) and (max-width : 767px)
	{
.screen-shot-1
		{
		min-width:200px;
		width:auto;
		min-height:200px;
		height:auto;
		font-size:15px;
		}
	p.test1 
		{
		width: 550px; 
		word-break: keep-all;
		}
	header 
		{
		position: fixed;
		}
	#menu-icon 
		{
		display:inline-block;
		margin-top:10px;
		margin-left:10px;
		}

	nav ul, nav:active ul 
		{ 
		display: none;
		position: absolute;
		padding: 20px;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px;
		}

	nav li 
		{
		text-align: center;
		width: 100%;
		padding: 10px 0;
		margin: 0;
		margin-bottom:5px;
		border-radius:2px;
		background:#ff8000;
		}
	nav li a
		{
		color:#000;
		}
	nav li:hover
		{
		background-color:#fff;
		border:2px solid #ff8000;
		color:#000;
		}
	.current
		{
		border:2px solid #fff;
		color: #ff8000;
		}
	.current:hover
		{
		border:2px solid #ff8000;
		background: #fff;
		}
	nav:hover ul 
		{
		display: block;
		}
	.content
		{
		margin-top:0px;
		}
	.second-header-services h1
		{
		font-size:25px;
		}
	.second-header-services p
		{
		font-size:15px;
		}
	.second-header-services a
		{
		font-size:15px;
		padding:4px 8px;
		}
	.content
		{
		margin-top:0px;
		}
	.content-layer-standard-2 h2
		{
		font-size:25px;
		}
	.content-layer-standard-2 a
		{
		font-size:18px;
		padding:8px 10px;
		}
	.list-big
		{
		min-width:93%;
		width:auto;
		min-height:300px;
		height:auto;
		margin-right:20px;
		}
	.list-big h2
		{
		font-size:23px;
		text-align:center;
		}
	.list-big p
		{
		font-size:18px;
		text-align:center;
		}
	.list-big table
		{
		width:220px;
		height:30px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:10px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.screen-shot
		{
		min-width:205px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:90%;
		height:220px;
		margin-right:60px;
		}
	
	}
	/** 768x1024 resolution **/	
@media only screen and (min-width : 768px) and (max-width : 1024px) 
	{

	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	
	nav
		{
		margin-top:10px;
		}		
	nav:hover ul 
		{
		display: block;
		}
	.content
		{
		margin-top:0px;
		}
	.second-header-services h1
		{
		font-size:30px;
		}
	.second-header-services p
		{
		font-size:20px;
		}
	.second-header-services a
		{
		font-size:20px;
		padding:4px 8px;
		}
	.content-layer-standard-2 h2
		{
		font-size:35px;
		}
	.content-layer-standard-2 a
		{
		font-size:23px;
		padding:8px 10px;
		}
	.list-big
		{
		min-width:93%;
		width:auto;
		min-height:300px;
		height:auto;
		margin-right:20px;
		}
	.matrix2-service
		{
		margin:0 auto;
		margin-left:25px;
		}
	.list-big table
		{
		width:350px;
		height:30px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:17px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.screen-shot
		{
		min-width:305px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:90%;
		height:220px;
		margin-right:60px;
		}
	.screen-shot-1
		{
		min-width:200px;
		width:auto;
		min-height:200px;
		height:auto;
		font-size:15px;
		}
	p.test1 
		{
		width: 550px; 
		word-break: keep-all;
		}
	}
	
	
@media only screen and (min-width : 1300px)
	{
	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	.list-big table
		{
		width:500px;
		height:40px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:17px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.list-big a
		{
		font-size:20px;
		}
	.list-big
		{
		margin-left:25px;
		}
	.screen-shot-1
		{
		min-width:200px;
		width:auto;
		min-height:200px;
		height:auto;
		font-size:15px;
		}
	p.test1 
		{
		width: 550px; 
		word-break: keep-all;
		}
	
	}

@media only screen and (min-width : 1025px)
	{
	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	.list-big table
		{
		width:350px;
		height:30px;
		margin:0 auto;
		}
	.list-big table tr td a
		{
		color:#fff;
		background:orange;
		font-size:18px;
		}
	.list-big table tr td a:hover
		{
		background:#fff;
		color:orange;
		border:1px solid orange;
		}
	.screen-shot
		{
		min-width:305px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:410px;
		height:350px;
		}
	.screen-shot-1
		{
		min-width:200px;
		width:auto;
		min-height:200px;
		height:auto;
		font-size:20px;
		}
	p.test1 
		{
		font-size:20px;
		width: 450px; 
		word-break: keep-all;
		}
	}
@media only screen and (min-width : 1026px) and (min-width : 1190px)
	{
	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	.screen-shot
		{
		min-width:305px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:480px;
		height:350px;
		}
	}
	
@media only screen and (min-width : 1230px)
	{
	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	.screen-shot
		{
		min-width:305px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:510px;
		height:350px;
		margin:0 auto;
		}
	}

@media only screen and (min-width : 1350px)
	{
	header 
		{
		position: fixed;
		}
	.current a
		{
		color:#ff8000;
		}
	.screen-shot
		{
		min-width:305px;
		width:auto;
		min-height:250px;
		height:auto;
		margin:0 auto;
		position:absolute;
		}
	.screen-shot img
		{
		width:560px;
		height:350px;
		margin:0 auto;
		}
	}
	
	