section.player {
}

    section.player .columns {
        display: flex;
        flex-direction: row;
    }

        section.player .columns .primary {
            flex-grow: 1;
            padding-right: 47px;
        }

            section.player .columns .primary heading {
                display: block;
                padding-bottom: 15px;
                border-bottom: solid 3px rgba(255,255,255,0.1);
            }

                section.player .columns .primary heading h1 {
                    text-transform: none;
                    margin: 15px 0;
                }

                section.player .columns .primary heading .subheading {
                    display: flex;
                    flex-direction: row;
                }

                section.player .columns .primary heading .subheading {
                    margin-bottom: 15px;
                }

                    section.player .columns .primary heading .subheading .meta {
                        flex-grow: 1;
                    }

                    section.player .columns .primary heading .subheading .share {
                        flex-grow: 0;
                    }

                    section.player .columns .primary heading .subheading .share-pwa {
                        flex-grow: 0;
                        display: none;
                    }

                        section.player .columns .primary heading .subheading .share-pwa .share-icon {
                            background-size: cover;
                            background-repeat: no-repeat;
                            background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='256' height='256' viewBox='0 0 256 256' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 1.7.22%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='translate(128 128) scale(0.72 0.72)' style=''%3E%3Cg style='stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;' transform='translate(-175.05 -175.05000000000004) scale(3.89 3.89)' %3E%3Cpath d='M 74.37 59.915 c -4.756 0 -8.995 2.224 -11.754 5.68 L 30.112 49.018 c 0.356 -1.281 0.561 -2.625 0.561 -4.018 c 0 -1.393 -0.205 -2.737 -0.561 -4.018 l 32.505 -16.577 c 2.759 3.456 6.998 5.681 11.754 5.681 c 8.295 0 15.043 -6.748 15.043 -15.043 C 89.413 6.748 82.665 0 74.37 0 S 59.327 6.748 59.327 15.042 c 0 1.393 0.205 2.737 0.561 4.018 L 27.384 35.638 c -2.759 -3.456 -6.998 -5.681 -11.754 -5.681 C 7.335 29.958 0.587 36.706 0.587 45 c 0 8.295 6.748 15.043 15.042 15.043 c 4.756 0 8.995 -2.224 11.754 -5.68 L 59.888 70.94 c -0.356 1.281 -0.561 2.624 -0.561 4.017 C 59.327 83.252 66.075 90 74.37 90 s 15.043 -6.748 15.043 -15.043 C 89.413 66.663 82.665 59.915 74.37 59.915 z M 74.37 6 c 4.986 0 9.043 4.057 9.043 9.042 c 0 4.986 -4.057 9.043 -9.043 9.043 s -9.043 -4.057 -9.043 -9.043 C 65.327 10.057 69.384 6 74.37 6 z M 15.63 54.043 c -4.986 0 -9.042 -4.057 -9.042 -9.043 c 0 -4.986 4.057 -9.042 9.042 -9.042 c 4.986 0 9.043 4.057 9.043 9.042 C 24.673 49.986 20.616 54.043 15.63 54.043 z M 74.37 84 c -4.986 0 -9.043 -4.057 -9.043 -9.043 c 0 -4.985 4.057 -9.042 9.043 -9.042 s 9.043 4.057 9.043 9.042 C 83.413 79.943 79.356 84 74.37 84 z' style='stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;' transform=' matrix(1 0 0 1 0 0) ' stroke-linecap='round' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
                            width: 30px;
                            height: 30px;
                            display: block;
                        }



                section.player .columns .primary heading .columns .secondary {
                    flex: 0 0 30px;
                    padding-top: 37px;
                }


                section.player .columns .primary heading .columns .primary {
                    padding-right: 0;
                }

                section.player .columns .primary heading .columns .secondary .share-icon {
                    background-size: cover;
                    background-repeat: no-repeat;
                    //background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' version='1.1' width='256' height='256' viewBox='0 0 256 256' xml:space='preserve'%3E%3Cdesc%3ECreated with Fabric.js 1.7.22%3C/desc%3E%3Cdefs%3E%3C/defs%3E%3Cg transform='translate(128 128) scale(0.72 0.72)' style=''%3E%3Cg style='stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;' transform='translate(-175.05 -175.05000000000004) scale(3.89 3.89)' %3E%3Cpath d='M 74.37 59.915 c -4.756 0 -8.995 2.224 -11.754 5.68 L 30.112 49.018 c 0.356 -1.281 0.561 -2.625 0.561 -4.018 c 0 -1.393 -0.205 -2.737 -0.561 -4.018 l 32.505 -16.577 c 2.759 3.456 6.998 5.681 11.754 5.681 c 8.295 0 15.043 -6.748 15.043 -15.043 C 89.413 6.748 82.665 0 74.37 0 S 59.327 6.748 59.327 15.042 c 0 1.393 0.205 2.737 0.561 4.018 L 27.384 35.638 c -2.759 -3.456 -6.998 -5.681 -11.754 -5.681 C 7.335 29.958 0.587 36.706 0.587 45 c 0 8.295 6.748 15.043 15.042 15.043 c 4.756 0 8.995 -2.224 11.754 -5.68 L 59.888 70.94 c -0.356 1.281 -0.561 2.624 -0.561 4.017 C 59.327 83.252 66.075 90 74.37 90 s 15.043 -6.748 15.043 -15.043 C 89.413 66.663 82.665 59.915 74.37 59.915 z M 74.37 6 c 4.986 0 9.043 4.057 9.043 9.042 c 0 4.986 -4.057 9.043 -9.043 9.043 s -9.043 -4.057 -9.043 -9.043 C 65.327 10.057 69.384 6 74.37 6 z M 15.63 54.043 c -4.986 0 -9.042 -4.057 -9.042 -9.043 c 0 -4.986 4.057 -9.042 9.042 -9.042 c 4.986 0 9.043 4.057 9.043 9.042 C 24.673 49.986 20.616 54.043 15.63 54.043 z M 74.37 84 c -4.986 0 -9.043 -4.057 -9.043 -9.043 c 0 -4.985 4.057 -9.042 9.043 -9.042 s 9.043 4.057 9.043 9.042 C 83.413 79.943 79.356 84 74.37 84 z' style='stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;' transform=' matrix(1 0 0 1 0 0) ' stroke-linecap='round' /%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
                    background-image: url("/_public/images/app-share-icon.png");
                    width: 40px;
                    height: 40px;
                    display: block;
                }

                section.player .columns .primary heading .subheading .share .at-resp-share-element .at-share-btn {
                    margin: 0 0 0 14px;
                }

                    section.player .columns .primary heading .subheading .share .at-resp-share-element .at-share-btn:first-child {
                        margin: 0;
                    }

                section.player .columns .primary heading .description {
                    padding: 15px 0;
                    border-top: solid 1px rgba(255,255,255,0.1);
                }

        section.player .columns .secondary {
            flex: 0 0 300px;
        }

            section.player .columns .secondary h2 {
                margin: 0;
            }

            /* Start Card */
            section.player .columns .secondary .card {
                color: #fff;
                text-decoration: none;
                margin-bottom: 30px;
                display: block;
                cursor: pointer;
            }


                section.player .columns .secondary .card .poster {
                    display: block;
                    position: relative;
                    padding-bottom: calc(100% * 9 / 16);
                    width: 100%;
                }

                    section.player .columns .secondary .card .poster > div {
                        position: absolute;
                        top: 0;
                        bottom: 0;
                        width: 100%;
                        height: 100%;
                    }

                        section.player .columns .secondary .card .poster > div.gradient {
                            background-image: linear-gradient(to bottom, rgba(30, 34, 38, 0.07) 30%, rgba(29, 29, 29, 0.9) 93%);
                        }

                        section.player .columns .secondary .card .poster > div.teams {
                            display: flex;
                            justify-content: center;
                            align-items: center;
                        }

                            section.player .columns .secondary .card .poster > div.teams .icons {
                                display: flex;
                                flex-direction: row;
                            }

                                section.player .columns .secondary .card .poster > div.teams .icons > div img {
                                    width: 64px;
                                    height: 64px;
                                }

                                section.player .columns .secondary .card .poster > div.teams .icons > div.seperator {
                                    width: 40px;
                                    display: flex;
                                    justify-content: center;
                                    align-items: center;
                                    font-weight: bold;
                                    opacity: 0.6;
                                }


                    section.player .columns .secondary .card .poster .duration {
                        position: absolute;
                        bottom: 4px;
                        right: 4px;
                        background: rgba(0,0,0,0.9);
                        font-size: 12px;
                        padding: 5px 8px;
                    }

                section.player .columns .secondary .card .body h3 {
                    font-size: 14px;
                    margin: 10px 0 0 0;
                }


                section.player .columns .secondary .card .body .meta {
                    opacity: 0.5;
                    font-size: 12px;
                    color: #ffffff;
                }

                section.player .columns .secondary .card a, section.player .columns .secondary .card a:hover, section.player .columns .secondary .card a:visited, section.player .columns .secondary .card a:active {
                    color: #ffffff;
                    text-decoration: none;
                }


                section.player .columns .secondary .card .body .meta span {
                    display: block;
                }


                section.player .columns .secondary .card .poster > div.play {
                    background-color: rgba(255,255,255,0.075);
                    opacity: 0;
                    transition: opacity 0.3s;
                    -webkit-transition: opacity 0.3s;
                    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37' height='46'%3E%3Cpolygon fill='%23fff' stroke='%23fff' stroke-width='1' points='0,0 37,23 0,46'%3E%3C/polygon%3E%3C/svg%3E%0A");
                    background-position: center;
                    background-repeat: no-repeat;
                }

                section.player .columns .secondary .card:hover .poster > div.play {
                    opacity: 1;
                    transition: opacity 0.3s;
                    -webkit-transition: opacity 0.3s;
                }


