html{color:#000;overflow-y: scroll;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}

*, *:before, *:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*:focus {
	outline: none;
}

body {
	font-family: 'Ubuntu', sans-serif;
	font-size: 14px;
	background: #fff;
	width: 100%;
}

a {
	text-decoration: underline;
	color: #066997;
}
a:hover {
	text-decoration: none;
	color:#3db4a8;
}

b,strong {
	font-weight: 600;
}

p {
	line-height: 20px;
	margin-bottom: 3px;
	/*text-align: justify;*/
}

small {
	font-size: 8pt;
	line-height: 10px;
}

h1 {
	font-size: 24px;
}

h2 {
	font-size: 24px;
}

h3 {
	font-size: 24px;
}

pre {
	font-family: 'Ubuntu', sans-serif;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 20px;
	overflow-y: hidden;
    max-width: 100%;
}

.clear {
    clear: both;
    display: block;
    overflow: hidden;
    visibility: hidden;
    width: 0;
    height: 0;
	float: none;
}

/************************************/

.wrapper {
	width: 1200px;
	margin: 0 auto;
}

.left {
	float: left;
}

.right {
	float: right;
}

.header {
	padding: 15px 20px;
}

	#mob-menu {
		background-image: url(../images/mob-menu.svg);
		background-repeat: no-repeat;
		background-size: 30px;
		width: 30px;
		height: 30px;
		cursor: pointer;
		display: none;
	}

	.header a.logo {
		color: #000;
		text-decoration: none;
		font-size: 30px;
		display: block;
		background: url(../images/logo.svg);
		background-repeat: no-repeat;
		background-size: 50px;
		height: 50px;
		padding-left: 60px;
	}
		.header a.logo > span {
			display: block;
			font-size: 11px;
		}

#mob-catalog-box {
	display: none;
}

	#mob-catalog-box > .categories {
		box-shadow: none;
		border-top: 1px solid #eceeef;
		margin-bottom: 5px;
	}
	
		#mob-catalog-box > .categories > h2 {
			padding: 10px 23px;
		}
		
		#mob-catalog-box > .categories > ul.catalog {
			padding: 5px 0;
		}
		
		#mob-catalog-box > .categories > ul.catalog > li > a {
			padding: 5px 0px 5px 25px;
		}
		
