/*
Main site custom CSS goes here 
*/


/*
The CSS below will convert the locales buttons in the navbar from words (EN) to a relevant flag icon. Example definitions included below.
*/
/*
.localetext.disabled, .localetext.disabled:hover, .localetext.disabled:focus, .localetext.disabled:active, .localetext.disabled.active, .localetext[disabled], 
.localetext[disabled]:hover, .localetext[disabled]:focus, .localetext[disabled]:active, .localetext.active[disabled],
.localetext.active, .localetext:active,
.localetext:focus, .localetext:hover {
    color:transparent!important;
}

.localetext {
    color:transparent!important;
    background-repeat: no-repeat; 
    background-position: center;     
}

#locale-fr { background-image: url('images/fr.png'); }
#locale-en { background-image: url('images/en.png'); }
#locale-de { background-image: url('images/de.png'); }
#locale-it { background-image: url('images/it.png'); }
#locale-es { background-image: url('images/es.png'); }
#locale-pt { background-image: url('images/pt.png'); }
*/


/*
The CSS below allows changes to be made to the login screen, essentially the top section of the page can be tweaked. Example definitions included below.
*/

/* -- Ubuntu = fonte de Mucho -- 
@import url("https://fonts.googleapis.com/css?family=Ubuntu:300,400,400i,500,700");*/

/* -- Montserrat = fonte de Mucho --
@import url("https://fonts.googleapis.com/css?family=Montserrat:300,300i,400,400i,500,500i,600,600i"); */


@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-Light.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-LightItalic.ttf') format('truetype');
    font-style: italic;
}
@font-face {
    font-family: 'Montserrat';
    src: url('fonts/Montserrat-Medium.ttf') format('truetype');
    font-weight: bold;
}

/* -- LOGIN PAGE -- */
#loginheaderleft {
    background-image: url('https://muchomobile.ch/images/logo_mucho_120.png');
    background-repeat: no-repeat; 
    background-position: left; 
    height: 120px;
}
#loginheadermiddle::before {
	content: "";
    font-size: xx-large;
	font-weight: 300;
	text-align: left;
}
#loginheaderright {
    display:none;
}

#errorheaderleft {
    background-image: url('https://muchomobile.ch/images/logo_mucho_120.png');
    background-repeat: no-repeat;  
    background-position: left; 
    height: 120px;
    margin-top: 8px;
}
#errorheaderright {
    display:none;
}

.loginColumns .ibox-content {
	background-color: #fff;
	color: #666;
	border: 2px solid #e10020;
	border-radius: 5px;
}
.loginColumns .btn-white {
    border: 1px solid #fff;
}
.loginColumns .btn-white:hover {
    color: #e10020;
}
.loginColumns .ibox-content account a  {
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}


/* -- GLOBAL CSS -- */

.navbar-fixed-top, .navbar-static-top {
    background: #fff;
}

.bundle-2gbdataaddon {
    background-color: #1c84c6;
}
.sidebarlogo {
	background-image: url('https://muchomobile.ch/images/logo_mucho_120.png');
	background-repeat: no-repeat;
	height: 120px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	width: 94px;
	margin-bottom: 10px;
}
.mini-navbar li.nav-header .sidebarlogo {
    background-image: url('https://muchomobile.ch/images/logo_mucho_30.png');
    background-repeat: no-repeat;
	background-size: cover;
    height: 40px;
	width: 30px;
}

.sidebaraccountnumber {
    /*!important needed as this is used in style: .block, body.mini-navbar.fixed-sidebar .profile-element */
    display: block!important;
}


.customGreetingIcon:before {
    /* content can be any font awesome icon you wish */
    content: "\f087";
    display:none;
}


/*
Misc style changes here
*/

.directionicons
{
    display: block;
}

.directiontext
{
    display: none;
}

/* 
Promotion CSS goes after here 
*/