/* Tablet portrait */
@media only screen and (max-width:992px) {

    section.player .columns {
        flex-direction: column;
    }

        section.player .columns .primary heading .columns {
            flex-direction: row;
        }

        section.player .columns .primary heading h1 {
            font-size: 24px;
        }

        section.player .columns .primary heading .subheading {
            font-size: 12px;
        }

        section.player .columns .primary {
            width: 100%;
            padding-right: 0;
        }

        section.player .columns .secondary {
            width: 100%;
        }

            section.player .columns .secondary h2 {
                margin: 16px 0;
            }

            section.player .columns .secondary > div {
                display: block;
            }

            section.player .columns .secondary .card {
                display: flex;
                flex-direction: row;
                margin-bottom: 16px;
            }



                section.player .columns .secondary .card .poster {
                    position: relative;
                    flex: 0 0 200px;
                    padding-bottom: unset;
                    height: 113px;
                }

                    section.player .columns .secondary .card .poster > div > div.teams .icons > div img {
                        width: 58px;
                        height: 58px;
                    }

                    section.player .columns .secondary .card .poster > div > div.teams .icons > div.seperator {
                        width: 30px;
                        font-weight: 700;
                    }

                section.player .columns .secondary .card .body {
                    padding-left: 16px;
                    flex-grow: 1;
                }

                    section.player .columns .secondary .card .body h3 {
                        margin: 0;
                    }
}

