diff --git a/components/cycle-day/radio-button-group.js b/components/cycle-day/radio-button-group.js
index 4ef8358853f23d9accfb3992b1d53d6fe08f9a08..0881809fc75f9bc6b555e03f5c9b44356f1897de 100644
--- a/components/cycle-day/radio-button-group.js
+++ b/components/cycle-day/radio-button-group.js
@@ -12,10 +12,8 @@ export default class RadioButton extends Component {
       <View style={styles.radioButtonGroup}>
         {
           this.props.buttons.map(({ label, value }) => {
+            const isActive = value === this.props.active
             const circleStyle = [styles.radioButton]
-            if (value === this.props.active) {
-              circleStyle.push(styles.radioButtonActive)
-            }
             return (
               <TouchableOpacity
                 onPress={() => this.props.onSelect(value)}
@@ -23,7 +21,10 @@ export default class RadioButton extends Component {
                 activeOpacity={1}
               >
                 <View style={styles.radioButtonTextGroup}>
-                  <View style={circleStyle} />
+                  <View style={circleStyle}>
+                    {isActive ?
+                      <View style={styles.radioButtonActiveDot}/> : null}
+                  </View>
                   <Text>{label}</Text>
                 </View>
               </TouchableOpacity>
diff --git a/styles/index.js b/styles/index.js
index 7cc0c14e07763bc3da1b14dc96737ce80ffd55a7..9a1e6a9790e86fcd561030ef94f42c86a025e481 100644
--- a/styles/index.js
+++ b/styles/index.js
@@ -209,17 +209,21 @@ export default StyleSheet.create({
     marginVertical: 10,
   },
   radioButton: {
-    width: 30,
-    height: 30,
+    width: 20,
+    height: 20,
     borderRadius: 100,
     borderStyle: 'solid',
     borderWidth: 2,
     borderColor: secondaryColor,
-    marginBottom: 5
+    marginBottom: 5,
+    alignItems: 'center',
+    justifyContent: 'center'
   },
-  radioButtonActive: {
-    backgroundColor: secondaryColor,
-    color: fontOnPrimaryColor
+  radioButtonActiveDot: {
+    width: 10,
+    height: 10,
+    borderRadius: 100,
+    backgroundColor: secondaryColor
   },
   radioButtonGroup: {
     flexDirection: 'row',