.outerDiv 
{ 
	position: relative; 
	float: right; 
	right: 50%; 
}
.innerDiv 
{ 
	position: relative; 
	float: right; 
	right: -50%; 
}
.floatingDiv 
{
	float: left; 
	margin: 0 1.5em;
	width:auto; 
}
.clearFloat
{
	clear: both;
}
.clearfix:before,
.clearfix:after 
{ 
	content: " "; 
	display: table; 
}
.clearfix:after 
{ 
	
}
.clearfix 
{ 
	*zoom: 1; 
}
.promotionBold
{
	font-weight:bold;
}

.btnMore
{
	background-color: #95c11e;
    border-color: #95c11e;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;	
	border-radius: 3px;
}

.btnMore a
{
    color: #FFFFFF;
}

.btnPadding
{
	margin-top: 25%;
}

@media (max-width: 700px) 
{
	.outerDiv 
	{ 
		right: 45%; 
	}

	.btnMore
	{
	    width: 170px;
	}
	
	.bulleImg
	{
		display:none;
	}
	
	.btnPadding
	{
		margin-top:0;
	}
}

/* --- FOCUS BUTTON ACTIVATE UK90804 --- */

button:focus, button:active, button.focus, button.active {
/*background: #1c84c6 !important;*/
background: #23c6c8 !important;
border: 1px solid #d2d2d2 !important;
} 



/* --- CONCEPTO CHANGES --- */


body {
	font-family: 'Montserrat', "Trebuchet MS", Arial, sans-serif;
	background-color: #FFF;
	/*background-image: url('https://muchomobile.ch/images/bgd-08.jpg');*/
    background-repeat: no-repeat;
	background-attachment: fixed;
	background-position: center bottom;
	
}
.gray-bg {
	background: none;
}

.navbar-default {
	background-color: #FFF;
	border-right-width: 1px;
	border-bottom-width: 1px;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: none;
	border-right-color: #e7eaec;
	border-bottom-color: #e7eaec;
}
.nav-header {
	background-color: #FFF;
	color: #666;
}
.nav-header span {
	color: #666;
}

.navbar-default .nav li a {
    color: #666;
	text-decoration: none;
}
.navbar-default .nav li a:hover {
	background-color: #eee;
	color: #3f3f3f;
	/*text-decoration: underline !important;*/
}
.navbar-default .nav li a:focus {
    background-color: #eee;
    color: #e10020;
}
.navbar-default .nav li.active {
	background-color: #fff;
	border: none;
}
.navbar-default .nav li.active a {
	color: #e10020;
}
.navbar-default .nav li.active a:hover {
	background-color: #fff;
}

.mini-navbar .navbar-default .nav-second-level {
	background-color: #ddd;
	padding: 5px;
}


.lazur-bg {
    background-color: #eaf3d2;
	color: #333;
	border: none;
}
.ibox {
    background-color: #FFFFFF;
	/*color: #000;*/
	border: 1px solid #e10020;
	border-radius: 5px;
}
.ibox-content {
    background-color: #FFFFFF;
	/*color: #000;*/
	border-color: #e10020;
	border-bottom-left-radius: 5px;
	border-bottom-right-radius: 5px;
}
.ibox-title {
	background-color: #e10020;
	color: #fff;
	border: none;
	padding-top: 8px;
	padding-bottom: 4px;	
	/*border-top-left-radius: 5px;
	border-top-right-radius: 5px;*/
}
.p-sm {
	background-color: #fff;
	color: #e10020;
	border-radius: 5px;
	font-size: 15px;
}
.p-sm .radio-inline, .p-sm .checkbox-inline {
	margin-top: 6px;	
}


.ibox .ibox {
	border: none;
}

.btn-primary, .btn-primary:focus, .btn-primary:hover, .open .dropdown-toggle.btn-primary, 
.btnMore, .btnMore:focus, .btnMore:hover, .open .dropdown-toggle.btnMore, .lazur-bg .btn-white {
    background-color: #95c11e; /*18a689*/
    border-color: #95c11e;
    color: #fff;
}