/* mobile */
@media only screen and (max-width:576px) {

    section.player .container {
        padding: 0px;
    }

    section.player .columns .primary heading {
        padding: 0 15px;
    }




    section.player .columns .secondary {
        padding: 0 15px;
    }


        section.player .columns .secondary .card .poster {
            flex: 0 0 160px;
            padding-bottom: unset;
            height: 90px;
        }

            section.player .columns .secondary .card .poster > div.teams .icons > div img {
                width: 40px;
                height: 40px;
            }

    section.player .columns .primary heading h1 {
        font-size: 20px;
    }

    section.player .columns .primary heading .subheading {
        flex-direction: column;
    }

        section.player .columns .primary heading .subheading .meta {
            margin-bottom: 15px;
        }
}


body.device-app section.player .columns .primary {
    padding-right: 15px;
    padding-top: 10px;
}



@media only screen and (max-width:769px) {
    body.device-app section.player .container {
        padding: 0px;
    }

    body.device-app section.player .columns .primary {
        padding: 0px;
    }


        body.device-app section.player .columns .primary heading {
            padding: 0 15px;
        }

    body.device-app section.player .columns .secondary {
        padding: 0 15px;
    }

    section.player .columns .primary heading .columns .secondary {
        padding-top: 20px;
    }
}

