html, body {
	min-height:100% !important;
	max-height:100% !important;
	height:100% !important;
	overflow:hidden;
	font-size:15px;
} @media (max-width: 768px) {
	html, body {
		overflow:auto;
		font-size:15px;
	}
}

.default_font {
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:1.0rem;
	overflow:hidden;
}

#password_forgotten {
	color:white;
	font-size:0.75rem;
	margin:5px 15px;
} @media (max-width: 768px) {
	#password_forgotten {
		font-size:0.95rem !important;
	}
}

@media (max-width: 768px) {
	.recaptcha_box {
		padding:20px 0px;
	}
    .g-recaptcha {
        transform:scale(1.10);
    }
}

/* ------------------------------------------------------------------------------------------------------------------------ */

.form-row {
  background:transparent;
  margin-bottom:10px;
}

.form-row label {
  color:white;
  font-weight: 300;
  height: 40px;
  line-height: 40px;
} .form-row label > span {
  width: 120px;
  text-align: right;
  margin-right: 30px;
} @media (max-width: 768px) {
	.form-row label {
		font-size:1.4rem;
		height:auto;
		line-height:2.0rem;
		display:block;
		margin-left:0px;
	}
	.form-row label span {
		display:inline-block;
		text-align:center !important;
		width:300px !important;
		margin-right:0px;
	}
}

.StripeElement {
  background-color: white;
  padding: 10px 12px;
  border-radius: 4px;
  border: 1px solid transparent;
  box-shadow: 0 1px 3px 0 #e6ebf1;
  -webkit-transition: box-shadow 150ms ease;
  transition: box-shadow 150ms ease;
}

.StripeElement--focus {
  box-shadow: 0 1px 3px 0 #cfd7df;
}

.StripeElement--invalid {
  border-color: #fa755a;
}

.StripeElement--webkit-autofill {
  background-color: #fefde5 !important;
}

/* ------------------------------------------------------------------------------------------------------------------------ */

@media (max-width: 768px) {
	input[type=checkbox] {
		transform: scale(2.5);
		margin:0px 5px;
	}
}

/* ------------------------------------------------------------------------------------------------------------------------ */

.red_button {
	background-color:rgb(166,42,52);
	border:1px solid transparent;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	font-family:'Hind', Calibri, Verdana, sans-serif !important;
	font-size:1.0rem !important;
	font-weight:bold;
	padding:5px 35px;
	border-radius:25px;
	text-decoration:none;
	line-height:25px;
} @media (max-width: 768px) {
	.red_button {
		padding: 10px 35px;
		margin: 10px 0px;
	}
}

.red_button:hover {
	background-color:rgba(166,42,52,0.9);
}

.red_button:active {
	position:relative;
	top:1px;
}

 button.no_style_button {
	font-family:'Hind', Calibri, Verdana, sans-serif;
	position:relative;
	padding:2px;
	margin:0px;
	border:transparent;
	background-color:transparent;
	cursor:pointer;
} .no_style_button:hover {
	background-color:transparent !important;
} .no_style_button:focus {
	border:none;
	border-radius:0px;
	background:none;
} .no_style_button:active {
	padding:3px;
} .no_style_button:focus {
	outline:0;
}

/* ------------------------------------------------------------------------------------------------------------------------ */

#client_window {
    background-image: url("../images/connexion_microdesk_background.jpg") !important;
    background-position: center top;
    background-size: 100% auto;
}

#authentification_output_box {
	width:500px;
}

#authentification_output_box, #buy_access_output_box, #trial_end_output_box {
	padding:0px;
	background:rgb(136,160,215);
	background:linear-gradient(90deg, rgba(136,160,215,1) 0%, rgba(31,70,156,1) 80%);
	height:auto;
	border:none;
    -webkit-box-shadow: 0 8px 6px -6px rgba(200,200,200,0.5);
       -moz-box-shadow: 0 8px 6px -6px rgba(200,200,200,0.5);
            box-shadow: 0 8px 6px -6px rgba(200,200,200,0.5);
	z-index:5000;
} @media (max-width: 768px) {
	#authentification_output_box, #buy_access_output_box, #trial_end_output_box {
		width:auto;
		box-shadow:none !important;
		border-radius:0px !important;
	}
}

#trial_end_output_box {
	width:500px;
	padding:0px !important;
} @media (max-width: 768px) {
	#trial_end_output_box {
		width:100%;
		font-size:1.3rem;
	}
}

#trial_end_output_text {
	padding:20px 35px;
	color:white;
}

#buy_access_output_box {
	width:950px;
} @media (max-width: 768px) {
	#buy_access_output_box {
		width:100%;
	}
}

