@charset "utf-8";

/* CSS Document */

@font-face { 

  font-family: 'Plume'; 

  src: url('https://fonts.googleapis.com/css?family=Archivo+Narrow:700'); 

}



.well {

	border:none;

}

.search-query{

	color:#000;

}

.input-group .form-control:first-child, .input-group-addon:first-child, .input-group-btn:first-child > .btn, .input-group-btn:first-child > .btn-group > .btn, .input-group-btn:first-child > .dropdown-toggle, .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle), .input-group-btn:last-child > .btn-gr

{

	color:#000;

	border-color:#000;

}

select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .inputbox {

    border-color:#000;

	color: #000;

    width: auto;

}

div.ja_slidetitle{

	font-size:10px;

	text-align:center;

}

.iconerungis{

	background-image:url(../../../images/rungis.png);

	width:30px;

	height:55px;

	display:block;

}

.iconepdf{

	background-image:url(../../../images/pdf.png);

	width:30px;

	height:32px;

	display:block;

}





.date-badge {

  display: inline-block;

  width: 40px;

  height:40px;

  float:left;

  margin-right:10px;

  padding: 0px 5px 0px 5px;

  font-size: 12px;

  font-weight: bold;

  color: #ffffff;

  line-height: 20px;

  text-align: center;

  background-color: #003F8A;

  border-radius: 5px;

}



/* calendrier ****/

#flatcal_minical .flatcal_sundaycell{

	background-color:#ddd;

	text-align:center;

	font-size:14px;

	

}

#flatcal_minical .flatcal_busylink{

	background-color: #003F8A;

	color:#fff;

	text-align:center;

	font-size:14px;

	display:block;

}

#flatcal_minical .flatcal_daycell{

	text-align:center;

	font-size:14px;

}

.mod_events_latest_date{

	color:#000;

}

/* module de recherche */

.ja-k2filter-wrap.vertical-layout {

	margin-left:-30px;



}

.ja-k2filter-wrap.horizontal-layout {

	padding-top:30px;

	padding-bottom:80px;



}

.ja-k2filter-wrap.horizontal-layout li{

list-style-type: none;

}

.input-append input, .input-append select, .input-append .uneditable-input {

	float:right;

	

}



/* Les couleures du menu */



/***   Layout ***/

.moduleonslideshow{

	display:block; 

	position: absolute; 

	top:80px; 

	right:100px;

	background: rgba(255,255,255,0.5);

}

.t3-header {

  background-color:#003F8A;

  width:100%;

  

  border-top:solid 6px #fff;

  padding-top: 10px;

  z-index:5;

}

.acm-slideshow .owl-carousel {

	top:-100px;

	margin-bottom:-100px;

}

.row{

	height:80px;

}



.items-1{

}

.head-action{

	text-align:center;

}



.btn-action{

	font-size:11px; 

	width:50px;

	height:50px;

	border-radius: 5px;

	text-align:center;

	padding:3px 1px 1px 0px;

	margin-right:5px;

}

	

.t3-masthead{

	position:relative;

	margin-bottom:20px;

}



.btn-action-label{

	font-size:9px;

	width:50px;

	line-height:10px;

	vertical-align:middle;

	height:20px;

	

}



.logo {

  top:-121px;

  padding:0px;

  

}

.t3-mainbody{

	position:relative;

	top:-100px;

}

.t3-content{

	color:#000;

}

.t3-sidebar{

}

.t3-off-canvas-header-title{

	color:#FFF;

}

.t3-mainnav {

	background:rgba(0,0,0,0.7);

	top:0px;

	z-index:12;

	padding-top:0px;

	padding-bottom:0px;

}



.navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > li > div {

  line-height: normal;

  text-align: center;

  display: table-cell; /* comportement visuel de cellule */

  vertical-align: auto;

  }

.t3-footer{

	top:0px;

	position:relative;

}



/***** Slideshow ***/

.acm-slideshow .owl-carousel {

	top:-100px;

}



/****** Module styling ****/

.module-title {

	

	padding-left:15px;



padding-top:5px;

background-color:#C3D9EA;



font-family: 'Archivo Narrow', sans-serif;

	font-weight:bold;

}

input[type="search"]{

	border:#000 1px solid;

	color:#000;

}



.t3-mainbody{

background-color:#fff;

}

.container-hd{

	background-color:#efefef;

}

/****** K2 styling ****/





