* { font-family: 'News Cycle', sans-serif; }

body { background-color: #cccccc; }

.navbar-light { border-bottom-width: 3px !important; box-shadow: 0 0 20px rgba(0,0,0,0.3); }
.navbar .nav-link { font-size: 0.9rem !important; }
.navbar-expand-lg .navbar-nav .nav-link { padding-left: 0.2rem !important; padding-right: 0.2rem !important;}

.container-fluid-max { max-width: 1860px !important; 
	  padding-right: 15px;
	  padding-left: 15px;
	  margin-right: auto;
	  margin-left: auto;
	}

h1 { font-size: 1.5rem !important; text-transform: uppercase; color: #d39e0b;  }
.h-100 { min-width: 100%; }

.linkGialli a { color: #d39e0b !important; }

.bg-r0 { background-color: #e3e3e3; }

.btn-l1 { background-color: #533427; }
.btn-l2 { background-color: #7c5120; }
.btn-l3 { background-color: #808080; }
.btn-l4 { background-color: #dcb423; }
.btn-l5 { background-color: #61a8de; }
.btn-l6 { background-color: #c7700d; }
.btn-r1 { background-color: #8f8f8f; }
.btn-r2 { background-color: #3895f2; }
.btn-r3 { background-color: #aa18d6; }
.btn-r4 { background-color: #fcc40b; }
.btn-r0 { background-color: #e3e3e3; }
.btn-r0:hover { background-color: #d2d2d2; transform: scale(120%); }
.btn-rb { background-color: #ffffff; }

.text-r1 { color: #8f8f8f; }
.text-r2 { color: #3895f2; }
.text-r3 { color: #aa18d6; }
.text-r4 { color: #fcc40b; }
.text-r0 { color: #e3e3e3; }

.text-fir { color: #a51515 !important; }
.text-wat { color: #1959b2 !important; }
.text-ear { color: #63a11c !important; }
.text-lif { color: #acacac !important; }
.text-dea { color: #9824b1 !important; }
.text-dra { color: #d39e0b !important; }
.text-neu { color: #8ca0bc !important; }

.btn-fir { background-color: #a51515; }
.btn-wat { background-color: #1959b2; }
.btn-ear { background-color: #63a11c; }
.btn-lif { background-color: #acacac; }
.btn-dea { background-color: #9824b1; }
.btn-dra { background-color: #d39e0b; }
.btn-neu { background-color: #8ca0bc; }

.bg-fir { background-color: #a51515 !important; }
.bg-wat { background-color: #1959b2 !important; }
.bg-ear { background-color: #63a11c !important; }
.bg-lif { background-color: #acacac !important; }
.bg-dea { background-color: #9824b1 !important; }
.bg-dra { background-color: #d39e0b !important; }
.bg-neu { background-color: #8ca0bc !important; }

.bg-celeste { background-color: rgb(54, 182, 235); }
.bg-chiaro { background-color: #dddddd; }

.border-fir { border-color: #a51515 !important; }
.border-wat { border-color: #1959b2 !important; }
.border-ear { border-color: #63a11c !important; }
.border-lif { border-color: #acacac !important; }
.border-dea { border-color: #9824b1 !important; }
.border-dra { border-color: #d39e0b !important; }
.border-neu { border-color: #8ca0bc !important; }


stronger { font-weight: 900 !important; }

table th { font-size: 0.85rem !important; }

.table-cards td { padding: 0.1rem 0.2rem !important; font-size: 0.9rem; }

.carta img { transition: all .2s ease-in-out; z-index: inherit; }
.carta:hover img { transform: scale(110%) rotate(5deg); z-index: 900; }

.card-1 { border-radius: 15px; border: 1px solid rgba(0,0,0,0.2); transition: all 0.2s ease-in-out; }
.card-on { box-shadow: 0 0 30px rgba(0,0,0,0.3); transform: rotate(2deg); }

.card-image { position: relative; text-align: center; transition: all 0.2s ease-in-out; }
.card-image > a > img { overflow: hidden; border-radius: 15px; border: 1px solid rgba(0,0,0,0.2); transition: all 0.2s ease-in-out; }

.card-image .card-name { position: absolute; top: 201px; left: 10px; right: 10px; font-size: 0.80rem; font-weight: bolder; color: #ffffff; text-shadow: 1px 1px 3px #000,  -1px -1px 1px rgba(0,0,0,0.5); font-style: italic; text-align: center; text-transform: uppercase;  }
	.card-image .card-nameA { top: 192px !important; }
	.card-image .card-level { position: absolute; top: 220px; right: 91px; width: 18px; height: 18px; font-size: 0.8rem; line-height: 15px; font-weight: bolder; color: #fff; border: 1px solid rgba(0,0,0,0.8); background-color: rgba(0,0,0,0.55); text-align: center;  }
	.card-image .card-levelA { top: 210px !important; }
	.card-image span { position: absolute; top: 0; left:-2px;  width: 100%; color: #fff; font-weight: bolder; font-size: 1.5rem; text-shadow: -1px 0px 1px #000, 0px -1px 1px #000, 2px 2px 1px #000; font-style: italic; line-height: 46px !important; }
	.card-image img.icona { position: absolute; top: 0; left: 0;  width: 100%;  }
	.card-image .card-mana { position: absolute; top: 10px;  left: 3px;  width: 46px; height: 46px; }
	.card-image .card-mel  { position: absolute; top: 105px;  left: 0px;  width: 48px; height: 48px; }
	.card-image .card-ran  { position: absolute; top: 60px;  left: 0px;  width: 48px; height: 48px; }
	.card-image .card-mag  { position: absolute; top: 60px; left: 0px;  width: 48px; height: 48px; }
	.card-image .card-arm  { position: absolute; top: 105px; left:155px;  width: 48px; height: 48px; }
	.card-image .card-spe  { position: absolute; top: 150px; left: 0px;  width: 48px; height: 48px; }
	.card-image .card-hp   { position: absolute; top: 150px; left:155px; width: 48px; height: 48px; }
	.card-image .card-ed   { position: absolute; top: 8px; right: 26px; color: #fff; text-shadow: 1px 1px 1px #000, -1px -1px 1px #000; font-size: 0.6rem; font-weight: bold; }
	.card-image .card-info { position: absolute; top: 225px; left: 10px; right: 10px; height: 50px; line-height: 50px; }
	.card-image .card-infoA { top: 220px; }
	.border-abi { width: 30px; border: 2px solid rgba(255,255,255,0.7); box-shadow: 1px 1px 3px #000, 0 0 3px #000 inset; border-radius: 60px; }
	.border-abi2 { width: 42px; border: 0; border-radius: 0; }

.card-image-text1 { position: absolute; top: 25%; left: 50%; font-size: 1.1rem; transform: translate(-50%, -50%); opacity: 0; text-shadow: 0 0 3px #000; transition: all 0.2s ease-in-out;  }
.card-image:hover .card-image-text1 { opacity: 1; }
.card-image-text2 { position: absolute; top: 75%; left: 50%; font-size: 1.1rem; transform: translate(-50%, -50%); opacity: 0; text-shadow: 0 0 3px #000; transition: all 0.2s ease-in-out;  }
.card-image:hover .card-image-text2 { opacity: 1; }

.cardbox > div { background-color: #ffffff; color: #000; }

td.piccolino { font-size: 0.7rem; }

.border-b10 { border-bottom-width: 10px !important; }

.tira-sx { margin-left: -1rem !important;}

.shadow-black { text-shadow: 1px 1px 2px #000, -1px -1px 2px #000; }
.shadow-white { background-color: rgba(255,255,255,0.9); border-radius: 6px; }