<commit_before>@import 'variables';

// elements styles

// buttons

.button {
	padding: @space-small @space-large;
	border: @space-mini solid @gray;
	background-color: @gray;
	color: @light;
	text-align: center;
	text-decoration: none;
  cursor: pointer;
	-moz-transition: all @faster;
	-webkit-transition: all @faster;
	transition: all @faster;
	-moz-box-shadow: 0 @space-mini @space-mini 0 @dark;
	-webkit-box-shadow: 0 @space-mini @space-mini 0 @dark;
	box-shadow: 0 @space-mini @space-mini 0 @dark;

  &:hover,
  &:focus {
    background-color: @primary-color;
		color: @gray;
		border: @space-mini solid @dark;
  }

  &.primary {
    background-color: @primary-color;
    color: @gray;

    &:hover,
    &:focus {
      background-color: @gray;
			color: @light;
    }
  }

  &.secondary {
    background-color: @secondary-color;
    color: @light;

    &:hover,
    &:focus {
      background-color: @primary-color;
			color: @gray;
    }
  }

	&.cta {
		font-size: @mobile-font-large;
		font-weight: bold;

		.supporting {
			display: block;
			margin-top: @space-tiny;
			font-weight: normal;
		}

		@media (min-width: @tablet-width) {
			font-size: @tablet-font-jumbo;
		}
	}

  &.fluid {
    display: block;
    width: auto;
    margin-right: auto;
    margin-left: auto;<commit_msg>mobile and tablet button stylizations<commit_after>@import 'variables';

// elements styles

// buttons

.button {
	padding: @space-small @space-large;
	border: @space-mini solid @gray;
	background-color: @gray;
	color: @light;
	text-align: center;
	text-decoration: none;
  cursor: pointer;
	-moz-transition: all @faster;
	-webkit-transition: all @faster;
	transition: all @faster;
	-moz-box-shadow: 0 @space-mini @space-mini 0 @dark;
	-webkit-box-shadow: 0 @space-mini @space-mini 0 @dark;
	box-shadow: 0 @space-mini @space-mini 0 @dark;

  &:hover,
  &:focus {
    background-color: @primary-color;
		color: @gray;
		border: @space-mini solid @dark;
  }

  &.primary {
    background-color: @primary-color;
    color: @gray;

    &:hover,
    &:focus {
      background-color: @gray;
			color: @light;
    }
  }

  &.secondary {
    background-color: @secondary-color;
    color: @light;

    &:hover,
    &:focus {
      background-color: @primary-color;
			color: @gray;
    }
  }

	&.cta {
		font-size: @mobile-font-large;
		font-weight: bold;

		.supporting {
			display: block;
			margin-top: @space-tiny;
			font-weight: normal;
			font-size: @mobile-font-base;

			@media (min-width: @tablet-width) {
				font-size: @tablet-font-huge;
			}
		}

		@media (min-width: @tablet-width) {
			font-size: @tablet-font-jumbo;
		}
	}

  &.fluid {
    display: block;
    width: auto;
    margin-right: auto;
    margin-left: auto;
{'fraction_non_alphanumeric': 0.15969162995594713, 'fraction_numerical': 0.004405286343612335, 'mean_word_length': 2.8707386363636362, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '7368916', 'n_tokens_mistral': 1122, 'n_tokens_neox': 1009, 'n_words': 226}