/*
 * Product: UkrSocialNetwork
 * Author: Edward Nemirovskiy
 * Developer: Edward Nemirovskiy
 * Frontend: Pasha Filipchik
*/

body {font-size:16px;margin: 0;font-family: "Open Sans", sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;background: url('/img/bg.png') no-repeat;-webkit-font-smoothing: antialiased;-webkit-overflow-scrolling: touch;}

.centered {text-align:center;}

/* HEADER */
.navbar {padding-top: 60px;padding-bottom: 30px;}

.logotype {padding: 0 15px;height: 60px;}

.navbar .navbar-nav > li > a {
    color: #ffffff;
    font-weight:300;
    text-transform:uppercase;
}
.navbar .navbar-nav > li > a:hover {
    opacity:0.7;
    background:0;
}
.navbar-inverse {
    background: 0;
    border: 0;
}
.navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form {border:0}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {color: #ffffff;background-color: #2399c4;}
.navbar-inverse .navbar-toggle {outline:none;border:0;margin-top: 15px;}
.navbar-inverse .navbar-toggle:hover{background:rgba(87, 112, 168, 0.48);}
.navbar-inverse .navbar-toggle:active {background:#4d629f;}
.navbar-inverse .navbar-toggle:focus {background:#4d629f;}

/* CONTENT */
.landing-content {
    color: #fff;
    margin-bottom: 30px;
}

.h1, h1 {
    font-size: 4.0rem;
    font-weight: bold;
    font-family: Roboto,"Segoe UI","Helvetica Neue",Arial,sans-serif;
}
.landing-content>* {
    color: inherit;
    margin-bottom: 45px;
}
.btn {
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    user-select: none;
    border: 1px solid transparent;
    padding: 1.1rem;
    font-size: .812rem;
    line-height: 1.5;
    border-radius: .25rem;
    transition: all .15s ease-in-out;
}
.btn-md, .btn-md-2 {
    border-radius: .3rem;
}
.btn {
    color: #fff;
    margin-bottom: 15px;
    position: relative;
}
.btn-md {
    padding: 1.4rem 4.5rem;
    font-size: 1.4rem;
}
.btn-border {
    border: 2px solid;
}
.btn:hover {
    opacity: 0.8;
    color: #fff;
}
.btn:active {
    opacity: .8;
    color: #fff;
}
.btn:focus {
    opacity: .8;
    color: #fff;
}

/* REG FORM */
.reg_form {
    background: #fff;
    border-radius: 3px;
}
.reg_form .header {
    padding: 20px;
    border-bottom: 1px solid #e6ecf5;
    color: #515365;
}
.reg_form .reg_content {
    padding: 30px;
}
.form-control {width: 100%;}
.newinput {
    padding: 8px 18px;
    line-height: 1.8;
    background-clip: padding-box;
    border: 1px solid #d1d7e2;
    border-radius: 5px;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    box-shadow: none;
    margin-bottom: 10px;
}
.newinput:focus {border:1px solid #c7c7c7; box-shadow:none;}

.reg_form .reg_content .rememb {
    display: block;
    width: 100%;
    height: 40px;
    margin-bottom: 10px;
}
.reg_form .reg_content .rememb .help_auth {
    color: #888da8;
    display: inline-block;
    padding: 10px;
    float: right;
    font-size: 14px;
}

.btn_auth {width: 100%;padding: 17px;background: #2ab77e;color: #fff;border-radius: 3px;cursor: pointer;font-size: 15px;transition: background 0.3s;}
.btn_auth:hover {background: #2dce8d;}
.btn_auth:active {background: #22a771;}

.reg_form .click_reg {
    border-bottom: 1px solid #e6ecf5;
}
.reg_form .click_reg .open_ul:hover {opacity: 0.9;}
.reg_form .click_reg .open_ul {
    padding: 20px;
    display: inline-block;
    width: 50%;
    text-align: center;
    background: #7784925e;
    color: #778492;
    cursor: pointer;
    border-right: 1px solid #808f9e57;
    transition: all 0.1s;
}
.reg_form .click_reg .active {background: #77849294 !important;color: #616d79;}
.reg_form .click_reg .reg_open {border:0;float: right;}

.reg_form .reg_content_form {
	display:none;
	padding: 30px;
}
.reg_form .reg_content_form .rememb {
    display: block;
    width: 100%;
    height: 40px;
    margin-bottom: 10px;
}
.reg_form .reg_content_form .rememb .help_auth {
    color: #888da8;
    display: inline-block;
    padding: 10px;
    float: right;
    font-size: 14px;
}
.reg_form .input_register {
    display: inline-block;
    width: 49.2%;
}

@media (max-width: 768px) {
.left-reg-info {display:none;}
}

.dark-select {
    padding: 13px 5px 13px;
    border-radius: 2px;
    border: 1px solid #d3d9de;
    box-sizing: border-box;
    outline: none;
    color: #b4b4b4;
    margin-bottom: 12px;
}

#country, #city {width: 49%;float: left;margin-bottom: 14px;}
#country {margin-right: 9px;}

@media (max-width: 726px) {
    #country, #city {width:100% !important;}
    .reg_form .input_register {width:48%;}
}

/* NEW MENU MOBILE */
.mobile-version {display:none;}
@media (max-width: 767px) {
   .pc-version {display:none;}
   .mobile-version {display:block;}
}

/* NOTIFY NEW */

#gritter-notice-wrapper {
    top: 6rem
}

.gritter-item-wrapper {
    background: #3d3f42;
    -webkit-box-shadow: 0 0 .307rem rgba(0, 0, 0, .25);
    box-shadow: 0 0 .307rem rgba(0, 0, 0, .25);
    margin-bottom: 20px;
    cursor: pointer;
    border-radius: 4px;
}

.gritter-item {
    font-family: "Open Sans", sans-serif;
    background: 0 0;
    color: #FFF;
    padding: 0;
    display: table;
    table-layout: fixed;
    width: 100%
}

.gritter-icon-container,
.gritter-img-container {
    display: table-cell;
    width: 26%;
    vertical-align: middle;
    text-align: center
}

.gritter-image {
    float: none;
    width: 4.61538rem;
    height: 4.61538rem;
    border-radius: 50px;
}

.gritter-content {
    width: auto
}

.gritter-with-image,
.gritter-without-image {
    padding: 16px 30px 27px 75px;
    color: #545454;
    width: 23rem;
    display: table-cell;
}

.gritter-with-image p,
.gritter-without-image p {
    font-size: 12px;
    line-height: 1.5;
    color: #f6f7fb;
}

.gritter-without-image {
    padding-left: 1.461rem
}

.gritter-close:hover {
    color: #807f7f
}

.gritter-clean .gritter-item,
.gritter-clean .gritter-item .gritter-content,
.gritter-clean .gritter-item .gritter-content .gritter-close:after {
    color: #545454
}

.gritter-close:after {
    content: '\e680';
    font-family: "Stroke 7";
    font-size: 1.525rem;
    text-shadow: none;
    line-height: 1
}

.gritter-title {
    text-shadow: none;
    font-weight: 300;
    font-size: 14px;
    color: #f6f7fb;
}

.gritter-clean {
    background: #FFF
}

.gritter-clean .gritter-item .gritter-img-container {
    background-color: #fafafa
}

.gritter-clean .gritter-item .gritter-content .gritter-close {
    opacity: .5
}

.gritter-social .gritter-icon {
    font-size: 2.8rem
}

.gritter-social .gritter-content {
    padding-left: 0;
    width: 21.6rem
}

.gritter-social.facebook .gritter-icon-container {
    color: #5d82d1
}


.gritter-social.twitter .gritter-icon-container {
    color: #50bff5
}



.gritter-social.google-plus .gritter-icon-container {
    color: #eb5e4c
}



.gritter-social.dribbble .gritter-icon-container {
    color: #f7659c
}


.gritter-social.flickr .gritter-icon-container {
    color: #0063dc
}


.gritter-social.linkedin .gritter-icon-container {
    color: #238cc8
}


.gritter-social.youtube .gritter-icon-container {
    color: #ef4e41
}

.gritter-social.pinterest .gritter-icon-container {
    color: #e13138
}

.gritter-social.github .gritter-icon-container {
    color: #333
}

.gritter-social.tumblr .gritter-icon-container {
    color: #426d9b
}

.gritter-theme {
    background-color: #323232
}

.gritter-theme .gritter-title {
    color: #2cc185
}

.gritter-color .gritter-content,
.gritter-theme .gritter-content {
    color: #FFF
}

.gritter-color .gritter-close {
    color: #FFF;
    opacity: .7
}

.gritter-color .gritter-close:hover {
    opacity: 1
}

.gritter-color.primary,
.gritter-color.success {
    background: #2cc185
}

.gritter-color.info {
    background: #58C7EF
}

.gritter-color.warning {
    background: #FFDC42
}

.gritter-color.danger {
    background: #F45846
}

.gritter-color.dark {
    background: #545454
}
/* the norm */
#gritter-notice-wrapper {
	position:fixed;
	top:20px;
	right:20px;
	width:301px;
	z-index:9999;
}
#gritter-notice-wrapper.top-left {
    left: 20px;
    right: auto;
}
#gritter-notice-wrapper.bottom-right {
    top: auto;
    left: auto;
    bottom: 20px;
    right: 20px;
}
#gritter-notice-wrapper.bottom-left {
    top: auto;
    right: auto;
    bottom: 20px;
    left: 20px;
}
.gritter-item-wrapper {
	position:relative;
	margin:0 0 10px 0;
	background:url('../images/ie-spacer.gif'); /* ie7/8 fix */ 
}
.gritter-top {
	background:url(../images/gritter.png) no-repeat left -30px;
	height:10px;
}
.hover .gritter-top {
	background-position:right -30px;
}
.gritter-bottom {
	background:url(../images/gritter.png) no-repeat left bottom;
	height:8px;
	margin:0;
}
.hover .gritter-bottom {
	background-position: bottom right;
}

.hover .gritter-item {
	background-position:right -40px;
}
.gritter-item p {
	padding:0;
	margin:0;
	word-wrap:break-word;
}
.gritter-image {
	width:48px;
	height:48px;
	float:left;
}
.gritter-with-image,
.gritter-with-image {
	width:220px;
	float:right;
}
/* for the light (white) version of the gritter notice */
.gritter-light .gritter-item,
.gritter-light .gritter-bottom,
.gritter-light .gritter-top,
.gritter-light .gritter-close {
    background-image: url(../images/gritter-light.png);
    color: #222;
}
.gritter-light .gritter-title {
    text-shadow: none;
}
.gritter-close {
    display: block;
    top: 10px;
    right: 0px;
    left: auto;
    height: 1.525rem;
    float: right;
    width: 1.525rem;
    font-size: 0;
    background: 0 0;
    text-indent: inherit;
    color: #8c8c8c;
    display:none;
}
.gritter-color .gritter-close {
    color: #FFF;
    opacity: .7;
}