.video-js-faux .vjs-big-play-button {
    z-index: 9999;
}


/* Rode results */
section.player .columns .primary results.sport-rodeochile table {
    border-collapse: collapse;
    border-spacing: 0;
}

    section.player .columns .primary results.sport-rodeochile table td {
        padding: 2px;
    }

    section.player .columns .primary results.sport-rodeochile table tbody tr:nth-child(odd) {
        background: rgba(255,255,255,0.1);
    }

    section.player .columns .primary results.sport-rodeochile table thead td {
        font-weight: bold;
        vertical-align: bottom;
    }

    section.player .columns .primary results.sport-rodeochile table td.score {
        width: 70px;
        text-align: center;
    }

        section.player .columns .primary results.sport-rodeochile table td.score span {
            opacity: 0.85;
        }

    section.player .columns .primary results.sport-rodeochile table td.total {
        width: 70px;
        font-weight: bold;
        text-align: center;
    }



    section.player .columns .primary results.sport-rodeochile table td.position {
        width: 70px;
        font-weight: bold;
        text-align: center;
    }

    section.player .columns .primary results.sport-rodeochile table a:link {
        color: #fff;
        text-decoration: none;
    }

    section.player .columns .primary results.sport-rodeochile table a:visited {
        color: #fff;
        text-decoration: none;
    }

    section.player .columns .primary results.sport-rodeochile table a:hover {
        color: #0135AD;
        text-decoration: none;
    }

    section.player .columns .primary results.sport-rodeochile table a:active {
        color: #fff;
        text-decoration: none;
    }


/* Stats only header */


section.player .columns .primary .stats-only-heading {
    border-bottom: solid 3px rgba(255,255,255,0.1);
}

    section.player .columns .primary .stats-only-heading .teams {
        display: flex;
    }

        section.player .columns .primary .stats-only-heading .teams > div {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: flex-end;
        }

            section.player .columns .primary .stats-only-heading .teams > div:last-child {
                flex-direction: row-reverse;
            }

            section.player .columns .primary .stats-only-heading .teams > div.seperator {
                width: 40px;
                display: flex;
                justify-content: center;
                align-items: center;
                font-weight: bold;
                opacity: 0.6;
                flex: initial;
            }


        section.player .columns .primary .stats-only-heading .teams img {
            width: 120px;
            height: 120px;
        }


    section.player .columns .primary .stats-only-heading .meta {
        text-align: center;
    }

        section.player .columns .primary .stats-only-heading .meta h1 {
            text-transform: none;
            font-size: 24px;
        }

        section.player .columns .primary .stats-only-heading .meta .schedule {
            margin-bottom: 18px;
            opacity: 0.7;
        }



section.player .columns .primary heading .description a {
    text-decoration: underline;
    
}

section.player .columns .primary heading .description a:hover {
    color: rgba(35,66,129);        
}