h3, .h3 {font-size:20px; color:#003F8A;}

h2, .h2 {font-size:25px; color:#003F8A;}



div.k2ItemsBlock ul li div.moduleItemIntrotext {

	font-size:12px;

	line-height:13px;

	margin-bottom:0px;

	padding-bottom:2px;

}

div.k2ItemsBlock ul li div.moduleItemIntrotext a.moduleItemImage img {float: left; margin-right:5px; padding:0; width:70px; height:40px; overflow: hidden;}



div.k2ItemsBlock ul li:nth-child(odd)  { background:#eee;}



div.k2ItemsBlock ul li:hover--{

	border:solid 1px #666666;

}

div.k2ItemsBlock ul li{list-style-type:none;}

.t3-megamenu .t3-module ul li{

	list-style:none;

}



div.k2ItemsBlock ul li a.moduleItemTitle  { }



.itemListView .itemListDoctors .itemContainer .catItemView,

.itemView .itemListDoctors .itemContainer .catItemView {

  border: 1px solid #e6eaf0;

  background-color: #f6f6f6;

  padding: 10px;

  position: relative;

  border-radius: 3px;

  -webkit-box-shadow: 0px 0px 0 0 rgba(0, 0, 0, 0.2);

  box-shadow: 0px 0px 0 0 rgba(0, 0, 0, 0.2);

  -webkit-transition: box-shadow 150ms;

  -o-transition: box-shadow 150ms;

  transition: box-shadow 150ms;

}

.itemListView .itemListDoctors .itemContainer .catItemView:hover,

.itemView .itemListDoctors .itemContainer .catItemView:hover {

  -webkit-box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);

  box-shadow: 0px 0px 10px 5px rgba(0, 0, 0, 0.2);

}

.itemListView .itemListDoctors .catItemBody,

.itemView .itemListDoctors .catItemBody {

  padding-top: 10px;

  padding-bottom: 0;

  float: none;

  width: auto;

}

.itemListView .itemListDoctors .catItemTitle,

.itemView .itemListDoctors .catItemTitle,

.itemListView .itemListDoctors .catItemTitle a,

.itemView .itemListDoctors .catItemTitle a 

{

  padding: 10px;

  margin-left:10px;

  font-weight: bold;

  font-size: 15px;

text-indent: 0px;

line-height:20px;



font-family: 'Archivo Narrow', sans-serif;

}



.itemListView .itemListDoctors .catItemHeader .catItemTitle,

.itemView .itemListDoctors .catItemHeader .catItemTitle {

  margin-bottom: 12px;

  padding: 0;

  font-size:15px;

  text-indent:0px;

  

}



.itemListView .itemListDoctors .catItemImageBlock,

.itemView .itemListDoctors .catItemImageBlock {

  padding: 0 0 24px;

  margin-bottom: 0;

  float: none;

  width: auto;

}

.itemListView .itemListDoctors .catItemImage,

.itemView .itemListDoctors .catItemImage {

  margin-bottom: 0;

	height:150px;

	overflow: hidden;

}

.catItemImageBlock .catItemImage{

	height:150px;

	overflow: hidden;

	}

.itemListSubCategories .subCategoryContainer .subCategory{

	margin-bottom:20px;

	background-color:#F7F7F7;

}

.itemListSubCategories:hover .subCategoryContainer:hover .subCategory:hover{

-moz-box-shadow: 0px 0px 5px 5px #c0c0c0;

-webkit-box-shadow: 0px 0px 5px 5px #c0c0c0;

-o-box-shadow: 0px 0px 5px 5px #c0c0c0;

box-shadow: 0px 0px 5px 5px #c0c0c0;

filter:progid:DXImageTransform.Microsoft.Shadow(color=#c0c0c0, Direction=NaN, Strength=5);

background-color:#fff;

border: solid 1px #003F8A ;

}

/****    Styles pour le Hover (page d'accueil)***** */



.view {

   width: 100%;

   height: 200px;

   overflow: hidden;

   position: relative;

   cursor: default;

   margin-bottom:-10px;

}

.view .mask,.view .content {

   width: 100%;

   height: 200px;

   position: absolute;

   overflow: hidden;

   top: 0;

   left: 0;

}

.view img {

   display: block;

   position: relative;

}

.view h2 {

   text-transform: uppercase;

   color: #fff;

   text-align: center;

   position: relative;

   font-size: 12px;

   background: rgba(0, 0, 0, 0.8);

   padding: 10px;

}

.view p {

   font-family: Georgia, serif;

   font-style: italic;

   font-size: 12px;

   position: relative;

   color: #fff;

   padding: 10px 20px 20px;

   text-align: center;

}

.view a.info {

   display: inline-block;

   text-decoration: none;

   padding: 7px 14px;

   background: #000;

   color: #fff;

   text-transform: uppercase;

   -webkit-box-shadow: 0 0 1px #000;

   -moz-box-shadow: 0 0 1px #000;

   box-shadow: 0 0 1px #000;

}

.view a.info: hover {

   -webkit-box-shadow: 0 0 5px #000;

   -moz-box-shadow: 0 0 5px #000;

   box-shadow: 0 0 5px #000;

}





.view-first img {

   -webkit-transition: all 0.2s linear;

   -moz-transition: all 0.2s linear;

   -o-transition: all 0.2s linear;

   -ms-transition: all 0.2s linear;

   transition: all 0.2s linear;

   

}

.view-first .mask {

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";

   filter: alpha(opacity=0);

   opacity: 0;

   background-color: rgba(0,119,211, 0.7);

   -webkit-transition: all 0.4s ease-in-out;

   -moz-transition: all 0.4s ease-in-out;

   -o-transition: all 0.4s ease-in-out;

   -ms-transition: all 0.4s ease-in-out;

   transition: all 0.4s ease-in-out;

   font-size:10px;

}

.view-first h2 {

   -webkit-transform: translateY(-100px);

   -moz-transform: translateY(-100px);

   -o-transform: translateY(-100px);

   -ms-transform: translateY(-100px);

   transform: translateY(-100px);

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";

   filter: alpha(opacity=0);

   opacity: 0;

   -webkit-transition: all 0.2s ease-in-out;

   -moz-transition: all 0.2s ease-in-out;

   -o-transition: all 0.2s ease-in-out;

   -ms-transition: all 0.2s ease-in-out;

   transition: all 0.2s ease-in-out;

   padding-right:75px;

}

.view-first p {

   -webkit-transform: translateY(100px);

   -moz-transform: translateY(100px);

   -o-transform: translateY(100px);

   -ms-transform: translateY(100px);

   transform: translateY(100px);

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";

   filter: alpha(opacity=0);

   opacity: 0;

   -webkit-transition: all 0.2s linear;

   -moz-transition: all 0.2s linear;

   -o-transition: all 0.2s linear;

   -ms-transition: all 0.2s linear;

   transition: all 0.2s linear;

}

.view-first:hover img {

   -webkit-transform: scale(1.1,1.1);

   -moz-transform: scale(1.1,1.1);

   -o-transform: scale(1.1,1.1);

   -ms-transform: scale(1.1,1.1);

   transform: scale(1.1,1.1);

}

.view-first a.info {

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=0)";

   filter: alpha(opacity=0);

   opacity: 0;

   -webkit-transition: all 0.2s ease-in-out;

   -moz-transition: all 0.2s ease-in-out;

   -o-transition: all 0.2s ease-in-out;

   -ms-transition: all 0.2s ease-in-out;

   transition: all 0.2s ease-in-out;

}

.view-first:hover .mask {

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";

   filter: alpha(opacity=100);

   opacity: 1;

}

.view-first:hover h2,

.view-first:hover p,

.view-first:hover a.info {

   -ms-filter: "progid: DXImageTransform.Microsoft.Alpha(Opacity=100)";

   filter: alpha(opacity=100);

   opacity: 1;

   -webkit-transform: translateY(0px);

   -moz-transform: translateY(0px);

   -o-transform: translateY(0px);

   -ms-transform: translateY(0px);

   transform: translateY(0px);

}

.view-first:hover p {

   -webkit-transition-delay: 0.1s;

   -moz-transition-delay: 0.1s;

   -o-transition-delay: 0.1s;

   -ms-transition-delay: 0.1s;

   transition-delay: 0.1s;

}

.view-first:hover a.info {

   -webkit-transition-delay: 0.2s;

   -moz-transition-delay: 0.2s;

   -o-transition-delay: 0.2s;

   -ms-transition-delay: 0.2s;

   transition-delay: 0.2s;

}

				

/**** Style Menu Navbar */









/**** Style Menu Navbar */



.navbar-nav > li a{

	box-sizing:content-box;

	width:100px;

	height:60px;

	text-align:center;

	vertical-align: middle;	

}



 .t3-megamenu .dropdown-menu .mega-nav > li a

{

	height:20px;

	width:94%;

	text-align:left;

	font-size:12px;



}





.menu1:hover{

	background-color:#1E9FB5;

}

.menu2:hover{

	background-color:#670164;

}

.menu3:hover{

	background-color:#0E7838;

}

.menu4:hover{

	background-color:#DE1213;

}

.menu5:hover{

	background-color:#F8940B;

}

.menu6:hover{

	background-color:#F04102;

}

.menu7:hover{

	background-color:#02275B;

}



.menu8:hover{

	background-color:#B4015F;

}



/* stymes du Megamenu */



.sousmenu-hoteldeville1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-hoteldeville2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-hoteldeville{

	border:6px solid #1E9FB5;

}

.sousmenu-economique1 {

	padding-top:100px;

	background:url(../../../images/menu/economique1.jpg) top no-repeat;

}

.sousmenu-economique2 {

	padding-top:100px;

	background:url(../../../images/menu/economique2.jpg) top no-repeat;

}

.sousmenu-economique{

	border:6px solid #670164;

}

.sousmenu-cadredevie1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-cadredevie2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-cadredevie{

	border:6px solid #328C56;

}

.sousmenu-familiale1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-familiale2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-familiale{

	border:6px solid #DE1213;

}

.sousmenu-enfance1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-enfance2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-enfance{

	border:6px solid #F8940B;

}

.sousmenu-jeunesse1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-jeunesse2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-jeunesse{

	border:6px solid #F04102;

}

.sousmenu-sport1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-sport2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-sport{

	border:6px solid #02275B;

}

.sousmenu-culture1 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville1.jpg) top no-repeat;

}

.sousmenu-culture2 {

	padding-top:100px;

	background:url(../../../images/menu/hoteldeville2.jpg) top no-repeat;

}

.sousmenu-culture{

	border:6px solid #B4015F;

}

.morebutton{

	color:#fff;

}

/*********   Les icones *******/

.icone-droite{





border:solid 1px #00408a;

-moz-border-radius: 5px;

-webkit-border-radius: 5px;

border-radius: 5px;



width:70px;

height:70px;

margin:10px;

padding:5px;

color:#00408A;

text-align:center;

font-size:12px;

font-weight:bold;

}



/************Tables*******************/

CSSTableGenerator {

	margin:0px;padding:0px;

	width:100%;

	box-shadow: 10px 10px 5px #888888;

	border:1px solid #000000;

	

	-moz-border-radius-bottomleft:0px;

	-webkit-border-bottom-left-radius:0px;

	border-bottom-left-radius:0px;

	

	-moz-border-radius-bottomright:0px;

	-webkit-border-bottom-right-radius:0px;

	border-bottom-right-radius:0px;

	

	-moz-border-radius-topright:0px;

	-webkit-border-top-right-radius:0px;

	border-top-right-radius:0px;

	

	-moz-border-radius-topleft:0px;

	-webkit-border-top-left-radius:0px;

	border-top-left-radius:0px;

}.CSSTableGenerator table{

    border-collapse: collapse;

        border-spacing: 0;

	width:100%;

	height:100%;

	margin:0px;padding:0px;

}.CSSTableGenerator tr:last-child td:last-child {

	-moz-border-radius-bottomright:0px;

	-webkit-border-bottom-right-radius:0px;

	border-bottom-right-radius:0px;

}

.CSSTableGenerator table tr:first-child td:first-child {

	-moz-border-radius-topleft:0px;

	-webkit-border-top-left-radius:0px;

	border-top-left-radius:0px;

}