#product_microdesk_functions_list_box {
	display:inline-block;
	vertical-align:top;
	padding:20px 40px;
	color:white;
} #product_microdesk_message_buy_box {
	border-radius:0px !important;
	position:absolute;
	top:70px;
	left:calc(50% - 300px);
	padding:20px;
} @media (max-width: 768px) {
	#product_microdesk_message_buy_box {
		position:static !important;
		font-size:1.2rem;
		line-height:1.2rem;
		border:none;
		border-top:5px solid black;
		margin:8px;
		margin-top:25px;
		padding:0px;
	}
}

.product_price_text {
	color:white;
	font-size:1.3rem;
} @media (max-width: 768px) {
	.product_price_text {
		font-size:2.0rem;
	}
}

#inscription_output_box {
	padding:0px;
	background:rgb(136,160,215);
	background:linear-gradient(90deg, rgba(136,160,215,1) 0%, rgba(31,70,156,1) 80%);
	max-width:100%;
	min-height:100%;
}

#inscription_output_form_inscription {
	display:inline-block;
	text-align:justify;
	padding:40px;
	vertical-align:middle;
	width:345px;
} @media (max-width: 768px) {
	#inscription_output_form_inscription {
		min-width:auto;
		padding:0px;
	}
}

.control {
    font-family: arial;
    display: block;
    position: relative;
    padding-left: 40px;
    margin-bottom: 10px;
    padding-top: 2px;
    cursor: pointer;
    font-size: 14px;
}
    .control input {
        position: absolute;
        z-index: -1;
        opacity: 0;
    }
.control_indicator {
    position: absolute;
    top: 0px;
    left: 0;
    height: 20px;
    width: 20px;
    background: transparent;
    border: 2px solid #ffffff;
    border-radius: 0px;
}
.control:hover input ~ .control_indicator,
.control input:focus ~ .control_indicator {
    background:rgba(255,255,255,0.2);
}

.control input:checked ~ .control_indicator {
    background: transparent;
}
.control:hover input:not([disabled]):checked ~ .control_indicator,
.control input:checked:focus ~ .control_indicator {
    background: #0e6647d;
}
.control input:disabled ~ .control_indicator {
    background: #e6e6e6;
    opacity: 0.6;
    pointer-events: none;
}
.control_indicator:after {
    box-sizing: unset;
    content: '';
    position: absolute;
    display: none;
}
.control input:checked ~ .control_indicator:after {
    display: block;
}
.control-checkbox .control_indicator:after {
	left: 6px;
    top: 0px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 3px 3px 0;
    transform: rotate(45deg);
}
.control-checkbox input:disabled ~ .control_indicator:after {
    border-color: #7b7b7b;
}
.control-checkbox .control_indicator::before {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 4.5rem;
    height: 4.5rem;
    margin-left: -1.3rem;
    margin-top: -1.3rem;
    background: #2aa1c0;
    border-radius: 3rem;
    opacity: 0.6;
    z-index: 99999;
    transform: scale(0);
}
@keyframes s-ripple {
    0% {
        transform: scale(0);
    }
    20% {
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(1);
    }
}
@keyframes s-ripple-dup {
   0% {
       transform: scale(0);
    }
   30% {
        transform: scale(1);
    }
    60% {
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(1);
    }
}
.control-checkbox input + .control_indicator::before {
    animation: s-ripple 250ms ease-out;
}
.control-checkbox input:checked + .control_indicator::before {
    animation-name: s-ripple-dup;
}

.inscription_checkboxes {
	color:white;
	text-align:left;
	padding:10px 10px;
} @media (max-width: 768px) {
	.inscription_checkboxes {
		padding:5px 20px;
		line-height:1.5rem;
	}
} .inscription_checkboxes_link {
	color:white !important;
	font-style:italic;
}

.product_image {
	width:300px;
} @media (max-width: 768px) {
	.product_image {
		width:300px;
	}
}

#password_forgotten_box {
	position:absolute;
	z-index:999999 !important;
	box-shadow:1px 1px 12px #555;
	margin:30px;
	background:rgb(136,160,215);
	background:linear-gradient(90deg, rgba(136,160,215,1) 0%, rgba(31,70,156,1) 80%);
} @media (max-width: 768px) {
	#password_forgotten_box {
		position:static !important;
		box-shadow:none !important;
	}
}

/* ------------------------------------------------------------------------------------------------------------------------ */

