html, body{
	font-family:'Roboto', sans-serif;
	margin:0;
	padding:0;
	text-align: center;
	background: #eeeef0;
	min-width:320px;
}

.cookie-popup {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0,0,0,0.7);
  color: #fff;
  text-align: center;
  padding: 0 10px;
  font-size: 14px;
  display: none;
  z-index: 9999;
}

.cookie-popup button {

  border:0;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	margin: 10px;
	display: inline-block;
	background: #fff;
	color: #000;
	border-radius: 4px;
	cursor: pointer;
}

.cookie-popup button:hover {
  background: #2f6de2;
  color: #fff;
}

#header {
/*	background:  url(../images/gta5.jpg) #000 repeat-x;*/
background: rgb(0,0,0);
background: linear-gradient(130deg, rgba(0,0,0,1) 0%, rgba(58,79,99,1) 100%);
}

#header_row, #menu_row {
	width: 100%;
	display: inline-block;
	text-align: left;
	position: relative;
}

#header_row {
	max-width: 1108px;
}

#menu_row {
	max-width: 1108px;
}

#logo {
	color:#fff;
	text-decoration: none;
	text-transform: uppercase;
	font-weight: 900;
	font-size:36px;
	line-height: 40px;
	padding: 50px 10px 16px;;
	display: inline-block;
}

#logo span {
	display: block;
	font-size:20px;
	margin-left:20px;
	line-height: 24px;
}

#logo:hover, #logo:hover span{
	opacity: 0.9;
}



#login, #langs {
	cursor: pointer;
	color: #fff;
	font-weight: bold;
	font-size:16px;
	position:absolute;
	border-radius: 4px;
	cursor: pointer;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

#login {
	padding: 12px 14px 12px 20px;
	left:4px;
	top:4px;
	line-height: 16px;
}

#langs {
	padding: 12px 14px;
	line-height: 24px;
	top:4px;
	right:4px;
}
#login:hover, #langs:hover {
	background: #262626;
}





#langs svg, #langs_block svg {
	display: inline-block;
	vertical-align: top;
	height:24px;
	margin-right: 10px;
}

#langs span {
	margin-top:5px;
}
#login_block, #langs_block {
	box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
}
#login_block {
	display: none;
	background: #fff;
	width:220px;
	color:#424242;
	position: absolute;
	left: 4px;
	top: 4px;
	line-height: 16px;
	margin:0;
	padding:0;
	z-index:2;
	border-radius: 4px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

#login_block ul{
	list-style: none;
}

#login_block ul a{
	padding: 18px 28px;
	text-decoration: none;
	color: #444;
	display: block;
}

#login_block .header {
	text-align: left;
	padding: 12px 14px 12px 20px;
	cursor: pointer;
	font-weight: bold;
	font-size:16px;
	border-bottom: 1px solid #eeeef0;
}

#langs_block {
	display: none;
	background: #fff;
	width:112px;
	color:#424242;
	position: absolute;
	right: 4px;
	top: 4px;
	line-height: 24px;
	margin:0;
	padding:0;
	z-index:2;
	border-radius: 4px;
	font-weight: bold;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

#langs_block .header {
	text-align:right;
}
#langs_block div{
	padding: 12px 14px;
	cursor: pointer;
	border-radius: 4px;
}

#langs_block div:hover {
	background: #eeeef0;
}

#langs_block span {
	margin-top:8px;
}
#socials{
	text-align: center;
}

#socials svg {
	width:32px;
	vertical-align: top;
	padding: 10px;
	display: inline-block;
}

#socials a {
	margin: 10px 4px;
	display: inline-block;
	border-radius: 4px;
}

#socials a:hover {
	background: #eeeef0;
}

#menu {
	padding: 0 10px;
}
span.down {
	border: solid #b8b8b8;
	border-width: 0 2px 2px 0;
	display: inline-block;
	padding: 3px;
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	margin-left: 8px;
	vertical-align: top;
	margin-top: 2px;
}