.CSSTableGenerator table tr:first-child td:last-child {

	-moz-border-radius-topright:0px;

	-webkit-border-top-right-radius:0px;

	border-top-right-radius:0px;

}.CSSTableGenerator tr:last-child td:first-child{

	-moz-border-radius-bottomleft:0px;

	-webkit-border-bottom-left-radius:0px;

	border-bottom-left-radius:0px;

}.CSSTableGenerator tr:hover td{

	

}

.CSSTableGenerator tr:nth-child(odd){ background-color:#aad4ff; }

.CSSTableGenerator tr:nth-child(even)    { background-color:#ffffff; }.CSSTableGenerator td{

	vertical-align:middle;

	

	

	border:1px solid #000000;

	border-width:0px 1px 1px 0px;

	text-align:left;

	padding:7px;

	font-size:10px;

	font-family:Arial;

	font-weight:normal;

	color:#000000;

}.CSSTableGenerator tr:last-child td{

	border-width:0px 1px 0px 0px;

}.CSSTableGenerator tr td:last-child{

	border-width:0px 0px 1px 0px;

}.CSSTableGenerator tr:last-child td:last-child{

	border-width:0px 0px 0px 0px;

}

.CSSTableGenerator tr:first-child td{

		background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );

	background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );

	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");	background: -o-linear-gradient(top,#005fbf,003f7f);



	background-color:#005fbf;

	border:0px solid #000000;

	text-align:center;

	border-width:0px 0px 1px 1px;

	font-size:14px;

	font-family:Arial;

	font-weight:bold;

	color:#ffffff;

}

.CSSTableGenerator tr:first-child:hover td{

	background:-o-linear-gradient(bottom, #005fbf 5%, #003f7f 100%);	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #005fbf), color-stop(1, #003f7f) );

	background:-moz-linear-gradient( center top, #005fbf 5%, #003f7f 100% );

	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#005fbf", endColorstr="#003f7f");	background: -o-linear-gradient(top,#005fbf,003f7f);



	background-color:#005fbf;

}

.CSSTableGenerator tr:first-child td:first-child{

	border-width:0px 0px 1px 0px;

}

.CSSTableGenerator tr:first-child td:last-child{

	border-width:0px 0px 1px 1px;

}

.CSSTableGenerator tr td{

	width:50%;

}

/*! @license

*

* Buttons

* Copyright 2012-2014 Alex Wolfe and Rob Levin

*

* Licensed under the Apache License, Version 2.0 (the "License");

* you may not use this file except in compliance with the License.

* You may obtain a copy of the License at

* http://www.apache.org/licenses/LICENSE-2.0

*

* Unless required by applicable law or agreed to in writing, software

* distributed under the License is distributed on an "AS IS" BASIS,

* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.

* See the License for the specific language governing permissions and

* limitations under the License.

*/

/*

* Compass (optional)

*

* We recommend the use of autoprefixer instead of Compass

* when using buttons. However, buttons does support Compass.

* simply change $ubtn-use-compass to true and uncomment the

* @import 'compass' code below to use Compass.

*/

/*

* Required Files

*

* These files include the variables and options

* and base css styles that are required to generate buttons.

*/

/*

* $ubtn prefix (reserved)

*

* This prefix stands for Unicorn Button - ubtn

* We provide a prefix to the Sass Variables to

* prevent namespace collisions that could occur if

* you import buttons as part of your Sass build process.

* We kindly ask you not to use the prefix $ubtn in your project

* in order to avoid possilbe name conflicts. Thanks!

*/

/*

* Button Namespace (ex .button or .btn)

*

*/

/*

* Button Defaults

*

* Some default settings that are used throughout the button library.

* Changes to these settings will be picked up by all of the other modules.

* The colors used here are the default colors for the base button (gray).

* The font size and height are used to set the base size for the buttons.

* The size values will be used to calculate the larger and smaller button sizes.

*/

/*

* Button Colors

*

* $ubtn-colors is used to generate the different button colors.

* Edit or add colors to the list below and recompile.

* Each block contains the (name, background, color)

* The class is generated using the name: (ex .button-primary)

*/

/*

* Button Shapes

*

* $ubtn-shapes is used to generate the different button shapes.

* Edit or add shapes to the list below and recompile.

* Each block contains the (name, border-radius).

* The class is generated using the name: (ex .button-square).

*/

/*

* Button Sizes

*

* $ubtn-sizes is used to generate the different button sizes.

* Edit or add colors to the list below and recompile.

* Each block contains the (name, size multiplier).

* The class is generated using the name: (ex .button-giant).

*/

/*

* Color Mixin

*

* Iterates through the list of colors and creates

*

*/

/*

* No Animation

*

* Sets animation property to none

*/

/*

* Clearfix

*

* Clears floats inside the container

*/

/*

* Base Button Style

*

* The default values for the .button class

*/

.button {

  color: #666666;

  background-color: #eeeeee;

  border-color: #eeeeee;

  font-weight: 300;

  font-size: 12px;

  text-decoration: none;

  text-align: center;

  line-height: 29px;

  height: 40px;

  padding: 5px;

  margin: 5px;

  display: inline-block;

  appearance: none;

  cursor: pointer;

  border: none;

  -webkit-box-sizing: border-box;

     -moz-box-sizing: border-box;

          box-sizing: border-box;

  -webkit-transition-property: all;

          transition-property: all;

  -webkit-transition-duration: .3s;

          transition-duration: .3s;

  /*

  * Disabled State

  *

  * The disabled state uses the class .disabled, is-disabled,

  * and the form attribute disabled="disabled".

  * The use of !important is only added because this is a state

  * that must be applied to all buttons when in a disabled state.

  */ }

  .button:visited {

    color: #666666; }

  .button:hover, .button:focus {

    background-color: #00408A;

    text-decoration: none;

    outline: none; }

  .button:active, .button.active, .button.is-active {

    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.3);

    text-decoration: none;

    background-color: #eeeeee;

    border-color: #cfcfcf;

    color: #d4d4d4;

    -webkit-transition-duration: 0s;

            transition-duration: 0s;

    -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2);

            box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2); }

  .button.disabled, .button.is-disabled, .button:disabled {

    top: 0 !important;

    background: #EEE !important;

    border: 1px solid #DDD !important;

    text-shadow: 0 1px 1px white !important;

    color: #CCC !important;

    cursor: default !important;

    appearance: none !important; }

    .button.disabled else, .button.is-disabled else, .button:disabled else {

      -webkit-box-shadow: none !important;

              box-shadow: none !important;

      opacity: .8 !important; }



/*

* Base Button Tyography

*

*/

.button-uppercase {

  text-transform: uppercase; }



.button-lowercase {

  text-transform: lowercase; }



.button-capitalize {

  text-transform: capitalize; }



.button-small-caps {

  font-variant: small-caps; }



.button-icon-txt-large {

  font-size: 36px !important; }



/*

* Base padding

*

*/

.button-width-small {

  padding: 0 10px !important; }



/*

* Base Colors

*

* Create colors for buttons

* (.button-primary, .button-secondary, etc.)

*/

.button-primary,

