/*!
 * Fabio Valerio
 * Copyright 2017
 * Copyright 2011-2017 Twitter, Inc.
 * webfreelancer.com.br
 */


  @blue: #007bff;
  @indigo: #6610f2;
  @purple: #6f42c1;
  @pink: #e83e8c;
  @red: #dc3545;
  @orange: #fd7e14;
  @yellow: #ffc107;
  @green: #28a745;
  @teal: #20c997;
  @cyan: #17a2b8;
  @white: #fff;
  @gray: #868e96;
  @gray-dark: #343a40;

  @light: #E0E0E0;
  @light-hover: #757575;

  @dark: #343a40;

  
  /* Mídias */
  @facebook: #3b5999;
  @twitter: #55acee;
  @linkedin: #0077B5;
  @skype: #00AFF0;
  @youtube: #cd201f;
  @google-plus: #dd4b39;
  @whatsapp: #25D366;
  @blogger: #f57d00;
  @instagram: #e4405f;
  @pinterest: #bd081c;

  /*Tamanho*/
  @size_midia_1 : 1rem;
  @size_midia_2 : 2rem;
  @size_midia_3 : 3rem;

/* MIDIAS */
.facebook    { color: @facebook;    }
.twitter     { color: @twitter;     }
.linkedin    { color: @linkedin;    }
.skype       { color: @skype;       }
.youtube     { color: @youtube;     }
.google-plus { color: @google-plus; }
.whatsapp    { color: @whatsapp;    }
.blogger     { color: @blogger;     }
.instagram   { color: @instagram;   }
.pinterest   { color: @pinterest;   }

.box-facebook    { background-color: @facebook    ; color: @white; }
.box-twitter     { background-color: @twitter     ; color: @white; }
.box-linkedin    { background-color: @linkedin    ; color: @white; }
.box-skype       { background-color: @skype       ; color: @white; }
.box-youtube     { background-color: @youtube     ; color: @white; }
.box-google-plus { background-color: @google-plus ; color: @white; }
.box-whatsapp    { background-color: @whatsapp    ; color: @white; }
.box-blogger     { background-color: @blogger     ; color: @white; }
.box-instagram   { background-color: @instagram   ; color: @white; }
.box-pinterest   { background-color: @pinterest   ; color: @white; }

.box-facebook    :hover { color: @dark; }
.box-twitter     :hover { color: @dark; }
.box-linkedin    :hover { color: @dark; }
.box-skype       :hover { color: @dark; }
.box-youtube     :hover { color: @dark; }
.box-google-plus :hover { color: @dark; }
.box-whatsapp    :hover { color: @dark; }
.box-blogger     :hover { color: @dark; }
.box-instagram   :hover { color: @dark; }
.box-pinterest   :hover { color: @dark; }


.box-outline-facebook    { color: @facebook    ; background-color: @white; border:  1px solid @facebook; }
.box-outline-twitter     { color: @twitter     ; background-color: @white; border:  1px solid @twitter; }
.box-outline-linkedin    { color: @linkedin    ; background-color: @white; border:  1px solid @linkedin; }
.box-outline-skype       { color: @skype       ; background-color: @white; border:  1px solid @skype; }
.box-outline-youtube     { color: @youtube     ; background-color: @white; border:  1px solid @youtube; }
.box-outline-google-plus { color: @google-plus ; background-color: @white; border:  1px solid @google-plus; }
.box-outline-whatsapp    { color: @whatsapp    ; background-color: @white; border:  1px solid @whatsapp; }
.box-outline-blogger     { color: @blogger     ; background-color: @white; border:  1px solid @blogger; }
.box-outline-instagram   { color: @instagram   ; background-color: @white; border:  1px solid @instagram; }
.box-outline-pinterest   { color: @pinterest   ; background-color: @white; border:  1px solid @pinterest; }

.box-outline-facebook    :hover { color: @dark;  }
.box-outline-twitter     :hover { color: @dark;  }
.box-outline-linkedin    :hover { color: @dark;  }
.box-outline-skype       :hover { color: @dark;  }
.box-outline-youtube     :hover { color: @dark;  }
.box-outline-google-plus :hover { color: @dark;  }
.box-outline-whatsapp    :hover { color: @dark;  }
.box-outline-blogger     :hover { color: @dark;  }
.box-outline-instagram   :hover { color: @dark;  }
.box-outline-pinterest   :hover { color: @dark;  }


.box-midias-circulo{
    border-radius: 100%;
    display: inline-block;
    text-align: center;
    margin: 0 5px;
}

.box-midias-quadrado{
    border-radius: 0;
    display: inline-block;
    text-align: center;
    margin: 0 5px;
}

.box-midias-1{
  font-size: @size_midia_1;
  width: calc( @size_midia_1 * 2 );
  height: calc( @size_midia_1 * 2 );
  padding: calc( @size_midia_1 / 5 ) !important;
}

.box-midias-2{
  font-size: @size_midia_2;
  width: calc( @size_midia_2 * 2 );
  height: calc( @size_midia_2 * 2 );
  padding: calc( @size_midia_2 / 5 ) !important;
}

.box-midias-3{
  font-size: @size_midia_3;
  width: calc( @size_midia_3 * 2 );
  height: calc( @size_midia_3 * 2 );
  padding: calc( @size_midia_3 / 5 ) !important;
}

/*  BTN */
.btn-light {
  color: @light-hover;
  background-color: @light;
  border-color: @light;
}

.btn-light:hover {
  color: @light-hover;
  background-color: @light;
  border-color: @light;
}

.btn-light.disabled, .btn-light:disabled {
  background-color: @light;
  border-color: @light;
}

.btn-light:not([disabled]):not(.disabled):active, .btn-light:not([disabled]):not(.disabled).active, .show > .btn-light.dropdown-toggle {
  color:  @white;
  background-color: #bd2130;
  border-color: #b21f2d;
  box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.5);
}


/* BTN OUTLINE */


.btn-outline-light {
  color: @light-hover;
  background-color:  @white;
  border-color: @light;
}


.btn-outline-light:hover {
  color: @light-hover;
  background-color: @light;
  border-color: @light;
}



/* TODOS */

.btn:focus {
  box-shadow: 0 0 0 0.2rem rgba(0,0,0,0.5) !important;
  color: rgba(0,0,0,0.5) !important;
}

/* background */

.bg-dark{
  background-color: @dark;
}

.bg-light{
  background-color: @light;
}