html, body {
	background: #ededed !important;
}

*:focus {outline:0 !important;}

*::-webkit-scrollbar {
	display: none;
}

.dt_header {
	width: 100%;
	background: #2B253A;
	/*background: 
    linear-gradient(
      rgba(43,37,58, 0.95), 
      rgba(43,37,58, 0.95)
    ),
    url(../modules/home/images/bg4.jpg);
    background-size: cover;
    background-position: center center;*/
	height: 60px;
	color: #fff;
	cursor: default;
	text-align: center;
}

.dt_login_bg {
	width:100%;
	min-height: 100vh;
	/*background: linear-gradient(to bottom, #1d1c25, #431e3f);*/

	background: 
    linear-gradient(
      rgba(67,30,63, 0.9), 
      rgba(67,30,63, 0.9)
    ),
    url(../modules/home/images/bg.jpg);
    background-position: center center;
    background-size: cover;
	margin-top: 0px;
	display: block;
}

/*.dt_login_bg_light {
	width:100%;
	min-height: 100vh;
	background: linear-gradient(to bottom, #1d1c25, #431e3f);

	background: 
    linear-gradient(
      rgba(255,255,255, 0.8), 
      rgba(255,255,255, 0.8)
    ),
    url(../modules/home/images/bg5.jpg);
    background-position: center center;
    background-size: cover;
	margin-top: 0px;
	display: block;
}*/

.dt_login_container {
	width: 95%;
	max-width: 400px;
	margin: auto;
	padding: 20vh 0px;
	display: block;
}

.dt_login_container h1 {
	color: #fff;
}

.dt_login_container md-input-container input {
	background-color: #fff !important;
}

.dt_login_container md-input-container {
	margin: 0px !important;
}

.spacer_4 {
	width: 100%;
	height: 4px;
	display: block;
	clear: both;
}

.spacer_8 {
	width: 100%;
	height: 8px;
	display: block;
	clear: both;
}

.spacer_16 {
	width: 100%;
	height: 16px;
	display: block;
	clear: both;
}

.spacer_32 {
	width: 100%;
	height: 32px;
	display: block;
	clear: both;
}

.max_width_400 { max-width: 400px; }
.max_width_600 { max-width: 600px; }
.max_width_800 { max-width: 800px; }
.max_width_1000 { max-width: 1000px; }

.padding_0 { padding: 0px !important; }
.padding_4 { padding: 4px !important; }
.padding_8 { padding: 8px !important; }
.padding_16 { padding: 16px !important; }
.padding_sides_16 { padding-left: 16px !important; padding-right: 16px !important; }

.ta_left { text-align: left; }
.ta_center { text-align: center; }
.ta_right { text-align: right; }

.va_top {
	vertical-align: top;
}

.display_inline_block { display: inline-block; }
.display_block { display: block; }

.margin_0 {
	margin: 0px !important;
}

.margin_auto {
	margin: auto;
}

.float_left {
	float: left;
}
.float_right {
	float: right;
}

.equal_width_table {
  width: 100% !important;
  table-layout: fixed !important;
}

.opacity_100 { opacity: 1; }
.opacity_75 { opacity: .75; }
.opacity_50 { opacity: .5; }
.opacity_25 { opacity: .25; }
.opacity_0 { opacity: 0; }

.opacity_100_hover:hover { opacity: 1; }
.opacity_75_hover:hover { opacity: .75; }
.opacity_50_hover:hover { opacity: .5; }
.opacity_25_hover:hover { opacity: .25; }
.opacity_0_hover:hover { opacity: 0; }

md-input-container:not(.md-input-has-value) input:not(:focus) {
  color: rgba(0, 0, 0, 1) !important;
}


.dt_home_link_container {
	margin: 8px;
	padding: 32px;
	text-align: center;
	border-radius: 8px;
	cursor: pointer;
	display: inline-block;
	max-width: 250px;
	width: 100%;
}

.dt_home_link_container h1 {
	font-weight: 400;
}