span.top {
	border: solid #b8b8b8;
	border-width: 0 2px 2px 0;
	display: inline-block;
	padding: 3px;
	transform: rotate(-135deg);
	-webkit-transform: rotate(-135deg);
	margin-left: 8px;
	vertical-align: top;
	margin-top: 6px;
}

#menu_buttons a{
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	margin-right: 10px;
	display: block;
	float: left;
	background: #262626;
	color: #fff;
	border-radius: 4px;
	margin-top: 10px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

#menu_buttons a:hover {
	background: #000;
	color: #fff;
}

#search_block {
	border-radius: 4px;
	background: #fff;
	color: #636363;
	width: 225px;
	float: right;
	margin-top: 10px;
}

#search_block input {
	border-radius: 4px;
	padding: 12px 5px 12px 20px;
	border: 0;
	float: left;
	width: 160px;
	font-size: 14px;
	background: #fff;
	outline: none;
}

#search_block svg {
	height:16px;
	display: inline-block;
	fill: #989898;
	vertical-align: top;
	padding:8px;
	margin:4px;
	border-radius: 4px;
	cursor: pointer;
}

#search_block svg:hover {
	background: #262626;
	fill:#fff;
}

#page {
	max-width: 1128px;
	width: 100%;
	display: inline-block;
}

.big_block {
	border-radius:4px;
	background: #fff;
	padding: 10px;
	margin: 10px;
	word-break: break-word;
	text-align: left;
}

.big_block h1 {
	margin:0;
	padding:0;
}

.navigation {
	border-radius:4px;
	background: #fff;
	padding: 10px;
	margin: 10px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

.navigation .advert {
	margin:5px 10px;
}
.emblems {
	display: block;
	margin: 10px;
	border-radius:4px;
	background: #fff;
}

.emblems img {
	margin: 4px;
	border-radius:4px;
	vertical-align: top;
	background: #ececec;
	width:calc(100% - 8px);
	max-width: 320px;
}

.emblems .info{
	text-align: left;
}
.likes, .delete, .copy{
	padding:6px 10px;
	margin:0 0 4px 4px;
	border-radius: 6px;

	display: inline-block;
	color:#696969;
	line-height: 20px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	font-size:12px;
}


.delete svg {
	height:20px;
	display: inline-block;
	fill: #696969;
	vertical-align: top;
}

.likes svg, .copy svg {
	height:20px;
	margin-right: 6px;
	display: inline-block;
	fill: #696969;
	vertical-align: top;

}


.likes:hover, .delete:hover {
	cursor: pointer;
	background:#eeeef0;
	color:#000;
}
.likes:hover svg, .delete:hover svg {
	fill:#000;
}
.likes.active svg{
	fill:#e61e14;
}

.navigation a{
	font-weight: bold;
	color:#696969;
	padding:4px 8px;
	margin:2px;
	text-decoration: none;
	border-radius: 4px;
}

.navigation span{
	font-weight: bold;
	color:#d2d2d2;
	padding:4px 8px;
	margin:2px;
	text-decoration: none;
	border-radius: 4px;
}

.navigation a.active{
	color:#2f6de2;
}

.navigation a:hover {
	background: #2f6de2;
	color:#fff;
}

.advert {
	margin:10px;
}

#main_text {
	border-radius:4px;
	background: #fff;
	padding: 10px;
	margin: 10px;
	text-align: left;
}

#main_text h1 {
	font-size: 20px;
	padding:0;
	margin:0;

}

#main_text p {
	font-size: 14px;
	line-height: 22px;
}

#footer {
	text-align: center;
}

#footer .block{
	width:300px;
	padding:20px;
	display: inline-block;
	vertical-align: top;
	text-align: left;
	color:#696969;
}

#footer .right{

	text-align: right;
}