#no_script_window, #unsupported_browser_window {
	z-index:20000;
	box-shadow:1px 1px 12px #555;
	background-color:white;
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:15px;
	width:100%;
	height:100%;
	position:absolute;
	left:0; right:0;
	top:0; bottom:0;
	margin:auto;
	max-width:100%;
	max-height:100%;
	overflow:auto;
	overflow-y:hidden;
} #no_script_div, #unsupported_browser_div {
	z-index:25000;
	box-shadow:1px 1px 12px #555;
	background-color:#e0edf5;
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:15px;
	border:3px solid black;
	width:400px;
	height:75px;
	position:absolute;
	left:0; right:0;
	top:0; bottom:0;
	margin:auto;
	padding:10px;
	max-width:100%;
	max-height:100%;
	overflow:auto;
	overflow-y:hidden;
} #unsupported_browser_div {
	width:750px;
	height:180px;
} .supported_browser_list {
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:12px;
	color:rgb(0,90,49);
	font-weight:bold;
}

/* ------------------------------------------------------------------------------------------------------------------------ */

#trial_button_window {
	position:absolute;
	z-index:5000;
	width:200px;
	height:100px;
	padding:15px 15px 0px 115px;
	display:none;
}

#loading_window, #client_window {
	z-index:10000;
	background-color:rgb(244,245,248) !important;
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:15px;
	width:100%;
	height:100%;
	position:absolute;
	left:0; right:0;
	top:0; bottom:0;
	margin:auto;
	max-width:100%;
	max-height:100%;
	overflow-x:hidden !important;
	overflow-y:auto !important;
} @media (max-width: 768px) {
	#loading_window, #client_window {
		position: static !important;
		margin:0px !important;
		width:100%;
		font-size:22pt !important;
	}
	
	#client_window > table {
		width:100%;
	}
}

#client_window {
	z-index:9999 !important;
}

#loader {
	position:absolute;
	left:0; right:0;
	top:0; bottom:0;
	z-index: 15000;
	margin:auto;
	border-radius: 50%;
	border-top: 5px solid rgb(25,102,146);
	border-bottom: 5px solid rgb(25,102,146);
	border-left: 5px solid gray;
	border-right: 5px solid gray;
	width:45px;
	height:45px;
	-webkit-animation: spin 2s linear infinite;
	animation: spin 2s linear infinite;
} @media (max-width: 768px) {
	#loader {
		width:125px;
		height:125px;
		border-top: 20px solid rgb(25,102,146);
		border-bottom: 20px solid rgb(25,102,146);
		border-left: 20px solid gray;
		border-right: 20px solid gray;
	}
}

@-webkit-keyframes spin {
	0% { -webkit-transform: rotate(0deg); }
	100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

/* ------------------------------------------------------------------------------------------------------------------------ */

.main_box_header {
	color:white;
	border-bottom:1px solid white;
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:20pt;
	padding:10px 7px;
	border-radius:0px !important;
	text-align:center;
	font-size:1.30rem;
	font-weight:normal;
	min-width:400px;
} @media (max-width: 768px) {
	.main_box_header {
		border-radius:0px !important;
		min-width:100%;
	}
}

.error_box {
	line-height:15px;
	min-height:15px;
	color: white;
	padding:5px;
	font-family:'Hind', Calibri, Verdana, sans-serif;
	font-size:0.8rem;
	margin-bottom:10px;
} @media (max-width: 768px) {
	.error_box {
		line-height:20px;
		min-height:40px;
		font-size:1.1rem;
	}
}

.buttons_box {
	display:inline-block;
	padding-top:10px;
	padding-bottom:10px;
	min-height:45px;
}

.authentification_form_element, .buy_form_element {
	text-align:center;
	border:none !important;
	border-radius:10px !important;
	width:255px !important;
	font-size:0.8rem !important;
	padding:12px 30px !important;
	margin:2px;
} @media (max-width: 768px) {
	.authentification_form_element, .buy_form_element {
		width:280px !important;
		margin:4px;
	}
}

.buy_form_element_select {
	width:297px !important;
	font-size:13px !important;
	height:30px !important;
	padding: 4px !important;
}						

.inscription_form_element {
	border:none !important;
	border-radius:25px !important;
	width:255px !important;
	font-size:0.9rem !important;
	height:20px !important;
	padding:15px 30px !important;
	margin:2px;
} @media (max-width: 768px) {
	.inscription_form_element {
		width:270px !important;
		margin:4px;
	}
}

.subscription_form_element {
	border:none !important;
	border-radius:10px !important;
	width:86% !important;
	font-size:0.9rem !important;
	padding:12px 30px !important;
	margin:2px;
} @media (max-width: 768px) {
	.subscription_form_element {
		width:230px !important;
		margin:4px;
	}
}

#card-errors {
	display:inline-block;
	padding:7px;
} @media (max-width: 768px) {
	#card-errors {
		font-size:1.2rem;
	}
}