.dt_background_w1 { background: #f9faf4; }
.dt_background_w2 { background: #f8e7b9; }
.dt_background_u1 { background: #0e67ab; }
.dt_background_u2 { background: #b3ceea; }
.dt_background_b1 { background: #150b00; }
.dt_background_b2 { background: #a69f9d; }
.dt_background_r1 { background: #d3202a; }
.dt_background_r2 { background: #eb9f82; }
.dt_background_g1 { background: #00733d; }
.dt_background_g2 { background: #c4d3ca; }

.dt_table_row_alt_background {
	background: #eee;
}

.dt_fill_w1 { fill: #f9faf4; }
.dt_fill_w2 { fill: #f8e7b9; }
.dt_fill_u1 { fill: #0e67ab; }
.dt_fill_u2 { fill: #b3ceea; }
.dt_fill_b1 { fill: #150b00; }
.dt_fill_b2 { fill: #a69f9d; }
.dt_fill_r1 { fill: #d3202a; }
.dt_fill_r2 { fill: #eb9f82; }
.dt_fill_g1 { fill: #00733d; }
.dt_fill_g2 { fill: #c4d3ca; }

.dt_color_w1 { color: #f9faf4; }
.dt_color_w2 { color: #f8e7b9; }
.dt_color_u1 { color: #0e67ab; }
.dt_color_u2 { color: #b3ceea; }
.dt_color_b1 { color: #150b00; }
.dt_color_b2 { color: #a69f9d; }
.dt_color_r1 { color: #d3202a; }
.dt_color_r2 { color: #eb9f82; }
.dt_color_g1 { color: #00733d; }
.dt_color_g2 { color: #c4d3ca; }

md-toast {
  position: fixed !important; }

md-toast.green .md-toast-content {
  background-color: #00733d !important;
}

md-toast.red .md-toast-content {
  background-color: #d3202a !important;
}

md-toast.blue .md-toast-content {
  background-color: #0e67ab !important;
}


.dt_home_link_container svg {
	max-width: 150px;
	width: 90%;
}

.dt_home_link_container:hover svg {
	fill: #fff;
}

.dt_home_link_container:hover h1 {
	color: #fff;
}

@import url('https://fonts.googleapis.com/css2?family=New+Rocker&display=swap');
.dt_home_link_container_1 {
	background: linear-gradient(rgba(0,115,61, 0.55), rgba(0,115,61, 0.55) ), url(../modules/home/images/decks.jpg);
    background-size: cover;
    background-position: center center;
    font-family: 'New Rocker', cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 28px;
}
.dt_home_link_container_1:hover {
	/*background: linear-gradient( rgba(0,115,61, 0.35),  rgba(0,115,61, 0.35) ), url(../modules/home/images/decks.jpg);*/
	/*background-size: cover;*/
    /*background-position: center center;*/
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}
.dt_home_link_container_2 {
	background: linear-gradient( rgba(211,32,42, 0.65), rgba(211,32,42, 0.65) ), url(../modules/home/images/games.jpg);
    background-size: cover;
    background-position: center center;
    font-family: 'New Rocker', cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 28px;
}
.dt_home_link_container_2:hover {
	/*background:  linear-gradient( rgba(211,32,42, 0.45), rgba(211,32,42, 0.45) ), url(../modules/home/images/games.jpg);*/
	/*background-size: cover;*/
    /*background-position: center center;*/
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}
.dt_home_link_container_3 {
	background:  linear-gradient( rgba(14,103,171, 0.55), rgba(14,103,171, 0.55) ), url(../modules/home/images/packs.jpg);
    background-size: cover;
    background-position: center center;
    font-family: 'New Rocker', cursive;
    font-weight: 400;
    font-style: normal;
    font-size: 28px;
}
.dt_home_link_container_3:hover {
	/*background:  linear-gradient( rgba(14,103,171, 0.35), rgba(14,103,171, 0.35) ), url(../modules/home/images/packs.jpg);*/
	/*background-size: cover;*/
    /*background-position: center center;*/
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2), 0 3px 6px rgba(0, 0, 0, 0.2);
}

/* NAV */

.dt_nav_home_link {
	cursor: pointer;
	width: 35px;
	padding: 4px 8px;
	float: left;
	display: inline-block;
}

.dt_nav_home_link svg {
	fill: #fff;
}

.dt_nav_user_link {
	cursor: pointer;
	width: 35px;
	padding: 4px 8px;
	float: right;
	display: inline-block;
}

.dt_nav_user_link svg {
	fill: #fff;
}

.dt_nav_home_link_faded {
	width: 35px;
	padding: 4px 8px;
	float: left;
	display: inline-block;
}

.dt_nav_home_link_faded svg {
	fill: rgba(255,255,255,0.1);
}

.dt_nav_user_link_faded {
	width: 35px;
	padding: 4px 8px;
	float: right;
	display: inline-block;
}

.dt_nav_user_link_faded svg {
	fill: rgba(255,255,255,0.1);
}



.dt_deck_container {
	width: 250px;
	padding:3px;
	text-align: center;
	margin: 4px;
	cursor: pointer;
	border-radius: 7px;
	border: 3px solid rgba(0,0,0,0);
	display: inline-block;
	vertical-align: top;
}

.dt_deck_container:hover {
	border: 3px solid #f1c40f;
}

.dt_deck_preview {
	width: 244px;
	height: 340px;
	margin:3px;
	/*background: #000;*/
	background-size: contain !important;
	background-repeat: no-repeat !important;
}

.dt_deck_new {
	width: 238px;
	height: 334px;
	margin:3px;
	/*background: #000;*/
	/*border: 3px solid #00733d;*/
	border: 3px solid #0e67ab;
	border-radius: 5px;
	text-align: center;
	/*background-size: contain !important;*/
}

.dt_deck_new h1 {
	font-size: 120px;
}

.dt_card_count_input {
	padding: 4px;
	border-radius: 5px;
	border: 1px solid #888;
	min-width: 30px;
	text-align: center;
	display: inline-block;
}

.dt_card_count_input:hover {
	background: #0e67ab;
	color: #fff;
}

.dt_selected_card_count_input {
	padding: 4px;
	border-radius: 5px;
	background: #00733d;
	border: 1px solid #00733d;
	min-width: 30px;
	text-align: center;
	display: inline-block;
	color: #fff;
}

.dt_selected_card_count_input:hover {
	background: #0e67ab;
	color: #fff;
}

.dt_friend_deck_count_bubble {
	background: #00733d;
	padding: 1px;
	border-radius: 50%;
	color: #fff;
	min-width: 24px;
	display: inline-block;
}

.draggable {
	transition: all 0.01s ease;
}

.draggable_drag {
	opacity: 0;
}
.droppable.droppable_over {
	background: #ccc;
}

.dt_folder_mini_deck_container { 
	width: 100px;
	height: 150px;
	display: inline-block;
	margin: 6px;
}

.dt_mini_deck_preview {
	width: 100%;
	height: 135px;
	background-size: contain !important;
	background-repeat: no-repeat !important;
	display: inline-block;
}


@media screen and (max-width: 850px){
	.dt_deck_container { width: 220px; }
	.dt_deck_preview { width: 214px; height: 310px;  }
	.dt_deck_new { width: 208px;  height: 304px; }
	.dt_deck_new h1 { font-size: 110px; }
	.dt_folder_mini_deck_container { width: 90px; height: 130px; }
	.dt_mini_deck_preview { width: 90px; height: 130px; }
}
@media screen and (max-width: 760px){
	.dt_deck_container { width: 190px; }
	.dt_deck_preview { width: 184px; height: 267px;  }
	.dt_deck_new { width: 178px;  height: 258px; }
	.dt_deck_new h1 { font-size: 90px; }
	.dt_folder_mini_deck_container { width: 70px; height: 115px; }
	.dt_mini_deck_preview { width: 70px; height: 115px; }
}
@media screen and (max-width: 670px){
	.dt_deck_container { width: 220px; }
	.dt_deck_preview { width: 214px; height: 310px;  }
	.dt_deck_new { width: 208px;  height: 304px; }
	.dt_deck_new h1 { font-size: 110px; }
	.dt_folder_mini_deck_container { width: 70px; height: 105px; }
	.dt_mini_deck_preview { width: 70px; height: 105px; }
}
@media screen and (max-width: 400px){
	.dt_deck_container { width: 164px; }
	.dt_deck_preview { width: 160px; height: 232px;  }
	.dt_deck_new { width: 154px;  height: 222px; }
	.dt_deck_new h1 { font-size: 80px; }
	.dt_folder_mini_deck_container { width: 50px; height: 80px; }
	.dt_mini_deck_preview { width: 50px; height: 80px; }
}



.dt_dialog {
	min-width: 320px;
	width: 90%;
	max-width: 650px;
}

.dt_dialog_md {
	min-width: 320px;
	width: 90%;
	max-width: 850px;
}

.dt_dialog_lg {
	min-width: 320px;
	width: 90%;
	max-width: 1250px;
}

md-tabs [role="tabpanel"] {
  transition: none !important;
}

.md-button {
	margin-left: 2px;
	margin-right: 2px;
}

.md-tab {
	padding-left:12px !important;
	padding-right:12px !important;
}

.dt_table {
	width: 100%;
}

.dt_table th {
	text-align: left;
}

.cursor_default {
	cursor: default;
}

.cursor_pointer {
	cursor: pointer;
}

.dt_card_tooltip {
	opacity: 1 !important;
	max-height: 500px !important;
	height: auto !important;
	background: rgba(0,0,0,0) !important;
}

.dt_card_tooltip span {
	margin: 0px;
	color: rgba(0,0,0,0) !important;
}



.width_100p {
	width: 100%;
}

.va_bottom {
	vertical-align: bottom;
}

.dt_card_tab_container {
	display: inline-block;
	width:260px;
	text-align: center;
	vertical-align: top;
}

.dt_card_tab_container_sm {
	display: inline-block;
	width:260px;
	text-align: center;
	vertical-align: top;
}

.dt_card_image { width: 250px; }
.dt_card_image_sm { width: 250px; }

.dt_card_tab_container_outer { padding: 16px 0px; }

@media screen and (max-width: 1125px){
	.dt_card_image_sm { width: 220px; }
	.dt_card_tab_container_sm { width:225px; }
}

@media screen and (max-width: 980px){
	.dt_card_image_sm { width: 200px; }
	.dt_card_tab_container_sm { width:205px; }
}

@media screen and (max-width: 900px){
	.dt_card_image { width: 230px; }
	.dt_card_tab_container { width:240px; }
	.dt_card_image_sm { width: 190px; }
	.dt_card_tab_container_sm { width:192px; }
}

@media screen and (max-width: 785px){
	.dt_card_image { width: 210px; }
	.dt_card_tab_container  { width:220px; }
}

@media screen and (max-width: 725px){
	.dt_card_image { width: 190px; }
	.dt_card_tab_container  { width:200px; }
}

@media screen and (max-width: 400px){
	.dt_card_image { width: 168px; }
	.dt_card_tab_container  { width:170px; }
	.dt_card_image_sm { width: 168px; }
	.dt_card_tab_container_sm { width:170px; }
}

.dt_flip_card_button {
	padding: 2px;
	border: 1px solid #bbb;
	color: #bbb;
	border-radius: 2px;
	cursor: pointer;
	margin: 2px auto;
	display: block;
	width: 80px;
	text-align: center;
}

.dt_flip_card_button:hover {
	background: #ddd;
}

.dt_flip_card_button_dark {
	padding: 2px;
	/*border: 1px solid #555;*/
	color: #000;
	border-radius: 2px;
	cursor: pointer;
	margin: 2px auto;
	display: block;
	width: 120px;
	background: #eee;
	font-size: 22px;
	text-align: center;
}

.dt_flip_card_button_dark:hover {
	background: #111;
	color: #fff;
}

.dt_flip_card_button_inverted {
	padding: 2px;
	/*border: 1px solid #555;*/
	color: #000;
	border-radius: 2px;
	cursor: pointer;
	margin: 2px auto;
	display: block;
	width: 120px;
	background: #eee;
	text-align: center;
}

.dt_flip_card_button_inverted:hover {
	background: #111;
	color: #fff;
}

.dt_flip_card_button_long {
	width: auto;
	max-width: 140px;
}

.dt_md_menu_sub_button {
	text-transform: none;
	font-size: 15px;
	font-weight: 400;
}

.dt_below_card_buttons {
	width: 25%;
	min-width: 0px;
	margin: 0px;
	padding: 0px;
	height: 18px;
	min-height: 0px;
	/*opacity: 0.2;*/
	color: #ccc;
}

.dt_below_card_buttons:hover {
	/*opacity: 1;*/
	color: #000;
	/*transition: opacity .1s;*/
}



.clear_both {
	clear: both;
}
.dt_life_manage_button {
	opacity: 0.3;
	cursor: pointer;
	transition: opacity .2s;
}
.dt_life_manage_button:hover {
	opacity: 1;
}

.dt_count_manage_button {
	opacity: 1;
	color: #777;
	cursor: pointer;
	transition: color .2s;
}
.dt_count_manage_button:hover {
	opacity: 1;
	color: #0e67ab;
}
.dt_count_manage_button_disabled {
	opacity: 0.2 !important;
	cursor: default;
}
.dt_count_manage_button_disabled:hover {
	opacity: 0.2 !important;
}
.dt_game_bottom_card {
	margin: 0px 3px;
	height: 140px;
	width: 100px;
}
.dt_game_bottom_card_placeholder {
	margin: 0px 3px;
	width: 100px;
	height: 140px;
	border: 2px dashed #ccc;
	border-radius: 5px;
	text-align: center;
}
.dt_game_bottom_card_placeholder span {
	margin-top:65px;
	display: inline-block;
	color: #ccc;
}
.dt_hand_card {
	max-width: 100px;
	display: inline-block;
	margin: 4px;
}

.dt_hand_container_outer {
	overflow: scroll;
	padding: 3px;
	border: 2px dashed #ccc;
	border-radius: 5px;
	text-align: center;
}
.dt_hand_container_inner {
	text-align: center;
	overflow-x: scroll;
	width: 100%;
	white-space: nowrap !important;
}

.dt_counter {
	/*position: absolute;*/
    /*left: -2px;*/
    /*z-index: 100;*/
    /*bottom: 1px;*/
    color: #fff;
	background: #000;
	border: 1px solid #fff;
    padding: 2px;
    border-radius: 12px;
    transition: left .2s, bottom .2s;
}

.dt_counter_tapped {
	left: -40px;
	bottom: 25px;
}

.dt_invited_pending_game {
	background: #ffaa1d;
}


.dt_gameboard_with_gamelog {
	display: inline-block;
    box-sizing: border-box;
    left: 0px;
    float: left;
    min-height: 100vh;
    width: calc(100% - 250px);
}

.dt_gamelog {
	position: fixed;
    display: inline-block;
    box-sizing: border-box;
    float: right;
    height: 100vh;
    width: 250px;
    top: 0px;
    overflow-y: scroll;
    background: rgb(24, 28, 32);
}

.dt_gamelog_user {
	/*color: #b3ceea;*/
	color: #1d97ff;
	padding: 4px;
	font-size: 14px;
}
.dt_gamelog_user_opponent {
	/*color: #eb9f82;*/
	padding: 4px;
	font-size: 14px;
}

.dt_page_title {
	white-space: nowrap !important;
	overflow: hidden !important;
	text-overflow: ellipsis !important;
}

.dt_draft_selected_card {
	margin:4px;
	border: 2px
	solid #ffaa1d;
	background: #ffc76a;
	border-radius: 10px;
}
.dt_draft_not_selected_card {
	margin:4px;
	border: 2px
	solid rgba(255,255,255,0);
	border-radius: 10px;
}

.animate-spin {
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  display: inline-block; }

@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }
@-webkit-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }
@-o-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }
@-ms-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }
@keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg); }
  100% {
    -moz-transform: rotate(359deg);
    -o-transform: rotate(359deg);
    -webkit-transform: rotate(359deg);
    transform: rotate(359deg); } }



.dt_alt_card_art_container {
	width: 100%;
	overflow: scroll;
	white-space: nowrap;
}

.dt_alt_card_art_container::-webkit-scrollbar {
  display: block !important;
  width: 5px;
  height: 8px;
  background-color: #c9d0d6;
}

.dt_alt_card_art_container::-webkit-scrollbar-thumb {
  background: #0d8aee;
}

.dt_alt_card_art_container_inner {
	display: inline-block;
	vertical-align: top;
	padding: 5px;
}


.dt_select_search_header {
	box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1), 0 0 0 0 rgba(0, 0, 0, 0.14), 0 0 0 0 rgba(0, 0, 0, 0.12);
	padding-left: 10.667px;
	height: 48px;
	cursor: pointer;
	position: relative;
	display: flex;
	align-items: center;
	width: auto;
}

.dt_select_searchbox {
	border: none;
	outline: none;
	height: 100%;
	width: 100%;
	padding: 0;
}