/* Buttons */
.btn {
  padding: 1rem 3rem;
  border-radius: 0px;
  color: white;
}
.btn:hover {
  color: white;
}
.btn-sm {
  padding: 0.6rem 1.5rem;
  border-radius: 3px;
}
.btn-md {
  padding: 1rem 2.6rem;
  border-radius: 0px;
}
.btn-lg {
  padding: 1.2rem 3.2rem;
  border-radius: 6px;
}
.bg-primary {
  background-color: #e1201d !important;
}
.bg-success {
  background-color: #f7ed4a !important;
}
.bg-info {
  background-color: #82786e !important;
}
.bg-warning {
  background-color: #879a9f !important;
}
.bg-danger {
  background-color: #b1a374 !important;
}
.btn-primary,
.btn-primary:active {
  background-color: #e1201d !important;
  border-color: #e1201d !important;
  color: #ffffff !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary.active {
  color: #ffffff !important;
  background-color: #9d1614 !important;
  border-color: #9d1614 !important;
}
.btn-primary.disabled,
.btn-primary:disabled {
  color: #ffffff !important;
  background-color: #9d1614 !important;
  border-color: #9d1614 !important;
}
.btn-secondary,
.btn-secondary:active {
  background-color: #149dcc !important;
  border-color: #149dcc !important;
  color: #ffffff !important;
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary.focus,
.btn-secondary.active {
  color: #ffffff !important;
  background-color: #0d6786 !important;
  border-color: #0d6786 !important;
}
.btn-secondary.disabled,
.btn-secondary:disabled {
  color: #ffffff !important;
  background-color: #0d6786 !important;
  border-color: #0d6786 !important;
}
.btn-info,
.btn-info:active {
  background-color: #82786e !important;
  border-color: #82786e !important;
  color: #ffffff !important;
}
.btn-info:hover,
.btn-info:focus,
.btn-info.focus,
.btn-info.active {
  color: #ffffff !important;
  background-color: #59524b !important;
  border-color: #59524b !important;
}
.btn-info.disabled,
.btn-info:disabled {
  color: #ffffff !important;
  background-color: #59524b !important;
  border-color: #59524b !important;
}
.btn-success,
.btn-success:active {
  background-color: #f7ed4a !important;
  border-color: #f7ed4a !important;
  color: #3f3c03 !important;
}
.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success.active {
  color: #3f3c03 !important;
  background-color: #eadd0a !important;
  border-color: #eadd0a !important;
}
.btn-success.disabled,
.btn-success:disabled {
  color: #3f3c03 !important;
  background-color: #eadd0a !important;
  border-color: #eadd0a !important;
}
.btn-warning,
.btn-warning:active {
  background-color: #879a9f !important;
  border-color: #879a9f !important;
  color: #ffffff !important;
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.focus,
.btn-warning.active {
  color: #ffffff !important;
  background-color: #617479 !important;
  border-color: #617479 !important;
}
.btn-warning.disabled,
.btn-warning:disabled {
  color: #ffffff !important;
  background-color: #617479 !important;
  border-color: #617479 !important;
}
.btn-danger,
.btn-danger:active {
  background-color: #b1a374 !important;
  border-color: #b1a374 !important;
  color: #ffffff !important;
}
.btn-danger:hover,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger.active {
  color: #ffffff !important;
  background-color: #8b7d4e !important;
  border-color: #8b7d4e !important;
}
.btn-danger.disabled,
.btn-danger:disabled {
  color: #ffffff !important;
  background-color: #8b7d4e !important;
  border-color: #8b7d4e !important;
}
.btn-white {
  color: #333333 !important;
}
.btn-white,
.btn-white:active {
  background-color: #ffffff !important;
  border-color: #ffffff !important;
  color: #808080 !important;
}
.btn-white:hover,
.btn-white:focus,
.btn-white.focus,
.btn-white.active {
  color: #808080 !important;
  background-color: #d9d9d9 !important;
  border-color: #d9d9d9 !important;
}
.btn-white.disabled,
.btn-white:disabled {
  color: #808080 !important;
  background-color: #d9d9d9 !important;
  border-color: #d9d9d9 !important;
}
.btn-black,
.btn-black:active {
  background-color: #333333 !important;
  border-color: #333333 !important;
  color: #ffffff !important;
}
.btn-black:hover,
.btn-black:focus,
.btn-black.focus,
.btn-black.active {
  color: #ffffff !important;
  background-color: #0d0d0d !important;
  border-color: #0d0d0d !important;
}
.btn-black.disabled,
.btn-black:disabled {
  color: #ffffff !important;
  background-color: #0d0d0d !important;
  border-color: #0d0d0d !important;
}
.btn-primary-outline,
.btn-primary-outline:active {
  background: none;
  border-color: #871311;
  color: #871311;
}
.btn-primary-outline:hover,
.btn-primary-outline:focus,
.btn-primary-outline.focus,
.btn-primary-outline.active {
  color: #ffffff;
  background-color: #e1201d;
  border-color: #e1201d;
}
.btn-primary-outline.disabled,
.btn-primary-outline:disabled {
  color: #ffffff !important;
  background-color: #e1201d !important;
  border-color: #e1201d !important;
}
.btn-secondary-outline,
.btn-secondary-outline:active {
  background: none;
  border-color: #0b566f;
  color: #0b566f;
}
.btn-secondary-outline:hover,
.btn-secondary-outline:focus,
.btn-secondary-outline.focus,
.btn-secondary-outline.active {
  color: #ffffff;
  background-color: #149dcc;
  border-color: #149dcc;
}
.btn-secondary-outline.disabled,
.btn-secondary-outline:disabled {
  color: #ffffff !important;
  background-color: #149dcc !important;
  border-color: #149dcc !important;
}
.btn-info-outline,
.btn-info-outline:active {
  background: none;
  border-color: #4b453f;
  color: #4b453f;
}
.btn-info-outline:hover,
.btn-info-outline:focus,
.btn-info-outline.focus,
.btn-info-outline.active {
  color: #ffffff;
  background-color: #82786e;
  border-color: #82786e;
}
.btn-info-outline.disabled,
.btn-info-outline:disabled {
  color: #ffffff !important;
  background-color: #82786e !important;
  border-color: #82786e !important;
}
.btn-success-outline,
.btn-success-outline:active {
  background: none;
  border-color: #d2c609;
  color: #d2c609;
}
.btn-success-outline:hover,
.btn-success-outline:focus,
.btn-success-outline.focus,
.btn-success-outline.active {
  color: #3f3c03;
  background-color: #f7ed4a;
  border-color: #f7ed4a;
}
.btn-success-outline.disabled,
.btn-success-outline:disabled {
  color: #3f3c03 !important;
  background-color: #f7ed4a !important;
  border-color: #f7ed4a !important;
}
.btn-warning-outline,
.btn-warning-outline:active {
  background: none;
  border-color: #55666b;
  color: #55666b;
}
.btn-warning-outline:hover,
.btn-warning-outline:focus,
.btn-warning-outline.focus,
.btn-warning-outline.active {
  color: #ffffff;
  background-color: #879a9f;
  border-color: #879a9f;
}
.btn-warning-outline.disabled,
.btn-warning-outline:disabled {
  color: #ffffff !important;
  background-color: #879a9f !important;
  border-color: #879a9f !important;
}
.btn-danger-outline,
.btn-danger-outline:active {
  background: none;
  border-color: #7a6e45;
  color: #7a6e45;
}
.btn-danger-outline:hover,
.btn-danger-outline:focus,
.btn-danger-outline.focus,
.btn-danger-outline.active {
  color: #ffffff;
  background-color: #b1a374;
  border-color: #b1a374;
}
.btn-danger-outline.disabled,
.btn-danger-outline:disabled {
  color: #ffffff !important;
  background-color: #b1a374 !important;
  border-color: #b1a374 !important;
}
.btn-black-outline,
.btn-black-outline:active {
  background: none !important;
  border-color: #000000;
  color: #000000;
}
.btn-black-outline:hover,
.btn-black-outline:focus,
.btn-black-outline.focus,
.btn-black-outline.active {
  color: #ffffff;
  background-color: transparent;
  border-color: #2098d1;
}
.btn-black-outline.disabled,
.btn-black-outline:disabled {
  color: #ffffff !important;
  background-color: #333333 !important;
  border-color: #333333 !important;
}
.btn-white-outline,
.btn-white-outline:active,
.btn-white-outline.active {
  background: none !important;
  border-color: #fff;
  color: #fff;
}
.btn-white-outline:hover,
.btn-white-outline:focus,
.btn-white-outline.focus {
  color: #333333;
  background-color: transparent;
  border-color: #2098d1;
}
.btn-white-no,
.btn-white-no:active,
.btn-white-no.active {
  background: none !important;
  border-color: #fff;
  color: #fff;
}
.btn-white-no:hover,
.btn-white-ono:focus,
.btn-white-ono.focus {
  color: #fff;
  background-color: transparent;
  border-color: #fff;
}

@import 'https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300';

.box-1 { background-color: #FF6766; }
.box-2 { background-color: #3C3C3C; }
.box-3 { background-color: #66A182; }

.btn {
  line-height: 50px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
}

/* 
========================
      BUTTON ONE
========================
*/
.btn-one {
  color: #FFF;
  transition: all 0.3s;
  position: relative;
}
.btn-one span {
  transition: all 0.3s;
}
.btn-one::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-top-style: solid;
  border-bottom-style: solid;
  border-top-color: rgba(255,255,255,0.5);
  border-bottom-color: rgba(255,255,255,0.5);
  transform: scale(0.1, 1);
}
.btn-one:hover span {
  letter-spacing: 2px;
}
.btn-one:hover::before {
  opacity: 1; 
  transform: scale(1, 1); 
}
.btn-one::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all 0.3s;
  background-color: rgba(255,255,255,0.1);
}
.btn-one:hover::after {
  opacity: 0; 
  transform: scale(0.1, 1);
}


/* 
========================
      BUTTON TWO
========================
*/
.btn-two {
  color: #FFF;
  transition: all 0.5s;
  position: relative; 
}
.btn-two span {
  z-index: 2; 
  display: block;
  position: absolute;
  width: 100%;
  height: 100%; 
}
.btn-two::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all 0.5s;
  border: 1px solid rgba(255,255,255,0.2);
  background-color: rgba(255,255,255,0.1);
}
.btn-two::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  transition: all 0.5s;
  border: 1px solid rgba(255,255,255,0.2);
  background-color: rgba(255,255,255,0.1);
}
.btn-two:hover::before {
  transform: rotate(-45deg);
  background-color: rgba(255,255,255,0);
}
.btn-two:hover::after {
  transform: rotate(45deg);
  background-color: rgba(255,255,255,0);
}


/* 
========================
      BUTTON THREE
========================
*/
.btn-three {
  color: #FFF;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  font-family: 'Roboto', sans-serif;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-three::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: rgba(255,255,255,0.1);
  transition: all 0.3s;
}
.btn-three:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-three::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(255,255,255,0.5);
  transform: scale(1.2,1.2);
}
.btn-three:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/* 
========================
      BUTTON FOUR
========================
*/
.btn-four {
  color: #FFF;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  font-family: 'Roboto', sans-serif;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-four::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background-color: rgba(255,255,255,0.1);
  transition: all 0.3s;
}
.btn-four:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-four::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(255,255,255,0.5);
  transform: scale(1.2,1.2);
}
.btn-four:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/*
========================
      BUTTON FIVE
========================
*/
.btn-five {
  color: #FFF;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  font-family: 'Roboto', sans-serif;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-five::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 1px solid rgba(255,255,255,0.5);  
  background-color: rgba(0,0,0,0.1);
  transition: all 0.3s;
}
.btn-five:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-five::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(255,255,255,0.5);
  transform: scale(1.2,1.2);
}
.btn-five:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/*
========================
      BUTTON SIX
========================
*/
.btn-six {
  color: #000;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  line-height: 15px;
  height: 50px;
  width: auto;
  cursor: pointer;
  white-space: nowrap;
}
.btn-six::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 1px solid rgba(255,255,255,0.5);
  background-color: rgba(255,255,255,0.1);
  transition: all 0.3s;
}
.btn-six:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-six::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border-left: 1px solid rgba(0,0,0,0.5);
  border-right: 1px solid rgba(0,0,0,0.5);
  transform: scale(1.2,1.2);
  color: #FFF;
}
.btn-six:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/*
========================
      BUTTON SEVEN
========================
*/
.btn-seven {
  color: #000;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-seven::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 1px solid rgba(232, 98, 86, 0.5);  
  background-color: rgba(232, 98, 86, 0.5);
  transition: all 0.3s;
}
.btn-seven:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-seven::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(232, 98, 86, 0.5);
  transform: scale(1.2,1.2);
}
.btn-seven:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/* 
========================
      BUTTON EIGHT
========================
*/
.btn-eight {
  color: #000;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-eight::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 1px solid rgba(255,255,255,0.5);  
  background-color: rgba(0,0,0,0.1);
  transition: all 0.3s;
}
.btn-eight:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-eight::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(255,255,255,0.5);
  transform: scale(1.2,1.2);
}
.btn-eight:hover::after {
  opacity: 1;
  transform: scale(1,1);
}
/* 
========================
      BUTTON NINE
========================
*/
.btn-nine {
  color: #000;
  font-weight: bold;
  transition: all 0.5s;
  position: relative;
  font-size: 15px;
  font-family: 'Roboto', sans-serif;
  line-height: 15px;
  height: 50px;
  text-align: center;
  width: 250px;
  cursor: pointer;
  white-space: nowrap;
}
.btn-nine::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  border: 1px solid rgba(0,0,0,0.5);  
  background-color: rgba(0,0,0,0.1);
  transition: all 0.3s;
}
.btn-nine:hover::before {
  opacity: 0 ;
  transform: scale(0.5,0.5);
}
.btn-nine::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  opacity: 0;
  transition: all 0.3s;
  border: 1px solid rgba(0,0,0,0.5);
  transform: scale(1.2,1.2);
  background-color: rgba(0,0,0,0.1);
}
.btn-nine:hover::after {
  opacity: 1;
  transform: scale(1,1);
}

