* {box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box;}
body {
	margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
    color: #444444;
    font-size: 14px;
    -webkit-font-smoothing: subpixel-antialiased;
    -moz-osx-font-smoothing: auto;
    background-color: #edeef0;
}
a {text-decoration: none; color: inherit;}
ul {padding: 0; margin: 0;}
li {list-style: none;}
h1 {font-weight: 400; font-size: 16px;}
h2, h3 {font-weight: 400; font-size: 14px;}
.main-txt h1 {font-weight: 400; font-size: 14px;}

#head-main {width: 100%; margin: 0 auto; min-height: 420px; background: #fff url(../images/bg.jpg) no-repeat; background-position: 0 60px; background-size: cover; box-shadow: 0 3px 5px rgba(0, 0, 0, 0.15); overflow: hidden;}
.top-head {position: relative; max-width: 1140px; margin: 0 auto; min-height: 54px; overflow: hidden;}
#head-page {width: 100%; margin: 0 auto; min-height: 54px; background: rgba(255, 255, 255, 0.95);
    box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); overflow: hidden;}
.logo {float: left; display: block; height: 54px; line-height: 54px; font-weight: bold; color: #444; font-size: 24px; padding: 0 10px; transition: 0.4s;} 
#head-page .logo {float: left; display: block; height: 54px; line-height: 54px; font-weight: bold; color: #444; font-size: 24px; padding: 0 10px; box-shadow: -1px 0 #eee inset, 0 0; border-right: 1px solid #fff;}

.logo i {font-style: normal; color: #1caad9;}
.logo:hover {color: #18a1cf; transition: 0.4s;}

.top-menu {float: right;}
.top-menu li {float: left;}
.top-cat {float: left; text-transform: uppercase;}
.top-tut {float: left; text-transform: uppercase;}

#head-page .top-menu li a { display: block; height: 54px; padding: 0 10px; line-height: 54px; color: #444; box-shadow: 1px 0 #fff inset, 0 0; border-left: 1px solid #eee;}
 .top-menu li a, .top-cat a, .top-tut a { display: block; height: 54px; padding: 0 10px; line-height: 54px; color: #444;}
.top-cat a {margin-left: 20px;}
#head-page .top-menu li a:hover, .top-menu li a:hover, .top-cat a:hover, .top-tut a:hover {color: #18a1cf;}

.search-page {position: absolute; left: 310px; right: 396px; background: #f1f1f1; top: 9px; height: 36px; border-radius: 3px; overflow: hidden;}
.search-page input {border: none;}
.search-page #story {height: 36px; line-height: 36px; width: 88%; padding: 0 10px; font-size: 14px; color: #999; border: 1px solid #f2f2f2; font-weight: 100;}
.search-page .srch-btn {
    float: right;
    height: 36px;
	width: 12%!important;
	background-color: #f1f1f1;
	background-image: url('../icons/search-ico.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 18px 18px;
	cursor: pointer;
    transition: 0.5s;
}
.srch-btn:hover {background-color: #00e39e; transition: 0.5s;}


.cat-ico {
    padding-left: 38px!important;
    background-image: url('../icons/cat-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 18px;
    background-size: 18px 18px;
}
.tut-ico {
    padding-left: 38px!important;
    background-image: url('../icons/tut-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 18px;
    background-size: 18px 18px;
}
.download-ico {
    padding-left: 32px!important;
    background-image: url('../icons/download.svg');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 14px 14px;
}
.upload-ico {
    padding-left: 38px!important;
    background-image: url('../icons/upload-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 18px;
    background-size: 18px 18px;
}
.login-ico {
    padding-left: 38px!important;
    background-image: url('../icons/login-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 18px;
    background-size: 18px 18px;
}
.reg-ico {
    padding-left: 38px!important;
    background-image: url('../icons/reg-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 18px;
    background-size: 18px 18px;
}
.size-ico {
    padding-left: 32px!important;
    background-image: url('../icons/size-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 14px 15px;
}
.dwnl-ico {
    padding-left: 32px!important;
    background-image: url('../icons/dwnl-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 14px 15px;
}
.format-ico {
    padding-left: 32px!important;
    background-image: url('../icons/format-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 14px 15px;
}
.catmini-ico {
    padding-left: 32px!important;
    background-image: url('../icons/catmini-ico.svg');
    background-repeat: no-repeat;
    background-position: 10px 10px;
    background-size: 14px 32px;
}
.user-log {
    line-height: 54px;
    width: 34px;
    height: 34px;
    background-image: url('../icons/user-ico.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 34px 34px;
    }


.head-block {max-width: 860px; height: auto; margin: 48px auto 24px; padding: 0 10px;}
.head-block h1 {margin-bottom: 34px; font-size: 24px; color: #fff; text-align: center; font-weight: 500;}
.head-block p {text-align: center; font-size: 16px; color: #fff;}
.search-main {box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); position: relative; width: 100%; height: 54px; margin-bottom: 12px; font-size: 18px; padding: 0 10px; line-height: 54px; color: #a0a0a0; background: #fff; border-radius: 3px; margin-top: 12px; overflow: hidden;}
.search-btn {float: right; width: 54px; height: 54px;
    background-image: url('../icons/search-ico.svg');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 30px 30px;
}

#icon-menu {position: absolute; height: 24px; width: 30px; cursor: pointer; right: 10px; top: -9999px;}
.sand-ico {display: block; margin-top: 4px; width: 20px; border-bottom: 3px solid #fefefe;}
#icon-menu:hover .sand-ico{border-bottom: 3px solid #00e39e;}

/* Search Main */
.search-main input {border: none;}
.search-main #story {width: 91%; padding: 0 1px; font-size: 18px!important; line-height: 54px; font-family: Verdana!important; color: #a0a0a0; vertical-align: inherit!important;}
.search-main .srch-btn {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 9%!important;
	background-color: #fff;
	background-image: url('../icons/search-ico.svg');
	background-repeat: no-repeat;
	background-position: center;
	background-size: 30px 30px;
	cursor: pointer;
    transition: 0.5s;
}
.srch-btn:hover {background-color: #f1f1f1; transition: 0.5s;}
/* END Search */

.upload-btn {
    position: relative;
    display: block;
    width: 185px;
    margin: 34px auto;
    padding-left: 28px;
    height: 54px;
    line-height: 54px;
    font-size: 18px;
    font-weight: 500;
    background: #fff;
    border-bottom: 1px solid rgba(0,0,0,.3);
    color: #232732;
    text-align: center;
    border-radius: 10px;
    background-image: url('../icons/upload.svg');
    background-repeat: no-repeat;
    background-position: 12px center;
    background-size: 24px 24px;
}
.upload-btn-vector {display: block; position: absolute; width: 8px; height: 8px; left: 16px; top: -16px; border: 8px solid transparent; border-bottom: 8px solid #fff;}
.upload-btn:hover .upload-btn-vector{border: 8px solid transparent; border-bottom: 8px solid #f1f1f1;}
.upload-btn:hover {background-color: #f1f1f1;}

#center {max-width: 1100px; margin: 15px auto 0; overflow: hidden;}
#wrap-content {float: left; width: 100%;}
#content {margin-right: 255px; overflow: hidden;}
#other {float: left; margin-right: 255px;}
#right {float: left; margin-left: -240px; width: 240px;}
/* FOOTER */
#footer {font-size: 12px; min-height: 250px; max-width: 1100px; margin: 30px auto 0; padding: 10px; border-top: 1px solid rgba(0,0,0,.09); box-shadow: 0 1px #fff inset;}
.footer-share {margin: 24px auto; overflow: hidden;}
.footer-share span {display: inline-block; margin: 0 4px;
    background-repeat: no-repeat;
    background-position: center;
    width: 34px;
    height: 34px;
    background-size: 34px 34px;
}
.fb {background-image: url('../icons/facebook.svg');}
.ins {background-image: url('../icons/instagram.svg');}
.pin {background-image: url('../icons/pinterest.svg');}
.vk {background-image: url('../icons/vk.svg');}

.footer-center-menu {overflow: hidden;}
.footer-center-menu ul {float: left; width: 33.333333%; text-align: center;}
.foot-title {line-height: 24px; color: #444!important; text-transform: uppercase; font-weight: bold!important;}
.footer-center-menu li {line-height: 24px; color: #777; font-weight: normal;}
.footer-line {display: block; width: 150px; margin: 24px auto; height: 2px; border-top: 1px solid rgba(0,0,0,.09); box-shadow: 0 1px #fff inset;}
.footer-copy {line-height: 18px; color: #777; text-align: center;}
#footer a:hover {text-decoration: underline;}
/* END FOOTER */

/* MAIN */
.main-board {margin-right: -10px; overflow: hidden;}
.wrap-main-model {float: left; width: 33.3333333%; padding: 0 10px 10px 0;}
.main-model {padding: 10px; background: #fff; box-shadow: 0 1px 0 0 #d7d8db, 0 0 0 1px #e3e4e8; border-radius: 3px;}
.main-model img {width: 100%; height: auto;}
.main-model-title {text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.main-model-cat {padding-top: 8px; color: #18a1cf; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.main-txt {margin-top: 20px; padding: 20px; font-size: 12px; line-height: 1.5; background: #fff; box-shadow: 0 1px 0 0 #d7d8db, 0 0 0 1px #e3e4e8; border-radius: 5px;}
/* end MAIN */
.h1cat {height: 40px; line-height: 40px; margin: 0 10px 20px 0; text-align: center; background: #fff; border: 1px solid #f1f1f1; border-radius: 5px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.white-board {
    margin-right: 20px;
    padding: 20px;
    font-size: 12px;
    line-height: 1.5;
    background: #fff;
    border: 1px solid #f1f1f1;
    border-radius: 5px;
    overflow: hidden;
}
/* PAGE */
.wrap-model {float: left; width: 100%;}
.model-block {margin-right: 255px; padding-bottom: 10px; background: #fff; border-radius: 5px 0 0 0;}
.model-block {min-height: 320px;}
.model-block img {width: 100%; height: auto; padding: 10px;}
#details {float: right; margin-left: -255px; width: 255px;}
.block-info {padding: 20px; background: #fff; border-radius: 0 5px 5px 0;}
.link-cat a {
    color: #555;
    line-height: 25px;
    background: #eee;
    display: inline-block;
    padding: 2px 10px;
    margin: 2px;
    border-radius: 4px;
}
.link-cat a:hover {text-decoration: none;}
.ads {
    margin-top: 15px;
    padding: 5px 0;
    margin-left: 15px;
    min-height: 540px;
    background-color: #fff;
    border-radius: 0 5px 5px 5px;
}
.ads img {width: 240px; height: auto;}
.ads img:hover {opacity: 0.7;}
.ads-main {
    clear: both;
	padding: 10px;
    height: auto;
    background-color: #fff;
	box-shadow: 0 1px 0 0 #d7d8db, 0 0 0 1px #e3e4e8;
    border-radius: 5px;
    margin-bottom: 15px;
}
#details h1 {margin-top: 0; color: #444;}
.model-btn {
	display: block;
	width: 100%;
	height: 40px;
	line-height: 40px;
	color: #444;
	text-align: center;
	background-color: #eee;
	border-radius: 3px;
    padding-left: 14px!important;
    background-image: url('../icons/download.svg');
    background-repeat: no-repeat;
    background-position: 16px 10px;
    background-size: 18px 18px;
}
.model-btn:hover {background-color: #ddd;}
#details ul li {padding: 10px 0; color: #666; font-size: 12px; overflow: hidden;}
#details ul li span {float: right; margin-right: 5px; color: #1caad9;}
#details li:first-child {padding: 0 0 20px; color: #676767; font-size: 14px; border-bottom: none; box-shadow: none;}
#other h2 {margin: 0; padding: 12px 15px; text-align: center; font-weight: 400; border-bottom: 1px solid #eee;}
.description {line-height: 1.5; font-size: 14px; background: #fff; border-top: 1px solid #f2f2f2; border-radius: 0 0 5px 5px;}
.description-txt {padding: 15px;}

.right-menu {background: #fff; background: rgba(255, 255, 255, 0.95); box-shadow: 0 1px 5px rgba(0, 0, 0, 0.15); border-radius: 5px;}
.right-menu li a {display: block; padding: 12px 20px; color: #444; border-bottom: 1px solid #fbfbfb; transition: 0.5s;}
.right-menu a:hover {color: #666; border-bottom: 1px solid #1caad9; transition: 0.5s;}
.pint {margin-top: 15px;}

.random-post {margin-top: 15px; background: #fff; box-shadow: 0 1px 0 0 #d7d8db, 0 0 0 1px #e3e4e8; border-radius: 5px; overflow: hidden;}
.random-post h3 {
    margin:0;
    background-color: #fff;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    color: #444;
    text-align: center;
    font-weight: normal;
    padding: 12px 15px;
}
.random-post li {width: 50%; float: left; padding: 0;}
.random-post li a {display: block; padding: 10px; color: #1caad9; border-right: 1px solid #ddd;}
.random-post-title {margin-bottom: 10px; padding: 3px 5px; font-size: 12px; color: #fff; background: #18a1cf; border-radius: 3px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
.random-post li img {width: 100%; height: auto;}
.random-post li a:hover {opacity: 0.7;}

/* TUTORIALS */
.wrap-tut {margin: 15px 0; padding: 10px; background: #fff; border-radius: 5px;}
.marL15 {margin-left: 15px;}
.marR10 {margin-right: 10px;}
.ads-top {margin: 0 0 15px; padding: 10px; background: #fff; border-radius: 5px;}
.tut-title a {color: #000; font-weight: 400; text-decoration: underline;}
.tut-title a:hover {text-decoration: none;}
.tut-txt {font-size: 12px; color: #666;}
/* FULL */
.tutorials-block {margin-top: 15px;}
.tutorials-block-title {margin: 15px 0; padding: 10px; color: #444; font-weight: 400; text-align: center; background: #fff; border-radius: 5px;}
.wrap-tut-full {float: left; width: 100%;}
.wrap-tut-full h1 {margin: 0; padding: 15px; font-size: 18px; font-weight: 500;}
.tut-block {margin-right: 255px; padding-bottom: 10px; background: #fff; border-radius: 5px 0 0 0;}
#details-tut {float: right; margin-left: -255px; width: 255px;}
.block-info-tut {position: relative; padding: 10px; background: #fff; border-radius: 0 5px 5px 0;}
.caret {
position: absolute;
    left: 5px;
    top: 20px;
    width: 0;
    height: 0;
    vertical-align: middle;
    border-right: 6px solid #49505a;
    border-bottom: 6px solid transparent;
    border-top: 6px solid transparent;
}
/* END FULL */
/* END TUTORIALS */

/* CATEGORY List */
.cat-box {padding: 15px; background: rgba(255, 255, 255, 0.95); border-radius: 5px;}
.cat-box h1 {text-align: center; color: #1caad9; font-weight: 400;}
.cat-list {margin: 20px 0 20px; padding-left: 40px; overflow: hidden;}
.cat-list a {display: block; line-height: 38px; font-size: 12px;}
.cat-list li {float: left; width: 33.33333%; text-align: left;}
.cat-list a:hover {color: #1caad9;}
/* END CATEGORY List */

/* NAVIGATE */
.navigate {clear: both; margin: 10px 10px; padding-top: 10px; min-height: 60px; line-height: 40px; overflow: hidden;}
.navigate span {margin-left: 8px; margin-right: 8px;}
.navigate a {margin: 0 0; padding: 6px 10px; background: #fff; color: #444; border: 1px solid #ccc; border-radius: 3px;}
.navigate a:hover {background-color: #18a1cf; color: #fff; border: 1px solid #18a1cf;}
/* END */

/* CONVERSATION */
.comm-board {
    height: auto;
    margin: 15px 0 0;
    background-color: #fff;
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 5px;
    overflow: hidden;
}
.conv {
    max-width: 100%;
    padding: 15px;
	background: #fff;
    overflow: hidden;
}
.conv-top-box {overflow: hidden; margin-bottom: 12px;}
.conv-img {float: left; width: 36px; height: 36px; margin-right: 12px;}
.conv-img img {width: 36px; height: 36px; border-radius: 50%;}
.conv-name {font-size: 14px; color: #18a1cf; line-height: 1.4;}
.conv-date {font-size: 12px; font-weight: 400; line-height: 1.4; color: rgba(0,0,0,.44);}
.conv-body {margin-left: 48px;}
.conv-sign {float: right; font-size: 12px; font-weight: 400; color: #999;}
.conv-sign a {color: #3394e6; text-decoration: underline; letter-spacing: 1px;}
.conv-sign a:hover {text-decoration: none;}

.addcomm-btn {clear: both; float: right; height: 32px; margin-top: 6px; padding: 0 17px; line-height: 32px; color: #fff; text-align: center; background: #1caad9; border: none; border-radius: 3px;}
.addcomm-btn:hover {background: #18a1cf; cursor: pointer;}
#comments {
    border-radius: 4px;
    height: 64px;
    font-size: 13px;
    border: none;
    color: rgba(0,0,0,.64);
    border-bottom: 1px solid #ccc;
    line-height: 1.5;
    transition: 0.1s;
}
/* END */

@media (max-width: 1120px) {
    #center, .search-bar {padding: 0 10px;}
}

@media (max-width: 1080px) {
	#content {margin-right: 215px;}	
	#right {margin-left: -200px; width: 200px;}
	#center {max-width: 1060px;}
	.top-bar {padding-right: 10px;}
	#details {margin-left: -200px; width: 200px;}
	.model-block {margin-right: 215px;}
    #other {margin-right: 215px;}
    #details ul li span {float: none;}
}

@media (max-width: 960px) {
	#warp-content {float: none; width: 100%;}
	#content {margin-right: 0;}
	#right {clear: both; margin-left: 0; margin-top: 15px; width: 100%;}
	.main-board {padding-right: 0; margin-right: -10px;}
	.main-txt {margin-right: 0; margin-bottom: 20px;}
    .cat-list li {width: 50%;}
}

@media (max-width: 640px) {
    .wrap-main-model {width: 50%;}
	.wrap-model {float: none;}
	#details {clear: both; float: none; margin-top: 15px; margin-left: 0; width: 100%;}
	.model-block {margin-right: 0;}
	#other {float: none; width: 100%; margin-right: 0;}
    .random-post li {width: 50%;}
    .random-post li a {border-top: 1px solid #ddd;}
    .cat-list {padding-left: 15px;}
}
@media (max-width: 480px) {
 	.cat-list li {width: 100%;}   
}


/* Формы на UL */ 
	.addform ul.ui-form { list-style: none; padding: 0; margin: 0; }
		.addform ul.ui-form > li { margin-bottom: 20px; }
		.addform ul.ui-form > li:last-child { margin-bottom: 0; }
		.addform .form-group { margin-bottom: 20px; }
		.addform .form-group > label { display: block; margin-bottom: .4em; }
		.addform .imp:after { content: "*"; margin: 0 0 0 10px; color: #e85319; }

		@media only screen and (min-width: 601px) {
		.addform .form-group.combo:after { clear: both; display: table; content: ""; }
		.addform .form-group.combo > .combo_field { width: 50%; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;}
		.addform .form-group.combo > .combo_field:last-child { padding-left: 10px; }
		.addform .form-group.combo > .combo_field:first-child { padding-right: 10px; }
		}
		.addform .form_submit { margin-top: 20px; }
		.addform .form-sep { border-top: 1px solid #efefef; }

/* ADS */
.ads-top-link {margin: 15px 0;}
.useful {margin: 15px 0 0; padding: 10px; font-size: 14px;}
.useful a {color: #18a1cf;}
.useful a:hover {text-decoration: none;}