.body {
	width: 100%;
	padding: 0px;
	background: linear-gradient(45deg, #ffe35c, #a0e4f8);
	color: #000;
}
		.catalog-box {
			float: left;
			width: 220px;
			margin: 20px;
		}
			
			.categories {
				background-color: #fff;
				box-shadow: 0px 3px 5px 0 rgba(174,174,174,0.5);
				margin-bottom: 20px;
			}
				.categories h2 {
					padding: 20px;
					font-size: 24px;
					border-bottom: 1px solid #eceeef;
				}
				ul.catalog {
				
				}
				ul.catalog > li {
					position: relative;
					background-size: 8px 8px;
					background-image: url(../images/rarrow-b.svg);
					background-repeat: no-repeat;
					background-position: 10px center;
				}
				ul.catalog > li > a {
					text-transform: uppercase;
					color: #58697a;
					display: block;
					font-size: 12px;
					line-height: 18px;
					padding: 11px 0px 10px 25px;
					text-decoration: none;
				}
				ul.catalog > li > a:hover {
					color: #fff;
				}
				ul.catalog > li:hover {
					background-color: #3db4a8;
					color: #fff;
					background-image: url(../images/rarrow-w.svg);
				}
				ul.catalog > li.selected {
					background-color: #3db4a8;
					background-image: url(../images/rarrow-w.svg);
					color: #fff;
				}
				ul.catalog > li.selected > a,
				ul.catalog > li.selected:after {
					color: #fff;
				}
				
				ul.catalog > li > ul.subcat {
				
				}
					ul.subcat li {
					
					}
					ul.subcat > li > a {
						text-transform: uppercase;
						color: #58697a;
						display: block;
						font-size: 11px;
						line-height: 18px;
						padding-left: 25px;
						text-decoration: none;
					}
					ul.subcat > li > a:hover {
						color: #3db4a8;
					}
					
		.page-box {
			margin-left: 260px;
			margin-right: 20px;
			padding-top: 20px;
		}
		
		.page-content {
			background-color: #fff;
			padding: 20px;
			box-sizing: border-box;
			border-radius: 0px;
			box-shadow: 0px 3px 5px 0 rgba(174,174,174,0.5);
			font-size: 14px;
			margin-bottom: 20px;
		}
			
			.mainpage h2 {
				margin: 0px !important;
			}
			
			.head-title-sort {
				overflow: hidden;
				margin-bottom: 20px;
			}
				
				.head-title {
					
				}
				
				.head-sort {
					text-align: center;
					margin-top: 20px;
					line-height: 60px;
				}
				
					.head-sort > a {
						padding: 10px 15px;
						margin: 10px;
						color: #3db4a8;
						border: 1px solid #3db4a8;
						background: #fff;
						text-decoration: none;
						font-size: 16px;
						white-space: nowrap;
					}
					
					.head-sort > a:hover,
					.head-sort > a.active {
						background: #3db4a8;
						color: #fff;
					}
			
			.page-content h2{
				margin: 20px 0;
			}
			
			.page-content h3 {
				/*margin-bottom: 20px;*/
			}
			
			.page-content ul.app_list {
				text-align: center;
				margin-bottom: 10px;
			}

				li.app_box {
					display: inline-block;
					width: 100px;
					margin: 15px;
				}
					
					.paragraph-end {
						background-image: -webkit-gradient(linear,left top,right top,color-stop(0%,rgba(255,255,255,0)),color-stop(100%,rgba(255,255,255,1)));
						background-image: -webkit-linear-gradient(left,rgba(255,255,255,0),rgba(255,255,255,1));
						background: linear-gradient(to right,rgba(255,255,255,0),rgba(255,255,255,1));
						filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1,StartColorStr='#00ffffff',EndColorStr='#ffffff');
						bottom: 0;
						height: 25px;
						max-height: 100%;
						position: absolute;
						right: 0;
						width: 60px;
					}
					
					span.mask2 {
						display: block;
						position: absolute;
						top: 0;
						left: 0;
						z-index: 1;
						width: 100px;
						height: 100px;
						background: url(../images/mask175.png) 0 0 no-repeat;
						background-size: 100px 100px;
					}
					
					
					
					.app_box .app_icon {
						max-width: 100%;
					}
					
					.app_box .app_icon a {
						width: 100px;
						height: 100px;
						display: block;
						overflow: hidden;
						position: relative;
					}
					
					.app_box .app_icon img {
						max-width: 100%;
					}
					.app_box .app_name {
						font-size: 12px;
						line-height: 17px;
						margin-bottom: 0;
						margin-top: 3px;
						min-height: 17px;
						display: block;
						overflow: hidden;
						position: relative;
						white-space: nowrap;
					}
						.app_box .app_name a  {
							font-weight: bold;
							color: #757575;
							text-decoration: none;
						}
						.app_box .app_name a:hover {
							color: #3db4a8;
						}
						
						.app_box .app_name .paragraph-end {
							height: 19px;
							width: 45px;
						}
					
						.app_box .app_price {
							font-size: 11px;
							width: 100%;
							background-color: #f2e18c;
							padding: 3px 5px;
							text-align: center;
							margin-top: 6px;
						}

			
			.page-content .pagination {
				text-align: center;
			}
				.page-content .pagination a {
					display: inline-block;
					padding: 10px 20px;
					background-color: #3db4a8;
					border: 1px solid #3db4a8;
					color: #fff;
					text-decoration: none;
					font-weight: 700;
					font-size: 14px;
					margin: 5px;
				}
				
				.page-content .pagination a:hover {
					color: #3db4a8;
					background-color: #fff;
				}
				
			.comments {
				margin-bottom: 20px;
				box-shadow: 0px 3px 5px 0 rgba(174,174,174,0.5);
			}
			
			.app_main_info {
				overflow: hidden;
				width: 550px;
				margin: 0 auto;
			}
				
				.app_image {
					float: left;
					width: 175px;
				}
				
					.app_image img {
						max-width: 100%;
						
					}
				
				.app_short_info {
					padding: 10px 20px;
					min-width: 250px;
					float: left;
					font-size: 15px;
				}
					
					.app_short_info div {
						margin-bottom: 10px;
					}
					
					.app_short_info span.app_price {
						color: #fff;
						font-size: 25px;
						padding: 10px 20px;
						background-color: #3db4a8;
						line-height: 68px;
					}
			
			.app_description {
				margin-bottom: 20px;
				line-height: 18px;
			}
			
				.app_description img {
					margin: 20px auto;
					display: block;
					max-width: 100%;
				}
				
				.app_description ul {
					margin: 10px;
				}
					.app_description ul li {
						margin-left: 25px;
						list-style-type: disc;
					}
				
				.app_description h3 {
					text-align: left;
				}
			
			.bx-wrapper {
				box-shadow: none !important;
			}
				
				.bx-wrapper img {
					margin: 0 auto;
				}
			
			.download-link {
				text-align: center;
				margin: 20px 0;
			}
			
				.download-link a {
					max-width: 400px;
					display: block;
					background-color: #65c178;
					text-decoration: none;
					color: #fff;
					font-size: 18px;
					padding: 15px;
					margin: 0 auto;
				}
				
				.download-link a:hover{
					background-color:#3db4a8
				}
			