#footer a, #emblem_right a, .big_block a, #main_text a{
	color:#2f6de2;
	text-decoration: none;
	border-bottom: 1px solid #bbd2ff;
}

#footer a:hover, #emblem_right a:hover, .big_block a:hover, #main_text a:hover {
	border-bottom: 1px solid #2f6de2;
}



#emblem_left {
	width:300px;
	background: #fff;
	display: inline-block;
	border-radius: 4px;
	margin: 10px;
	text-align: left;
}

#emblem_right {

	margin:0 10px 0 10px;
	text-align: left;
}

#emblem_right .block {
	padding:10px;
	margin-top:10px;
	background: #fff;
	border-radius: 4px;
}

#emblem_image img{
	margin: 4px;
	border-radius: 4px;
	background: #ececec;
	width:292px;
	height:292px;
	vertical-align: top;
}

#emblem_right h1{
	margin:0;
	padding:0;
	line-height: 24px;
	font-size: 30px;
	padding-bottom: 10px;
}

#emblem_right .header {
	font-weight: bold;
	padding-bottom:10px;
}
#emblem_right .advert {
	margin:0;
}
#emblem_id {
	float:right;
}


#copy_button, #copy_button2{
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	margin-right: 10px;
	display: inline-block;
	background: #262626;
	color: #fff;
	border-radius: 4px;
	cursor: pointer;
}

#copy_button:hover, #copy_button2:hover {
	background: #000;
	color: #fff;
}

#code_show, #code_show2{
	display: inline-block;
	cursor: pointer;
	padding: 12px 14px 12px 20px;
	line-height: 16px;
	cursor: pointer;
	font-size: 16px;
	border-radius: 4px;
}

#code_instruction {
	display: inline-block;
	cursor: pointer;
	padding: 12px 14px 12px 20px;
	line-height: 16px;
	cursor: pointer;
	font-size: 16px;
	border-radius: 4px;
}

#code_show:hover, #code_show2:hover, #code_instruction:hover {
	background: #eeeef0;
}


#code_info, #code_info2 {
	display: none;
	margin-top:10px;
}

#code_info textarea, #code_info2 textarea {
	border:1px solid #999999;
	background: #fff;
	border-radius:4px;
	width: 100%;
	height: 200px;
	font-size:10px;
	padding:4px;
	box-sizing: border-box;
}

#instruction_hide {
	display: none;
}
.emblem_info {
	padding:10px;

}

.emblem_info span {
	float:right;
	font-weight: bold;
}

.table input {
	width:100%;
	border:1px solid #999999;
	background: #fff;
	border-radius:4px;
	height:30px;
	padding: 0 10px;
	box-sizing: border-box
}

.table textarea{
	border:1px solid #999999;
	background: #fff;
	border-radius:4px;
	width: 100%;
	height: 200px;
	font-family:'Roboto', sans-serif;
	font-size:10px;
	box-sizing: border-box;
}

#add_button, #add_crew_button {
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	display: inline-block;
	background: #262626;
	color: #fff;
	border:1px solid #262626;
	border-radius: 4px;
	margin-top: 10px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	width: auto;
	height: auto;
	cursor: pointer;
}

#add_button:hover {
	background: #000;
}

.table {
	display: table;
	width:100%;
}
.table_row {
	display: table-row;
}

.table_left, .table_right {
		display: block;
		padding:6px 0 0 0;
	}

#add_err {
    border-radius:4px;
    background: #b0120a;
    padding: 10px;
    margin: 10px;
    text-align: left;
}
#add_err .name {
    color:#fff;
    font-size: 18px;
    font-weight: bold;
}
#add_err .type {
    color:#fff;
    margin: 5px 0 0 20px;
}
#add_err a{
    color: #fff;
    font-weight: bold;
}

#login_links {
	margin:0;
	padding:0;
	text-align: right;
}
#login_links a {
	display: block;
	padding: 10px;
}

