/*! * Angular Material Design * https://github.com/angular/material * @license MIT * v1.1.1 */ md-radio-button { box-sizing: border-box; display: block; margin-bottom: 16px; white-space: nowrap; cursor: pointer; position: relative; } md-radio-button[disabled] { cursor: default; } md-radio-button[disabled] .md-container { cursor: default; } md-radio-button .md-container { position: absolute; top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); box-sizing: border-box; display: inline-block; width: 20px; height: 20px; cursor: pointer; left: 0; right: auto; } [dir=rtl] md-radio-button .md-container { left: auto; } [dir=rtl] md-radio-button .md-container { right: 0; } md-radio-button .md-container .md-ripple-container { position: absolute; display: block; width: auto; height: auto; left: -15px; top: -15px; right: -15px; bottom: -15px; } md-radio-button .md-container:before { box-sizing: border-box; background-color: transparent; border-radius: 50%; content: ''; position: absolute; display: block; height: auto; left: 0; top: 0; right: 0; bottom: 0; -webkit-transition: all 0.5s; transition: all 0.5s; width: auto; } md-radio-button.md-align-top-left > div.md-container { top: 12px; } md-radio-button .md-off { box-sizing: border-box; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border-style: solid; border-width: 2px; border-radius: 50%; -webkit-transition: border-color ease 0.28s; transition: border-color ease 0.28s; } md-radio-button .md-on { box-sizing: border-box; position: absolute; top: 0; left: 0; width: 20px; height: 20px; border-radius: 50%; -webkit-transition: -webkit-transform ease 0.28s; transition: -webkit-transform ease 0.28s; transition: transform ease 0.28s; transition: transform ease 0.28s, -webkit-transform ease 0.28s; -webkit-transform: scale(0); transform: scale(0); } md-radio-button.md-checked .md-on { -webkit-transform: scale(0.5); transform: scale(0.5); } md-radio-button .md-label { box-sizing: border-box; position: relative; display: inline-block; margin-left: 30px; margin-right: 0; vertical-align: middle; white-space: normal; pointer-events: none; width: auto; } [dir=rtl] md-radio-button .md-label { margin-left: 0; } [dir=rtl] md-radio-button .md-label { margin-right: 30px; } md-radio-group { /** Layout adjustments for the radio group. */ } md-radio-group.layout-column md-radio-button, md-radio-group.layout-xs-column md-radio-button, md-radio-group.layout-gt-xs-column md-radio-button, md-radio-group.layout-sm-column md-radio-button, md-radio-group.layout-gt-sm-column md-radio-button, md-radio-group.layout-md-column md-radio-button, md-radio-group.layout-gt-md-column md-radio-button, md-radio-group.layout-lg-column md-radio-button, md-radio-group.layout-gt-lg-column md-radio-button, md-radio-group.layout-xl-column md-radio-button { margin-bottom: 16px; } md-radio-group.layout-row md-radio-button, md-radio-group.layout-xs-row md-radio-button, md-radio-group.layout-gt-xs-row md-radio-button, md-radio-group.layout-sm-row md-radio-button, md-radio-group.layout-gt-sm-row md-radio-button, md-radio-group.layout-md-row md-radio-button, md-radio-group.layout-gt-md-row md-radio-button, md-radio-group.layout-lg-row md-radio-button, md-radio-group.layout-gt-lg-row md-radio-button, md-radio-group.layout-xl-row md-radio-button { margin-top: 0; margin-bottom: 0; margin-left: 0; margin-right: 16px; } [dir=rtl] md-radio-group.layout-row md-radio-button, [dir=rtl] md-radio-group.layout-xs-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-xs-row md-radio-button, [dir=rtl] md-radio-group.layout-sm-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-sm-row md-radio-button, [dir=rtl] md-radio-group.layout-md-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-md-row md-radio-button, [dir=rtl] md-radio-group.layout-lg-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-lg-row md-radio-button, [dir=rtl] md-radio-group.layout-xl-row md-radio-button { margin-left: 16px; } [dir=rtl] md-radio-group.layout-row md-radio-button, [dir=rtl] md-radio-group.layout-xs-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-xs-row md-radio-button, [dir=rtl] md-radio-group.layout-sm-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-sm-row md-radio-button, [dir=rtl] md-radio-group.layout-md-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-md-row md-radio-button, [dir=rtl] md-radio-group.layout-lg-row md-radio-button, [dir=rtl] md-radio-group.layout-gt-lg-row md-radio-button, [dir=rtl] md-radio-group.layout-xl-row md-radio-button { margin-right: 0; } md-radio-group.layout-row md-radio-button:last-of-type, md-radio-group.layout-xs-row md-radio-button:last-of-type, md-radio-group.layout-gt-xs-row md-radio-button:last-of-type, md-radio-group.layout-sm-row md-radio-button:last-of-type, md-radio-group.layout-gt-sm-row md-radio-button:last-of-type, md-radio-group.layout-md-row md-radio-button:last-of-type, md-radio-group.layout-gt-md-row md-radio-button:last-of-type, md-radio-group.layout-lg-row md-radio-button:last-of-type, md-radio-group.layout-gt-lg-row md-radio-button:last-of-type, md-radio-group.layout-xl-row md-radio-button:last-of-type { margin-left: 0; margin-right: 0; } md-radio-group:focus { outline: none; } md-radio-group.md-focused .md-checked .md-container:before { left: -8px; top: -8px; right: -8px; bottom: -8px; } md-radio-group[disabled] md-radio-button { cursor: default; } md-radio-group[disabled] md-radio-button .md-container { cursor: default; } .md-inline-form md-radio-group { margin: 18px 0 19px; } .md-inline-form md-radio-group md-radio-button { display: inline-block; height: 30px; padding: 2px; box-sizing: border-box; margin-top: 0; margin-bottom: 0; } @media screen and (-ms-high-contrast: active) { md-radio-button.md-default-theme .md-on { background-color: #fff; } }