/* Small devices (landscape phones, 576px and up)*/

/* Extra large devices (large desktops, 1200px and up)*/
@media (max-width: 1200px) {
	.container{
		max-width: 100%;
	}
}
@media (max-width: 1100px) {
	.btn-log,
	#header a.btn{
		border: none;
		text-align: center;
		width: 50px;
		height: auto;
		margin-top: 0px;
		padding-top: 50px;
		padding-left: 0px;
		padding-right: 0px;
		background-position: top left;
	}
	#header a.btn{
		width: auto;
	}
	#header a.btn i{
		left: 0;
		right: 0;
		margin-left: auto;
		margin-right: auto;
	}
	.col-login{
		padding-top: 20px;
	}
}
/* Large devices (desktops, 992px and up)*/
@media (max-width: 992px) {
	.collapse{
		display: block;
	}
	.navbar-expand-lg .navbar-toggler{
		display: none;
	}
	.navbar-expand-lg .navbar-nav{
		-webkit-box-orient: horizontal;
		-webkit-box-direction: normal;
		-ms-flex-direction: row;
		flex-direction: row;
	}
	.navbar.navbar-light .navbar-nav .nav-link{
		padding-left: 20px;
		padding-right: 20px;
	}
	.navbar.navbar-light .navbar-nav .nav-link:before{
		left: 0px;
	}
	.menu-principal-container{
		margin-left: auto;
		margin-right: auto;
		display: block;
		max-width: 650px;
	}
}
@media (max-width: 820px) {
	#cta .um-col-alt{
		position: relative;
	}
}
@media (max-width: 768px) {
	.container{
		padding-left: 0px;
		padding-right: 0px;
	}
	.wpb_content_element, ul.wpb_thumbnails-fluid > li, .wpb_button{
		margin-bottom: 15px;
	}
	.hidden-sm{
	    display: flex !important;
	}

	/* HEADER */
	html body #header{
		padding-left: 15px !important;
		padding-right: 15px !important;
		height: auto;
	}
	.col-search{
		padding-top: 100px;
		padding-bottom: 15px;
		-webkit-box-flex: 0;
		-ms-flex: 0 0 100%;
		flex: 0 0 100%;
		max-width: 100% !important;
	}
	#searchform{
		margin-top: 0px;
	}
	.col-logo{
		position: absolute;
		top: 0px;
		margin-left: 25%;
		z-index: 101;
	}
	#header.header .logo{
		margin-top: 0px !important;
		margin-bottom: 0px !important;
		margin-left: auto !important;
		margin-right: auto !important;
	}
	.col-login{
		position: absolute;
		top: 15px;
		right: 0px;
		z-index: 102;
		padding-top: 0px;
		margin-top: -10px;
		padding-right: 15px;
	}
	

	.collapse{
		display: none;
	}
	.navbar-expand-lg .navbar-toggler{
		display: block;
	}
	.navbar-expand-lg .navbar-nav{
		background-color: #fff;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.navbar{
		position: absolute;
		top: -137px;
		left: 0px;
		z-index: 100;
		width: 100%;
		padding-left: 0px;
	}
	.navbar-light .navbar-toggler{
		border-radius: 50%;
		border: 1px solid #000;
		height: 52px;
		width: 52px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.navbar-collapse{
		background: #fff;
		width: 100%;
	}
	.navbar-toggler-icon{
		background-image: none;
		background-color: #000;
		height: 1px;
		width: 100%;
		display: block;
		float: left;
		margin-top: 4px;
		margin-bottom: 4px;
	}
	.nav-tabs.logout{
		margin-top: -10px;
	}
	.nav-tabs.logout li a.nav-link,
	.nav-tabs.logout li a.nav-link:hover, 
	.nav-tabs.logout li a.nav-link:focus, 
	.nav-tabs.logout li a.nav-link:visited, 
	.nav-tabs.logout li a.nav-link:active{
	    border: none;
		text-align: center;
		width: 80px;
		height: auto;
		margin-top: 0px;
		padding-top: 50px;
		padding-left: 0px;
		padding-right: 0px;
		background-position: top center;
	}
	.nav-tabs.logout li a.nav-link:hover, 
	.nav-tabs.logout li a.nav-link:focus, 
	.nav-tabs.logout li a.nav-link:visited, 
	.nav-tabs.logout li a.nav-link:active{
		opacity: 0.6;
	}
	.dropdown-menu.show{
		left: -100% !important;
	}

	/* CAROUSEL */
	#carouselActuUne{
		height: auto;
	}
	#carouselActuUne .carousel-item.active{
		height: auto;
		display: block;
		float: left;
	}
	#carouselActuUne .visuel{
		width: 100%;
		height: 300px;
		display: block;
		float: left;
	}
	#carouselActuUne .carousel-caption{
		width: 100%;
		height: auto;
		display: block;
		float: left;
	}
	#carouselActuUne .carousel-caption h3{
		font-size: 28px;
		line-height: 32px;
	}
	#carouselActuUne .carousel-indicators{
		bottom: -20px;
	}

	/* NEWS */
	#bloc-news .bloc{
		padding-left: 0px;
		padding-right: 0px;
		padding-bottom: 35px;
	}
	#bloc-news .bloc:first-child{
		margin-bottom: 20px;
	}
	#bloc-news .cat{
		position: absolute;
		z-index: 1;
		width: 50%;
		right: 0px;
		top: 10px;
		padding-left: 15px;
		padding-right: 15px;
	}
	#bloc-news .visuel{
		width: 50%;
		height: 100%;
	}
	#bloc-news .content{
		padding-top: 40px;
		width: 50%;
		position: initial;
	}
	#bloc-news .content a{
		width: 100%;
		position: absolute;
		left: 0;
		padding-top: 5px;
		padding-bottom: 5px;
	}
	#bloc-news .content h3{
		font-size: 16px;
		line-height: 18px;
	}
	#bloc-news .content p{
		font-size: 12px;
		line-height: 14px;
		margin-bottom: 20px;
	}

	.home h2{
		font-size: 30px;
		line-height: 30px;
		max-width: 100%;
	}

	/* DOWNLOAD */
	#bloc-download{
		padding-right: 70px;
	}
	#bloc-download a{
		position: absolute;
		height: 100%;
		top: 0;
		right: 0;
		padding-left: 30px;
		padding-right: 30px
	}
	#bloc-download a i{
		position: absolute;
		top: 50%; /* poussé de la moitié de hauteur du référent */
		transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
		left: 0;
		right: 0;
		font-size: 24px;
	}

	/* PRODUCT */
	#bloc-product{
		display: table;
		width: 100%;
		margin-bottom: 30px;
	}
	#bloc-product a{
		display: table-row;
	}
	#bloc-product img{
		display: table-cell;
	}
	#bloc-product .content{
		display: table-cell;
		vertical-align: middle;
		width: 50%;
	}

	/* BLOC SLIDE */
	#bloc-slide .bloc{
		border: none;
		background: transparent;
		text-align: center;
		padding-top: 0px;
		padding-bottom: 10px;
	}
	#bloc-slide .bloc i{
		position: relative;
		left: 0;
		right: 0;
		top: 0;
		margin-left: auto;
		margin-right: auto;
	}
	#bloc-slide .bloc h2{
		font-size: 30px;
	}
	#bloc-slide a.btn{
		width: 100%;
		max-width: none;
		margin-top: 10px;
	}
	#bloc-slide .visuel{
		width: 30%;
		float: left;
		height: 80px;
	}
	#bloc-slide h3{
		width: 60%;
		float: right;
	}
	#bloc-slide .col-12:not(.bloc) a.btn{
	    font-size: 11px;
	    padding-top: 5px;
	    padding-bottom: 5px;
	}
	#bloc-slide .col-12:not(.bloc){
		border-left: 14px solid #000;
		margin-bottom: 15px;
	}
	#bloc-slide.yellow .col-12:not(.bloc){
		border-color: #f7a800;
	}

	/* MOST READ */
	#most-read .article h3{
		max-width: none;
	}
	#most-read .nav-tabs .nav-item .nav-link{
		font-size: 13px;
		min-width: 0px;
		line-height: 25px;
		padding-top: 10px;
		padding-bottom: 10px;
		padding-left: 50px;
		padding-right: 10px;
	}
	#most-read .nav-tabs .nav-item img{
		left: 10px;
		top: 6px;
	}

	/* more */
	.more h2{
		font-size: 34px;
	}

	/* CTA */
	.cta h3{
		font-size: 30px;
		line-height: 30px;
	}

	/* FOOTER */
	#copyright .copyright-text{
		width: 100%;
	}
	#copyright.footer .menu.left{
		width: 100%;
	}
	#copyright.footer .menu-footer-left1-container,
	#copyright.footer .menu-footer-left2-container{
		width: 50%;
	}
	#copyright.footer .menu.left ul{
		margin-left: auto;
		margin-right: auto;
		float: left;
	}
	#copyright.footer .menu.left ul li{
		text-align: left;
	}
	#copyright.footer .menu.left ul li a{
		font-size: 12px;
	}
	#copyright .social-icons ul,
	#copyright.footer .right{
		margin-left: auto;
		float: none;
	}
	#copyright.footer .menu{
	}

	/* CONTENT ARTICLE */
	#contain .post-title .title h1{
		font-size: 30px;
		line-height: 30px;
	}

	/* LANDING */
	#cover-teeshirt{
		background-position: left top !important;
		background-size: contain !important;
		background: none !important;
	}
	#cover-teeshirt h1{max-width: 100%;}
	#cover-teeshirt .col-form{
		padding: 0px !important;
		margin-top: -60px;
	}
	#cover-teeshirt .col-form .vc_column-inner{
		padding-right: 20px !important;
		padding-left: 20px !important;
	}
	#cover-teeshirt .col-form .teeshirt-mobile .vc_column-inner{
		padding-right: 0px !important;
		padding-left: 0px !important;
		background-position: left center !important;
	}
	.sixteen.columns{
		width: 100% !important;
		padding-left: 15px;
		padding-right: 15px;
	}
	.rtl .left{
	    margin-left: 0px;
	}
	.rtl .right{
	    margin-left: 0px;
	}
}
/* Small devices (landscape phones, 576px and up)*/
@media (max-width: 576px) {
	#header a.btn{
		display: none;
	}
	/* CTA Newsletter */
	#cta .left{
	    display: none;
	}
}