#login_links a:hover {
	background: #eeeef0;
}
.orders {
	border-radius: 4px;
	background: #fff;
	padding: 10px;
	margin: 10px;
	word-break: break-word;
	text-align: left;
	word-wrap:break-word
}
.orders a{
	color: #03338e;
	text-decoration: none;
	border-bottom: 1px solid #bbd2ff;
}
.orders a:hover {
	border-bottom: 1px solid #2f6de2;
}
.orders span {
    float:right;
    color:#259b24;
    font-weight:bold
}

.orders textarea{

    border:1px solid #999999;
    background: #fff;
     border-radius:2px;
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    -khtml-border-radius:2px;
    width: 100%;
    height: 100px;
    font-family: "Lucida Console", Monaco, monospace;
    font-size:10px;
    margin: 10px 0;
}
.button {
	background: #2f6de2;
	color:#fff !important;
	text-decoration: none;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: bold;
	padding: 12px 20px;
	margin-right: 10px;
	display: inline-block;
	border-radius: 4px;
	margin-top: 10px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
	border:none;
}

.text_input {
	border:1px solid #999999;
	background: #fff;
	border-radius:4px;
	width: 100%;
	height: 100px;
	font-family:'Roboto', sans-serif;
	font-size:10px;
	box-sizing: border-box;
}

.crew_images img {
	vertical-align: top;
	width:100px;

	border-radius: 4px;
	vertical-align: top;

	padding:10px;
}

.crew_images {
	display: inline-block;
	border: 4px solid #ececec;
	cursor: pointer;
	background: #ececec;
	border-radius: 4px;
	margin: 4px;
}

.crew_images:hover {
	border: 4px solid #2f6de2;
}


#top_block {
	text-align: right;
	color: #444;
	font-size:14px;
	-moz-user-select: none;
	-khtml-user-select: none;
	user-select: none;
}

#top_block_right {
	display: inline-block;
}

#sort {
	padding: 10px 14px 10px 20px;
	line-height: 16px;
	cursor: pointer;
	font-size: 14px;
	border-radius: 4px;
	display: inline-block;
	border: 1px solid #b8b8b8;
	background: #fff;
	margin:0 10px;
}



#sort:hover {
	background: #eeeef0;
}

#sort_select {
	display: none;
	position: absolute;
	border-radius: 4px;
	border: 1px solid #b8b8b8;
	background: #fff;
	width: 175px;
	text-align: left;
	margin-left: -187px;
	margin-top: 40px;
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.2);
}

#sort_select.active {
	display: inline-block;
}

#sort_select div {
	padding:10px 14px 10px 20px;
	cursor: pointer;
}

#sort_select div:hover {
	background: #eeeef0;
}

@media screen and (min-width: 376px) {
	.emblems {
		width: 168px;
		display: inline-block;
	}
	.emblems img {
		width: 160px;
		height: 160px;
	}
}

@media screen and (min-width: 768px) {
	#logo {
		font-size:78px;
		line-height: 84px;
		padding: 10px 10px 16px;
	}

	#logo span {
		font-size:36px;
		margin-left:40px;
		line-height: 40px;
	}


	#login {
		top:10px;
		left:auto;
		right: 0;
	}
	#langs {
		top:auto;
		bottom:10px;
		right: 0;
	}

	#login_block {
		left:auto;
		right: 0;
		top: 10px;
	}
	#login_block .header {
		text-align: right;
	}
	#langs_block {
		right: 0;
		top: 92px;
	}
	.table_left, .table_right {
		display: table-cell;
		padding:10px 0;
	}
	.table_left {
		width:200px;
	}

	#emblem_left {
		width:328px;
		background: #fff;
		float:left;
		margin: 10px 0 0 10px;

	}

	#emblem_right {

		margin:0 10px 0 348px;

	}
	#emblem_image img{
		width:320px;
		height:320px;
	}

	#code_show, #code_show2 {
		float: right;
	}
}