@import url('https://fonts.googleapis.com/css?family=Lobster');
@font-face {
    font-family: "ModernPictograms";
    src: url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.eot");
    src: url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.eot?#iefix")format("embedded-opentype"),
    url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.woff2")format("woff2"),
    url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.woff")format("woff"),
    url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.ttf")format("truetype"),
    url("https://db.onlinewebfonts.com/t/286f9571ba712c92375b5738359d21f0.svg#ModernPictograms")format("svg");
}
/* line 13, ../sass/screen.scss */


.cool_btn1 .top {
    text-align: center;
    display: block;
}
/* line 22, ../sass/screen.scss */
.cool_btn1 {
  width: 190px;
  height: 190px;
  margin: 5px;
  position: relative;
  -webkit-border-radius: 200px;
  -moz-border-radius: 200px;
  -ms-border-radius: 200px;
  -o-border-radius: 200px;
  border-radius: 200px;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #fafafa), color-stop(50%, #e3e3e3), color-stop(50%, #888888), color-stop(100%, #666666));
  background-image: -webkit-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
  background-image: -moz-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
  background-image: -o-linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
  background-image: linear-gradient(#fafafa, #e3e3e3 50%, #888888 50%, #666666);
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3);
  display: inline-block;
}

/* line 31, ../sass/screen.scss */
.cool_btn1 .top {
  text-align: center;
  font-size: 50px;
  margin: 30px 0 0 0;
  color: #333;
  text-shadow: 0 1px 0 white, 0 -1px 0 rgba(0, 0, 0, 0.5);
  font-family: 'Lobster', cursive;
  font-weight: normal;
  line-height: 1;
}

/* line 40, ../sass/screen.scss */
.cool_btn1 .top i {
  display: block;
  font-style: normal;
  font-size: 14px;
  font-weight: bold;
  font-family: helvetica, arial, sans-serif;
  text-shadow: none;
}
/* line 49, ../sass/screen.scss */
.cool_btn1 h2 {
  font-family: 'ModernPictogramsNormal', Arial, sans-serif;
  font-weight: normal;
  text-align: center;
  font-size: 50px;
  line-height: 1;
  margin: 25px 0 0 0;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 -1px 0px rgba(0, 0, 0, 0.8);
  color: #fafafa;
}

/* -------------------
Transitions
-------------------- */
/* line 76, ../sass/screen.scss */
.cool_btn1.blue, .cool_btn1.teal, .cool_btn1.orange, .cool_btn1.green {
  -webkit-transition-property: all;
  -moz-transition-property: all;
  -o-transition-property: all;
  transition-property: all;
  -webkit-transition-duration: 0.4s;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  transition-duration: 0.4s;
  cursor: pointer;
}

/* -------------------
Colors
-------------------- */
/* line 84, ../sass/screen.scss */
.cool_btn1.blue {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #577fbd), color-stop(100%, #274281));
  background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
  background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
  background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
  background-image: linear-gradient(#d5d5d5, #ffffff 50%, #577fbd 50%, #274281);
}
/* line 86, ../sass/screen.scss */
.cool_btn1.blue .top {
  color: #4265A3;
}
/* line 89, ../sass/screen.scss */
.cool_btn1.blue h2 {
  color: #1E3261;
}

/* line 93, ../sass/screen.scss */
.cool_btn1.teal {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #11b8fe), color-stop(100%, #0187b8));
  background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
  background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
  background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
  background-image: linear-gradient(#d5d5d5, #ffffff 50%, #11b8fe 50%, #0187b8);
}
/* line 95, ../sass/screen.scss */
.cool_btn1.teal .top {
  color: #149EDB;
}
/* line 98, ../sass/screen.scss */
.cool_btn1.teal h2 {
  color: #0C6186;
}

/* line 102, ../sass/screen.scss */
.cool_btn1.orange {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #f49e23), color-stop(100%, #e27619));
  background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
  background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
  background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
  background-image: linear-gradient(#d5d5d5, #ffffff 50%, #f49e23 50%, #e27619);
}
/* line 104, ../sass/screen.scss */
.cool_btn1.orange .top {
  color: #e27619;
}
/* line 107, ../sass/screen.scss */
.cool_btn1.orange h2 {
  color: #AC5509;
}

/* line 111, ../sass/screen.scss */
.cool_btn1.green {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #d5d5d5), color-stop(50%, #ffffff), color-stop(50%, #2fd51d), color-stop(100%, #00a01e));
  background-image: -webkit-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
  background-image: -moz-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
  background-image: -o-linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
  background-image: linear-gradient(#d5d5d5, #ffffff 50%, #2fd51d 50%, #00a01e);
}
/* line 113, ../sass/screen.scss */
.cool_btn1.green .top {
  color: #00a01e;
}
/* line 116, ../sass/screen.scss */
.cool_btn1.green h2 {
  color: #006312;
}

/* -------------------
Hover States
-------------------- */
/* line 123, ../sass/screen.scss */
.cool_btn1.orange:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(255, 174, 0, 0.8);
}

/* line 128, ../sass/screen.scss */
.cool_btn1.teal:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(16, 216, 252, 0.8);
}

/* line 133, ../sass/screen.scss */
.cool_btn1.blue:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(43, 95, 187, 0.8);
}

/* line 138, ../sass/screen.scss */
.cool_btn1.green:hover {
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
  -moz-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3), inset 0px 2px 5px rgba(0, 0, 0, 0.3), 0 0 28px 6px rgba(47, 217, 29, 0.8);
}

.cool_btn1.m {
    width:100px;
    height:100px;
}

.cool_btn1.m .top{
    font-size:25px;
    margin: 16px 0 0 0;
}

.cool_btn1.m h2 { 
    margin: 12px 0 0 0;
    font-size:25px;
}

.cool_btn1.xs {
    margin:3px;
    width:50px;
    height:50px;
}

.cool_btn1.xs .top{
    font-size:14px;
    margin: 8px 0 0 0;
}

.cool_btn1.xs h2 { 
    margin: 8px 0 0 0;
    font-size:12px;
}

.cool_btn1.xs .top i {
    font-size:12px;
    display:none;
}

.cool_btn1 .badge-effect {
    width: 100%;
    position: absolute;
    height: 100%;
}

.cool_btn1.xs .badge-effect {
   display:none;
}