/* 
========================
      SUBMIT BUTTON
========================*/

.submit-btn {
    display: inline-block;
    padding: 8px 40px !important;
    background: #f70655 !important;
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #f70655;
    border-radius: 0px;
    transition: all 0.5s ease 0s;
}
.submit-btn:hover{
    background: transparent !important;
    border: 2px solid #000;
    color: #000 !important;
}

input[type=kontak],
input[type=button],
input[type=submit] {
	display: inline-block;
    padding: 8px 40px !important;
	background-color: #019934 !important;
    font-size: 15px;
    font-weight: 600;
	font-family: 'Roboto', sans-serif;
    color: #FFF;
    border-radius: 0px;
    transition: all 0.5s ease 0s;
	position: relative;
	line-height: 15px;
	height: 50px;
	text-align: center;
	width: 250px;
	cursor: pointer;
	white-space: nowrap;
	border: none;
    padding: 15px 30px;
    text-decoration: none;
    margin: 4px 2px;
    cursor: pointer;
}
input:hover[type=kontak],
input:hover[type=button],
input:hover[type=submit]{
    background-color: #4681f4 !important;
    border: 2px solid #FFF;
    color: #FFF !important;
}

.butones:hover{
    background: #fff;
    color: #f70655;
}


/*========================
  END of SUBMIT BUTTON
========================*/	

