/* VERSION 1.4 23.01.2017 - 10:40 */

/*	--------------------------------------------------
	:: Global Reset & Standards
	-------------------------------------------------- */

	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed,
	figure, figcaption, footer, header, hgroup,
	menu, nav, output, ruby, section, summary,
	time, mark, audio, video { margin: 0; padding: 0; border: 0; font: inherit; vertical-align: baseline; }
    html, body { height: 100%; width: 100%; margin: 0; }
	html { font-size: 100%; }
	body { line-height: 1; background-color: #fff; overflow-x: hidden; }
	ol, ul { list-style: none; }
 
body { font-size: 14px; font-family: 'Open Sans', sans-serif; font-weight: 400;
 background: #031020 url("../img/bg.jpg") no-repeat center; background-size: cover; color: #fff; }

select option{
    background-color: grey;
}

/* TYPOGRAPHY */
h1, h2, h3, h4, h5, h6 { text-transform: uppercase; line-height: 1.4em; color: #5bbfe3; font-weight: 700; }
h1 { font-size: 2.5em; }
h2 { font-size: 2em; text-align: left; padding: .5em 0; margin-bottom: 1em; border-bottom: 1px solid #5bbfe3; }
table h2 { padding: 0; border: 0; margin: 0; }
h3 { font-size: 1.75em; }
p, ul, ol { font-size: 1.4em; line-height: 1.4em; margin: .8em auto;  }

@media only screen and (max-width: 400px) {
    h2 { font-size: 1.75em; }
}

/* LINKS */
a, a:link { color: #fff; text-decoration: underline; }
a:hover { text-decoration: none; }

/* CONTAINERS */
.wrap { width: 96%; height: 100%; margin: 1em auto; text-align: center; }
.page { width: 100%; height: 100%; margin: 0; padding: 0; position: relative; }
#logo { margin: 3em auto 2em; width: 90%; }
.content#bottoni { overflow: auto; margin-bottom: 2em; }
.footer { position: absolute; bottom: 2em; height: 1.25em; border-top: 1px solid rgba(255, 255, 255, .75); padding-top: .5em; width: 96%; }
.footer .tbt { width: 40%; padding: 0; float: right; margin: 0 .25em .25em 0; opacity: .75; }
.lang { float: left; margin: 0 0 .25em .25em; }
.lang a { width: 30px; height: 30px; display: inline-block; background-color: transparent; background-repeat: no-repeat; 
    background-position: center; text-indent: -9999px; }
.lang a.ita { background-image: url(../img/ita.png); }
.lang a.eng { background-image: url(../img/eng.png); }
.lang a.esp { background-image: url(../img/esp.png); }
.lang a.fra { background-image: url(../img/fra.png); }
.lang a:hover { opacity: .75; }
.welcome { margin: .8em auto; font-size: 1.4em; line-height: 1.4em; }

@media only screen and (max-width: 800px) {
    .footer { position: static; margin-top: 4em; }
}

/* BUTTONS */
button, #center .buttons a, .etabs a#exit, .paginate_button, 
button.DTTT_disabled, div.DTTT_disabled, a.DTTT_disabled,
button.DTTT_button, div.DTTT_button, a.DTTT_button, a.bottone { 
    border: 0 !important; cursor: pointer !important; font-family: 'Days One', sans-serif; font-size: 18px !important; width: auto; 
    height: 2.5em !important; line-height: 2.5em; padding: 0 1.35em !important; border-radius: .35em !important; color: #fff !important; 
    margin: 0 .25em .25em !important; z-index: 10; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); box-shadow: #666 0 1px 3px !important; 
    background: #0d447d !important; background: linear-gradient(to bottom,  #0d447d 0%,#34587c 50%,#34587c 55%,#2aa1c0 100%) !important; 
    text-decoration: none; 
}
.paginate_button.disabled { background: #ccc !important; background: -webkit-linear-gradient(top, #ccc 0%,#f9f9f9 89%,#fafafa 100%) !important; color: #0d447d !important; text-shadow: -1px -1px 0 rgba(0,0,0,0.3) !important; cursor: default; }
button.DTTT_disabled, div.DTTT_disabled, a.DTTT_disabled, button.DTTT_button, div.DTTT_button, a.DTTT_button { height: 2em !important; line-height: 2em; }
.content#bottoni button { width: 31.25%; float: left; margin: 1% !important; height: 5em !important; line-height: 1.2em !important; word-break: break-word; padding: 0 1em !important; }
.paginate_button { padding: .5em 1em; }
button#logout, button#exit, button#undo, button#back, button#reset, .etabs a#exit { background: rgba(13, 68, 125, .25) !important; text-transform: uppercase; border-width: 2px; border-style: solid; border-color: rgba(255, 255, 255, .25); }
#bottoni button { line-height: 14px !important; }
button:hover, .paginate_button:hover, div.DTTT_container a:hover { background-color: #217E96 !important; background-image: linear-gradient(to right top, #217E96, #082b4f) !important; color: #fff !important; }
button#logout:hover, button#exit:hover, button#undo:hover, button#back:hover, button#reset:hover, .etabs a:hover#exit { background: rgba(255, 255, 255, .25) !important; color: #fff; }
button#undo { float: none; }

.material-icons {
    text-rendering: optimizeLegibility !important;
}

@media only screen and (max-width: 640px) {
    button, .paginate_button { padding: .25em 1em !important; font-size: 90% !important; }
}

@media only screen and (max-width : 600px) {
    form input, form select, form button, #bottoni button { height: 2.5em !important; }
    form button, #bottoni button { width: 100%; clear: both; }
    #info_div form button { width: auto; }
}

@media only screen and (max-width: 400px) {
    button, .paginate_button { padding: 0 .65em; font-size: 85%; }
    button#new_league { margin-top: 3.25em !important; margin-left: .5em; }
}

/* FORMS */
form, #bottoni { width: 100%; max-width: 500px !important; margin: 1em auto; }
form#createForm { max-width: 100% !important; }
form div, #info_div div { clear: both; width: 100%; max-width: 500px; margin: .8em auto; }
form input[type="text"], 
form input[type="email"], 
form input[type="password"], 
form input[type="number"],
form input[type="date"],
form input[type="time"],
form select, 
input[type="text"], 
input[type="email"],
input[type="password"], 
input[type="number"], 
input[type="date"],
input[type="time"],
input[type="search"],
select { 
    width: 94%; max-width: 400px !important; height: 3em; font-size: 16px; border-radius: .5em !important; border: 0; padding: 0 3%; 
    background: rgba(255, 255, 255, .25); color: #fff; font-family: 'Open Sans', sans-serif;
}
input[type="date"], input[type="time"] { -webkit-appearance: textfield; -webkit-rtl-ordering: logical; -webkit-user-select: text; }
input[type="date"], input[type="time"] { align-items: center; display: -webkit-inline-flex; -webkit-padding-start: 1px; overflow: hidden; padding: 0; }

input::-webkit-input-placeholder { color: #ccc; }
input::-moz-placeholder { color: #ccc; }
input:-ms-input-placeholder { color: #ccc; }
input:-moz-placeholder { color: #ccc; }


form select { width: 100%; color: #fff; }
form label { width: 4%; float: left; text-align: left; }
form input::-webkit-input-placeholder { color: #fff; }
form input:-moz-placeholder { color: #fff; }
form input::-moz-placeholder { color: #fff; }
form input:-ms-input-placeholder { color: #fff; }

table input[type="number"], 
table input[type="text"],
table input[type="email"],
table input[type="date"], 
table input[type="time"],
table input[type="password"], 
#info_div input[type="number"], 
#info_div input[type="text"], 
#info_div input[type="email"],
#info_div input[type="date"],
#info_div input[type="time"],
#staff_div input[type="number"], 
#staff_div input[type="text"], 
#staff_div input[type="email"], 
#staff_div input[type="date"], 
#staff_div input[type="time"]{ 
    height: 2.5em; width: 27%; border: 0; padding: 0 2%; margin-left: 1%;
}
table#menu input[type="number"], 
table#menu input[type="text"],
table#menu input[type="email"],
table#menu input[type="date"],
table#menu input[type="password"],
table#nuovo input[type="number"], 
table#nuovo input[type="text"],
table#nuovo input[type="email"],
table#nuovo input[type="date"],
table#nuovo input[type="password"]{ 
    width: 60% !important; margin-left: 0;
}
table#menu label, table#nuovo label { display: inline-block; }
table#menu label { margin-bottom: 2%; }
table#menu select, table#nuovo select { width: 64%; }
table#menu td .column, table#nuovo td .column { width: 49%; display: inline-block; }
#info_div form, #info_div form div { max-width: 90% !important;}
#info_div form div { margin-bottom: .5em; height: 3em; line-height: 3em; }


/* CHECKBOX & RADIO */
label.control { display: block !important; position: relative; cursor: pointer; height: 1.5em; text-indent: -9999px; }
.control.control--radio { text-indent: 40px; height: 2.5em; line-height: 30px; }
.control input { position: absolute; z-index: -1; opacity: 0; }
.control__indicator { position: absolute; top: 0; left: 35%; height: 2em; width: 30%; background: #e6e6e6; border-radius: .5em; }
.control--radio .control__indicator { left: 0; width: 30px !important; height: 30px; border-radius: 50%; }
.control:hover input ~ .control__indicator, .control input:focus ~ .control__indicator { background: #ccc; }
.control input:checked ~ .control__indicator { background: #2aa1c0; }
.control:hover input:not([disabled]):checked ~ .control__indicator, .control input:checked:focus ~ .control__indicator { background: #2AA1C0; }
.control input:disabled ~ .control__indicator { background: #e6e6e6; opacity: 0.6; pointer-events: none; }
.control__indicator:after { content: ''; position: absolute; display: none; }
.control input:checked ~ .control__indicator:after { display: block; }
.control--checkbox .control__indicator:after { left: 35%; top: .25em; width: 30%; height: .75em; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.control--checkbox input:disabled ~ .control__indicator:after { border-color: #7b7b7b; }
.control--radio .control__indicator:after { top: 10px; left: 10px; width: 9px; height: 9px; border-radius: 50%; background: #fff; }
.control--radio input:disabled ~ .control__indicator:after { background: #7b7b7b; }
#menu td.privacy_td { line-height: 1.25em; position: relative; }
#menu .control__indicator { left: 0%; width: 30px; }
#menu span.control__text { position: absolute; top: 20px; left: 55px; width: auto; height: auto; }
.sezione span.text { height: 3em; line-height: 3em; display: inline-block; width: 80%; text-indent: 70px; }
.sezione label.control { margin-top: -2.25em; }
.sezione .control__indicator { left: 30px; top: 0; width: 30px; }

@media only screen and (max-width : 900px) {
    table#menu input[type="number"], 
    table#menu input[type="text"],
    table#menu input[type="email"],
    table#menu input[type="date"],
    table#menu input[type="password"],
    table#nuovo input[type="number"], 
    table#nuovo input[type="text"],
    table#nuovo input[type="email"],
    table#nuovo input[type="date"],
    table#nuovo input[type="password"]{ 
        width: 50% !important; 
    }
    table#menu select { width: 64%; }
}

@media only screen and (max-width: 768px) {
    table#menu label, table#nuovo label { margin-left: 1%; }
    table#menu input[type="number"], 
    table#menu input[type="text"],
    table#menu input[type="email"],
    table#menu input[type="date"],
    table#menu input[type="password"],
    table#nuovo input[type="number"], 
    table#nuovo input[type="text"],
    table#nuovo input[type="email"],
    table#nuovo input[type="date"],
    table#nuovo input[type="password"] { 
        width: 90% !important; clear: both; float: none !important;
    }
    table#menu select, table#nuovo select { width: 94% !important; clear: both !important; float: none !important; }
    .sezione span.text { text-indent: 40px; }
    .sezione label.control { margin-top: -2.5em; }
    .sezione .control__indicator { left: 0; top: 0; width: 30px; }
}

@media only screen and (max-width : 600px) {
    #logo { margin: 1em auto; }
    .welcome { margin: .5em auto; font-size: 1.2em; line-height: 1.2em; }
    .control.control--radio { float: left !important; margin-right: 10px; }
    table#menu select, table#nuovo select { width: 60%; }
    #menu .control.control--checkbox { margin-bottom: 30px; }
}

@media only screen and (max-width: 480px) {
    table#menu td .column, table#nuovo td .column { width: 100%; margin-bottom: .5em; }
    table#menu td, table#nuovo td { border: 0; padding: 0 .5em; }
    #menu span.control__text { top: 0; }
}

@media only screen and (max-width: 400px) {
    .control__indicator { width: 70%; left: 15%; }
    #menu .control.control--checkbox { margin-bottom: 40px; }
    table input[type="number"] { width: 80% !important; }
}

/*  --------------------------------------------------
    SETTINGS 
    --------------------------------------------------   */
.etabs {border-bottom: 1px solid #5bbfe3; overflow:auto; margin: .8em auto !important; height:auto !important; background-color:transparent !important;}
#settings_tab div { clear: both; padding: 1.5em 1em; }
.etabs li.tab {height: 3em; line-height: 3em;}
button.tab-button {height: 2em;}
button.tab-button, .etabs li.tab  { font-size: 14px; border-radius: .5em; float: left; padding: 0 1em; margin-right: .2em; 
    font-family: 'Days One', sans-serif; background: #35c6f3; background: linear-gradient(to bottom,  #35c6f3 0%,#2aa1c0 50%,#35c6f3 100%); } 
.etabs li.tab a:hover, .etabs li.tab a.active, .etabs li.active, .tab-button:hover, .tab-button.active { color: #0d447d; text-decoration: none; }
.etabs li.tab a.active, .etabs li.active, .tab-button.active { background: #fff !important; }
.etabs a { text-decoration: none; }
button#salva, button#exit { float: left; margin-bottom: 1em; margin-right: 1%; }
.etabs a#exit { float: none; margin: 0 !important; position: absolute; right: 1.5em; font-family: 'Days One', sans-serif; 
    height: 2em !important; line-height: 2em; font-size: 15px !important; }

/* TABLE */
table, tr, td { margin: 0; padding: 0; width: 100%; text-align: center; line-height: 1.4em; }
table { border-collapse: collapse; }
tbody { width: 100%; }
th, td strong, tfoot { padding: 1.5em .5em; text-transform: uppercase; border-bottom: 1px solid #5bbfe3; font-weight: 700; }
td strong { border: 0; } 
td { text-align: center; padding: 1em .5em; width: 33%; border-bottom: 1px solid rgba(255, 255, 255, .25); vertical-align: middle; }
th:first-child, td:first-child { text-align: left; }
#menu th { padding: .5em; }
#menu td, #nuovo td { width: 50%; text-align: left; line-height: 2.5em; }
table.stats td { width: auto !important; }
#menu td input, #menu td select, #nuovo td input, #nuovo td select { float: right; margin-right: 1%; }
#menu td input[type="time"], #menu td span, #nuovo td input[type="time"], #nuovo td span { float: left; }
#menu td span, #nuovo td span { width: 34%; margin-bottom: .25em; }
.radio { width: 25%; float: left; } 
table select { height: 2.5em; }
td form select { width: 100%; }
#info_div td:first-of-type { width: 15%; }
#info_div table input[type="text"], #info_div table input[type="number"] { width: 80%; max-width: 360px !important; padding: 0 20px; }
#ufficiali { margin-bottom: 2em; }
#ufficiali td.thead, #ufficiali td span, #ufficiali td input[type="text"], #ufficiali td select { width: 17% !important; display: inline-block; padding-left: 1%; padding-right: 1%; margin-left: 0.5%; margin-right: 0.5%; }
#ufficiali td.thead { margin-left: 0; margin-right: 0; padding-left: 1%; padding-right: 1%; width: 17.75% !important; }
#recaptcha_div { height: 100% !important;  }
.recaptchatable, #recaptcha_area tr, #recaptcha_area td, #recaptcha_area th { width: auto !important; }
#recaptcha_area td { line-height: 0 !important; background-color: #850400; }
td.recaptcha_r3_c2 { display: none; }
 td.recaptcha_image_cell { border: 0 !important; }
.recaptchatable td.recaptcha_r4_c1 { background: none;  }
table#menu input[type="text"]#recaptcha_response_field { width: 153px !important; color: #333 !important; float: none !important; }
input[type="text"]#recaptcha_response_field::-webkit-input-placeholder { color: #666; }
input[type="text"]#recaptcha_response_field::-moz-placeholder { color: #666; }
input[type="text"]#recaptcha_response_field:-ms-input-placeholder { color: #666; }
input[type="text"]#recaptcha_response_field:-moz-placeholder { color: #666; }
.recaptchatable td.recaptcha_r4_c1 { width: 171px !important; }

@media only screen and (max-width: 1240px) {
    #ufficiali td.thead { width: 17.25% !important;  }
}

@media only screen and (max-width: 768px) {
    #ufficiali td.thead { display: none; }
    #ufficiali td span, #ufficiali td input[type="text"], #ufficiali td select { width: 97% !important; max-width: 97% !important;  margin: .25em auto; }
    #ufficiali td select { width: 99% !important; max-width: 99% !important;}
    #ufficiali td span { word-break: break-all; margin-bottom: 1em; }
    .etabs a#exit { position: static; float: left; }
    .etabs li:last-child { background: transparent !important; }
    .etabs li { margin-bottom: .25em; }
}

@media only screen and (max-width: 600px) {
    #menu td { padding-left: 0; padding-right: 0; }
    .radio { width: 100%; clear: both; border-bottom: 1px solid rgba(255, 255, 255, .25); padding: .5em; }
    .radio:last-of-type { border: 0; }
}

@media only screen and (max-width: 500px) {
    #menu td { vertical-align: top; }
    #menu td span { width: 100%; float: none; display: block; }
    #menu td input, #menu td select { float: none; width: 100%; clear: both; }
    td form select { width: 100%; }
    table#menu input[type="time"] { clear: both; margin-bottom: .25em; float: left; width: 90%; }
    table#menu td { width: auto; }
}

@media only screen and (max-width: 480px) {
    .etabs { margin: .5em auto !important; }
    button.tab-button, .etabs li.tab, .etabs a#exit { font-size: 11px !important; height: 1.5em !important; line-height: 1.5em; border-radius: .25em !important; padding: 0 .5em !important; margin-right: .1em !important; }
    .etabs a#exit {  }
}


/*  --------------------------------------------------
    MATCHES 
    --------------------------------------------------   */
/* Checkbox in Matches */
.check-all { text-align: left; line-height: 2.5em; overflow: hidden; }
.check-all div { float: left; }
#option_div .control { width: 50%; float: left; height: 2.5em; }
#option_div .control__indicator { left: 5%; height: 2.5em; }
#option_div .control--checkbox .control__indicator:after { top: .5em; }
#option_div button { float: right; margin-left: .5%; overflow: hidden; }
#matches_div { clear: both; border: 1px solid #5bbfe3; border-width: 1px 0; margin: 3% auto; padding: .5% 0; }
#matches_div .match { clear: both; width: 100%; height: 2em; cursor: pointer; padding: 0 0 1%; }
#matches_div .match span { text-align: left; float: left; padding: 1%; }
span.name { width: 36%; }
span.date { width: 15%; }
span.score { width: auto; }
#matches_div .match.selected, table.dataTable tr.DTTT_selected.odd, table.dataTable tr.DTTT_selected.even { background-color: #5bbfe3 !important; color: #0d447d !important; font-weight: 700; }

@media only screen and (max-width: 900px) {
    .check-all { clear: both; width: 100%; }
    #matches_div .match span { padding: 1.4% 1%; }
}

@media only screen and (max-width: 600px) { 
    span.name { width: 28%; }
    span.date { width: 25%; }
    span.score { width: auto; }
}

@media only screen and (max-width: 400px) {
    #matches_div .match span { padding-top: 2%; }
}

/*  --------------------------------------------------
    LINEUP
    --------------------------------------------------   */

#container .sezione { width: 47%; display: inline-block; margin: 0 .5%; vertical-align: top; text-align: left; }
#container .sezione.double { margin-right: 50%; }
#container .sezione.double.right { margin-right: .5%; margin-left: 50% !important; margin-top: -200px; width: auto !important; }
#container .sezione span.label { width: 34%; height: 2.5em; line-height: 1.25em; word-break: break-all; display: inline-block; }
#container .sezione select { width: 64%; float: right; height: 2.5em; }
#container #bottoni { margin: 0 0 1em; text-align: left; max-width: 100% !important; }
#container .sezione button { padding: 0 1em; margin: 0 .05em .25em;}
#container .sezione#formazione button { padding: 0 2em; }
#toHide { margin-bottom: 1em;  }

.sezione#titolari, .sezione#formazione { text-align: left; margin: 1em 0; min-height: 450px; }
.sezione#titolari ul { margin: 0; display: block; height: 100%; }
#titolari li { padding-left: 6px; font-size: 14px; height: 2.5em; line-height: 2.5em; word-break: break-all; overflow: hidden;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}
#titolari li:nth-last-child(odd) { background: #2AA1C0; }
#titolari li:nth-last-child(even) { background: #0d447d; }
#titolari li span { font-size: 24px; display: inline-block; margin-left: .5em; font-weight: 700; }

#formazione table { background: transparent url("../img/mini-camp.png") no-repeat center; background-size: 100% 100%; border-collapse: separate; }
#formazione table, #formazione th:first-child, #formazione td:first-child { text-align: center; }
#formazione td { border: 0;
  -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Chrome/Safari/Opera */
     -khtml-user-select: none; /* Konqueror */
       -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
            user-select: none; /* Non-prefixed version, currently
                                  not supported by any browser */
}
#formazione td.position { cursor: pointer !important; font-family: 'Days One', sans-serif; border-radius: .35em; 
    text-shadow: -1px -1px 0 rgba(0,0,0,0.3); box-shadow: #666 0 1px 3px; background: rgba(255, 255, 255, .25); box-shadow: none; 
    font-size: 17px; color: #0d447d; border-collapse: separate; }
#formazione td:hover.position { background: rgba(255, 255, 255, .75); }
.luce { border: 4px solid #2aa1c0 !important; }
table#nuovo { clear: both; }
table#nuovo td.end { padding: 1em .5em; }

@media only screen and (max-width: 768px) {
    #container .sezione { padding: .25em 0; margin: 1% .5%; }
    #container .sezione button { padding: 0 .5em; }
    #container .sezione span.label, #container .sezione select { width: 92% !important; float: none; margin: 0 .5%; }
}

@media only screen and (max-width: 600px) {
    #container #bottoni { text-align: left; }
    form button, #bottoni button { width: auto; clear: none; }
    .sezione#titolari, .sezione#formazione { margin-bottom: 1em; }
}

@media only screen and (max-width: 479px) {
    #container .sezione { width: 100%; clear: both; }
    .sezione#titolari, .sezione#formazione { width: 47%; display: inline-block; }
    .sezione#formazione { overflow-x: auto; }
    #container .sezione.double.right {  }

}

@media only screen and (max-width: 400px) { 
    #titolari li { font-size: 75%; height: 3em; line-height: 3em; }
    #container .sezione.double.right button { clear: right; margin-right: 20px !important; }
}

@media only screen and (max-width: 320px) { 
    
}

/*  --------------------------------------------------
    PLAYERS & TEAMS
    --------------------------------------------------   */
#info_div, #staff_div { width: 100%; display: block; clear: both; margin-bottom: 1em; }
#info_div span, #staff_div span { display: block; text-align: left; float: left; width: 38%; height: 2.5em; line-height: 2.5em; }

#info_div input[type="text"], 
#info_div input[type="number"],
#info_div select { float: left !important; width: 50% !important; margin-left: 2%; }
#info_div select, #staff_div select { width: 58% !important; height: 2.5em; }
#info_div select#nationality { width: 54% !important; }
#info_div select#hall_country_id { width: 56% !important; }
#info_div .control--checkbox .control__indicator { width: 200%; margin-left: 20%; }
#staff_div div.sezione .control--checkbox span.control__indicator { margin-left: 0; width: 200% !important; }
#staff_div div.sezione .control--checkbox .control__indicator:after { top: 1em; }
#tab3 .control__indicator { width: 15% !important; }
#logo_div img { float: right; max-width: 300px; height: auto;  margin: 0 0 1em; }
#logo_div button { float: left; margin-left: .5em; }

#info_div div.sezione, #staff_div div.sezione { width: 31% !important; max-width: 31% !important; margin: 0 .5% !important; display: inline-block; vertical-align: top; clear: none; }

#info_div .sezione form, #info_div .sezione form div, #staff_div .sezione form, #staff_div .sezione form div { width: 100% !important; max-width: 100% !important; }
#info_div div.sezione span, #staff_div div.sezione span { width: 30% !important; word-break: break-all; line-height: 1.2em; padding-top: .5em; }
#staff_div div.sezione.s2 span { width: 16% !important; }
#info_div div.sezione input[type="text"], #staff_div div.sezione input[type="text"], div.sezione select { width: 58% !important; margin-bottom: .5em; }

#info_div div.sezione input[type="text"].color { width: 28% !important; }
#staff_div div.sezione { width: 48% !important; max-width: 48% !important; }
#staff_div select { width: 65% !important; }

#t_div #info_div div.sezione { width: 48% !important; max-width: 48% !important; }
#t_div #info_div div.sezione:nth-of-type(2) span { width: 60% !important; }
#t_div #staff_div div.sezione { margin-bottom: 2em !important; }
#t_div #staff_div div.sezione input[type="text"] { float: right; }


@media only screen and (max-width: 768px) {
    #info_div div.sezione { width: 48% !important; max-width: 48% !important; }
    #info_div div.sezione:last-child { width: 100% !important; max-width: 100% !important; }
    #info_div div.sezione:last-child span { width: 14% !important; }
    #info_div div.sezione:last-child input[type="text"] { width: 34.5% !important; }
    #info_div div.sezione input[type="text"] { width: 62% !important; }
}

@media only screen and (max-width: 640px) {
    #logo_div img, #logo_div button { float: none; display: block; clear: both; margin: 0 auto .5em; }
    #logo_div button { display: inline-block; }
    #info_div form, #info_div form div { max-width: 100% !important;}
    #info_div span { line-height: 1em; }
    #info_div .control--checkbox .control__indicator { width: 300%; }
    #staff_div div.sezione, #t_div #info_div div.sezione { width: 100% !important; max-width: 100% !important; }
    #t_div #info_div div.sezione span, #t_div #info_div div.sezione:nth-of-type(2) span { width: 30% !important; margin-right: 5%; }
    #t_div #info_div div.sezione input[type="text"] { float: right !important; width: 58% !important; }
    #t_div #info_div div.sezione input[type="color"] { margin: 0 1%; width: 29% !important; }
}

@media only screen and (max-width: 480px) {
    #t_div #info_div div.sezione span, #t_div #info_div div.sezione:nth-of-type(2) span { margin-right: 1%; }
    #t_div #info_div div.sezione input[type="color"] { margin: 0 1%; width: 29% !important; }
}

/*  --------------------------------------------------
    STATS_PAGE & EVENTS
    --------------------------------------------------   */
#settings_tab .check-all, #events_page .check-all, #events_container .check-all { padding: 0; overflow: hidden; }
#settings_tab .column, #events_page .column, #events_container .column { width: 31%; display: inline-block; float: none; margin: 0 1% 10px !important; padding: 0 !important; }
#settings_tab .column.quarter { width: 22%; }
#settings_tab .check-all .column div.text, 
#settings_tab .check-all div.text, 
#settings_tab .check-all select, 
#events_page .check-all .column div.text, 
#events_page .check-all div.text, 
#events_page .check-all select,
#events_container .check-all .column div.text, 
#events_container .check-all div.text, 
#events_container .check-all select { 
    height: 2.5em !important; line-height: 2.5em; padding: 0; margin-right: 3%; width: 25%; 
}
#settings_tab .check-all select, #events_page .check-all select, #events_container .check-all select { height: 2.5em; line-height: 2.5em; padding: 0 2%; width: 70%; margin: 0; }
#settings_tab .check-all .column select, #events_page .check-all .column select, #events_container .check-all .column select { margin-right: 0; }

#stats_page table { margin-bottom: 2em !important; max-width: 100% !important; }
table#boxscore, table#match_info { width: 48%; margin-left: .5%; margin-right: .5%; display: inline-block; vertical-align: top; }
table#boxscore td, table#match_info td { width: 33%; }

div.table-container { overflow-x: auto !important; }

#vteam_stats tfoot, #hteam_stats tfoot { border-top: 3px solid #5bbfe3; border-bottom: 3px solid #5bbfe3; }
#vteam_stats tr:nth-last-child(even), #hteam_stats tr:nth-last-child(even) { background: #0d447d; }

#hteam_stats tr.base th:nth-of-type(1), #vteam_stats tr.base th:nth-of-type(1),
#hteam_stats tr.base th:nth-of-type(6), #vteam_stats tr.base th:nth-of-type(6),
#hteam_stats tr.base th:nth-of-type(8), #vteam_stats tr.base th:nth-of-type(8),
#hteam_stats tr.base th:nth-of-type(11), #vteam_stats tr.base th:nth-of-type(11),
#hteam_stats tr.base th:nth-of-type(16), #vteam_stats tr.base th:nth-of-type(16),
#hteam_stats tr.base th:nth-of-type(22), #vteam_stats tr.base th:nth-of-type(22),
#hteam_stats tr.base th:nth-of-type(23), #vteam_stats tr.base th:nth-of-type(23),
#hteam_stats tr td:nth-of-type(2), #vteam_stats tr td:nth-of-type(2),
#hteam_stats tr td:nth-of-type(7), #vteam_stats tr td:nth-of-type(7),
#hteam_stats tr td:nth-of-type(9), #vteam_stats tr td:nth-of-type(9),
#hteam_stats tr td:nth-of-type(12), #vteam_stats tr td:nth-of-type(12),
#hteam_stats tr td:nth-of-type(17), #vteam_stats tr td:nth-of-type(17),
#hteam_stats tr td:nth-of-type(23), #vteam_stats tr td:nth-of-type(23),
#hteam_stats tr td:nth-of-type(24), #vteam_stats tr td:nth-of-type(24),
#hteam_stats tr:last-child td:nth-of-type(2), #vteam_stats tr:last-child td:nth-of-type(2),
#hteam_stats tr:last-child td:nth-of-type(3), #vteam_stats tr:last-child td:nth-of-type(3),
#hteam_stats tr:last-child td:nth-of-type(5), #vteam_stats tr:last-child td:nth-of-type(5),
#hteam_stats tr:last-child td:nth-of-type(8), #vteam_stats tr:last-child td:nth-of-type(8),
#hteam_stats tr:last-child td:nth-of-type(13), #vteam_stats tr:last-child td:nth-of-type(13),
#hteam_stats tr:last-child td:nth-of-type(19), #hteam_stats tr:last-child td:nth-of-type(19), #vteam_stats tr:last-child td:nth-of-type(19),
#hteam_stats tr:last-child td:nth-of-type(20), #vteam_stats tr:last-child td:nth-of-type(20) { border-right: 2px solid #ff8c72; }

#hteam_stats tr:last-child td:nth-of-type(7),
#hteam_stats tr:last-child td:nth-of-type(9),
#hteam_stats tr:last-child td:nth-of-type(12),
#hteam_stats tr:last-child td:nth-of-type(17),
#hteam_stats tr:last-child td:nth-of-type(23),
#hteam_stats tr:last-child td:nth-of-type(24),
#vteam_stats tr:last-child td:nth-of-type(7),
#vteam_stats tr:last-child td:nth-of-type(9),
#vteam_stats tr:last-child td:nth-of-type(12),
#vteam_stats tr:last-child td:nth-of-type(17),
#vteam_stats tr:last-child td:nth-of-type(23),
#vteam_stats tr:last-child td:nth-of-type(24) { border-right: 0; }

#dist_table td, #tra_table td, #tra_table2 td { text-align: center !important; border: 0 !important; }
#stats_page .column table.mini-camp, #stats_page .column table.mini-camp2 { background: transparent url("../img/mini-camp.png") no-repeat center top; background-size: 100% 100% !important; width: 100% !important; height: 100% !important; margin: 0 !important; padding: 0; vertical-align: middle; }
#stats_page .column table.mini-camp2 { background: transparent url("../img/mini-camp2.png") no-repeat center bottom;  }
table.mini-camp, table.mini-camp2 { height: 20em !important; }
#stats_page .column table.mini-camp tbody td, 
#stats_page .column table.mini-camp2 tbody td { 
    border-bottom: 0; width: 30% !important; height: 8em !important; margin: 0; padding: 1em 1% !important; display: inline-block; }
#stats_page .column table.mini-camp2 tbody td { height: 4.65em !important; }
#stats_page .column table.mini-camp2 tbody td { width: 17% !important; text-align: center; vertical-align: middle; }
#settings_tab div.position, #settings_tab div.from { padding: .5em 0 !important; text-align: left !important; font-weight: 700; font-size: 120%; display: inline-block; width: 100%; }
div.from span { display: block; width: 10%; text-align: center; }
span#from3, span#from6 { margin-left: 45%; }
span#from2, span#from1 { margin-left: 90%; }
#html5CanvasId { display: none; }
table#boxscore td, table#match_info td, table#hteam_stats td, table#vteam_stats td { padding: .25em .5em; }
.mini-camp td, .mini-camp2 td {
    opacity: 0;
    color: black;
    position: relative;
    z-index: 10;
}
#html5CanvasId {
    position: absolute;
    z-index: 10;
    display: inline !important;
}

#events_wrapper { margin-top: 1em; }
.DTTT_container { float: right !important; width: auto; height: 2.5em; line-height: 2.5em; display: inline-flex; }
div.DTTT_container a { color: #fff !important; z-index: 10; }
button.DTTT_disabled, div.DTTT_disabled, a.DTTT_disabled { float: right; }

#events_filter { width: 31%; float: left; text-align: left; margin-left: .5%; }
#events_filter label { line-height: 2.5em; }
#events_filter input { height: 2.5em; max-width: 71% !important; float: right; }
table#events { width: 100% !important; }
table#events td { width: 10% }
table.dataTable tr { cursor: pointer; }
.dataTables_info, .dataTables_paginate { clear: both; text-align: center; float: none; margin: 1em 0 2em; display: block; }
.dataTables_info { font-weight: 700; }

.DTE_Bubble_Table, 
.DTE_Bubble_Liner form select,
.DTE_Bubble_Liner form input[type="number"],
div.DTE_Field select,
div.DTE_Field input[type="color"],
div.DTE_Field input[type="date"], 
div.DTE_Field input[type="datetime"], 
div.DTE_Field input[type="datetime-local"], 
div.DTE_Field input[type="email"], 
div.DTE_Field input[type="month"], 
div.DTE_Field input[type="number"], 
div.DTE_Field input[type="password"], 
div.DTE_Field input[type="search"], 
div.DTE_Field input[type="tel"], 
div.DTE_Field input[type="text"], 
div.DTE_Field input[type="time"], 
div.DTE_Field input[type="url"], 
div.DTE_Field input[type="week"] { 
    color: #000 !important;
}

.DTE_Bubble_Liner form select,
.DTE_Bubble_Liner form input[type="number"],
div.DTE_Field select,
div.DTE_Field input[type="color"],
div.DTE_Field input[type="date"], 
div.DTE_Field input[type="datetime"], 
div.DTE_Field input[type="datetime-local"], 
div.DTE_Field input[type="email"], 
div.DTE_Field input[type="month"], 
div.DTE_Field input[type="number"], 
div.DTE_Field input[type="password"], 
div.DTE_Field input[type="search"], 
div.DTE_Field input[type="tel"], 
div.DTE_Field input[type="text"], 
div.DTE_Field input[type="time"], 
div.DTE_Field input[type="url"], 
div.DTE_Field input[type="week"]  {
    border: 1px solid #ccc; height: 2.5em; line-height: 2.5em;
}

div.DTE_Body { padding: 52px 0 0 !important; position: relative !important; }
div.DTE_Body_Content div.DTE_Field:hover { background-color:transparent !important; border: 0 !important; }

div.DTE_Bubble div.DTE_Bubble_Liner div.DTE_Bubble_Table div.DTE_Form_Buttons { padding: 0 0 10px !important; }
div.DTE div.DTE_Header { background-color: #0d447d !important; }
.DTE_Body_Content form { max-width: 90% !important; color: #000 !important; margin-top: -50px !important; }
form div.DTE_Form_Content { max-width: 100% !important; }
div.DTE_Body div.DTE_Body_Content div.DTE_Field { padding: 1% 0 !important; max-width: 85% !important; display: inline-block !important; }

div.DTE_Body div.DTE_Body_Content div.DTE_Field>label { float: left; width: 40%; line-height: 2.5em; margin: 0; padding: 0 !important; height: 2.5em;  }
div.DTE_Body div.DTE_Body_Content div.DTE_Field>div.DTE_Field_Input { float: right; width: 48%; clear: right; height: 2.5em; margin: 0; padding: 0;  }
div.DTE div.DTE_Form_Buttons button { height: 2em !important; line-height: 2em !important; padding-left: 1em; padding-right: 1em; text-shadow: -1px -1px 0 rgba(0,0,0,0.3) !important; float: none !important; }

div.DTE_Footer { background-color: transparent !important; border-top: 0 !important; padding: 0 !important; margin: 0 !important; position: absolute; display: block !important; width: 99.5% !important; position: absolute !important; top: 0 !important; }
div.DTE_Footer div.DTE_Form_Buttons button { float: right !important; margin: 10px 40px 0 0 !important; }

.bordo-mini-camp { border-width: 2px; border-style: solid; border-color: #0d447d; display: inline-block; padding: .2em; }

@media only screen and (max-width: 990px) {
    #settings_tab .column, #settings_tab .column.quarter { width: 47%; }
    #stats_page table.mini-camp { width: 47%; }  
    #events_wrapper { width: 100%; clear: both; margin-bottom: 1em; }
}

@media only screen and (max-width: 640px) {
    table#boxscore, table#match_info { width: 98%; margin-left: 1%; margin-right: 1%; clear: both; }
    #settings_tab .column, #settings_tab .column.quarter, #events_page .column { width: 100%; clear: both; }
    #settings_tab .check-all select { width: 72%; max-width: 100% !important; } 
    #events_wrapper { margin-top: 0; }
    div.DTTT_container { clear: both; margin-bottom: 1em; text-align: right !important; display: inline; }
    #events_filter { width: auto; float: right; clear: both; margin-top: 1em; }
    #settings_tab .check-all .column div.text, #settings_tab .check-all div.text, #settings_tab .check-all select, #events_page .check-all .column div.text, #events_page .check-all div.text, #events_page .check-all select { width: 20%; margin-right: 3%; }
    #settings_tab .check-all select, #events_page .check-all select { width: 75% }
    #events_filter input { width: auto; margin-right: 2%; }  
}

/*  --------------------------------------------------
    FIELD 
    --------------------------------------------------   */

/* CAMPO VERTICALE */
#field_page { background-image: url("../img/court_bg_tr.png"); background-size: 100% 100%; position: absolute; height: 90%; width: 95%; }
#field_page #field { width: 90%; height: 90%; padding: 0; margin: 0 auto; top: 4.5%; left: 5%; position: absolute; }
#field_page .half { width: 98%; height: 47%; text-align: center; position: absolute; left: 1%; }
#field_page .half#top-left-half { top: 0; padding-bottom: 2.5%; }
#field_page .half#bottom-right-half { top: 51%; padding-top: 2.5%;}
.cella { width: 31.5%; height: 33%; display: inline-block; margin: .75% .25% 0; padding: .25%; overflow: hidden; padding-top: 2.05em; text-align: center; z-index: 10; }
.nome { height: 2em; line-height: 2em; min-height: 2em; overflow: hidden !important; color: #fff; background: rgba(13, 68, 125, .25); z-index: 10; position: absolute; top: 0; left: 0; width: 96%; font-weight: 600; border-radius: .3em; word-break: break-all; }
.cella button { width: 46% !important; height: 28% !important; line-height: 28% !important; float: left !important; margin: 1% !important; padding: 0 !important; z-index: 10 !important; position: relative !important; background: rgba(255, 255, 255, .5) !important; box-shadow: none !important; font-size: 24px !important; border-radius: .2em !important; color: #0d447d !important; }
.cella button:disabled { background: rgba(150, 150, 150, .5) !important; color: #666 !important; cursor: default !important; }
.cella { position: relative; }
.cella span { display: inline-block; position: absolute; }
.cella .busto {top: 0; left: 38.75%; width: 22%; height: 62%; z-index: 5; }
.cella .manica { top: 3%; width: 12%; height: 21%; }
.cella .manica.sinistra { left: 31%; transform: rotate(-30deg); -o-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -webkit-transform: rotate(-30deg); }
.cella .manica.destra { right: 31%; transform: rotate(30deg); -o-transform: rotate(30deg); -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); }
.cella .gamba { top: 62%; width: 11.5%; height: 40%; }
.cella .gamba.sinistra { left: 38%; transform: skew(-5deg); -o-transform: skew(-5deg); -moz-transform: skew(-5deg); -webkit-transform: skew(-7deg); }
.cella .gamba.destra { right: 38%; transform: skew(5deg); -o-transform: skew(5deg); -moz-transform: skew(5deg); -webkit-transform: skew(7deg); }

.ball {  position: absolute; width:30px; height:30px;}
.ball.left { bottom: 5%; left: 10%; }
.ball.right { bottom: 5%; right: 20%;}

.nopp { font-size: 20px !important; line-height: 20px; margin: 70px 10px !important; position: relative;}

/* INTESTAZIONE SQUADRE */
.battut4 { height: 4%; margin: 0; position: absolute; width: 100%; left: 0; right: 0; display: table; }
.battut4#squadra-uno { top: 0; }
.battut4#squadra-due { bottom: 0; }
.battut4 img { width: auto; float: left; height: 1.25em; margin-right: .5em;  }
@-moz-document url-prefix() {
    .battut4 img { display: none; }
}
.battut4 .team { height: 100%; width: 70%; display: table-cell; vertical-align: middle; margin-right: 10%; float: left; text-align: left; font-weight: 600; font-size: 1.25em; line-height: 1.25em; color: #fff; text-shadow: 1px 1px 0 rgba(255,255,255,.5) }
.extra { width: 60% !important; height: 4%; position: absolute; right: 0; } 
.extra#extra-uno { top: 0; }
.extra#extra-due { top: 96%; }
.extra button { font-size: 1em !important; line-height: 1em !important; height: 100% !important; float: right !important; margin-left: .5em !important; padding: 0 1.5em !important; }

/* BOTTONI CENTRALI */
#center { height: 3em; margin: 0; font-family: 'Days One', sans-serif;  vertical-align: middle; position: absolute; z-index: 10; width: 100%; top: 49%; }
#center .buttons, #center #info { width: 33%; float: left; height: 100%; text-align: center; vertical-align: middle; }
#center .buttons a, #center .buttons button { text-decoration: none; display: inline-block; /*height: 1.25em !important; line-height: 1.25em !important; padding: .25em 1.5em !important; */ background: #35c6f3; background: linear-gradient(to bottom,  #35c6f3 0%,#2aa1c0 50%,#35c6f3 100%); width: auto; border-radius: .5em; text-shadow: -1px -1px 0 rgba(0,0,0,0.3); box-shadow: #666 0 1px 3px; /*margin-top: .3em !important;*/  }
#center .buttons a, #center .buttons button, #center a.child { height: 2.5em !important; line-height: 2.5em !important; padding: 0 1em !important; margin: 0 !important; font-size: 1.2em !important; }

#center .buttons a.fa-icon { color: #0d447d !important; cursor: pointer !important; background: #fff !important; background: linear-gradient(to bottom,  #ffffff 0%,#f1f1f1 50%,#e1e1e1 51%,#f6f6f6 100%) !important; font-size: 1.2em !important; }
#center #info { /*display: table;*/ text-transform: uppercase; }
#center a.child { display: inline-block; width: 100%; vertical-align: middle; border-radius: .5em; text-decoration: none; box-shadow: #666 0 1px 3px; /*min-height: 1.25em; line-height: 1.25em !important; margin-top: .3em;*/ padding: 0 !important }
#center .nostra a.child { color: #0d447d; background: #fceabb; background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); }
#center .vostra a.child { color: #f8b500;  background: #0d447d; background: linear-gradient(to bottom,  #0d447d 0%,#34587c 50%,#34587c 55%,#2aa1c0 100%); }

#center .buttons a:hover, #center a:hover.child, #center a.fa-icon:hover.child { background: #0d447d !important; color: #fff !important; }
.fa-exchange { transform: rotate(90deg); }

/* COLORI SQUADRA TOP o LEFT */
#top-left-half .cella .busto, #top-left-half .cella .manica { background-color: #eee /* T-SHIRT */; } 
#top-left-half .cella .gamba { background-color: #0b2263  /*PANTALONE */; } 
#top-left-half .cella.libero .busto, #top-left-half .cella.libero .manica { background-color: #4463bd /* T-SHIRT LIBERO */; }
#top-left-half .cella.libero .gamba { background-color: #fff /* PANTALONE LIBERO */; } 
#top-left-half .cella.palleggiatore .busto, #top-left-half .cella.palleggiatore .manica { background-color: #4223bd /* T-SHIRT PALLEGGIATORE */; }
#top-left-half .cella.palleggiatore .gamba { background-color: #f2f /* PANTALONE PALLEGGIATORE */; } 

/* COLORI SQUADRA BOTTOM o RIGHT */
#bottom-right-half .cella .busto, #bottom-right-half .cella .manica { background-color: #333 /* T-SHIRT */; }
#bottom-right-half .cella .gamba { background-color: #fff /* PANTALONE */; }
#bottom-right-half .cella.libero .busto, #bottom-right-half .cella.libero .manica { background-color: #cc0000 /* T-SHIRT LIBERO */; }
#bottom-right-half .cella.libero .gamba { background-color: #000 /* PANTALONE LIBERO */; }
#bottom-right-half .cella.palleggiatore .busto, #bottom-right-half .cella.palleggiatore .manica { background-color: #660000 /* T-SHIRT PALLEGGIATORE */; }
#bottom-right-half .cella.palleggiatore .gamba { background-color: #ddd /* PANTALONE PALLEGGIATORE */; } 

/* CAMPO VERTICALE TOP */
.top#field_page { background-image: url("../img/court_bg_tr_vtop.png"); background-size: 100% 90%; background-position: center 30%; background-repeat: no-repeat; }
.top#field_page .half#bottom-right-half { display: none; }
.top#field_page .battut4#squadra-due, .top#field_page .extra#extra-due { display: none; }

.top#field_page #center { position: absolute; top: 96% !important; width: 100%; left: 0; right: 0; }
.top#field_page .half#top-left-half { top: 5%; height: 90%; }
.top#field_page .cella { height: 39%; padding-top: 30px; }
.top#field_page .cella .busto { top: 16%; height: 40%; z-index: 5; }
.top#field_page .cella .manica { top: 20.8%; width: 13%; height: 14%; }
.top#field_page .cella .gamba { top: 52%; width: 11.5%; height: 30%; }

/* CAMPO VERTICALE BOTTOM */
.bottom#field_page { background-image: url("../img/court_bg_tr_vbottom.png"); background-size: 100% 90%; background-position: center 50%; background-repeat: no-repeat; }
.bottom#field_page .half#top-left-half { display: none; }
.bottom#field_page .battut4#squadra-due { top: 88% !important; }
.bottom#field_page .extra#extra-due { top: 93% !important; }
.bottom#field_page .battut4#squadra-uno, .bottom#field_page .extra#extra-uno { display: none; }
.bottom#field_page #center { position: absolute; top: -3.5% !important; width: 100%; left: 0; right: 0; }
.bottom#field_page .half#bottom-right-half { top: 0; height: 90%; }
.bottom#field_page .cella { height: 33%; padding-top: 30px; }
.bottom#field_page .cella .busto { top: 16%; height: 40%; z-index: 5; }
.bottom#field_page .cella .manica { top: 20.8%; width: 13%; height: 14%; }
.bottom#field_page .cella .gamba { top: 52%; width: 11.5%; height: 30%; }

/* CAMPO ORIZZONTALE */
.hor#field_page { background-image: url("../img/court_bg_tr_hor.png"); width: 96%; height: 86%; }
.hor#field_page #field .half { width: 49% !important; height: 95%; position: absolute; top: 1%; } 
.hor#field_page #field .half#top-left-half { left: 1%; }
.hor#field_page #field .half#bottom-right-half {left: 52%; }

.hor .cella { width: 46%; height: 23% !important; text-align: center; float: none; position: absolute; }

.hor .half#top-left-half .cella:nth-of-type(1) { left: 0; top: 67%; }
.hor .half#top-left-half .cella:nth-of-type(2) { left: 0; top: 34%; }
.hor .half#top-left-half .cella:nth-of-type(3) { left: 0; top: 1%; }
.hor .half#top-left-half .cella:nth-of-type(4) { left: 49%; top: 67%; }
.hor .half#top-left-half .cella:nth-of-type(5) { left: 49%; top: 34%; }
.hor .half#top-left-half .cella:nth-of-type(6) { left: 49%; top: 1%; }

.hor .half#bottom-right-half .cella:nth-of-type(1) { left: 0; top: 67%; }
.hor .half#bottom-right-half .cella:nth-of-type(2) { left: 0; top: 34%; }
.hor .half#bottom-right-half .cella:nth-of-type(3) { left: 0%; top: 1%; }
.hor .half#bottom-right-half .cella:nth-of-type(4) { left: 49%; top: 67%; }
.hor .half#bottom-right-half .cella:nth-of-type(5) { left: 49%; top: 34%; }
.hor .half#bottom-right-half .cella:nth-of-type(6) { left: 49%; top: 1%; }

.hor .cella .busto {top: 20%; height: 40%; }
.hor .cella .manica { top: 22%; height: 15%; }
.hor .cella .manica.sinistra { left: 32%; }
.hor .cella .manica.destra { right: 32%; }
.hor .cella .gamba { height: 30%; top: 60%; }
.hor#field_page .battut4 { width: 50%; top: 0; position: absolute; text-align: center; }
.hor#field_page #squadra-uno { left: 0; }
.hor#field_page #squadra-due { right: 0 !important; left: 50%; }
.hor#field_page .team { width: auto; margin-right: 0; }
.hor#field_page .battut4#squadra-due .team {  text-align: right !important; float: right; }
.hor#field_page #squadra-due img { float: right; margin-left: .5% !important; }
.hor#field_page .extra { width: 4% !important; height: 80%; position: absolute; top: 10%; }
.hor#field_page .extra#extra-uno { left: 0; }
.hor#field_page .extra#extra-due { left: 97%; }
.hor#field_page .extra button { width: 100%; height: 2.75em !important; line-height: 2.75em !important; padding: 0 !important; margin: 0 0 .5em 0 !important; text-align: center; font-size: .9em !important; float: none !important; }
.hor #center { position: absolute; top: 101%; width: 100%; left: 0; right: 0; }
.hor#field_page #center .buttons a, .hor#field_page #center .buttons button { padding: 0 1.5em !important; }
.hor .fa-exchange { transform: rotate(0); }

/* CAMPO ORIZZONTALE LEFT */
.hor.left#field_page { background-image: url("../img/court_bg_tr_hleft.png"); width: 96%; height: 86%;  background-size: 100% 90%; background-repeat: no-repeat;  }
.hor.left#field_page .half#bottom-right-half { display: none; } 
.hor.left#field_page .battut4#squadra-due, .hor.left#field_page .extra#extra-due { display: none; }
.hor.left#field_page #field .half { width: 100% !important; height: 83%; left: 5% !important; top: 1% !important; }

.hor.left.active .half#top-left-half .cella { width: 48%; margin: 0; }
.hor.left.active .half#top-left-half .cella:nth-of-type(1) { left: 0; top: 67%; }
.hor.left.active .half#top-left-half .cella:nth-of-type(2) { left: 0; top: 35%; }
.hor.left.active .half#top-left-half .cella:nth-of-type(3) { left: 0; top: 1%; }
.hor.left.active .half#top-left-half .cella:nth-of-type(4) { left: 50%; top: 67%; }
.hor.left.active .half#top-left-half .cella:nth-of-type(5) { left: 50%; top: 35%; }
.hor.left.active .half#top-left-half .cella:nth-of-type(6) { left: 50%; top: 1%; }

.hor.left.active .half#top-left-half .cella, .hor.right.active .half#bottom-right-half .cella { height: 21.5%; }
.hor.left.active .half#top-left-half .cella button, .hor.right.active .half#bottom-right-half .cella button { height: 31%; margin: .25% 1% .5% !important; }

.hor.left .cella .busto {top: 25%; height: 40%; width: 18%; left: 41%; z-index: 5; }
.hor.left .cella .manica { top: 32%; height: 15%; }
.hor.left .cella .gamba { height: 30%; top: 60%; width: 9%; }
.hor.left .cella .gamba.sinistra { left: 41%; }
.hor.left .cella .gamba.destra { right: 41%; }
.hor.left #center { top: 96%; }
.hor.left#field_page #center .buttons, .hor.left#field_page #center #info { width: 33.25%; }
.hor.left#field_page #center #info { margin-top: 0; }

.hor.left.active#field_page .extra button { width: 100%; margin: 0 0 .75em !important; height: auto !important; line-height: 1em !important; padding: 1em 0 !important; }

/* CAMPO ORIZZONTALE RIGHT */
.hor.right#field_page { background-image: url("../img/court_bg_tr_hright.png"); width: 96%; height: 86%; background-size: 100% 90%; background-repeat: no-repeat;  }
.hor.right#field_page .half#top-left-half { display: none; }
.hor.right#field_page .battut4#squadra-uno, .hor.right#field_page .extra#extra-uno { display: none; }
.hor.right#field_page #field .half { width: 100% !important; height: 83%; top: 1%; left: -.5% !important; }

.hor.right.active .half#bottom-right-half .cella:nth-of-type(1) { left: 0; top: 66%; }
.hor.right.active .half#bottom-right-half .cella:nth-of-type(2) { left: 0; top: 34%; }
.hor.right.active .half#bottom-right-half .cella:nth-of-type(3) { left: 0%; top: 2%; }
.hor.right.active .half#bottom-right-half .cella:nth-of-type(4) { left: 49%; top: 66%; }
.hor.right.active .half#bottom-right-half .cella:nth-of-type(5) { left: 49%; top: 34%; }
.hor.right.active .half#bottom-right-half .cella:nth-of-type(6) { left: 49%; top: 2%; }

.hor.right .cella .busto {top: 25%; height: 40%; width: 18%; left: 41%; z-index: 5; }
.hor.right .cella .manica { top: 32%; height: 15%; }
.hor.right .cella .gamba { height: 30%; top: 60%; width: 9%; }
.hor.right .cella .gamba.sinistra { left: 41%; }
.hor.right .cella .gamba.destra { right: 41%; }
.hor.right #center { top: 95%; }
.hor.right#field_page #center .buttons, .hor.right#field_page #center #info { width: 33.25%; }
.hor.right#field_page #center #info { margin-top: 0; }

.hor.right.active#field_page .extra button { width: 100%; margin: 0 0 .75em !important; height: auto !important; line-height: 1em !important; padding: 1em 0 !important; }

/* ----------- 1280px X 800px ----------- */
/* ----------- Galaxy Tab 10.1 ----------- */
/* Portrait */
@media 
  (max-device-width: 800px) 
  and (orientation: portrait) { 
      .cella { height: 44%; }
      #field_page.bottom .half#bottom-right-half { padding-top: 7.5%; }
      #field_page.top .half#top-left-half { padding-top: 5%; }
      .bottom#field_page .cella .busto, .top#field_page .cella .busto { top: 26%; height: 30%; left: 34.75%; width: 32%; }
      .bottom#field_page .cella .manica, .top#field_page .cella .manica { top: 28%; width: 20%; height: 10%; }
      .bottom#field_page .cella .manica.sinistra, .top#field_page .cella .manica.sinistra { left: 21% }
      .bottom#field_page .cella .manica.destra, .top#field_page .cella .manica.destra { right: 21% }
      .bottom#field_page .cella .gamba, .top#field_page .cella .gamba { top: 52%; width: 16%; height: 20%; }
      .bottom#field_page .cella .gamba.sinistra, .top#field_page .cella .gamba.sinistra { left: 33% }
      .bottom#field_page .cella .gamba.destra, .top#field_page .cella .gamba.destra { right: 33% }
      .extra button a { padding: 0 1em !important; }
      #field_page .half#bottom-right-half { top: 51%; }
      
      .hor#field_page .extra#extra-uno, .hor#field_page .extra#extra-due { width: 8% !important; }
      .hor.right.active#field_page .extra#extra-due { left: 92%; }
      .hor#field_page .extra button, .hor.left.active#field_page .extra button, .hor.right.active#field_page .extra button { height: 4em !important; line-height: 4em !important; }
      
      .hor .cella { height: 30% !important; }
      .hor .cella .busto { top: 25%; height: 30%; }
      .hor .cella .manica { width: 19%; top: 26.5%; height: 10%; }
      .hor .cella .manica.sinistra { left: 27%; }
      .hor .cella .manica.destra { right: 27%; }
      
      .hor #top-left-half .cella .manica, .hor #bottom-right-half .cella .manica { top: 29%; }
      .hor #top-left-half .cella .manica.sinistra, .hor #bottom-right-half .cella .manica.sinistra { left: 28%; }
      .hor #top-left-half .cella .manica.destra, .hor #bottom-right-half .cella .manica.destra { right: 28%; }
      
      #center { height: 4%; }
      #center .buttons a, #center .buttons button, #center a.child { height: 2.5em !important; line-height: 2.5em !important; padding: 0 1em !important; margin: 0 !important; font-size: 1.2em !important; }
      #center a.child { padding: 0 !important; }
      
      .top#field_page #center, .bottom#field_page #center, .hor.right#field_page #center, .hor.left#field_page #center { height: 3em !important; line-height: 3em !important; }
      .top#field_page #center .buttons a, .top#field_page #center .buttons button, .top#field_page #center a.child, .bottom#field_page #center .buttons a, .bottom#field_page #center .buttons button, .bottom#field_page #center a.child,
      .hor.right#field_page #center .buttons a, .hor.right#field_page #center .buttons button, .hor.right#field_page #center a.child, .hor.left#field_page #center .buttons a, .hor.left#field_page #center .buttons button, .hor.left#field_page #center a.child{ height: 3em !important; line-height: 3em !important; padding: 0 .5em !important; }
      .bottom#field_page #center a.child, .top#field_page #center a.child, .hor.left#field_page #center a.child, .hor.right#field_page #center a.child { font-size: .8em !important; padding: .25em 0 !important; line-height: 1.25em !important; }
      
      .bottom#field_page .battut4#squadra-due { top: 90% !important; }
      .bottom#field_page .extra#extra-due { top: 90% !important; }
      .bottom#field_page #center { top: -1.5% !important; }
}
/* Landscape */
@media 
  (max-device-width: 1280px) 
  and (orientation: landscape) { 
      #field_page .half#bottom-right-half { top: 51%; }
      .top#field_page .cella, .bottom#field_page .cella { height: 44%; }
      .top#field_page #center, .bottom#field_page #center { top: 95%; }
      .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 2em !important; }
      .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button { padding: 0 1.8em !important; }
}

/* ----------- MAX-WIDTH 1100px ----------- */
@media only screen and (max-width : 1100px) {
    .extra button { margin-left: .1em !important; }
}

/* ----------- MAX-WIDTH 990px ----------- */
@media only screen and (max-width : 990px) {
    /* CAMPO COMPLETO VERTICALE */
    .etabs { margin: .25em auto !important; }
    button.tab-button, .etabs li.tab, .etabs a#exit { font-size: 12px !important; height: 1.25em !important; line-height: 1.25em; border-radius: .5em !important; padding: .5em !important; margin-right: .25em !important; }
    #settings_tab button.tab-button { height: 2.5em !important; }
    .etabs { text-align: left; margin: .25em 0; }
    .etabs li.tab { display: block; }
    .etabs a#exit { padding: .5em 1em !important; height: 1.25em !important; line-height: 1.25em !important; font-size: 12px !important; }
    .battut4 { overflow: hidden; width: 50%; }
    .extra { overflow: hidden; width: 60%; }
    .extra button { font-size: .75em !important; line-height: .75em !important; margin-left: .25em !important; }
    .extra button a { padding: 0 1.35em; }
    /* CAMPO VERTICALE TOP */
    .top#field_page #center { top: 95%; }
    .top#field_page #center #info { margin-top: 0; }
    .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button { padding: 0 1em !important; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page #center { top: 95%; }
    .bottom#field_page #center #info { margin-top: 0; }
    .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 .75em !important; }
}

/* ----------- MAX-WIDTH 900px ----------- */
@media only screen and (max-width : 900px) {
    /* CAMPO COMPLETO VERTICALE */
    .cella { height: 29%; }
    .cella .busto {top: 20%; height: 40%; }
    .cella .manica { top: 22%; height: 15%; }
    .cella .manica.sinistra { left: 32%; }
    .cella .manica.destra { right: 32%; }
    .cella .gamba { height: 30%; top: 60%; }
    /* CAMPO VERTICALE TOP */
    .top#field_page #center .buttons, .top#field_page #center #info { width: 33.25%; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page #center .buttons, .bottom#field_page #center #info { width: 33.25%; }
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor .cella .busto {top: 28%; height: 35%; }
    .hor .cella .manica { top: 21.5%; height: 12%; }
    .hor .cella .manica.sinistra { left: 32%; }
    .hor .cella .manica.destra { right: 32%; }
    .hor .cella .gamba { height: 19%; top: 55%; }
    .hor #bottom-right-half .cella .manica, .hor #top-left-half .cella .manica { top: 28% !important; } 
    /* CAMPO ORIZZONTALE LEFT */
    .hor.left.active#field_page .extra button { margin: 0 0 .5em !important; padding: .5em 0 !important; }
    /* CAMPO ORIZZONTALE RIGHT */
    .hor.right.active#field_page .extra button { margin: 0 0 .5em !important; padding: .5em 0 !important; }
}

/* ----------- MAX-WIDTH 800px ----------- */
@media only screen and (max-width : 800px) {
    #center { height: 2em; }
    #center .buttons a, #center .buttons button, #center a.child { height: 2em !important; line-height: 2em !important; font-size: 1em !important; }
    #center a.child { font-size: .8em !important; padding: .25em 0 !important; }
    #center .buttons a.fa-icon { font-size: 1em !important; }
    
    .hor#field_page .extra#extra-uno, .hor#field_page .extra#extra-due { width: 6% !important; }
    .hor.right.active#field_page .extra#extra-due { left: 94%; }
    
    .top#field_page .cella, .bottom#field_page .cella { height: 40%; top: 3% !important; }
    
    .bottom#field_page .battut4#squadra-due { top: 88% !important; }
    .bottom#field_page .extra#extra-due { top: 93% !important; }
    .bottom#field_page #center { top: -3.5% !important; }
} 

/* ----------- MAX-WIDTH 768px ----------- */
@media only screen and (max-width : 768px) {
    /* CAMPO COMPLETO VERTICALE */
    .battut4 .team { font-size: 14px; }
    #field_page .half#top-left-half { top: 1%; }
    #field_page .half#bottom-right-half { top: 53%; }
    .cella { height: 30% !important; margin: 0 .25%; padding-top: 1.4em; }
    .nome { font-size: 10px; line-height: 16px; overflow: hidden; min-height: 1.5em; height: 1.5em; line-height: 1.5em; }
    .cella button { height: 30%; font-size: 16px !important; }
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor#field_page .extra { width: 7% !important; }
    .hor#field_page .extra#extra-uno { left: -1.5%; }
    .hor#field_page .extra#extra-due { left: 94%; }
    .hor#field_page .extra button { width: 100%; padding: 0 !important;  font-size: .7em !important; }
    .hor#field_page #center .buttons a, .hor#field_page #center .buttons button { padding: 0 .75em !important; }
    
}

/* ----------- 1024px X 768px ----------- */
/* ----------- iPad mini ----------- */
/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 1) {
      /*#center .buttons:first-child a { float: left; padding: 0 1.25em !important; }*/
}
/* Portrait */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: portrait) 
  and (-webkit-min-device-pixel-ratio: 1) {
      .cella { height: 44% !important; }
      .bottom#field_page .battut4#squadra-due { top: 93% !important; }
      .bottom#field_page .extra#extra-due { top: 93% !important; }
      .bottom#field_page #center { top: -2.5% !important; }
}

/* ----------- MAX-WIDTH 690px ----------- */
@media only screen and (max-width : 690px) {
    /* CAMPO COMPLETO VERTICALE */
    .battut4 .team { font-size: 12px; }
    #field_page { height: 88%; }
    #field_page .half { height: 45%; }
    .cella .busto {top: 30%; height: 30%; }
    .cella .manica { top: 33%; height: 10%; }
    .cella .manica.sinistra { left: 32%; }
    .cella .manica.destra { right: 32%; }
    .cella .gamba { height: 20%; }
    #center { top: 48%; }
    #center .buttons a, #center .buttons button, #center .buttons a.fa-icon { padding: 0 .75em !important; }
    /* CAMPO VERTICALE TOP */
    .top#field_page #center { top: 90%; }  
    .top#field_page #center #info { margin-top: 0; }
    .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button { padding: 0 .5em !important; }
    .top.active#field_page #center a.child { font-size: .8em !important; padding: .25em 0 !important; line-height: 1.25em !important; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page #center { top: 90%; }  
    .bottom#field_page #center #info { margin-top: 0; }
    .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 .5em !important; }
    .bottom.active#field_page #center a.child { font-size: .8em !important; padding: .25em 0 !important; line-height: 1.25em !important; }
    .bottom#field_page .battut4#squadra-due { top: 90% !important; }
    .bottom#field_page .extra#extra-due { top: 90% !important; }
    .bottom#field_page #center { top: -5.5% !important; }
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor#field_page #field { height: 88% !important; top: 5% !important; }  
    .hor .cella { height: 23.5% !important; }
    .hor .cella .busto { top: 27%; height: 25%; z-index: 5; }
    .hor .cella .manica { top: 30% !important; height: 15%; }
    .hor .cella .manica.sinistra { transform: rotate(40deg); -o-transform: rotate(40deg); -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); }
    .hor .cella .manica.destra { transform: rotate(-40deg); -o-transform: rotate(-40deg); -moz-transform: rotate(-40deg); -webkit-transform: rotate(-40deg); }
    .hor .cella .gamba { height: 20%; top: 50%; }
    .hor #center { position: absolute; top: 101%; width: 100%; left: 0; right: 0; }
    .hor #center .buttons, .hor #center #info { width: 33.25%; }
    /* CAMPO ORIZZONTALE LEFT */
    .hor .cella .manica { top: 30% !important; height: 15%; width: 10% !important;}
    .hor.left .cella .manica.sinistra { transform: rotate(-40deg); -o-transform: rotate(-40deg); -moz-transform: rotate(-40deg); -webkit-transform: rotate(-40deg); }
    .hor.left .cella .manica.destra { transform: rotate(40deg); -o-transform: rotate(40deg); -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); }
    /* CAMPO ORIZZONTALE RIGHT */
    .hor .cella .manica { top: 30% !important; height: 15%; width: 10% !important;}
    .hor.right .cella .manica.sinistra { transform: rotate(-40deg); -o-transform: rotate(-40deg); -moz-transform: rotate(-40deg); -webkit-transform: rotate(-40deg); }
    .hor.right .cella .manica.destra { transform: rotate(40deg); -o-transform: rotate(40deg); -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); }
    
    
    .page.hor.right.active#field_page .half#bottom-right-half .cella, 
    .page.hor.left.active#field_page .half#top-left-half .cella { 
        height: 30% !important;  
    }
    
}

/* ----------- MAX-WIDTH 550px ----------- */
@media only screen and (max-width : 550px) {
    /* CAMPO COMPLETO VERTICALE */
    .etabs { margin: .5em auto !important; }
    .etabs li.tab { height: 2em !important; line-height: 2em; }
    .etabs li.tab, .etabs a#exit { height: 2em !important; line-height: 2em;  }
    button.tab-button { height: 1.5em !important; line-height: 1.5em;  }
    button.tab-button, .etabs li.tab, .etabs a#exit { font-size: 10px !important;
        border-radius: .25em !important; padding: 0 .5em !important; margin-right: .1em !important; }
    .etabs { text-align: left; margin: .25em 0; }
    .etabs li.tab { display: block; }
    .etabs a#exit { height: 2em !important; line-height: 2em !important; font-size: 11px !important; }
    .battut4 .team { font-size: 12px; width: 100%; }
    .battut4 img { display: none; }
    .extra button { font-size: .75em !important; line-height: .75em !important; margin-left: .1em !important; }
    #field { top: 5% !important; height: 90% !important; }
    #field_page .half#top-left-half { top: 1%; }
    #field_page .half#bottom-right-half { top: 53%; }
    .cella { margin: 0 .25% .5%; padding-top: 1.1em !important; }
    .nome { font-size: 10px; line-height: 16px; overflow: hidden; min-height: 1.5em; height: 1.5em; line-height: 1.5em; }
    .cella .busto { top: 36%; height: 25%; }
    .cella .manica { top: 38%; height: 10%; }
    .cella .manica.sinistra { left: 32%; }
    .cella .manica.destra { right: 32%; }
    .cella .gamba { height: 15%; }    
    /* CAMPO COMPLETO ORIZZONTALE */
    .top#field_page #center { top: 90%; }  
    .hor #center .nostra a { font-size: .8em !important; padding: .25em 0 !important; }
    .hor#field_page .battut4 { width: 50% !important; }
    /* CAMPO VERTICALE TOP */
    .top#field_page .cella .busto { top: 19.5%; height: 30%; }
    .top#field_page .cella .manica { top: 19.5%; width: 24%; height: 8%; }
    .top#field_page .cella .manica.sinistra { left: 25%; }
    .top#field_page .cella .manica.destra { right: 25%; }
    .top#field_page .cella .gamba { top: 49%; height: 20%; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page .cella .busto { top: 18.5%; height: 31.5%; }
    .bottom#field_page .cella .manica { top: 19.5%; width: 20%; height: 8%; }
    .bottom#field_page .cella .manica.sinistra { left: 25%; }
    .bottom#field_page .cella .manica.destra { right: 25%; }
    .bottom#field_page .cella .gamba { top: 49%; height: 20%; }
    /* CAMPO ORIZZONTALE LEFT */
    .hor.left .cella .manica { top: 29%; }
    .hor.left .cella .manica.sinistra { transform: rotate(-30deg); -o-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -webkit-transform: rotate(-30deg); left: 33% }
    .hor.left .cella .manica.destra { transform: rotate(30deg); -o-transform: rotate(30deg); -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); right: 33%; }
    
    /* CAMPO ORIZZONTALE RIGHT */
    .hor.right .cella .manica { top: 29%; }
    .hor.right .cella .manica.sinistra { transform: rotate(-30deg); -o-transform: rotate(-30deg); -moz-transform: rotate(-30deg); -webkit-transform: rotate(-30deg); left: 33% }
    .hor.right .cella .manica.destra { transform: rotate(30deg); -o-transform: rotate(30deg); -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); right: 33%; }
}

/* ----------- MAX-WIDTH 480px ----------- */
@media only screen and (max-width : 480px) {
    /* CAMPO COMPLETO VERTICALE */
    .battut4, .extra { width: 100% !important; float: none; clear: both; }
    .battut4#squadra-uno { top: 0 }
    .nome { font-size: 9px; overflow: hidden; }
    .team { font-size: 10px; letter-spacing: -1px; }
    .extra#extra-uno { top: 4.5%; }
    .extra#extra-due { top: 91.5%; }
    #field_page #field { height: 80% !important; top: 9% !important; }
    .cella button { font-size: 15px !important; }
    #center .buttons a, #center .buttons button, #center a.child, #center .buttons a.fa-icon { font-size: .7em !important; }
    #center a.child { min-height: 2em; height: auto !important; line-height: 1.2em !important; padding: .5em 0 !important; overflow: auto; }
    #center #info { margin-top: -.35em; }
    /*#center .buttons a { padding: 0 .25em !important; }
    #center a.child { padding: 0 !important; font-size: .8em; }*/
    /*#center .buttons a.fa-icon { width: 20% !important; } */
    /* CAMPO VERTICALE TOP */
    .top#field_page .cella .manica { height: 6%; }
    .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button { padding: 0 .5em !important; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page .cella .manica { height: 6%; }
    .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 .5em !important; }
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor#field_page #center .buttons a, .hor#field_page #center .buttons button { padding: 0 1em !important; }
    /* CAMPO ORIZZONTALE LEFT */
    .hor.left .cella .busto { top: 28.5%; }
    .hor.left#field_page #center #info { margin-top: .25em; }
    /* CAMPO ORIZZONTALE RIGHT */
    .hor.right .cella .busto { top: 28.5%; }
    .hor.right#field_page #center #info { margin-top: .25em; }
    }

/* ----------- MAX-WIDTH 360px ----------- */
@media only screen and (max-width : 360px) {
    /* CAMPO COMPLETO VERTICALE */
    .extra#extra-due { top: 95%; }
    /* CAMPO VERTICALE TOP */
    .page.top#field_page .half#top-left-half .cella { width: 29%; height: 44% !important; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page .extra#extra-due { top: 5%; }
    .page.bottom#field_page .half#bottom-right-half .cella { width: 29%; height: 44% !important; }
    .bottom#field_page .battut4#squadra-due { top: 90% !important; }
    .bottom#field_page .extra#extra-due { top: 95% !important; }
    .bottom#field_page #center { top: -9% !important; }
    /* CAMPO ORIZZONTALE LEFT & RIGHT */
    /*.half#bottom-right-half .cella, 
    .half#top-left-half .cella { 
        width: 30%; height: 44% !important; 
    }*/
    .page.hor.right.active#field_page .half#bottom-right-half .cella, 
    .page.hor.left.active#field_page .half#top-left-half .cella { 
        height: 30% !important; width: 44% !important; 
    }
    .hor.right.active#field_page #center .buttons a, .hor.right.active#field_page #center .buttons button, .hor.left.active#field_page #center .buttons a, .hor.left.active#field_page #center .buttons button { padding: 0 .5em !important; }
}

/* ----------- 736px X 414px ----------- */
/* ----------- iPhone 6 Plus ----------- */
/* Portrait */
@media only screen 
and (min-device-width : 414px) 
and (max-device-width : 736px) 
and (orientation : portrait) { 
    .hor.right#field_page #center .buttons a, .hor.right#field_page #center .buttons button, .hor.left#field_page #center .buttons a, .hor.left#field_page #center .buttons button { padding: 0 .75em !important; }
    .wrap { padding-top: 0; }
}

/* ----------- 667px X 375px ----------- */
/* ----------- iPhone 6 ----------- */
/* Portrait */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 667px) 
and (orientation : portrait) { 
    #field_page .half#top-left-half { top: 1%; }
    #field_page .half#bottom-right-half { top: 54.5%; }
    .cella { height: 42% !important; }
    #center #info { margin-top: -.2em; }
    #center .buttons a, #center .buttons button, #center a.child, #center .buttons a.fa-icon { font-size: .7em !important; }
    #center .buttons a, #center .buttons button, #center .buttons a.fa-icon { padding: 0 .75em !important; }
    .hor#field_page #center .buttons a, .hor#field_page #center .buttons button, .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button, .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 .5em !important; }
    .hor.right#field_page #center .buttons a, .hor.right#field_page #center .buttons button, .hor.left#field_page #center .buttons a, .hor.left#field_page #center .buttons button { padding: 0 .5em !important; }
    
    .bottom#field_page #center { top: -5% !important; }
    
    .wrap { padding-top: 0; }
}

/* ----------- 568px X 320px ----------- */
/* ----------- iPhone 5 and 5S ----------- */
/* Portrait */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2)
    and (orientation: portrait) {
    .wrap { padding-top: 0; }
    
    /* CAMPO COMPLETO VERTICALE */
    .battut4 .team, .extra { width: 100% !important; float: none; clear: both; }
    .battut4#squadra-uno { top: 0 }
    .extra#extra-uno { top: 4.5%; }
    .extra#extra-due { top: 91.5%; }
    #field_page #field { height: 80%; top: 9%; }
    .cella { height: 37%; margin: .5%; width: 30%; }
    #center .buttons a, #center .buttons button, #center a.child, #center .buttons a.fa-icon { font-size: .7em !important; }
    #center .buttons a, #center .buttons button, #center .buttons a.fa-icon { padding: 0 .5em !important; }
    /*#center .buttons a.fa-icon, #center .buttons a { font-size: .7em !important; }*/
    /* CAMPO VERTICALE top */
    .top#field_page { background-size: 100% 80%; }
    .top#field_page .battut4#squadra-due, .top#field_page .extra#extra-due { top: 0; width: 100%; }
    .top#field_page .extra#extra-due { top: 5%; }
    .top#field_page #center { top: 96%; }
    .top#field_page .half#top-left-half { top: 1%; height: 85% !important; }
    .top#field_page .cella { height: 41% !important; padding-top: 25px; }
    .top#field_page  .half#bottom-right-half .cella, .top#field_page  .half#top-left-half .cella { width: 30% !important; height: 48% !important; }
    .top#field_page .cella .busto { top: 30%; height: 27%; }
    .top#field_page .cella .manica { top: 31%; width: 18%; height: 12%; }
    .top#field_page .cella .gamba { top: 50%; width: 17%; height: 23%; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page { background-size: 100% 80%; }
    .bottom#field_page .battut4#squadra-due, .bottom#field_page .extra#extra-due { top: 0; width: 100%; }
    .bottom#field_page .extra#extra-due { top: 5%; }
    .bottom#field_page #center { top: 96%; }
    .bottom#field_page .half#bottom-right-half { top: 1%; height: 85% !important; }
    .bottom#field_page  .half#bottom-right-half .cella, .bottom#field_page  .half#bottom-right .cella { width: 30% !important; height: 48% !important; }
    .bottom#field_page .cella { height: 41% !important; padding-top: 25px; }
    .bottom#field_page .cella .busto { top: 30%; height: 27%; }
    .bottom#field_page .cella .manica { top: 31%; width: 18%; height: 12%; }
    .bottom#field_page .cella .gamba { top: 50%; width: 17%; height: 23%; }
        
    .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button, .bottom.active#field_page #center .buttons a, .bottom.active#field_page #center .buttons button { padding: 0 .5em !important; }    
        
    .bottom#field_page .battut4#squadra-due { top: 88% !important; }
    .bottom#field_page .extra#extra-due { top: 93% !important; }
    .bottom#field_page #center { top: -7% !important; }
    
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor#field_page #field .half { height: 90% !important; }
    .hor .cella { height: 25% !important;}
    .page.hor .half#bottom-right-half .cella, .page.hor .half#top-left-half .cella { width: 44% !important; height: 30% !important; }
    .hor #center { top: 95%; }
    .hor#field_page #center .buttons a, .hor#field_page #center .buttons button { padding: 0 .5em !important; }
    /* CAMPO ORIZZONTALE LEFT */
    .hor.left#field_page #field .half { height: 78% !important;}
    /* CAMPO ORIZZONTALE RIGHT */
    .hor.right#field_page #field .half { height: 78% !important;}
        
    .hor.right#field_page #center .buttons a, .hor.right#field_page #center .buttons button, .hor.left#field_page #center .buttons a, .hor.left#field_page #center .buttons button { padding: 0 .5em !important; }
}
/* Landscape */
@media only screen 
    and (min-device-width: 320px) 
    and (max-device-width: 568px)
    and (-webkit-min-device-pixel-ratio: 2)
    and (orientation: landscape) {
        
    .wrap { padding-top: 0; }
        
    /* CAMPO COMPLETO VERTICALE */
    .etabs { padding-bottom: .5em !important; margin: .5em auto !important; }
    button.tab-button, .etabs li.tab, .etabs a#exit { font-size: 10px !important; height: 1.5em !important; line-height: 1.5em; border-radius: .25em !important; padding: 0 .5em !important; margin-right: .1em !important; }
    .etabs { text-align: left; margin: .25em 0; padding-bottom: .25em !important; }
    .etabs li.tab { display: block; }
    .etabs a#exit { padding: .25em .5em !important; height: 1em !important; line-height: 1em !important; }
    #field { top: 5% !important; height: 90% !important; }
    #field_page .half#top-left-half { top: 1%; }
    #field_page .half#bottom-right-half { top: 50%; }
    .cella { height: 23% !important; }
    .cella button { width: 14.5% !important; height: 90% !important; margin: 1% .5% !important; padding: 2% 0; }
    .battut4, .extra { overflow: hidden; width: 50%; height: 8%; }
    .battut4 .team { font-size: 12px; width: 50%; }
    .battut4 img{ display: none; }
    .extra#extra-uno, .battut4#squadra-uno { top: -3%; }
    .extra#extra-due, .battut4#squadra-due { top: 96%; }
    .extra button { font-size: .75em !important; line-height: .75em !important; margin-left: .1em !important; }
    .cella { height: 37%; margin: .5%; width: 31%; }
    #center { top: 46%; }
    #center .buttons a, #center .buttons button, #center a.child, #center .buttons a.fa-icon { font-size: .7em !important; }
    #center .buttons a, #center .buttons button, #center .buttons a.fa-icon { padding: 0 .75em !important; }
    /*#center { top: 47%; }
    #center .buttons a.fa-icon, #center .buttons a, #center a.child { font-size: .7em !important; }*/
    /* CAMPO VERTICALE TOP */
    .top#field_page .half#top-left-half { top: 6%; }
    .top#field_page .extra#extra-uno { top: 0; }
    .top#field_page .extra button { padding: 0 1em !important; } 
    .top#field_page #center { top: 90%; }   
    .top.active#field_page #center .buttons a, .top.active#field_page #center .buttons button { padding: 0 .5em !important; }
    /* CAMPO VERTICALE BOTTOM */
    .bottom#field_page { background-size: 100% 75%; }
    .bottom#field_page .battut4#squadra-due, .bottom#field_page .extra#extra-due { top: 0; width: 100%; }
    .bottom#field_page .extra#extra-due { top: 0; }
    .bottom#field_page .extra button { padding: 0 1em !important; } 
    .bottom#field_page #center { top: 90%; }
    .bottom#field_page #center #info { margin-top: .25em; }
    .bottom#field_page .half#bottom-right-half { top: 5%; height: 85% !important; }
    .bottom#field_page .cella { height: 30% !important; padding-top: 20px; }
    .bottom#field_page .cella .busto { top: 38%; height: 27%; }
    .bottom#field_page .cella .manica { top: 39%; width: 15%; height: 12%; }
    .bottom#field_page .cella .gamba { top: 60%; width: 11.5%; height: 30%; }
    
    .bottom#field_page .battut4#squadra-due { top: 90% !important; }
    .bottom#field_page .extra#extra-due { top: 90% !important; }
    .bottom#field_page #center { top: -5% !important; }
    .bottom#field_page #center a.child { margin-top: -.5em; }
        
    /* CAMPO COMPLETO ORIZZONTALE */
    .hor#field_page .half { height: 90% !important; }
    .hor .cella { height: 22% !important; }
    .hor .battut4 { margin-top: -2%;}
    .hor #center { top: 94%; }
    .hor #center .buttons a { margin-top: 0 !important; }
    /* CAMPO ORIZZONTALE LEFT */
    .hor.left#field_page #field .half { height: 75% !important; margin-top: 1% !important; }
    /* CAMPO ORIZZONTALE RIGHT */
    .hor.right#field_page #field .half { height: 75% !important; margin-top: 1% !important; }
}

/* ----------- 480px X 320px ----------- */
/* ----------- iPhone 4 and 4s ----------- */
/* Portrait */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: portrait) {
      
      .wrap { padding-top: 0; }
      
      /* CAMPO COMPLETO VERTICALE */
      #field_page #field { top: 5%; }
      #field_page .half { height: 40% !important; }
      #field_page .half#top-left-half { top: 3%; }
      #field_page .half#bottom-right-half { top: 54%; }
      .cella { height: 44% !important; margin: .5%; width: 30%; }
      .cella button { height: 28% !important; margin: 1.5% !important; font-size: 12px !important; }
      /*#center .buttons:first-child a:first-child { padding: 0 .5em !important; }*/
}
/* Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {
      
      .wrap { padding-top: 0; }
      
      .battut4 .team , .extra { width: 100% !important; float: none; clear: both; }
      .battut4, .extra { overflow: hidden; width: 50%; height: 8%; }
      #field_page .half#bottom-right-half { top: 56%; }
}

/* ----------- MAX-WIDTH 320px ----------- */
@media only screen and (max-width : 320px) {
    .hor.right#field_page #center .buttons a, .hor.right#field_page #center .buttons button, .hor.left#field_page #center .buttons a, .hor.left#field_page #center .buttons button { padding: 0 .5em !important; }
    #center a.child { font-size: .8em !important; padding: .25em 0 !important; line-height: 1.25em !important; }
    /*.half#bottom-right-half .cella, .half#top-left-half .cella { height: 31% !important; width: 44%; }*/
}

/* ----------- iPhone 6+ ----------- */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3) { 
       .wrap { padding-top: 10px !important; }
}

/* ----------- iPhone 6 ----------- */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)  { 
        .wrap { padding-top: 10px !important; }
}

/* ----------- iPhone 5 and 5S ----------- */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2) { 
    .wrap { padding-top: 1% !important; }
}

/* ----------- iPhone 4 and 4S ----------- */
/* Portrait and Landscape */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 480px)
  and (-webkit-min-device-pixel-ratio: 2) {
      .wrap { padding-top: 10px !important; }
}

/* ----------- Galaxy S5 ----------- */
/* Portrait and Landscape */
@media screen 
  and (device-width: 360px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {
    .wrap { padding-top: 0 !important; }
}

/* ----------- Galaxy S4 ----------- */
/* Portrait and Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 3) {
       .wrap { padding-top: 0 !important; }
}

/* ----------- Galaxy S3 ----------- */
/* Portrait and Landscape */
@media screen 
  and (device-width: 320px) 
  and (device-height: 640px) 
  and (-webkit-device-pixel-ratio: 2) {
       .wrap { padding-top: 0 !important; }
}


/* SWEET ALERT */
.sweet-alert.show-input input { display: inline-block; color: #666; }
.sweet-alert h2 { margin: 10px auto; }
table.tabellone { width: 100%; margin: 0 auto; color: #797979; }
table.tabellone a { color: #fff; }
table.tabellone td { padding: .1em .5em; width: 16.6%; max-width: 16.6%; }
table.tabellone td.grey, 
table.tabellone td.bordo,
table.tabellone td.h1,
table.tabellone td.h2,
table.tabellone td.h3,
table.tabellone td.h4,
table.tabellone td.h5,
table.tabellone td.pallah,
table.tabellone td.v1,
table.tabellone td.v2,
table.tabellone td.v3,
table.tabellone td.v4,
table.tabellone td.v5,
table.tabellone td.pallav
{ width: 16.6%; }
table.tabellone td.grey { font-weight: 700 !important; }
table.tabellone tr:nth-of-type(3) td, table.tabellone tr:nth-of-type(6) td { background: #0d447d; color: #fff; }
table.tabellone tr:nth-of-type(4) td { border-bottom: 1px solid #ccc; }
table.tabellone a.bottone { padding: 0 1em !important; }
span.bordo { display: block; font-weight: bold; color: #0d447d; }
span.span_ht { margin: .25em auto 0; }
span.span_vt { margin: 0 auto .25em; }
ul#in, ul#out, ul#errori, ul#giocatori { font-size: 1em; margin: 0 auto; }
ul#in li, ul#out li, ul#errori li, ul#giocatori li { padding: .2em 0; border-bottom: 1px solid #ccc; border-top: 1px solid #fff; cursor: pointer; }
li.titolo b { font-weight: 700; }
.sweet-alert fieldset { margin-top: 1em; }

.fond.selected, #errori .selected, #giocatori .selected { background-color: #0d447d; color: #fff; cursor: pointer; }

@media only screen and (max-width : 768px) {
    .sweet-alert { margin-top: 0 !important; position: absolute; top: 0; width: auto; left: 0; right: 0; text-align: center; }
}

@media only screen and (max-width : 670px) {
    table.tabellone { width: 95%; }
    table.tabellone td { width: 12% !important; max-width: .75em !important; }
    table.tabellone a.bottone { padding: 0 .5em !important }
}

@media only screen and (max-width : 640px) {
    .sweet-alert button, .sweet-alert .paginate_button { padding: 0 1em !important; }
}

@media only screen and (max-width : 600px) {
    table.tabellone { width: 98%; }
    table.tabellone td { padding: .1em .25em; }
}

@media only screen and (max-width : 570px) {
    table.tabellone a.bottone { padding: 0 .25em !important }
}

@media screen and (min-width: 540px) and (max-width: 768px) {
    .sweet-alert { margin-left: 0 !important; } 
}

@media only screen and (max-width: 480px) {
     table.tabellone a.bottone { padding: .15em .5em !important; font-size: 12px !important; }
}

@media only screen and (max-width : 400px) {
    .sweet-alert .sa-icon { width: 40px; height: 40px; margin: .5em auto; }
    .sweet-alert .sa-icon.sa-warning .sa-body { width: 4px; height: 17px; top: 7px; }
    .sweet-alert .sa-icon.sa-warning .sa-dot { width: 6px; height: 6px; bottom: 7px; }
    .sweet-alert .sa-icon.sa-info::before { height: 17px; }
    .sweet-alert .sa-icon.sa-info::after { width: 6px; height: 6px; top: 26px; }
    .sweet-alert .sa-icon.sa-success .sa-placeholder { width: 40px; height: 40px; }
    .sweet-alert .sa-icon.sa-success .sa-line.sa-tip { width: 18px; left: 1px; top: 19px; }
    .sweet-alert .sa-icon.sa-success .sa-line.sa-long { width: 28px; right: 1px; top: 18px; }
    .sweet-alert .sa-icon.sa-success::before,
    .sa-icon.sa-success.animate::after { display: none; }
    .sweet-alert .sa-icon.sa-success .sa-fix { background-color: transparent; }
    .animateSuccessTip { -webkit-animation: animateSuccessTip 0s; animation: animateSuccessTip 0s; }
    .animateSuccessLong { -webkit-animation: animateSuccessLong 0s; animation: animateSuccessLong 0s; }
    .sa-icon.sa-success.animate::after { -webkit-animation: rotatePlaceholder 0s ease-in; animation: rotatePlaceholder 0s ease-in; }
    .sweet-alert h2 { font-size: 21px; line-height: 21px; text-align: center; margin: 0 auto .5em; }
    table.tabellone td { padding: 0; }
    table.tabellone a.bottone { padding: 3px .5em !important; }
    span.bordo { margin: .2em auto; }
    ul#errori, ul#giocatori { overflow: auto; height: 170px; font-size: .75em; }
    .sweet-alert button { font-size: .75em !important; }
}