.footer {
	width: 100%;
	background: #fff;
	color: #ABABAB;
	padding: 20px 30px;
	line-height: 20px;
}
	.footer a {
		color: #ABABAB;
		text-decoration: underline;
	}
	.footer a:hover {
		text-decoration: none;
	}
	
	#top {
		background-image: url(../images/top.svg);
		background-repeat: no-repeat;
		background-size: 20px;
		width: 20px;
		height: 20px;
		cursor: pointer;
	}
	
.bfooter {
	margin-top: 20px;
}
	
.rbox {
	min-width: 320px;
	width: 100%;
	display: block;
	margin-bottom: 20px;
}

.dt_title {
	font-size: 20px;
}

@media screen and (max-width: 1200px) {
	
	.wrapper {
		width: 100%;
	}
	
}

@media screen and (max-width: 1020px) {
	
	.wrapper {
		width: 100%;
	}
	
	.head-title {
		float: none;
	}
	
	.rbox {
		margin-top: 20px;
	}
	
}

@media screen and (max-width: 800px) {
	
	.wrapper {
		width: 100%;
	}
	
	#mob-menu {
		display: block;
	}
	
	.header a.logo {
		font-size: 22px;
		background-size: 30px;
		height: 30px;
		padding-left: 40px;
		line-height: 30px;
	}
	
		.header a.logo > span {
			display: none;
		}
	
	h1 {
		font-size: 18px;
		text-align: center;
	}
	
	.page-content h2, 
	.page-content h3, 
	h2, h3 {
		font-size: 16px;
		text-align: center;
	}
	
	.catalog-box {
		display: none;
	}
	
	.page-box {
		margin-left: 20px;
	}
	
	li.app_box {
		margin: 15px;
	}
	
	.footer-text {
		display: none;
	}
	
}

@media screen and (max-width: 600px) {
	
	.app_image {
		float: none;
		margin: 0 auto;
	}
	
	.app_short_info {
		float: none;
		padding: 0;
	}
	
	.app_main_info {
		width: 100%;
	}
	
	.head-sort {
		line-height: 35px;
	}
	
		.head-sort > a {
			display: block;
			padding: 0px;
		}
		
}

@media screen and (max-width: 400px) {
	
	.page-content {
		box-shadow: none;
	}
	
	.page-box {
		margin-left: 0;
		margin-right: 0;
		padding-top: 5px;
	}
	
	.footer {
		padding: 20px;
	}
	
	.rbox {
		position: relative;
		left: -20px;
		width: calc(100% + 40px);
	}
		
}