.lazur-bg .btn-white:hover {
    background-color: #95c11e; /*18a689*/
    border-color: #95c11e;
    color: #fff;
	/*position: relative;
    top: -1px;*/
	box-shadow: 0px 2px 1px #597412;
}

.btn-primary:hover, .btnMore:hover {
    text-decoration: none;
    text-shadow: 0px 1px 1px #3f3f3f;
    position: relative;
    top: -1px;
	box-shadow: 0px 2px 1px #597412;
}
.btn-primary:active, .btnMore:active {
    text-decoration: none;
    text-shadow: 0px 0px 5px #fff;
	background-color: #95c11e;
	position: relative;
    top: 0px;
	box-shadow: none;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open .dropdown-toggle.btn-primary,
.btn-primary:active:hover,
.btn-primary:active:focus,
.btn-primary.active:hover,
.btn-primary.active:focus {
  background-color: #95c11e;
  border-color: #95c11e;
  color: #FFFFFF;
}
.btn-primary.active[disabled], 
.btn-primary.disabled, 
.btn-primary.disabled.active, 
.btn-primary.disabled:active, 
.btn-primary.disabled:focus, 
.btn-primary.disabled:hover, 
.btn-primary[disabled], 
.btn-primary[disabled]:active, 
.btn-primary[disabled]:focus, 
.btn-primary[disabled]:hover, 
fieldset[disabled] .btn-primary, 
fieldset[disabled] .btn-primary.active, 
fieldset[disabled] .btn-primary:active, 
fieldset[disabled] .btn-primary:focus, 
fieldset[disabled] .btn-primary:hover {
    background-color: #cae08e; /*1dc5a3*/
    border-color: #cae08e;  /*1dc5a3*/
}

.lazur-bg .btn-white:hover {
	text-decoration: none;
	text-shadow: 0px 1px 1px #3f3f3f;
	color: #FFF;
}
.lazur-bg .btn-white:active {
    text-decoration: none;
    text-shadow: 0px 0px 5px #fff;
	background-color: #95c11e;
	color: #FFF;
}

.carousel-indicators li {
    border: 1px solid #f18089; /*95c11e*/
}
.carousel-indicators li:hover {
    border: 1px solid #e10020; /*95c11e*/
}
.carousel-indicators .active {
    background-color: #e10020; /*95c11e*/
}
.carousel-control .glyphicon-chevron-left, 
.carousel-control .glyphicon-chevron-right, 
.carousel-control .icon-next, 
.carousel-control .icon-prev {
    color: #f18089;  /*95c11e*/
}
.carousel-control .glyphicon-chevron-left:hover, 
.carousel-control .glyphicon-chevron-right:hover, 
.carousel-control .icon-next:hover, 
.carousel-control .icon-prev:hover {
    color: #e10020;  /*95c11e*/
}

/* alertes standard */
.alert-info {
    background-color: #eee; /*d9edf7*/
    border-color: #ccc; /*d9edf7*/
    color: #666; /*31708f*/
}
.alert-warning {
    background-color: #eee; /*fcf8e3*/
    border-color: #ccc; /*faebcc*/
    color: #666; /*8a6d3b*/
}
.alert-danger {
  background-color: #f9ccd0; /*f2dede*/
  border-color: #f18089; /*ebccd1*/
  color: #e10020; /*a94442*/
}


table tr:hover td {
	background-color: #eee;
	
}

.panel-default > .panel-heading {
    color: #333;
    background-color: #fef2f3; /*f5f5f5*/
    border-color: #f18089; /*ddd*/
	border-radius: 0px;
}
.panel-default > .panel-heading:hover {
    color: #333;
    background-color: #fbd9de; /*f5f5f5*/
    border-color: #fbd9de; /*ddd  f18089 */
}

.logo-element {
	background-color: #FFF;
}


.minimalize-styl-2, .minimalize-styl-2:hover, .minimalize-styl-2:focus, .minimalize-styl-2:active {
	background-color: #e10020;  /*cae08e*/
    border-color: #e10020;  /*cae08e*/
}



/* -- remplacement systématique de couleurs -- */

/* vert : #23c6c8 > #95c11e */  

.btn-info.btn-outline {
  color: #95c11e;
}
.btn-info {
  background-color: #95c11e;
  border-color: #95c11e;
}
.badge-info {
  background-color: #95c11e;
}
.toast-info {
  background-color: #95c11e;
}
/*.lazur-bg {
  background-color: #95c11e;
}  déjà défini  */
.panel-info {
  border-color: #95c11e;
}
.panel-info > .panel-heading {
  background-color: #95c11e;
  border-color: #95c11e;
}
.progress-bar-info {
  background-color: #95c11e;
}
.text-info {
  color: #95c11e;
}
.category-list li a .text-info {
  color: #95c11e;
}
.skin-2 .spin-icon {
  background: #95c11e !important;
}
.skin-2 .nav-header {
  background: #95c11e;
}
.skin-2 .navbar-minimalize {
  background: #95c11e;
  border-color: #95c11e;
}
.market-pref-tick {
    color: #95c11e;
}
.market-pref-cross {
    color: #e10020;
}


div.ng-valid[required],
form.ng-valid[required],
input.ng-valid[required] {
  border-left: 5px solid #95c11e;
}
div.ng-invalid,
input.ng-invalid {
  border-left: 5px solid #e10020;
}



/* -- champs input -- */

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
  color: #95c11e; /*3c763d*/
}
.has-success .form-control {
  border-color: #95c11e; /*3c763d*/
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-success .form-control:focus {
  border-color: #2b542c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #67b168;
}
.has-success .input-group-addon {
  color: #95c11e; /*3c763d*/
  border-color: #95c11e; /*3c763d*/
  background-color: #cae08e;  /*dff0d8*/
}
.has-success .form-control-feedback {
  color: #95c11e; /*3c763d*/
}

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label {
  color: #8a6d3b; /*8a6d3b*/
}
.has-warning .form-control {
  border-color: #8a6d3b;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-warning .form-control:focus {
  border-color: #66512c;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #c0a16b;
}
.has-warning .input-group-addon {
  color: #8a6d3b;
  border-color: #8a6d3b;
  background-color: #fcf8e3;
}
.has-warning .form-control-feedback {
  color: #8a6d3b;
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
  color: #e10020; /*a94442*/
}
.has-error .form-control {
  border-color: #e10020; /*a94442*/
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
.has-error .form-control:focus {
  border-color: #e10020; /*843534*/
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #e10020; /*843534*/
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px #e10020; /*843534*/
}
.has-error .input-group-addon {
  color: #e10020; /*a94442*/
  border-color: #e10020; /*a94442*/
  background-color: #f2dede; 
}
.has-error .form-control-feedback {
  color: #e10020; /*a94442*/
}


.waitloading {
	font-size:20px;
	color:#fff;
	margin:10px;
	justify-content:center
}
.sk-spinner-double-bounce .sk-double-bounce1, .sk-spinner-double-bounce .sk-double-bounce2 {
	background-color: #e10020;	/*95c11f*/
}





/* --- Pour désactiver la partie "Manage your Friends&Family numbers" --- */
friendsfamily {
	display: none;  
}





/* -- Styles popup "your SIM is active" -- */


.modal-dialog .modal-content .modal-body {
	padding-top: 40px;
	padding-bottom: 40px;
}
.modal-dialog .modal-content .modal-header h4.modal-title {
	font-size: 22px;
}

#regSuccessMsisdnMessageIntro {
	font-size: 18px;
	font-weight: bold;
}
#regSuccessMsisdnMessage {
	margin-bottom: 50px;
}
#printMessage {
	
}
#regSuccessPrintButton {
	font-size: 22px;
	font-weight: bold;
	padding: 15px;
}
#regSuccessDoNotPrintButton {
	display: none;	
}

.modal-dialog .modal-content .modal-footer button.btn-white:disabled {
	display: none;
}

#succesRegisterAnother {
	display: inline;
}
#succesRegisterComplete {
	/*font-size: 22px;*/
	font-weight: bold;

}