/*Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) and (max-width: 1400px){
	.right-tab li{
		width: 18%;
	}
	.right-tab li a{
		font-size: 12px;
	}
	.table-bordered > tbody > tr > td.text-main-inner, .table-bordered > thead > tr > th.text-main-inner, .table-bordered > thead > tr > th.text-main-inner-left, .right-tab li a{
		font-size: 12px;
	}
}

/*Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199px){
	.table-bordered > tbody > tr > td.text-main-inner, .table-bordered > thead > tr > th.text-main-inner, .right-tab li a{
		font-size: 14px;
	}
	.right-tab li{
		width: 26%;
	}
}

/*Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991px){
	.right-tab li{
		width: 33%;
	}
	.right-tab li a{
		font-size: 12px;
	}
	.right-tab{
		margin: 0;
	}
	.table-bordered > tbody > tr > td.text-main-inner, .table-bordered > thead > tr > th.text-main-inner, .table-bordered > thead > tr > th.text-main-inner-left, .right-tab li a{
		font-size: 12px;
	}
	.nav{
		margin: 0;
	}
	.nav > li > a{
		line-height: 35px;
	}
	.nav > li > a i.activite, .nav > li > a i.activite:hover, .nav > li > a i.activite:focus, .nav > li > a i.calendrier, .nav > li > a i.ecommerce, .nav > li > a i.marketplace, .nav > li > a i.marketing, .nav > li > a i.relation, .nav > li > a i.merchan, .nav > li > a i.utili, .nav > li > a i.information, .nav > li > a i.myaccount, .nav > li > a i.logout{
		margin: 8px 15px 0 0;
	}
	.dropdown-toggle{
		margin: 20px 0 10px 0;
	}
}
/*Extra small devices (portrait phones, less than 576px)*/
/*No media query since this is the default in Bootstrap*/
@media (min-width: 0px) and (max-width: 767px){
	.dropdown-toggle{
		margin: 0 0 10px 0;
		padding: 6px 12px 6px 12px;
	}
	.nav{
		margin: 0;
	}
	.nav > li > a, .nav > li > a:hover{
		margin: 0px 0;
		padding: 0 10px;
		line-height: 30px;
	}
	.nav > li > a i.activite, .nav > li > a i.activite:hover, .nav > li > a i.activite:focus, .nav > li > a i.calendrier, .nav > li > a i.ecommerce, .nav > li > a i.marketplace, .nav > li > a i.marketing, .nav > li > a i.relation, .nav > li > a i.merchan, .nav > li > a i.utili, .nav > li > a i.information, .nav > li > a i.myaccount, .nav > li > a i.logout{
		margin: 7px 15px 0 0;
	}
	.login100-form-btn{
  padding: 0 12px;
  margin: 0 10px 0 0px;
  float: left;
}
h2{
	margin: 0 0 10px 0;
	width: 100%;
}
.right-tab{
	margin: 0 20px;
	width: auto;
}
.right-tab li{
	width: 100%;
}
.right-tab li a, .right-tab li a:hover{
	line-height: 30px;
	font-size: 14px;
}
.panel-body{
	padding: 10px;
}
.table-bordered > thead > tr > th.text-main-inner, .table-bordered > tbody > tr > td.text-main-inner, .table-bordered > thead > tr > th.text-main-inner-left, .table-bordered > thead > tr > td.text-main-inner-left{
	font-size: 12px;
}
.table > thead:first-child > tr:first-child > th{
	font-size: 14px;
}
.table-responsive{
	padding: 10px;
	border: 1px solid #e7ecf1 !important;
}
.navbar-collapse{
	display: none;
}
.table-bordered > tbody > tr > td.text-main{
	font-size: 16px;
	white-space: nowrap !important;
}
.table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th, .table > thead:first-child > tr:first-child > th{
	font-size: 12px;
	padding: 0 10px;
}
.dropdown{
	margin: 0;
}
.panel-default{
	margin: 10px 0 0 0;
	z-index: 0;
	position: relative;
}
.card, .card-img-top{
	max-width: 100%;
}
.page-bar { float: left !important; width: 100%; }
#dashboard {width: 100%; margin: 5% 0 0 0;}
.data-container-top.bootstrap-header { padding: 0 0px !important;}
#calendar-head #datepicker { right: 20px !important; width: auto !important;}
.panel-default nav { float: left; width: 100%;}
.text-main-inner { padding: 8px !important;}
/*.navbar-default { position: absolute !important; height: auto !important; overflow-y:hidden !important; overflow-x: hidden !important;  }*/
/*.navbar-default { height: auto !important; position: inherit !important; overflow: auto !important;}*/
.desktop_menu_list_new { position: relative;}
.sidebar .sidebar-nav.navbar-collapse { /*position: unset;*/ display: none; }
.footer_menu_logo { display: none;}
#togglemenuleft { display: none !important;}
.desktop_menu_list_new { width: 100%;}
.fixed-table-body table { font-size: 12px;}
.fixed-table-body table thead th:nth-child(1) { padding: 0 30px;}
.fixed-table-body table thead th { padding: 0 10px;}
.portlet.light.bordered { border:none !important;}

.desktop_menu_list_new { float: left; width: 100%; margin: 15px 0 0 0; padding: 0 0 20px 0; }
.sidebar .sidebar-nav.navbar-collapse { float: right; top: 0px; background: #fafafc; right: 0px; bottom: 75px;}
.navbar-header { float: right; }
.navbar-default { float: left; }
.navbar-toggle { margin-top: 0px !important;}

.nav { float: right; width: 220px; margin-top: 25px; text-align: left; }
.nav > li, .nav > li > a { position: unset;}
.closebtn { display: block !important; font-size: 30px; text-align: right; padding: 0 15px; color: #cccccc;}
.footer_menu_logo { right: 0px; background: #fafafc;}
.footer_menu_logo > li > a:hover { padding: 0px; }
.nav > li > a, .nav > li > a:hover { padding: 7px !important;}
body.hidebackground .mask { background-color:rgba(0,0,0,0.5); width: 100%; height: 100%; position: fixed; z-index: 1;}
/*body.hidebackground #main {z-index: -1;}*/

/*#page-wrapper { padding: 0px !important;}*/
#page-wrapper .header-tab { float: left; width: 100%; margin-bottom: 15px; padding-left: 13px;}
#calendar-head #datepicker { top: 164px !important;}
#datepickerExpand { background-color: #217ebd; border-color: #1f78b5; border-radius: 0px !important; color: #ffffff !important;}
.panel-heading { text-align: center !important;}
.table-responsive { overflow-y:inherit !important; overflow-x:inherit !important; float: left !important; margin-bottom: 0px !important; }
/*.table-responsive table, .table-responsive table tbody, .table-responsive table tbody tr { float: left; width: 100%;}*/
.table-responsive table tbody tr td { float: left; width: 50%; text-align: left !important; padding: 0; font-size: 14px !important;}
.table-responsive .box-name-list-tbl tbody tr td { float: inherit; width: 50%; text-align: left !important; padding: 0; font-size: 14px !important;}
.add_box_btn{width: 100%;margin-top: 10px;}

.table-responsive table.ecommerce-table tbody tr td { width: 100% !important; padding: 10px 8px !important; text-align: left !important;} 
.table-responsive table tbody tr td a { font-size: 14px !important;}
.panel-default { margin-top: 0px !important; padding-top: 0px !important;}
.panel-body { padding-top: 0px !important;}
ul#nav-tab { float: left !important; width: 100% !important; margin: 0px !important;}
ul#nav-tab li { width: 100% !important; float: left !important; clear: both;}
ul#nav-tab li a { text-align: left !important;}
.text-main-inner { padding: 0px 0px !important;}
table.merchandising-table .text-main-inner, table.merchandising-table .image-link-mobile, table.marketing-table .text-main-inner, table.marketing-table .image-link-mobile { padding: 8px !important;}
table.merchandising-table, table.merchandising-table tbody, table.merchandising-table tbody tr, table.marketing-table, table.marketing-table tbody, table.marketing-table tbody tr { float: none !important; width: auto !important;}
table.merchandising-table tbody tr td, table.marketing-table tbody tr td { float: left; width: 100%; text-align: left !important; font-size: 14px !important;}
.tab-content { padding: 0px !important;}
.tab-content .tab-pane { padding: 0px !important; border: none !important;}
.responsive-nopadding { padding: 0px !important;}

#nav-tabContent .marketing-table tr td:first-child { background:none !important; color: #3e3d3b !important; width: 100% !important; text-align: left !important; border:none !important; font-size: 16px !important; }
#nav-tabContent .marketing-table > tbody > tr:hover, #nav-tabContent .marketing-table > tbody > tr:hover > td:first-child { background:none !important; border-left:none !important;  }
#nav-tabContent .marketing-table tbody tr { float: left !important; width: 100% !important; border-top: 1px solid #e7ecf1 !important; margin: 10px 0 0 0 !important; padding: 10px 0 0 0 !important;}
#nav-tabContent .marketing-table tr:hover { border-top: 1px solid #e7ecf1 !important;}
#nav-tabContent .marketing-table tr td { width: 50% !important; float: left;}
#nav-tabContent .marketing-table tr td span { float: left; width: 100%; font-size: 16px !important; font-weight: bold !important; }
#nav-tabContent .marketing-table tr td::before { font-weight: normal !important; font-size: 14px !important;}
#nav-chiffres .panel.inner-panel-table { padding: 9px 19px 9px 19px !important;}
.right-tab li:nth-child(1) { padding: 0px !important;}
.right-tab li:last-child { padding: 0px !important;}

.panel-main-dashboard table tr td.text-main { float: left; width: 50%; margin-bottom: 15px;}

#nav-tabContent .ecommerce-table tr td:first-child { background:none !important; color: #3e3d3b !important; width: 100% !important; text-align: left !important; border:none !important; font-size: 16px !important; }
	#nav-tabContent .ecommerce-table > tbody > tr:hover, #nav-tabContent .ecommerce-table > tbody > tr:hover > td:first-child { background:none !important; border-left:none !important;  }
	#nav-tabContent .ecommerce-table tbody tr { float: left !important; width: 100% !important; border-top: 1px solid #e7ecf1 !important; margin: 10px 0 0 0 !important; padding: 10px 0 0 0 !important;}
	#nav-tabContent .ecommerce-table tr:hover { border-top: 1px solid #e7ecf1 !important;}
	#nav-tabContent .ecommerce-table tr td { width: 50% !important; float: left; text-align: left; border: none !important;}
	#nav-tabContent .ecommerce-table tr td span { float: left; width: 100%; font-size: 16px !important; font-weight: bold !important; }
	#nav-tabContent .ecommerce-table tr td::before { font-weight: normal !important; font-size: 14px !important; width: 100%;}
	.ecommerce-table tr td { padding: 10px 0px 10px 8px;}
	.dashboard-heading { text-align:center; }
	.navbar-default.sidebar .user-menu .menu_name { padding-left: 8%; } 
	#page-wrapper .ccv-mobile-heading { text-align: left !important; float: left;width: 50%;padding-left: 10px;}
	#page-wrapper .panel-heading-right a {display: block;float: right; background: #3a7db8 !important;color: #ffffff !important;border-radius: 2px;}
}
@media(min-width:1400px) {
	ul.userstabs li { padding: 0 3% 0 0px !important; }
	ul.userstabs li:nth-child(1) { padding: 0 3% 0 0px !important;}
	.right-tab li { /*width: 20% !important;*/ /*padding: 0 11% 0 0px !important;*/}
	.right-tab li a { text-align: left !important; }
	.right-tab li:nth-child(1) { /*padding: 0 11% 0 0px !important;*/}
	.news-image-wrapper { height:260px;}
	.news-image-wrapper img { max-width: 380px !important;}
}
@media (min-width: 992px) and (max-width: 1199px){
	.panel-main-dashboard table tr td.text-main { float: left; width: 25%; margin-bottom: 15px;}
	.inner-panel-table .marketing-table { width: 100% !important;}
}
@media (min-width: 768px) and (max-width: 991px){
	.panel-main-dashboard table tr td.text-main { float: left; width: 32%; margin-bottom: 15px;}
	.inner-panel-table .marketing-table { width: 100% !important;}

	#nav-tabContent .marketing-table th { display: block !important; width: 33% !important; float: left !important;}
	#nav-tabContent .marketing-table tr td:first-child { background:none !important; color: #3e3d3b !important; width: 33% !important; text-align: left !important; border:none !important; font-size: 16px !important; }
	#nav-tabContent .marketing-table > tbody > tr:hover, #nav-tabContent .marketing-table > tbody > tr:hover > td:first-child { background:none !important; border-left:none !important;  }
	#nav-tabContent .marketing-table tbody tr { float: none !important; width: auto !important; border-top: none !important; margin: 10px 0 0 0 !important; padding: 10px 0 0 0 !important;}
	/*#nav-tabContent .marketing-table tr:hover { border-top: 1px solid #e7ecf1 !important;}*/
	#nav-tabContent .marketing-table tr td { width: 33% !important; float: left;}
	#nav-tabContent .marketing-table tr td span { float: left; width: 100%; font-size: 16px !important; font-weight: bold !important; }
	#nav-tabContent .marketing-table tr td::before { display: none !important; font-weight: normal !important; font-size: 14px !important;}

	
	#nav-tabContent .ecommerce-table tr th { display: none;}
	#nav-tabContent .ecommerce-table tr td:first-child { background:none !important; color: #3e3d3b !important; width: 100% !important; text-align: left !important; border:none !important; font-size: 16px !important; }
	#nav-tabContent .ecommerce-table > tbody > tr:hover, #nav-tabContent .ecommerce-table > tbody > tr:hover > td:first-child { background:none !important; border-left:none !important;  }
	#nav-tabContent .ecommerce-table tbody tr { float: left !important; width: 100% !important; border-top: 1px solid #e7ecf1 !important; margin: 10px 0 0 0 !important; padding: 10px 0 0 0 !important;}
	#nav-tabContent .ecommerce-table tr:hover { border-top: 1px solid #e7ecf1 !important;}
	#nav-tabContent .ecommerce-table tr td { width: 50% !important; float: left; text-align: left; border: none !important;}
	#nav-tabContent .ecommerce-table tr td span { float: left; width: 100%; font-size: 16px !important; font-weight: bold !important; }
	#nav-tabContent .ecommerce-table tr td::before { font-weight: normal !important; font-size: 14px !important;}
	.rwd-table td::before { display: block !important;}
	.rwd-table td:before,
	.rwd-table.crm-table tr td:first-child:before { content: attr(data-th) " : "; font-weight: bold; width: 12em; display: inline-block; }
	
	.rwd-table.crm-table tr td:last-child:before { content: attr(data-th) " : "; font-weight: bold; width: 17em; display: inline-block; }
	.rwd-table.merchandising-table tr td:first-child::before { display: none;  }
	.rwd-table tr td:first-child:before { content: attr(data-th) ""; font-weight: bold; width: auto; display: inline-block; }
	.rwd-table.produit-tab-table tr td:first-child:before { color: #fff;}
	.ecommerce-table tr td { padding: 10px 8px 10px 0px !important;}

	#nav-marketing .marketing-table tr th { display: none !important;}
	#nav-marketing .marketing-table tr td:first-child { background:none !important; color: #3e3d3b !important; width: 100% !important; text-align: left !important; border:none !important; font-size: 16px !important; }
	#nav-marketing .marketing-table tbody tr { float: left !important; width: 100% !important; border-top: 1px solid #e7ecf1 !important; margin: 10px 0 0 0 !important; padding: 10px 0 0 0 !important;}
	#nav-marketing .marketing-table tr td { width: 50% !important; float: left; text-align: left !important;}
	#nav-marketing .marketing-table tr td::before { display: block !important; font-weight: normal !important; font-size: 14px !important;}

	 .page-activite .rwd-table td:before { display: none!important; }
}

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
	.news-content {  min-height: 370px;}
}
@media (min-width: 0px) and (max-width: 767px){
	.drop-down-menu-icon { display: none; }
	.page-activite #page-wrapper .header-tab, .page-new-activite #page-wrapper .header-tab { margin-bottom: 0px; }
	.page-activite #page-wrapper .header-tab .caption-subject, .page-new-activite #page-wrapper .header-tab .caption-subject { display: none; }
	#activite_news_blogs .panel-heading { text-align: left !important; }
	body.page-activite .desktop_menu_list_new, body.page-new-activite .desktop_menu_list_new { padding-bottom: 0px; }
}

@media (min-width: 0px) and (max-width: 767px){
	#dropdownMenuButton { margin-bottom: 0px; width: 100%;  height: 52px; }
	#dropdownMenuButton span{ font-size: 20px; text-transform:  uppercase; }
 	.data-container-top { float: left; width: 100%;  display:flex; flex-flow: column; }
    .data-container-top .header-tab {order:2;}
    .data-container-top .page-bar{order:1;}
    .desktop_menu_list_new { margin-bottom: 0px; padding-bottom: 0px;  }
    #page-wrapper .header-tab { padding-left: 0px; text-align: center; }
    .nav-tabs .nav-link.active,
    .nav-tabs .nav-link:hover,
    .nav-tabs .nav-link.active:hover { background: #3a7db8; color: #fff !important; }
    .panel-default  ul#nav-tab{ overflow: auto; white-space: nowrap; display: flex; }
    ul#nav-tab li a { text-align: left !important; padding: 0px !important; height: 52px; line-height: 56px; padding: 0 20px !important; }
     ul#nav-tab li { border-right: solid 1px #e2e7e8; border-top: solid 1px #e2e7e8; }
      .page-product table.marketing-table tbody tr td { width: 50%; }
    .page-product .product .rwd-table tr td:before { width: 100%; }
    .panel-default nav { margin-top: 30px; }
    .page-marketplace .panel-main-dashboard { margin-top: 35px !important; }
    .panel.panel-default .site_name:first-child,.panel.panel-default .site_name span{display: none;}
    body.page-marketplaceactivite table.marketing-table tbody tr td:nth-child(2) {display: inline-block;width: 100%;text-align: center!important;text-transform: capitalize;}
    .rwd-table td:nth-child(2):before {font-size: 18px;font-weight: bold!important;}
}	

@media (min-width: 320px) and (max-width: 360px){ 
	.nav > li > a { line-height: 28px; }
	.nav { margin-top: 0px; }
	.sidebar .sidebar-nav.navbar-collapse { bottom: 0px; }
}

/*Added by OCS# QA mobile menu scroll*/
@media (min-width: 0px) and (max-width: 767px){  
	.sidebar .sidebar-nav.navbar-collapse { width: min-content; }
	#page-wrapper { padding: 118px 0px 0px 0px !important;}
}
/*Added by OCS# QA mobile menu scroll*/