.button-primary-flat {

  background-color: #00408A;

  border-color: #00408A;

  color: white; }

  .button-primary:visited,

  .button-primary-flat:visited {

    color: white; }

  .button-primary:hover, .button-primary:focus,

  .button-primary-flat:hover,

  .button-primary-flat:focus {

    background-color: #4cb0f9;

    border-color: #4cb0f9;

    color: white; }

  .button-primary:active, .button-primary.active, .button-primary.is-active,

  .button-primary-flat:active,

  .button-primary-flat.active,

  .button-primary-flat.is-active {

    background-color: #2798eb;

    border-color: #2798eb;

    color: #0880d7; }



.button-plain,

.button-plain-flat {

  background-color: white;

  border-color: white;

  color: #00408A; }

  .button-plain:visited,

  .button-plain-flat:visited {

    color: #00408A; }

  .button-plain:hover, .button-plain:focus,

  .button-plain-flat:hover,

  .button-plain-flat:focus {

    background-color: white;

    border-color: white;

    color: #00408A; }

  .button-plain:active, .button-plain.active, .button-plain.is-active,

  .button-plain-flat:active,

  .button-plain-flat.active,

  .button-plain-flat.is-active {

    background-color: white;

    border-color: white;

    color: #e6e6e6; }



.button-inverse,

.button-inverse-flat {

  background-color: #222222;

  border-color: #222222;

  color: #eeeeee; }

  .button-inverse:visited,

  .button-inverse-flat:visited {

    color: #eeeeee; }

  .button-inverse:hover, .button-inverse:focus,

  .button-inverse-flat:hover,

  .button-inverse-flat:focus {

    background-color: #3c3c3c;

    border-color: #3c3c3c;

    color: #eeeeee; }

  .button-inverse:active, .button-inverse.active, .button-inverse.is-active,

  .button-inverse-flat:active,

  .button-inverse-flat.active,

  .button-inverse-flat.is-active {

    background-color: #222222;

    border-color: #222222;

    color: #090909; }



.button-action,

.button-action-flat {

  background-color: #a5de37;

  border-color: #a5de37;

  color: white; }

  .button-action:visited,

  .button-action-flat:visited {

    color: white; }

  .button-action:hover, .button-action:focus,

  .button-action-flat:hover,

  .button-action-flat:focus {

    background-color: #b9e563;

    border-color: #b9e563;

    color: white; }

  .button-action:active, .button-action.active, .button-action.is-active,

  .button-action-flat:active,

  .button-action-flat.active,

  .button-action-flat.is-active {

    background-color: #a1d243;

    border-color: #a1d243;

    color: #8bc220; }



.button-highlight,

.button-highlight-flat {

  background-color: #feae1b;

  border-color: #feae1b;

  color: white; }

  .button-highlight:visited,

  .button-highlight-flat:visited {

    color: white; }

  .button-highlight:hover, .button-highlight:focus,

  .button-highlight-flat:hover,

  .button-highlight-flat:focus {

    background-color: #fec04e;

    border-color: #fec04e;

    color: white; }

  .button-highlight:active, .button-highlight.active, .button-highlight.is-active,

  .button-highlight-flat:active,

  .button-highlight-flat.active,

  .button-highlight-flat.is-active {

    background-color: #f3ab26;

    border-color: #f3ab26;

    color: #e59501; }



.button-caution,

.button-caution-flat {

  background-color: #ff4351;

  border-color: #ff4351;

  color: white; }

  .button-caution:visited,

  .button-caution-flat:visited {

    color: white; }

  .button-caution:hover, .button-caution:focus,

  .button-caution-flat:hover,

  .button-caution-flat:focus {

    background-color: #ff7680;

    border-color: #ff7680;

    color: white; }

  .button-caution:active, .button-caution.active, .button-caution.is-active,

  .button-caution-flat:active,

  .button-caution-flat.active,

  .button-caution-flat.is-active {

    background-color: #f64c59;

    border-color: #f64c59;

    color: #ff1022; }



.button-royal,

.button-royal-flat {

  background-color: #7b72e9;

  border-color: #7b72e9;

  color: white; }

  .button-royal:visited,

  .button-royal-flat:visited {

    color: white; }

  .button-royal:hover, .button-royal:focus,

  .button-royal-flat:hover,

  .button-royal-flat:focus {

    background-color: #a49ef0;

    border-color: #a49ef0;

    color: white; }

  .button-royal:active, .button-royal.active, .button-royal.is-active,

  .button-royal-flat:active,

  .button-royal-flat.active,

  .button-royal-flat.is-active {

    background-color: #827ae1;

    border-color: #827ae1;

    color: #5246e2; }



/*

* Base Layout Styles

*

* Very Miminal Layout Styles

*/

.button-block,

.button-stacked {

  display: block; }



/*

* Button Types (optional)

*

* All of the files below represent the various button

* types (including shapes & sizes). None of these files

* are required. Simple remove the uneeded type below and

* the button type will be excluded from the final build

*/

/*

* Button Shapes

*

* This file creates the various button shapes

* (ex. Circle, Rounded, Pill)

*/

.button-square {

  border-radius: 0; }



.button-box {

  border-radius: 10px;

  

 }



.button-rounded {

  border-radius: 4px; }



.button-pill {

  border-radius: 200px; }



.button-circle {

  border-radius: 100%; }



/*

* Size Adjustment for equal height & widht buttons

*

* Remove padding and set a fixed width.

*/

.button-circle,

.button-box,

.button-square {

  padding: 0 !important;

  width: 40px; }

  .button-circle.button-giant,

  .button-box.button-giant,

  .button-square.button-giant {

    width: 70px;

	

	}

  .button-circle.button-jumbo,

  .button-box.button-jumbo,

  .button-square.button-jumbo {

    width: 60px; }

  .button-circle.button-large,

  .button-box.button-large,

  .button-square.button-large {

    width: 50px; }

  .button-circle.button-normal,

  .button-box.button-normal,

  .button-square.button-normal {

    width: 40px; }

  .button-circle.button-small,

  .button-box.button-small,

  .button-square.button-small {

    width: 30px; }

  .button-circle.button-tiny,

  .button-box.button-tiny,

  .button-square.button-tiny {

    width: 24px; }



/*

* Border Buttons

*

* These buttons have no fill they only have a

* border to define their hit target.

*/

.button-border, .button-border-thin, .button-border-thick {

  background: none;

  border-width: 2px;

  border-style: solid;

  line-height: 36px; }

  .button-border:hover, .button-border-thin:hover, .button-border-thick:hover {

    background-color: rgba(255, 255, 255, 0.9); }

  .button-border:active, .button-border-thin:active, .button-border-thick:active, .button-border.active, .active.button-border-thin, .active.button-border-thick, .button-border.is-active, .is-active.button-border-thin, .is-active.button-border-thick {

    -webkit-box-shadow: none;

            box-shadow: none;

    text-shadow: none;

    -webkit-transition-property: all;

            transition-property: all;

    -webkit-transition-duration: .3s;

            transition-duration: .3s; }



/*

* Border Optional Sizes

*

* A slight variation in border thickness

*/

.button-border-thin {

  border-width: 1px; }



.button-border-thick {

  border-width: 3px; }



/*

* Border Button Colors

*

* Create colors for buttons

* (.button-primary, .button-secondary, etc.)

*/

.button-border, .button-border-thin, .button-border-thick,

.button-border-thin,

.button-border-thick {

  /*

  * Border Button Size Adjustment

  *

  * The line-height must be adjusted to compinsate for

  * the width of the border.

  */ }

  .button-border.button-primary, .button-primary.button-border-thin, .button-primary.button-border-thick,

  .button-border-thin.button-primary,

  .button-border-thick.button-primary {

    color: #00408A; }

    .button-border.button-primary:hover, .button-primary.button-border-thin:hover, .button-primary.button-border-thick:hover, .button-border.button-primary:focus, .button-primary.button-border-thin:focus, .button-primary.button-border-thick:focus,

    .button-border-thin.button-primary:hover,

    .button-border-thin.button-primary:focus,

    .button-border-thick.button-primary:hover,

    .button-border-thick.button-primary:focus {

      background-color: rgba(76, 176, 249, 0.9);

      color: rgba(255, 255, 255, 0.9); }

    .button-border.button-primary:active, .button-primary.button-border-thin:active, .button-primary.button-border-thick:active, .button-border.button-primary.active, .button-primary.active.button-border-thin, .button-primary.active.button-border-thick, .button-border.button-primary.is-active, .button-primary.is-active.button-border-thin, .button-primary.is-active.button-border-thick,

    .button-border-thin.button-primary:active,

    .button-border-thin.button-primary.active,

    .button-border-thin.button-primary.is-active,

    .button-border-thick.button-primary:active,

    .button-border-thick.button-primary.active,

    .button-border-thick.button-primary.is-active {

      background-color: rgba(39, 152, 235, 0.7);

      color: rgba(255, 255, 255, 0.5);

      opacity: .3; }

  .button-border.button-plain, .button-plain.button-border-thin, .button-plain.button-border-thick,

  .button-border-thin.button-plain,

  .button-border-thick.button-plain {

    color: white; }

    .button-border.button-plain:hover, .button-plain.button-border-thin:hover, .button-plain.button-border-thick:hover, .button-border.button-plain:focus, .button-plain.button-border-thin:focus, .button-plain.button-border-thick:focus,

    .button-border-thin.button-plain:hover,

    .button-border-thin.button-plain:focus,

    .button-border-thick.button-plain:hover,

    .button-border-thick.button-plain:focus {

      background-color: rgba(255, 255, 255, 0.9);

      color: rgba(27, 154, 247, 0.9); }

    .button-border.button-plain:active, .button-plain.button-border-thin:active, .button-plain.button-border-thick:active, .button-border.button-plain.active, .button-plain.active.button-border-thin, .button-plain.active.button-border-thick, .button-border.button-plain.is-active, .button-plain.is-active.button-border-thin, .button-plain.is-active.button-border-thick,

    .button-border-thin.button-plain:active,

    .button-border-thin.button-plain.active,

    .button-border-thin.button-plain.is-active,

    .button-border-thick.button-plain:active,

    .button-border-thick.button-plain.active,

    .button-border-thick.button-plain.is-active {

      background-color: rgba(255, 255, 255, 0.7);

      color: rgba(27, 154, 247, 0.5);

      opacity: .3; }

  .button-border.button-inverse, .button-inverse.button-border-thin, .button-inverse.button-border-thick,

  .button-border-thin.button-inverse,

  .button-border-thick.button-inverse {

    color: #222222; }

    .button-border.button-inverse:hover, .button-inverse.button-border-thin:hover, .button-inverse.button-border-thick:hover, .button-border.button-inverse:focus, .button-inverse.button-border-thin:focus, .button-inverse.button-border-thick:focus,

    .button-border-thin.button-inverse:hover,

    .button-border-thin.button-inverse:focus,

    .button-border-thick.button-inverse:hover,

    .button-border-thick.button-inverse:focus {

      background-color: rgba(60, 60, 60, 0.9);

      color: rgba(238, 238, 238, 0.9); }

    .button-border.button-inverse:active, .button-inverse.button-border-thin:active, .button-inverse.button-border-thick:active, .button-border.button-inverse.active, .button-inverse.active.button-border-thin, .button-inverse.active.button-border-thick, .button-border.button-inverse.is-active, .button-inverse.is-active.button-border-thin, .button-inverse.is-active.button-border-thick,

    .button-border-thin.button-inverse:active,

    .button-border-thin.button-inverse.active,

    .button-border-thin.button-inverse.is-active,

    .button-border-thick.button-inverse:active,

    .button-border-thick.button-inverse.active,

    .button-border-thick.button-inverse.is-active {

      background-color: rgba(34, 34, 34, 0.7);

      color: rgba(238, 238, 238, 0.5);

      opacity: .3; }

  .button-border.button-action, .button-action.button-border-thin, .button-action.button-border-thick,

  .button-border-thin.button-action,

  .button-border-thick.button-action {

    color: #a5de37; }

    .button-border.button-action:hover, .button-action.button-border-thin:hover, .button-action.button-border-thick:hover, .button-border.button-action:focus, .button-action.button-border-thin:focus, .button-action.button-border-thick:focus,

    .button-border-thin.button-action:hover,

    .button-border-thin.button-action:focus,

    .button-border-thick.button-action:hover,

    .button-border-thick.button-action:focus {

      background-color: rgba(185, 229, 99, 0.9);

      color: rgba(255, 255, 255, 0.9); }

    .button-border.button-action:active, .button-action.button-border-thin:active, .button-action.button-border-thick:active, .button-border.button-action.active, .button-action.active.button-border-thin, .button-action.active.button-border-thick, .button-border.button-action.is-active, .button-action.is-active.button-border-thin, .button-action.is-active.button-border-thick,

    .button-border-thin.button-action:active,

    .button-border-thin.button-action.active,

    .button-border-thin.button-action.is-active,

    .button-border-thick.button-action:active,

    .button-border-thick.button-action.active,

    .button-border-thick.button-action.is-active {

      background-color: rgba(161, 210, 67, 0.7);

      color: rgba(255, 255, 255, 0.5);

      opacity: .3; }

  .button-border.button-highlight, .button-highlight.button-border-thin, .button-highlight.button-border-thick,

  .button-border-thin.button-highlight,

  .button-border-thick.button-highlight {

    color: #feae1b; }

    .button-border.button-highlight:hover, .button-highlight.button-border-thin:hover, .button-highlight.button-border-thick:hover, .button-border.button-highlight:focus, .button-highlight.button-border-thin:focus, .button-highlight.button-border-thick:focus,

    .button-border-thin.button-highlight:hover,

    .button-border-thin.button-highlight:focus,

    .button-border-thick.button-highlight:hover,

    .button-border-thick.button-highlight:focus {

      background-color: rgba(254, 192, 78, 0.9);

      color: rgba(255, 255, 255, 0.9); }

    .button-border.button-highlight:active, .button-highlight.button-border-thin:active, .button-highlight.button-border-thick:active, .button-border.button-highlight.active, .button-highlight.active.button-border-thin, .button-highlight.active.button-border-thick, .button-border.button-highlight.is-active, .button-highlight.is-active.button-border-thin, .button-highlight.is-active.button-border-thick,

    .button-border-thin.button-highlight:active,

    .button-border-thin.button-highlight.active,

    .button-border-thin.button-highlight.is-active,

    .button-border-thick.button-highlight:active,

    .button-border-thick.button-highlight.active,

    .button-border-thick.button-highlight.is-active {

      background-color: rgba(243, 171, 38, 0.7);

      color: rgba(255, 255, 255, 0.5);

      opacity: .3; }

  .button-border.button-caution, .button-caution.button-border-thin, .button-caution.button-border-thick,

  .button-border-thin.button-caution,

  .button-border-thick.button-caution {

    color: #ff4351; }

    .button-border.button-caution:hover, .button-caution.button-border-thin:hover, .button-caution.button-border-thick:hover, .button-border.button-caution:focus, .button-caution.button-border-thin:focus, .button-caution.button-border-thick:focus,

    .button-border-thin.button-caution:hover,

    .button-border-thin.button-caution:focus,

    .button-border-thick.button-caution:hover,

    .button-border-thick.button-caution:focus {

      background-color: rgba(255, 118, 128, 0.9);

      color: rgba(255, 255, 255, 0.9); }

    .button-border.button-caution:active, .button-caution.button-border-thin:active, .button-caution.button-border-thick:active, .button-border.button-caution.active, .button-caution.active.button-border-thin, .button-caution.active.button-border-thick, .button-border.button-caution.is-active, .button-caution.is-active.button-border-thin, .button-caution.is-active.button-border-thick,

    .button-border-thin.button-caution:active,

    .button-border-thin.button-caution.active,

    .button-border-thin.button-caution.is-active,

    .button-border-thick.button-caution:active,

    .button-border-thick.button-caution.active,

    .button-border-thick.button-caution.is-active {

      background-color: rgba(246, 76, 89, 0.7);

      color: rgba(255, 255, 255, 0.5);

      opacity: .3; }

  .button-border.button-royal, .button-royal.button-border-thin, .button-royal.button-border-thick,

  .button-border-thin.button-royal,

  .button-border-thick.button-royal {

    color: #7b72e9; }

    .button-border.button-royal:hover, .button-royal.button-border-thin:hover, .button-royal.button-border-thick:hover, .button-border.button-royal:focus, .button-royal.button-border-thin:focus, .button-royal.button-border-thick:focus,

    .button-border-thin.button-royal:hover,

    .button-border-thin.button-royal:focus,

    .button-border-thick.button-royal:hover,

    .button-border-thick.button-royal:focus {

      background-color: rgba(164, 158, 240, 0.9);

      color: rgba(255, 255, 255, 0.9); }

    .button-border.button-royal:active, .button-royal.button-border-thin:active, .button-royal.button-border-thick:active, .button-border.button-royal.active, .button-royal.active.button-border-thin, .button-royal.active.button-border-thick, .button-border.button-royal.is-active, .button-royal.is-active.button-border-thin, .button-royal.is-active.button-border-thick,

    .button-border-thin.button-royal:active,

    .button-border-thin.button-royal.active,

    .button-border-thin.button-royal.is-active,

    .button-border-thick.button-royal:active,

    .button-border-thick.button-royal.active,

    .button-border-thick.button-royal.is-active {

      background-color: rgba(130, 122, 225, 0.7);

      color: rgba(255, 255, 255, 0.5);

      opacity: .3; }

  .button-border.button-giant, .button-giant.button-border-thin, .button-giant.button-border-thick,

  .button-border-thin.button-giant,

  .button-border-thick.button-giant {

    line-height: 66px; }

  .button-border.button-jumbo, .button-jumbo.button-border-thin, .button-jumbo.button-border-thick,

  .button-border-thin.button-jumbo,

  .button-border-thick.button-jumbo {

    line-height: 56px; }

  .button-border.button-large, .button-large.button-border-thin, .button-large.button-border-thick,

  .button-border-thin.button-large,

  .button-border-thick.button-large {

    line-height: 46px; }

  .button-border.button-normal, .button-normal.button-border-thin, .button-normal.button-border-thick,

  .button-border-thin.button-normal,

  .button-border-thick.button-normal {

    line-height: 36px; }

  .button-border.button-small, .button-small.button-border-thin, .button-small.button-border-thick,

  .button-border-thin.button-small,

  .button-border-thick.button-small {

    line-height: 26px; }

  .button-border.button-tiny, .button-tiny.button-border-thin, .button-tiny.button-border-thick,

  .button-border-thin.button-tiny,

  .button-border-thick.button-tiny {

    line-height: 20px; }



/*

* Border Buttons

*

* These buttons have no fill they only have a

* border to define their hit target.

*/

.button-borderless {

  background: none;

  border: none;

  padding: 0 8px !important;

  color: #eeeeee;

  font-size: 20.8px;

  font-weight: 200;

  /*

  * Borderless Button Colors

  *

  * Create colors for buttons

  * (.button-primary, .button-secondary, etc.)

  */

  /*

  * Borderles Size Adjustment

  *

  * The font-size must be large to compinsate for

  * the lack of a hit target.

  */ }

  .button-borderless:hover, .button-borderless:focus {

    background: none; }

  .button-borderless:active, .button-borderless.active, .button-borderless.is-active {

    -webkit-box-shadow: none;

            box-shadow: none;

    text-shadow: none;

    -webkit-transition-property: all;

            transition-property: all;

    -webkit-transition-duration: .3s;

            transition-duration: .3s;

    opacity: .3; }

  .button-borderless.button-primary {

    color: #00408A; }

  .button-borderless.button-plain {

    color: white; }

  .button-borderless.button-inverse {

    color: #222222; }

  .button-borderless.button-action {

    color: #a5de37; }

  .button-borderless.button-highlight {

    color: #feae1b; }

  .button-borderless.button-caution {

    color: #ff4351; }

  .button-borderless.button-royal {

    color: #7b72e9; }

  .button-borderless.button-giant {

    font-size: 36.4px;

    height: 52.4px;

    line-height: 52.4px; }

  .button-borderless.button-jumbo {

    font-size: 31.2px;

    height: 47.2px;

    line-height: 47.2px; }

  .button-borderless.button-large {

    font-size: 26px;

    height: 42px;

    line-height: 42px; }

  .button-borderless.button-normal {

    font-size: 20.8px;

    height: 36.8px;

    line-height: 36.8px; }

  .button-borderless.button-small {

    font-size: 15.6px;

    height: 31.6px;

    line-height: 31.6px; }

  .button-borderless.button-tiny {

    font-size: 12.48px;

    height: 28.48px;

    line-height: 28.48px; }



/*

* Raised Buttons

*

* A classic looking button that offers

* great depth and affordance.

*/

.button-raised {

  border-color: #e1e1e1;

  border-style: solid;

  border-width: 1px;

  line-height: 38px;

  background: -webkit-gradient(linear, left top, left bottom, from(#00408A), to(#00408A));

  background: linear-gradient(#f6f6f6, #e1e1e1);

  -webkit-box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15);

          box-shadow: inset 0px 1px 0px rgba(255, 255, 255, 0.3), 0 1px 2px rgba(0, 0, 0, 0.15); }

  .button-raised:hover, .button-raised:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(white), to(gainsboro));

    background: linear-gradient(top, white, gainsboro); }

  .button-raised:active, .button-raised.active, .button-raised.is-active {

    background: #eeeeee;

    -webkit-box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2), 0px 1px 0px white;

            box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.2), 0px 1px 0px white; }



/*

* Raised Button Colors

*

* Create colors for raised buttons

*/

.button-raised.button-primary {

  border-color: #088ef0;

  background: -webkit-gradient(linear, left top, left bottom, from(#00408A), to(#2B72C4));

  background: linear-gradient(#34a5f8, #088ef0); }

  .button-raised.button-primary:hover, .button-raised.button-primary:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#42abf8), to(#0888e6));

    background: linear-gradient(top, #42abf8, #0888e6); }

  .button-raised.button-primary:active, .button-raised.button-primary.active, .button-raised.button-primary.is-active {

    border-color: #0880d7;

    background: #2798eb; }

.button-raised.button-plain {

  border-color: #f2f2f2;

  background: -webkit-gradient(linear, left top, left bottom, from(white), to(#f2f2f2));

  background: linear-gradient(white, #f2f2f2); }

  .button-raised.button-plain:hover, .button-raised.button-plain:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#ededed));

    background: linear-gradient(top, white, #ededed); }

  .button-raised.button-plain:active, .button-raised.button-plain.active, .button-raised.button-plain.is-active {

    border-color: #e6e6e6;

    background: white; }

.button-raised.button-inverse {

  border-color: #151515;

  background: -webkit-gradient(linear, left top, left bottom, from(#2f2f2f), to(#151515));

  background: linear-gradient(#2f2f2f, #151515); }

  .button-raised.button-inverse:hover, .button-raised.button-inverse:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#363636), to(#101010));

    background: linear-gradient(top, #363636, #101010); }

  .button-raised.button-inverse:active, .button-raised.button-inverse.active, .button-raised.button-inverse.is-active {

    border-color: #090909;

    background: #222222; }

.button-raised.button-action {

  border-color: #9ad824;

  background: -webkit-gradient(linear, left top, left bottom, from(#afe24d), to(#9ad824));

  background: linear-gradient(#afe24d, #9ad824); }

  .button-raised.button-action:hover, .button-raised.button-action:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#b5e45a), to(#94cf22));

    background: linear-gradient(top, #b5e45a, #94cf22); }

  .button-raised.button-action:active, .button-raised.button-action.active, .button-raised.button-action.is-active {

    border-color: #8bc220;

    background: #a1d243; }

.button-raised.button-highlight {

  border-color: #fea502;

  background: -webkit-gradient(linear, left top, left bottom, from(#feb734), to(#fea502));

  background: linear-gradient(#feb734, #fea502); }

  .button-raised.button-highlight:hover, .button-raised.button-highlight:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#febc44), to(#f49f01));

    background: linear-gradient(top, #febc44, #f49f01); }

  .button-raised.button-highlight:active, .button-raised.button-highlight.active, .button-raised.button-highlight.is-active {

    border-color: #e59501;

    background: #f3ab26; }

.button-raised.button-caution {

  border-color: #ff2939;

  background: -webkit-gradient(linear, left top, left bottom, from(#ff5c69), to(#ff2939));

  background: linear-gradient(#ff5c69, #ff2939); }

  .button-raised.button-caution:hover, .button-raised.button-caution:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#ff6c77), to(#ff1f30));

    background: linear-gradient(top, #ff6c77, #ff1f30); }

  .button-raised.button-caution:active, .button-raised.button-caution.active, .button-raised.button-caution.is-active {

    border-color: #ff1022;

    background: #f64c59; }

.button-raised.button-royal {

  border-color: #665ce6;

  background: -webkit-gradient(linear, left top, left bottom, from(#9088ec), to(#665ce6));

  background: linear-gradient(#9088ec, #665ce6); }

  .button-raised.button-royal:hover, .button-raised.button-royal:focus {

    background: -webkit-gradient(linear, left top, left bottom, from(#9c95ef), to(#5e53e4));

    background: linear-gradient(top, #9c95ef, #5e53e4); }

  .button-raised.button-royal:active, .button-raised.button-royal.active, .button-raised.button-royal.is-active {

    border-color: #5246e2;

    background: #827ae1; }



/*

* 3D Buttons

*

* These buttons have a heavy three dimensional

* style that mimics the visual appearance of a

* real life button.

*/

.button-3d {

  position: relative;

  top: 0;

  -webkit-box-shadow: 0 7px 0 #bbbbbb, 0 8px 3px rgba(0, 0, 0, 0.2);

          box-shadow: 0 7px 0 #bbbbbb, 0 8px 3px rgba(0, 0, 0, 0.2); }

  .button-3d:hover, .button-3d:focus {

    -webkit-box-shadow: 0 7px 0 #bbbbbb, 0 8px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 7px 0 #bbbbbb, 0 8px 3px rgba(0, 0, 0, 0.2); }

  .button-3d:active, .button-3d.active, .button-3d.is-active {

    top: 5px;

    -webkit-transition-property: all;

            transition-property: all;

    -webkit-transition-duration: .15s;

            transition-duration: .15s;

    -webkit-box-shadow: 0 2px 0 #bbbbbb, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #bbbbbb, 0 3px 3px rgba(0, 0, 0, 0.2); }



/*

* 3D Button Colors

*

* Create colors for buttons

* (.button-primary, .button-secondary, etc.)

*/

.button-3d.button-primary {

  -webkit-box-shadow: 0 7px 0 #0880d7, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #0880d7, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-primary:hover, .button-3d.button-primary:focus {

    -webkit-box-shadow: 0 7px 0 #077ace, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #077ace, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-primary:active, .button-3d.button-primary.active, .button-3d.button-primary.is-active {

    -webkit-box-shadow: 0 2px 0 #0662a6, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #0662a6, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-plain {

  -webkit-box-shadow: 0 7px 0 #e6e6e6, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #e6e6e6, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-plain:hover, .button-3d.button-plain:focus {

    -webkit-box-shadow: 0 7px 0 #e0e0e0, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #e0e0e0, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-plain:active, .button-3d.button-plain.active, .button-3d.button-plain.is-active {

    -webkit-box-shadow: 0 2px 0 #cccccc, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #cccccc, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-inverse {

  -webkit-box-shadow: 0 7px 0 #090909, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #090909, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-inverse:hover, .button-3d.button-inverse:focus {

    -webkit-box-shadow: 0 7px 0 #030303, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #030303, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-inverse:active, .button-3d.button-inverse.active, .button-3d.button-inverse.is-active {

    -webkit-box-shadow: 0 2px 0 black, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 black, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-action {

  -webkit-box-shadow: 0 7px 0 #8bc220, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #8bc220, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-action:hover, .button-3d.button-action:focus {

    -webkit-box-shadow: 0 7px 0 #84b91f, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #84b91f, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-action:active, .button-3d.button-action.active, .button-3d.button-action.is-active {

    -webkit-box-shadow: 0 2px 0 #6b9619, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #6b9619, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-highlight {

  -webkit-box-shadow: 0 7px 0 #e59501, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #e59501, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-highlight:hover, .button-3d.button-highlight:focus {

    -webkit-box-shadow: 0 7px 0 #db8e01, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #db8e01, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-highlight:active, .button-3d.button-highlight.active, .button-3d.button-highlight.is-active {

    -webkit-box-shadow: 0 2px 0 #b27401, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #b27401, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-caution {

  -webkit-box-shadow: 0 7px 0 #ff1022, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #ff1022, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-caution:hover, .button-3d.button-caution:focus {

    -webkit-box-shadow: 0 7px 0 #ff0618, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #ff0618, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-caution:active, .button-3d.button-caution.active, .button-3d.button-caution.is-active {

    -webkit-box-shadow: 0 2px 0 #dc0010, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #dc0010, 0 3px 3px rgba(0, 0, 0, 0.2); }

.button-3d.button-royal {

  -webkit-box-shadow: 0 7px 0 #5246e2, 0 8px 3px rgba(0, 0, 0, 0.3);

          box-shadow: 0 7px 0 #5246e2, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-royal:hover, .button-3d.button-royal:focus {

    -webkit-box-shadow: 0 7px 0 #493de1, 0 8px 3px rgba(0, 0, 0, 0.3);

            box-shadow: 0 7px 0 #493de1, 0 8px 3px rgba(0, 0, 0, 0.3); }

  .button-3d.button-royal:active, .button-3d.button-royal.active, .button-3d.button-royal.is-active {

    -webkit-box-shadow: 0 2px 0 #2f21d4, 0 3px 3px rgba(0, 0, 0, 0.2);

            box-shadow: 0 2px 0 #2f21d4, 0 3px 3px rgba(0, 0, 0, 0.2); }



/*

* Glowing Buttons

*

* A pulse like glow that appears

* rythmically around the edges of

* a button.

*/

/*

* Glow animation mixin for Compass users

*

*/

/*

* Glowing Keyframes

*

*/

@-webkit-keyframes glowing {

  from {

    -webkit-box-shadow: 0 0 0 rgba(44, 154, 219, 0.3);

            box-shadow: 0 0 0 rgba(44, 154, 219, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(44, 154, 219, 0.8);

            box-shadow: 0 0 20px rgba(44, 154, 219, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(44, 154, 219, 0.3);

            box-shadow: 0 0 0 rgba(44, 154, 219, 0.3); } }

@keyframes glowing {

  from {

    -webkit-box-shadow: 0 0 0 rgba(44, 154, 219, 0.3);

            box-shadow: 0 0 0 rgba(44, 154, 219, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(44, 154, 219, 0.8);

            box-shadow: 0 0 20px rgba(44, 154, 219, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(44, 154, 219, 0.3);

            box-shadow: 0 0 0 rgba(44, 154, 219, 0.3); } }



/*

* Glowing Keyframes for various colors

*

*/

@-webkit-keyframes glowing-primary {

  from {

    -webkit-box-shadow: 0 0 0 rgba(27, 154, 247, 0.3);

            box-shadow: 0 0 0 rgba(27, 154, 247, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(27, 154, 247, 0.8);

            box-shadow: 0 0 20px rgba(27, 154, 247, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(27, 154, 247, 0.3);

            box-shadow: 0 0 0 rgba(27, 154, 247, 0.3); } }

@keyframes glowing-primary {

  from {

    -webkit-box-shadow: 0 0 0 rgba(27, 154, 247, 0.3);

            box-shadow: 0 0 0 rgba(27, 154, 247, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(27, 154, 247, 0.8);

            box-shadow: 0 0 20px rgba(27, 154, 247, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(27, 154, 247, 0.3);

            box-shadow: 0 0 0 rgba(27, 154, 247, 0.3); } }



@-webkit-keyframes glowing-plain {

  from {

    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0.3);

            box-shadow: 0 0 0 rgba(255, 255, 255, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(255, 255, 255, 0.8);

            box-shadow: 0 0 20px rgba(255, 255, 255, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0.3);

            box-shadow: 0 0 0 rgba(255, 255, 255, 0.3); } }



@keyframes glowing-plain {

  from {

    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0.3);

            box-shadow: 0 0 0 rgba(255, 255, 255, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(255, 255, 255, 0.8);

            box-shadow: 0 0 20px rgba(255, 255, 255, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(255, 255, 255, 0.3);

            box-shadow: 0 0 0 rgba(255, 255, 255, 0.3); } }



@-webkit-keyframes glowing-inverse {

  from {

    -webkit-box-shadow: 0 0 0 rgba(34, 34, 34, 0.3);

            box-shadow: 0 0 0 rgba(34, 34, 34, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(34, 34, 34, 0.8);

            box-shadow: 0 0 20px rgba(34, 34, 34, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(34, 34, 34, 0.3);

            box-shadow: 0 0 0 rgba(34, 34, 34, 0.3); } }



@keyframes glowing-inverse {

  from {

    -webkit-box-shadow: 0 0 0 rgba(34, 34, 34, 0.3);

            box-shadow: 0 0 0 rgba(34, 34, 34, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(34, 34, 34, 0.8);

            box-shadow: 0 0 20px rgba(34, 34, 34, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(34, 34, 34, 0.3);

            box-shadow: 0 0 0 rgba(34, 34, 34, 0.3); } }



@-webkit-keyframes glowing-action {

  from {

    -webkit-box-shadow: 0 0 0 rgba(165, 222, 55, 0.3);

            box-shadow: 0 0 0 rgba(165, 222, 55, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(165, 222, 55, 0.8);

            box-shadow: 0 0 20px rgba(165, 222, 55, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(165, 222, 55, 0.3);

            box-shadow: 0 0 0 rgba(165, 222, 55, 0.3); } }



@keyframes glowing-action {

  from {

    -webkit-box-shadow: 0 0 0 rgba(165, 222, 55, 0.3);

            box-shadow: 0 0 0 rgba(165, 222, 55, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(165, 222, 55, 0.8);

            box-shadow: 0 0 20px rgba(165, 222, 55, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(165, 222, 55, 0.3);

            box-shadow: 0 0 0 rgba(165, 222, 55, 0.3); } }



@-webkit-keyframes glowing-highlight {

  from {

    -webkit-box-shadow: 0 0 0 rgba(254, 174, 27, 0.3);

            box-shadow: 0 0 0 rgba(254, 174, 27, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(254, 174, 27, 0.8);

            box-shadow: 0 0 20px rgba(254, 174, 27, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(254, 174, 27, 0.3);

            box-shadow: 0 0 0 rgba(254, 174, 27, 0.3); } }



@keyframes glowing-highlight {

  from {

    -webkit-box-shadow: 0 0 0 rgba(254, 174, 27, 0.3);

            box-shadow: 0 0 0 rgba(254, 174, 27, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(254, 174, 27, 0.8);

            box-shadow: 0 0 20px rgba(254, 174, 27, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(254, 174, 27, 0.3);

            box-shadow: 0 0 0 rgba(254, 174, 27, 0.3); } }



@-webkit-keyframes glowing-caution {

  from {

    -webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);

            box-shadow: 0 0 0 rgba(255, 67, 81, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);

            box-shadow: 0 0 20px rgba(255, 67, 81, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);

            box-shadow: 0 0 0 rgba(255, 67, 81, 0.3); } }



@keyframes glowing-caution {

  from {

    -webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);

            box-shadow: 0 0 0 rgba(255, 67, 81, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(255, 67, 81, 0.8);

            box-shadow: 0 0 20px rgba(255, 67, 81, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(255, 67, 81, 0.3);

            box-shadow: 0 0 0 rgba(255, 67, 81, 0.3); } }



@-webkit-keyframes glowing-royal {

  from {

    -webkit-box-shadow: 0 0 0 rgba(123, 114, 233, 0.3);

            box-shadow: 0 0 0 rgba(123, 114, 233, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(123, 114, 233, 0.8);

            box-shadow: 0 0 20px rgba(123, 114, 233, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(123, 114, 233, 0.3);

            box-shadow: 0 0 0 rgba(123, 114, 233, 0.3); } }



@keyframes glowing-royal {

  from {

    -webkit-box-shadow: 0 0 0 rgba(123, 114, 233, 0.3);

            box-shadow: 0 0 0 rgba(123, 114, 233, 0.3); }



  50% {

    -webkit-box-shadow: 0 0 20px rgba(123, 114, 233, 0.8);

            box-shadow: 0 0 20px rgba(123, 114, 233, 0.8); }



  to {

    -webkit-box-shadow: 0 0 0 rgba(123, 114, 233, 0.3);

            box-shadow: 0 0 0 rgba(123, 114, 233, 0.3); } }



/*

* Glowing Buttons Base Styes

*

* A pulse like glow that appears

* rythmically around the edges of

* a button.

*/

.button-glow {

  -webkit-animation-duration: 3s;

          animation-duration: 3s;

  -webkit-animation-iteration-count: infinite;

          animation-iteration-count: infinite;

  -webkit-animation-name: glowing;

          animation-name: glowing; }

  .button-glow:active, .button-glow.active, .button-glow.is-active {

    -webkit-animation-name: none;

            animation-name: none; }



/*

* Glowing Button Colors

*

* Create colors for glowing buttons

*/

.button-glow.button-primary {

  -webkit-animation-name: glowing-primary;

          animation-name: glowing-primary; }

.button-glow.button-plain {

  -webkit-animation-name: glowing-plain;

          animation-name: glowing-plain; }

.button-glow.button-inverse {

  -webkit-animation-name: glowing-inverse;

          animation-name: glowing-inverse; }

.button-glow.button-action {

  -webkit-animation-name: glowing-action;

          animation-name: glowing-action; }

.button-glow.button-highlight {

  -webkit-animation-name: glowing-highlight;

          animation-name: glowing-highlight; }

.button-glow.button-caution {

  -webkit-animation-name: glowing-caution;

          animation-name: glowing-caution; }

.button-glow.button-royal {

  -webkit-animation-name: glowing-royal;

          animation-name: glowing-royal; }



/*

* Dropdown menu buttons

*

* A dropdown menu appears

* when a button is pressed

*/

/*

* Dropdown Container

*

*/

.button-dropdown {

  position: relative;

  overflow: visible;

  display: inline-block; }



/*

* Dropdown List Style

*

*/

.button-dropdown-list {

  display: none;

  position: absolute;

  padding: 0;

  margin: 0;

  top: 0;

  left: 0;

  z-index: 1000;

  min-width: 100%;

  list-style-type: none;

  background: rgba(255, 255, 255, 0.95);

  border-style: solid;

  border-width: 1px;

  border-color: #d4d4d4;

  font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;

  -webkit-box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);

          box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);

  border-radius: 3px;

  -webkit-box-sizing: border-box;

     -moz-box-sizing: border-box;

          box-sizing: border-box;

  /*

  * Dropdown Below

  *

  */

  /*

  * Dropdown Above

  *

  */ }

  .button-dropdown-list.is-below {

    top: 100%;

    border-top: none;

    border-radius: 0 0 3px 3px; }

  .button-dropdown-list.is-above {

    bottom: 100%;

    top: auto;

    border-bottom: none;

    border-radius: 3px 3px 0 0;

    -webkit-box-shadow: 0 -2px 7px rgba(0, 0, 0, 0.2);

            box-shadow: 0 -2px 7px rgba(0, 0, 0, 0.2); }





/*

* Buton Groups

*

* A group of related buttons

* displayed edge to edge

*/

.button-group {

  *zoom: 1;

  position: relative;

  display: inline-block; }

  .button-group:after, .button-group:before {

    content: '.';

    clear: both;

    display: block;

    overflow: hidden;

    visibility: hidden;

    font-size: 0;

    line-height: 0;

    width: 0;

    height: 0; }

  .button-group .button,

  .button-group .button-dropdown {

    float: left; }

    .button-group .button:not(:first-child):not(:last-child),

    .button-group .button-dropdown:not(:first-child):not(:last-child) {

      border-radius: 0;

      border-right: none; }

    .button-group .button:first-child,

    .button-group .button-dropdown:first-child {

      border-top-right-radius: 0;

      border-bottom-right-radius: 0;

      border-right: none; }

    .button-group .button:last-child,

    .button-group .button-dropdown:last-child {

      border-top-left-radius: 0;

      border-bottom-left-radius: 0; }



/*

* Button Wrapper

*

* A wrap around effect to highlight

* the shape of the button and offer

* a subtle visual effect.

*/

.button-wrap {

  border: 1px solid #e3e3e3;

  display: inline-block;

  padding: 9px;

  background: -webkit-gradient(linear, left top, left bottom, from(#f2f2f2), to(white));

  background: linear-gradient(#f2f2f2, white);

  border-radius: 200px;

  -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.04);

          box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.04); }



/*

* Button Sizes

*

* This file creates the various button sizes

* (ex. .button-large, .button-small, etc.)

*/

.button-giant {

  font-size: 10px;

  height: 70px;

  line-height: 12px;

  padding: 5 5px;

  }



.button-jumbo {

  font-size: 24px;

  height: 60px;

  width:60px;

  line-height: 60px;

  padding: 0 60px; }



.button-large {

  font-size: 10px;

  height: 50px;

  line-height: 50px;

  padding: 0 10px; }



.button-normal {

  font-size: 16px;

  height: 40px;

  width:40px;

  line-height: 12px;

  padding: 5 5px;

  padding: 0 40px; }



.button-small {

  font-size: 10px;

  height: 30px;

  width:30px;

  line-height: 30px;

  padding: 5 5px;

  padding: 0 30px; 

  margin-left:30px;

  

  color:#FFF;}



.button-tiny {

  font-size: 9.6px;

  height: 24px;

  line-height: 24px;

  padding: 0 24px; }