/*========================
  BIGSKY BUTTON
========================*/	
.btn-basic{
    display: inline-block;
    padding: 8px 40px !important;
    background: radial-gradient(circle, rgba(123,255,70,1) 0%, rgba(75,147,0,1) 100%);
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}
.over-plan:hover{
    background: #000;
    /*border: 2px solid #000;*/
    color: #fff !important;
}
 
.btn-starter{
    display: inline-block;
    padding: 8px 40px !important;
    background: radial-gradient(circle, rgba(255,170,0,1) 0%, rgba(242,7,7,1) 100%);
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.btn-standard{
    display: inline-block;
    padding: 8px 40px !important;
    background: radial-gradient(circle, rgba(251,113,255,1) 0%, rgba(150,5,132,1) 100%);
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.btn-50{
    display: inline-block;
    padding: 8px 40px !important;
    background: linear-gradient(rgba(255,0,0,1), rgba(128,0,0,1));
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.btn-60{
    display: inline-block;
    padding: 8px 40px !important;
    background: linear-gradient(rgba(252,208,0,1), rgba(0,59,100,1));
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.btn-70{
    display: inline-block;
    padding: 8px 40px !important;
    background: linear-gradient(rgba(0,128,0,1), rgba(0,255,0,1));
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.btn-100{
    display: inline-block;
    padding: 8px 40px !important;
    background: linear-gradient(rgba(128,0,128,1), rgba(255,0,255,1));
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}

.starlink-plan{
    display: inline-block;
    padding: 8px 40px !important;
    background: linear-gradient(rgba(128,0,128,1), rgba(255,0,255,1));
    font-size: 15px;
    font-weight: 600;
    color: #fff;
    text-transform: capitalize;
    border: 2px solid #fff;
    border-radius: 0px;
    transition: all 0.8s ease 0s;
}