@media (max-width: 768px) { 
	.presentation_container{
		display: none;
	}
	.presentation{
		display:none;
	}
	.formConnection{
    	position: relative;
		margin: auto;
    	margin-top: 4vh;
	}
	body{
		background-size: cover;
	}
	.links-one{
		display: flex;
	}
	.links-two{
		padding-left: 4%;
		display: none;
	}
	.footer-banner-one{
    	justify-content: center;
	}
	.footer-banner-two{
    	justify-content: center;
	}
}

@media (min-width: 768px) { 
	.formConnection{
		float:right;
		margin-top:30px;
	}
	.presentation_container{
		display: flex;
	}
	.presentation{
		display:flex;
	}
	
	body{
		background-size: 100% 100%;
	}
	.links{
		position: absolute;
        right: 0;
        padding-right: 40px;
	}
	.links-one{
		display: none;
	}
	.links-two{
		display: flex;
	}
}

@media (max-width: 990px) { 
	.text_1{
		font-size:20px;
	}
	.imgHome{
		width:75px;
		border:3px solid #1e1e1e;
	}
	.item_title{
		font-size:9px;
		min-height:27px;
	}
	.item_title2{
		display:none;
	}
	.item_img{
		margin-top:10px;
	}
	.items{
		margin-top: 35px;
	}
}

@media (min-width: 991px) { 
	.text_1{
		font-size:35px;
	}
	.imgHome{
		width:125px;
		border:thick double #1e1e1e;
	}
	.item_title{
		font-size:13px;
	}
	.item_img{
		margin-top:30px;
	}
	.items{
		margin-top: 55px;
	}
}

@media (min-width: 1200px) { 
	.text_1{
		font-size:40px;
	}
}

html {
	height:100%;
}

body{
	height:100%;
	font-family:"Roboto", sans-serif;
	background-image:url("/tiraubuzzer/images/welcome_back.png");
	
}

main{
	margin-left:auto;
	margin-right:auto;
	min-width:350px;
	height:100%;
}

.presentation{
    align-items: center;
    flex-direction: column;
    justify-content: center;
}

.presentation_container{
    position: relative;
    padding: 20px;
    background-color: #ffffffb5;
    border-radius: 10px;
	border: 1px solid #e5e5e5;
    margin-top: 10vh;
    height: 490px;
}

.div_text_1{
	line-height:30px;
}

.text_1{
	font-weight:bold;
	vertical-align:middle;
	color:black;
}

.text_2_container{
	text-align: left;
    width: 100%;
}

.text_2{
	font-size:15px;
	font-weight:bold;
	color:#4e4e4e;
}

.imglogoText{
	width:38%;
	padding-top:15px;
	padding-bottom:15px;
}

.separator_container{
	text-align: left;
    width: 100%;
}
.separator{
	border-bottom:1px solid #b0b0b0;
	padding-bottom:2px;
	width:90%;
	margin-bottom:5px;
}

.formConnection{
	margin-top: 10vh;
	background-color: white;
	border: 1px solid #e5e5e5;
 	border-radius:10px;
 	padding-bottom:10px;
 	padding-left:20px;
 	padding-right:20px;
 	max-width:300px;
    height: 490px;
}

.logo{
	width:100%;
	border-bottom:1px solid #c4c4c4;
}

.title{
	padding-top:20px;
 	padding-bottom:55px;
 	font-size:30px;
 	font-weight:bold;
}

.textbox{
	border:none;
	background:transparent;
	border-bottom:1px solid #e80000;
	margin-bottom:12px;
	outline:none;
	padding:10px;
	font-size:15px;
	width:100%;
}

.buttonConnection{
    border: none;
	text-align:center;
	padding-bottom:5px;
	height:50px;
	border-radius:3px;
	width:100%;
	background-color:#12418B;
	color:white;
	font-size:15px;
	font-weight:bold;
	cursor:pointer;
	outline:none;
}

.buttonConnection:hover{
	background-color:#0c2d5f;
	border-color:#0c2d5f;
}


.subscribe_div{
	padding-top:7px;
	font-size:12px;
}

.subscribe{
	text-decoration: none;
	color:#ff8000;
	font-size:12px;
	font-weight:bold;
}

.password_forgotten_div{
	font-size:10px;
	text-align:right;
	padding-top:40px;	
}

