import React, { Component } from 'react';
import {
  StyleSheet,
  Text,
  View,
  Dimensions,
} from 'react-native';

export default StyleSheet.create({
  container: {
    backgroundColor: '#FFDF74',
    flex: 1,
    alignItems: 'center',
  },
  globeGroupContainer: {
    alignItems: 'center',
    position: 'absolute',
    width: Dimensions.get('window').width - 36,
    height: 362,
    top: 254,
    justifyContent: 'space-between',
  },
  globePosition: {
    width: 200,
    height: 200,
  },
  globeText: {
    fontFamily: 'Arial',
    fontStyle: 'normal',
    fontWeight: 'normal',
    fontSize: 30,
    lineHeight: 39,
    textAlign: 'center',
  },
  startButton: {
    backgroundColor: '#90CCF4',
    borderRadius: 10,
    height: 61,
    width: 159,
    alignItems: 'center',
    justifyContent: 'center',
    shadowColor: '#000',
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.5,
    shadowRadius: 3, 
    top: 658,
  },
  startText: {
    fontFamily: 'Arial',
    fontStyle: 'normal',
    fontWeight: 'normal',
    fontSize: 24,
    lineHeight: 32,
  },
  selectCircleObject: {
    width: 8,
    height: 8,
    backgroundColor: '#000000',
    borderRadius: 10,
  },
  circleContainer: {
    position: 'absolute',
    top: 777,
    width: 100,
    flex: 1,
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
  },
  circleObject: {
    width: 8,
    height: 8,
    backgroundColor: '#90CCF4',
    borderRadius: 10,
    
  },
});