/* LAYOUT */
.molecule-club-palmares { padding: 0; }
.molecule-club-palmares .container { padding-left: 0; padding-right: 0; }
.molecule-club-palmares .each-row { border: 1px solid var( --color-clear-gray ); padding: 20px 5px; margin: 20px 0; border-radius: 5px; }
.molecule-club-palmares .each-row .col-count { display: none; }
.molecule-club-palmares .each-row .col-loop { }

/* LOOP HEADER */
.molecule-club-palmares .each-row .header { margin-bottom: 20px; display: flex; align-items: center; }
.molecule-club-palmares .each-row .header .title-holder { flex: 1 1 auto; padding-left: 12px; order: 2; }
.molecule-club-palmares .each-row .header .mobile-count { display: block; flex: 0 0 auto; order: 1; }
.molecule-club-palmares .each-row .header .mobile-count .count { display: block; font-family: var( --font-core-sans ); font-weight: bold; font-size: 36px; line-height: 1; }
    
/* LOOP LIST */
.molecule-club-palmares .each-row .col-loop .loop-holder {  }
.molecule-club-palmares .each-row .col-loop .loop-holder .item { display: inline-block; font-family: var( --font-core-sans ); font-size: 16px; line-height: 20px; color: var( --color-shark ); font-weight: 300; }
.molecule-club-palmares .each-row .col-loop .loop-holder .item:nth-child(odd) { font-weight: bold; }

@media only screen and ( min-width: 48em ) {

    /* LAYOUT */
    .molecule-club-palmares .container { padding-left: var( --gs-container-padding ); padding-right: var( --gs-container-padding ); }
    .molecule-club-palmares .each-row { padding: 20px; margin: 25px 0; }
    .molecule-club-palmares .each-row .col-count { display: block; }
    
    /* COUNT */
    .molecule-club-palmares .each-row .col-count .count { display: block; text-align: center; font-family: var( --font-core-sans ); font-weight: bold; font-size: 64px; line-height: 1.2; }
    
    /* LOOP HEADER */
    .molecule-club-palmares .each-row .header { margin-bottom: 18px; }
    .molecule-club-palmares .each-row .header .title-holder { flex: 1 1 100%; padding-left: 0; }
    .molecule-club-palmares .each-row .header .mobile-count { display: none; background: red; }
    
    /* LOOP LIST */
    .molecule-club-palmares .each-row .col-loop .loop-holder .item { font-size: 18px; line-height: 24px; }

}

@media only screen and ( min-width: 62em ) { 
    
    /* COUNT */
    .molecule-club-palmares .each-row .col-count .count { font-size: 80px; }
    
    /* LOOP HEADER */
    .molecule-club-palmares .each-row .header { margin-bottom: 24px; }

}