.password_forgotten{
	text-decoration: none;
	color:#666666;
}

.remember{
	font-size:12px;
	text-align:right;
	color: #4e4e4e;
	cursor:default;
	margin-bottom:5px;
	
}

.cbRemember{
	vertical-align:middle;
	cursor:pointer;
}

.spanRemember{
	vertical-align:middle;
	padding-left:5px;
}

.rules_div{
	float:left;
	font-size:10px;
	text-align:right;
	padding-top:40px;	
}

.rules{
	text-decoration: none;
	color:#666666;
}

.error{
	text-align:center;
	color:#ff3333;
	font-weight:bold;
	height:20px;
	font-size:11px;
}

/*--------------------------------------------
------------------- ITEMS --------------------
--------------------------------------------*/

.item_title{
	font-weight:900;
	font-style:italic;
	color:#12418B;
}

.item_title2{
	font-size:11px;
	color:grey;
	min-height:50px;
}



.imgHome{
	border-radius:50%;
}

/*--------------------------------------------
--------------- BUTTON STYLAX ----------------
--------------------------------------------*/

.btn {
  letter-spacing: 0.1em;
  cursor: pointer;
  font-size: 14px;
  line-height: 46px;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  width: 100%;
  font-weight:bold;
  padding-top:0px;
  padding-bottom:0px;
}
.btn:hover {
  text-decoration: none;
}

/*btn_background*/
.effect01 {
  color: #FFF;
  border: 4px solid #12418B;
  box-shadow:0px 0px 0px 1px #12418B inset;
  background-color: #12418B;
  overflow: hidden;
  position: relative;
  transition: all 0.3s ease-in-out;
}
.effect01:hover {
  border: 4px solid #12418B;
  background-color: #FFF;
  box-shadow:0px 0px 0px 4px #EEE inset;
}

/*btn_text*/
.effect01 span {
  transition: all 0.2s ease-out;
  z-index: 2;
}
.effect01:hover span{
  letter-spacing: 0.13em;
  color: #12418B;
}

/*highlight*/
.effect01:after {
  background: #FFF;
  border: 0px solid #12418B;
  content: "";
  height: 155px;
  left: -75px;
  opacity: .8;
  position: absolute;
  top: -50px;
  -webkit-transform: rotate(35deg);
          transform: rotate(35deg);
  width: 50px;
  transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);/*easeOutCirc*/
  z-index: 1;
}
.effect01:hover:after {
  background: #FFF;
  border: 20px solid #12418B;
  opacity: 0;
  left: 120%;
  -webkit-transform: rotate(40deg);
          transform: rotate(40deg);
}

/*--------------------------------------------
--------------- ERROR MESSAGE ----------------
--------------------------------------------*/

#hideMe {
	animation: cssAnimation 0s 5s forwards;
  visibility: visible;
}
@keyframes cssAnimation {
  to   { visibility: hidden; }
}

/*--------------------------------------------
--------------- FOOTER-BANNER ----------------
--------------------------------------------*/
.footer-banner {
	cursor: default;
	position: fixed;
	bottom: 0;
	width: 100%;
	color: white;
	height:80px;
	display: flex;
	align-items: center;
}

.footer-banner-one {
	position: fixed;    
	white-space: nowrap;
	bottom: 0;
	width: 100%;
	color: #423838;
	font-size: 12px;
	height:30px;
	align-items: center;
	margin-bottom: 50px;
	display: flex;
}

.footer-banner-two {
	position: fixed;
	display: flex;
	bottom: 0;
	width: 100%;
	color: #423838;
	font-size: 12px;
	height:50px;
	align-items: center;
}

.copyright_container{
	display: flex;
	padding-right: 20px;
}

.copyright{
	padding-left: 40px;
	padding-right: 6px;
}

.links{
    align-items: center;
}

.links-one{
	padding-left: 6px;
}

.legalnotices_container{
	display: flex;
    align-items: center;
}

.contact, .cgu, .privacypolicy, .legalnotices{
	line-height:30px;
	cursor: pointer;
	text-decoration: none;
	color: #423838;
}

.legalnotices{
	padding-left: 3px;
}

.contact:hover, .cgu:hover, .privacypolicy:hover, .legalnotices:hover{
	text-decoration: underline;
	color: orange;
}

.bullet{
	padding:0px 2px 0px 8px;
}