{"id":3084,"date":"2021-12-09T21:02:57","date_gmt":"2021-12-09T14:02:57","guid":{"rendered":"https:\/\/khoahocthethao.vn\/?page_id=3084"},"modified":"2021-12-09T21:33:55","modified_gmt":"2021-12-09T14:33:55","slug":"soccer","status":"publish","type":"page","link":"https:\/\/khoahocthethao.vn\/index.php\/soccer\/","title":{"rendered":"Soccer"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"3084\" class=\"elementor elementor-3084\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-84a05b8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"84a05b8\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-29d26c7\" data-id=\"29d26c7\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-da0320e elementor-widget elementor-widget-html\" data-id=\"da0320e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\r\n<!doctype html>\r\n<html class=\"no-js\" lang=\"\">\r\n\r\n<head>\r\n\r\n  <link rel=\"manifest\" href=\"site.webmanifest\">\r\n  <link rel=\"apple-touch-icon\" href=\"icon.png\">\r\n  <!-- Place favicon.ico in the root directory -->\r\n  <link href=\"https:\/\/fonts.googleapis.com\/css?family=Lato&display=swap\" rel=\"stylesheet\">\r\n\r\n  <link rel=\"stylesheet\" href=\"css\/normalize.css\">\r\n  <link rel=\"stylesheet\" href=\"css\/main.css\">\r\n\r\n  <meta name=\"theme-color\" content=\"#fafafa\">\r\n<\/head>\r\n\r\n\r\n  <!--[if IE]>\r\n    <p class=\"browserupgrade\">You are using an <strong>outdated<\/strong> browser. Please <a href=\"https:\/\/browsehappy.com\/\">upgrade your browser<\/a> to improve your experience and security.<\/p>\r\n  <![endif]-->\r\n\r\n  <!-- Add your site or application content here -->\r\n\r\n  <div id=\"maincontainer\">\r\n    <p id=\"topnav\">Ph\u00e2n t\u00edch d\u1eef li\u1ec7u b\u00f3ng \u0111\u00e1 b\u1ea3n Mobile <\/p>\r\n  \r\n    <div id=\"pitchcontainer\">\r\n      <div id=\"linecontainer\">\r\n        <div class=\"top-box line\"><\/div>\r\n        <div class=\"centre-circle line\"><\/div>\r\n        <div class=\"centre-line line\"><\/div>\r\n        <div class=\"bottom-box line\"><\/div>\r\n      <\/div>\r\n      <div id=\"pitch\" class=\"line\" onclick=\"addevent(event)\"><\/div>\r\n    <\/div>\r\n  \r\n    <div id=\"datacontainer\">\r\n      <div id=\"resultscontainer\">\r\n        <table id=\"resultstable\">\r\n          <thead>\r\n            <tr>\r\n              <th>Event<\/th>\r\n              <th>X<\/th>\r\n              <th>Y<\/th>\r\n            <\/tr>\r\n          <\/thead>\r\n          <tbody id=\"resultsdata\"><\/tbody>\r\n        <\/table>\r\n      <\/div>\r\n  \r\n      <div id=\"eventscontainer\">\r\n        <p\r\n          class=\"event\"\r\n          id=\"selected\"\r\n          onclick=\"changeEventFocus(this)\"\r\n          contenteditable=\"false\"\r\n        >\r\n          Shot\r\n        <\/p>\r\n        <p class=\"event\" onclick=\"changeEventFocus(this)\" contenteditable=\"false\">\r\n          Pass\r\n        <\/p>\r\n        <p class=\"event\" onclick=\"changeEventFocus(this)\" contenteditable=\"false\">\r\n          Tackle\r\n        <\/p>\r\n        <p class=\"event\" onclick=\"changeEventFocus(this)\" contenteditable=\"false\">\r\n          Foul\r\n        <\/p>\r\n        <h4 onclick=\"eventsEditable()\"><span id=\"editON\">ON|<\/span>Edit<span id=\"editOFF\">|OFF<\/span><\/h4>\r\n\r\n        <p id=\"buttonContainer\">\r\n          <button id=\"export\" onclick=\"exportTableToCSV('events.csv')\">\r\n            Export CSV\r\n          <\/button>\r\n          <button id=\"delLast\" onclick=\"delLast()\">\r\n            Delete last\r\n          <\/button>\r\n        <\/p>\r\n      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n\r\n  \r\n\r\n\r\n  <script src=\"js\/vendor\/modernizr-3.8.0.min.js\"><\/script>\r\n  <script src=\"https:\/\/code.jquery.com\/jquery-3.4.1.min.js\" integrity=\"sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=\" crossorigin=\"anonymous\"><\/script>\r\n  <script>window.jQuery || document.write('<script src=\"js\/vendor\/jquery-3.4.1.min.js\"><\\\/script>')<\/script>\r\n \r\n  <!-- Google Analytics: change UA-XXXXX-Y to be your site's ID. -->\r\n  <script>\r\n    window.ga = function () { ga.q.push(arguments) }; ga.q = []; ga.l = +new Date;\r\n    ga('create', 'UA-103311395-4', 'auto'); ga('set','transport','beacon'); ga('send', 'pageview')\r\n  <\/script>\r\n  <script src=\"https:\/\/www.google-analytics.com\/analytics.js\" async><\/script>\r\n\r\n  <script src=\"js\/plugins.js\"><\/script>\r\n  <script src=\"js\/main.js\"><\/script>\r\n<style>\/*! HTML5 Boilerplate v7.3.0 | MIT License | https:\/\/html5boilerplate.com\/ *\/\r\n\r\n\/* main.css 2.0.0 | MIT License | https:\/\/github.com\/h5bp\/main.css#readme *\/\r\n\/*\r\n * What follows is the result of much research on cross-browser styling.\r\n * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,\r\n * Kroc Camen, and the H5BP dev community and team.\r\n *\/\r\n\r\n\/* ==========================================================================\r\n   Base styles: opinionated defaults\r\n   ========================================================================== *\/\r\n\r\nhtml {\r\n  color: #222;\r\n  font-size: 1em;\r\n  line-height: 1.4;\r\n}\r\n\r\n\/*\r\n * Remove text-shadow in selection highlight:\r\n * https:\/\/twitter.com\/miketaylr\/status\/12228805301\r\n *\r\n * Vendor-prefixed and regular ::selection selectors cannot be combined:\r\n * https:\/\/stackoverflow.com\/a\/16982510\/7133471\r\n *\r\n * Customize the background color to match your design.\r\n *\/\r\n\r\n::-moz-selection {\r\n  background: #b3d4fc;\r\n  text-shadow: none;\r\n}\r\n\r\n::selection {\r\n  background: #b3d4fc;\r\n  text-shadow: none;\r\n}\r\n\r\n\/*\r\n * A better looking default horizontal rule\r\n *\/\r\n\r\nhr {\r\n  display: block;\r\n  height: 1px;\r\n  border: 0;\r\n  border-top: 1px solid #ccc;\r\n  margin: 1em 0;\r\n  padding: 0;\r\n}\r\n\r\n\/*\r\n * Remove the gap between audio, canvas, iframes,\r\n * images, videos and the bottom of their containers:\r\n * https:\/\/github.com\/h5bp\/html5-boilerplate\/issues\/440\r\n *\/\r\n\r\naudio,\r\ncanvas,\r\niframe,\r\nimg,\r\nsvg,\r\nvideo {\r\n  vertical-align: middle;\r\n}\r\n\r\n\/*\r\n * Remove default fieldset styles.\r\n *\/\r\n\r\nfieldset {\r\n  border: 0;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n\r\n\/*\r\n * Allow only vertical resizing of textareas.\r\n *\/\r\n\r\ntextarea {\r\n  resize: vertical;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Browser Upgrade Prompt\r\n   ========================================================================== *\/\r\n\r\n.browserupgrade {\r\n  margin: 0.2em 0;\r\n  background: #ccc;\r\n  color: #000;\r\n  padding: 0.2em 0;\r\n}\r\n\r\n\/* ==========================================================================\r\n   Author's custom styles\r\n   ========================================================================== *\/\r\n\r\n   body {\r\n    margin: 0; \r\n    height: 1500%; \r\n    overflow:scroll ;\r\n    font-family: 'Lato', sans-serif;\r\n    touch-action: manipulation;\r\n    background-color: rgb(232, 235, 232);\r\n    padding-top: 100px;\r\n  }\r\n  \r\n  #maincontainer{\r\n    width: 400px;\r\n    max-width:95%;\r\n    height: 98%;\r\n    max-height: 800px;\r\n    background-color: #eee;\r\n    margin: 0 auto;\r\n    margin-top: 1%;\r\n    border: 1px solid rgb(126, 143, 126,0.5);\r\n    overflow-y: scroll;\r\n  }\r\n  \r\n  #topnav{\r\n    height:5%;\r\n    width: 82%;\r\n    margin: 4px auto;\r\n  }\r\n\r\n  #topnav a{\r\n    color: green;\r\n    text-decoration: none;\r\n    font-weight: 900;\r\n  }\r\n\r\n  #logo{\r\n    margin-left: 4px;\r\n  }\r\n  \r\n  #pitchcontainer{\r\n    width: 85%;\r\n    height: 60%;\r\n    margin: 0 auto;\r\n    padding: 0.5% 0 0.5% 0;\r\n    border: 0;\r\n    background: rgb(176,255,138);\r\n    background: linear-gradient(45deg, rgba(176,255,138,1) 0%, rgba(254,207,246,1) 100%);\r\n    position: relative;\r\n    \r\n    -webkit-box-shadow: 4px 2px 8px -1px rgba(115,115,115,1);\r\n    -moz-box-shadow: 4px 2px 8px -1px rgba(115,115,115,1);\r\n    box-shadow: 4px 2px 8px -1px rgba(115,115,115,1);\r\n  }\r\n  \r\n  #linecontainer{\r\n    z-index: 99;\r\n    background-size: 100% 20vmin;\r\n    border:solid 3px #979797;\r\n    height:90%;\r\n    position:absolute;\r\n    left: 5%;\r\n    width:90%;\r\n    margin: 5% auto;\r\n  }\r\n  \r\n  #pitch{\r\n    z-index: 100;\r\n    background-size: 100% 20vmin;\r\n    border:solid 3px #979797;\r\n    height:90%;\r\n    position:absolute;\r\n    left: 5%;\r\n    width:90%;\r\n    margin: 5% auto;\r\n  }\r\n  \r\n  .top-box {\r\n    border:solid 1px #fff;\r\n    border-top: none;\r\n    bottom: 80%;\r\n    left:15%;\r\n    position:absolute;\r\n    right:15%;\r\n    top:00%;\r\n  }\r\n  \r\n  .top-box:before {\r\n    border-bottom:solid 1px #fff;\r\n    border-radius:0 0 70% 70%;\r\n    bottom:-24%;\r\n    content:\"\";\r\n    height:40%;\r\n    left:30%;\r\n    position:absolute;\r\n    right:30%;\r\n  }\r\n  \r\n  .bottom-box {\r\n    border:solid 1px #fff;\r\n    border-bottom: none;\r\n    bottom:0;\r\n    left:15%;\r\n    position:absolute;\r\n    right:15%;\r\n    top:80%;\r\n  }\r\n  \r\n  .bottom-box:before {\r\n    border-top:solid 1px #fff;\r\n    border-radius:70% 70% 0 0;\r\n    content:\"\";\r\n    height:60%;\r\n    width: 40%;\r\n    left:30%;\r\n    position:absolute;\r\n    right:30%;\r\n    top: -24%;\r\n  }\r\n  \r\n  .centre-circle {\r\n    border:solid 1px #fff;\r\n    border-radius:100%;\r\n    bottom:40%;\r\n    left:35%;\r\n    position:absolute;\r\n    right:35%;\r\n    top:40%;\r\n  }\r\n  \r\n  .centre-line {\r\n    border-bottom:solid 1px #fff;\r\n    bottom:50%;\r\n    left:0;\r\n    position:absolute;\r\n    right:0;\r\n    top:50%;\r\n  }\r\n  \r\n  .line, .line:before{\r\n    border-color: #979797;\r\n    border-width: 3px;\r\n  }\r\n  \r\n  #datacontainer {\r\n    display: grid;\r\n    grid-template-columns: repeat(2, 1fr);\r\n    grid-template-rows: 1fr;\r\n    grid-column-gap: 5px;\r\n    grid-row-gap: 0px;\r\n    margin-top: 5%;\r\n    text-align:center;\r\n    overflow-y: scroll;\r\n  }\r\n  \r\n  #resultscontainer { grid-area: 1 \/ 1 \/ 2 \/ 2; }\r\n  #eventscontainer { grid-area: 1 \/ 2 \/ 2 \/ 3;\r\n  \r\n    overflow-y: unset;\r\n  }\r\n\r\n  #eventscontainer h4{\r\n    margin: 10px auto 2px auto;\r\n    background-color:rgb(228, 226, 226);\r\n    border: 1px solid darkgrey;\r\n    max-width:80%;\r\n    min-width: 40%;\r\n    -webkit-box-shadow: 1px 1px 2px 0px rgba(158,155,158,1);\r\n    -moz-box-shadow: 1px 1px 2px 0px rgba(158,155,158,1);\r\n    box-shadow: 1px 1px 2px 0px rgba(158,155,158,1);\r\n\r\n\r\n  }\r\n  \r\n  #resultscontainer{\r\n    width: 100%;\r\n    margin: 2% auto;\r\n    overflow-y: scroll;\r\n    height: 170px;\r\n  }\r\n  \r\n  #resultstable{\r\n    max-height: 70%;\r\n    margin: 0 auto;\r\n    width: 80%;\r\n  }\r\n  \r\n  #editON{\r\n    color:rgba(220,20,60,0.5);\r\n    display:none;\r\n  }\r\n\r\n  #editOFF{\r\n    color:rgba(46,139,87,0.5);\r\n  }\r\n\r\n  .event{\r\n    color: #613F75;\r\n    margin: 3px;\r\n  }\r\n  \r\n  #selected{\r\n    color: green;\r\n    font-weight: 600;\r\n  }\r\n  \r\n  .editable{\r\n    background-color: gray;\r\n  }\r\n\r\n  #buttonContainer{\r\n    margin-top: 0px;\r\n  }\r\n\r\n  #buttonContainer button{\r\n    width: 40%;\r\n    font-size: .7rem;\r\n  }\r\n\r\n\r\n\r\n\/* ==========================================================================\r\n   Helper classes\r\n   ========================================================================== *\/\r\n\r\n\/*\r\n * Hide visually and from screen readers\r\n *\/\r\n\r\n.hidden {\r\n  display: none !important;\r\n}\r\n\r\n\/*\r\n* Hide only visually, but have it available for screen readers:\r\n* https:\/\/snook.ca\/archives\/html_and_css\/hiding-content-for-accessibility\r\n*\r\n* 1. For long content, line feeds are not interpreted as spaces and small width\r\n*    causes content to wrap 1 word per line:\r\n*    https:\/\/medium.com\/@jessebeach\/beware-smushed-off-screen-accessible-text-5952a4c2cbfe\r\n*\/\r\n\r\n.sr-only {\r\n  border: 0;\r\n  clip: rect(0, 0, 0, 0);\r\n  height: 1px;\r\n  margin: -1px;\r\n  overflow: hidden;\r\n  padding: 0;\r\n  position: absolute;\r\n  white-space: nowrap;\r\n  width: 1px;\r\n  \/* 1 *\/\r\n}\r\n\r\n\/*\r\n* Extends the .sr-only class to allow the element\r\n* to be focusable when navigated to via the keyboard:\r\n* https:\/\/www.drupal.org\/node\/897638\r\n*\/\r\n\r\n.sr-only.focusable:active,\r\n.sr-only.focusable:focus {\r\n  clip: auto;\r\n  height: auto;\r\n  margin: 0;\r\n  overflow: visible;\r\n  position: static;\r\n  white-space: inherit;\r\n  width: auto;\r\n}\r\n\r\n\/*\r\n* Hide visually and from screen readers, but maintain layout\r\n*\/\r\n\r\n.invisible {\r\n  visibility: hidden;\r\n}\r\n\r\n\/*\r\n* Clearfix: contain floats\r\n*\r\n* For modern browsers\r\n* 1. The space content is one way to avoid an Opera bug when the\r\n*    `contenteditable` attribute is included anywhere else in the document.\r\n*    Otherwise it causes space to appear at the top and bottom of elements\r\n*    that receive the `clearfix` class.\r\n* 2. The use of `table` rather than `block` is only necessary if using\r\n*    `:before` to contain the top-margins of child elements.\r\n*\/\r\n\r\n.clearfix:before,\r\n.clearfix:after {\r\n  content: \" \";\r\n  \/* 1 *\/\r\n  display: table;\r\n  \/* 2 *\/\r\n}\r\n\r\n.clearfix:after {\r\n  clear: both;\r\n}\r\n\r\n\/* ==========================================================================\r\n   EXAMPLE Media Queries for Responsive Design.\r\n   These examples override the primary ('mobile first') styles.\r\n   Modify as content requires.\r\n   ========================================================================== *\/\r\n\r\n@media only screen and (min-width: 35em) {\r\n  \/* Style adjustments for viewports that meet the condition *\/\r\n}\r\n\r\n@media print,\r\n  (-webkit-min-device-pixel-ratio: 1.25),\r\n  (min-resolution: 1.25dppx),\r\n  (min-resolution: 120dpi) {\r\n  \/* Style adjustments for high resolution devices *\/\r\n}\r\n\r\n\/* ==========================================================================\r\n   Print styles.\r\n   Inlined to avoid the additional HTTP request:\r\n   https:\/\/www.phpied.com\/delay-loading-your-print-css\/\r\n   ========================================================================== *\/\r\n\r\n@media print {\r\n  *,\r\n  *:before,\r\n  *:after {\r\n    background: transparent !important;\r\n    color: #000 !important;\r\n    \/* Black prints faster *\/\r\n    box-shadow: none !important;\r\n    text-shadow: none !important;\r\n  }\r\n  a,\r\n  a:visited {\r\n    text-decoration: underline;\r\n  }\r\n  a[href]:after {\r\n    content: \" (\" attr(href) \")\";\r\n  }\r\n  abbr[title]:after {\r\n    content: \" (\" attr(title) \")\";\r\n  }\r\n  \/*\r\n     * Don't show links that are fragment identifiers,\r\n     * or use the `javascript:` pseudo protocol\r\n     *\/\r\n  a[href^=\"#\"]:after,\r\n  a[href^=\"javascript:\"]:after {\r\n    content: \"\";\r\n  }\r\n  pre {\r\n    white-space: pre-wrap !important;\r\n  }\r\n  pre,\r\n  blockquote {\r\n    border: 1px solid #999;\r\n    page-break-inside: avoid;\r\n  }\r\n  \/*\r\n     * Printing Tables:\r\n     * https:\/\/web.archive.org\/web\/20180815150934\/http:\/\/css-discuss.incutio.com\/wiki\/Printing_Tables\r\n     *\/\r\n  thead {\r\n    display: table-header-group;\r\n  }\r\n  tr,\r\n  img {\r\n    page-break-inside: avoid;\r\n  }\r\n  p,\r\n  h2,\r\n  h3 {\r\n    orphans: 3;\r\n    widows: 3;\r\n  }\r\n  h2,\r\n  h3 {\r\n    page-break-after: avoid;\r\n  }\r\n}\r\n\r\n<\/style>\r\n  \r\n\r\n<\/html>\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Ph\u00e2n t\u00edch d\u1eef li\u1ec7u b\u00f3ng \u0111\u00e1 b\u1ea3n Mobile Event X Y Shot Pass Tackle Foul ON|Edit|OFF Export CSV Delete last<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"wprm-recipe-roundup-name":"","wprm-recipe-roundup-description":"","footnotes":""},"class_list":["post-3084","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/pages\/3084","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/comments?post=3084"}],"version-history":[{"count":17,"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/pages\/3084\/revisions"}],"predecessor-version":[{"id":3102,"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/pages\/3084\/revisions\/3102"}],"wp:attachment":[{"href":"https:\/\/khoahocthethao.vn\/index.php\/wp-json\/wp\/v2\/media?parent=3084"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}