.mainpage-menu-top-wrapper {position: relative; height: 45px;}
.mainpage-menu-top {position: fixed; left: 0px; right: 0px; top: 0px; background: #f3f5f6; z-index: 10;}

/*Last acheivement attention*/
.mainpage-attention {margin-top: 30px; padding: 10px; border: 1px solid #b2d8ee; text-align: center; background: #e4f0f7;}

/*Login form*/
.mainpage-signup-form {min-width: 320px; margin: 30px 0px; padding: 150px 0px; color: #ffffff; background: url(/files/images/illustrations/01_form.jpg) 50%/cover;}
.mainpage-signup-form-content {position: relative; width: 800px; margin: auto;}
.mainpage-signup-form-title {line-height: 50px; margin-bottom: 10px; text-align: right; text-transform: uppercase; font-size: 40px; font-weight: normal;}
.mainpage-signup-form-field {position: relative; height: 50px; margin-bottom: 10px; padding-top: 16px;}
.mainpage-signup-form-field input {height: 34px; line-height: 34px; border-bottom: 2px solid #ffffff; transition: 0.2s all;}
.mainpage-signup-form-field label {position: absolute; top: 16px; width: 100%; height: 34px; line-height: 34px; padding: 0px 10px; cursor: text; white-space: nowrap; overflow: hidden;
	transition: 0.2s all;
}
.mainpage-signup-form-field.active label {top: 0px; height: 16px; line-height: 16px; font-size: 12px;}
.mainpage-signup-form-field.active input {background: rgba(255, 255, 255, 0.1);}
.mainpage-signup-form-field.field-error label {color: #ba3f5f;}
.mainpage-signup-form-field.field-error input {border-color: #ba3f5f;}
.mainpage-signup-form .response-block {min-height: 100px;}
.mainpage-signup-form .response-block>* {position: relative; margin: 5px 0px; padding-left: 20px; cursor: pointer; color: #ffffff; background: #ba3f5f;}
.mainpage-signup-form .response-block>*:after {content: ""; position: absolute; left: 0px; top: 0px; width: 20px; height: 20px;}
.mainpage-signup-form .response-block>*:hover:after {background: url(/files/images/links/close_white.png) no-repeat center/60% 60%;}
.mainpage-signup-form-button {line-height: 30px; padding: 10px; text-align: center; background: #3fba46;}

/*Dashboard*/
.mainpage-dashboard {width: 600px; min-width: 320px; margin: 30px auto;}
.mainpage-dashboard-item {float: left; display: block; margin: 5px 0.5%; text-align: center; color: #e3e6e8;}
.mainpage-dashboard-item:hover {outline: 2px solid #8b9397;}
.mainpage-dashboard-item img {display: inline-block; vertical-align: middle; width: 30px; height: 30px; margin-right: 5px;}
.mainpage-dashboard-item-new-advert {width: 99%; padding: 20px 10px; background: #a41ac5;}
.mainpage-dashboard-item-settings {width: 49%; padding: 20px 10px; background: #007fc6;}
.mainpage-dashboard-item-messenger {width: 49%; padding: 20px 10px; background: #3fba46;}
.mainpage-dashboard-item-orders {width: 49%; padding: 20px 10px; background: #3fba46;}
.mainpage-dashboard-item-favorites {width: 49%; padding: 20px 10px; background: #007fc6;}

/*Advantages*/
.mainpage-advantage-list-wrapper {min-width: 320px; margin: 30px 0px; padding: 150px 0px; color: #ffffff; background: #007fc6;}
.mainpage-advantage-list {width: 800px; margin: 0px auto;}
.mainpage-advantage-item {width: 390px; height: 80px; font-size: 0rem;}
.mainpage-advantage-item img {display: inline-block; vertical-align: middle; width: 70px; height: 70px; margin: 5px;}
.mainpage-advantage-text {display: inline-block; vertical-align: middle; width: 310px; line-height: 20px; font-size: 16px;}

/*Learn more button*/
.mainpage-learnmore {display: block; min-width: 320px; margin: 80px 0px; padding: 50px 0px; text-align: center; color: #ffffff; background-color: #3fba46;}

/*Root symbols*/
.mainpage-symbol-list-wrapper {position: relative; height: 220px; margin-bottom: 90px; padding: 0px 70px; overflow: hidden;}
.mainpage-symbol-list-arrow {position: absolute; top: 0px; width: 70px; height: 220px; cursor: pointer; opacity: 0.3; background-size: 200% auto; background-position: 0% 0%;}
.mainpage-symbol-list-arrow-prev {left: 0px; background-image: url(/files/images/links_pages/arrow-prev.png);}
.mainpage-symbol-list-arrow-next {right: 0px; background-image: url(/files/images/links_pages/arrow-next.png);}
.mainpage-symbol-list-wrapper:hover .mainpage-symbol-list-arrow {opacity: 1;}
.mainpage-symbol-list-arrow.inactive {cursor: not-allowed; background-position: 0% 100%;}
.mainpage-symbol-list {position: relative; height: 270px; font-size: 0rem; white-space: nowrap; overflow-x: overlay; overflow-y: hidden;}
.mainpage-symbol-item {position: relative; display: inline-block; width: 400px; height: 200px; margin: 10px; border-radius: 5px; overflow: hidden;}
.mainpage-symbol-item-image img {position: absolute; left: -1000px; right: -1000px; top: -1000px; bottom: -1000px; min-width: 100%; max-height: none; min-height: 100%; margin: auto;
	transition: 0.7s all;
}
.mainpage-symbol-item-title {position: absolute; left: 0px; right: 0px; bottom: 0px; height: 70px; line-height: 30px; padding: 5px 10px; text-align: right; font-size: 20px; color: #ffffff;
	overflow: hidden; background: rgba(0, 0, 0, 0.5); background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.5) 100%);
}
.mainpage-symbol-item-title-text {position: absolute; right: 10px; bottom: 10px;}
.mainpage-symbol-item:hover .mainpage-symbol-item-image img {transform: scale(1.05);}



/*Page About the project*/
.about-block {position: relative; margin: 20px 0px; border: 1px solid #bac1c4; border-radius: 10px; overflow: hidden;}
.about-block-image {position: relative; min-height: 160px;}
.about-block-image img {width: 100%; min-height: 160px;}
.about-block-image h2 {position: absolute; left: 0px; right: 0px; top: 0px; min-height: 120px; line-height: 40px; padding: 20px; text-align: right; font-size: 30px; color: #ffffff;
	background: rgba(0, 0, 0, 0.7); background: linear-gradient(to bottom, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
}
.about-block-text {padding: 20px; background: #e3e6e8;}
.about-block-text h2 {line-height: 30px; text-align: center;}
.about-block-text p {text-indent: 30px; text-align: justify;}
.about-block-text a {color: #007fc6;}
.about-block-text a:hover {text-decoration: underline;}



/*Content nodes*/
.node-block {margin: 20px 0px; padding: 50px 20px; border: 1px solid #bac1c4; border-radius: 5px; background: #e3e6e8;}
.node-block p {text-indent: 30px; text-align: justify;}
.node-block a {color: #007fc6;}
.node-block a:hover {text-decoration: underline;}