:root {
--primary: #6D007D;
  --secondary: #EF1855;
  --alternative: #FDEC07}

.header {
background-color:#fff;
  width:100%;
  position:fixed;
  left:0;
  top:0;
  min-height:63px;
  box-shadow:0px 3px 6px #0000001C;
  padding:5px 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:100}

@media (max-width: 767px) {
.header {
padding:5px 15px 5px 10px  }

}

.header .roundbtn_wrap {
width:calc(100% - 175px);
  display:flex;
  align-items:center;
  gap:10px}

@media (max-width: 767px) {
.header .roundbtn_wrap {
width:calc(100% - 135px)  }

}

.header .roundbtn_wrap .roundbtn {
background:transparent;
  width:30px;
  min-width:30px;
  height:30px;
  display:flex;
  align-items:center;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  z-index:3}

.header .roundbtn_wrap .roundbtn .center {
display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  gap:4px}

.header .roundbtn_wrap .roundbtn .center span {
background:#2459a3;
  width:21px;
  height:3px;
  transition:all ease-in-out 0.4s}

.header .roundbtn_wrap .roundbtn.click .center {
position:relative}

.header .roundbtn_wrap .roundbtn.click .center span {
background:#C8001F;
  transform:rotate(45deg);
  top:-1px;
  left:-11px;
  position:absolute}

.header .roundbtn_wrap .roundbtn.click .center span:nth-child(2) {
transform:rotate(-45deg)}

.header .roundbtn_wrap .roundbtn.click .center span:nth-child(3) {
opacity:0;
  transition:none}

.header .roundbtn_wrap .page_title {
max-width:100%;
  font-size:16px;
  line-height:20px;
  font-weight:600;
  color:#000;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap}

@media (max-width: 767px) {
.header .roundbtn_wrap .page_title {
max-width:100%;
    font-size:14px;
    line-height:16px  }

}

.header .right_header {
width:175px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:20px}

@media (max-width: 767px) {
.header .right_header {
width:135px;
    gap:10px  }

}

.header .right_header .common_btn {
background-color:#f7f7f7;
  width:26px;
  min-width:26px;
  height:26px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  position:relative}

.header .right_header .common_btn .count {
background-color:red;
  min-width:10px;
  height:10px;
  font-size:5px;
  color:#fff;
  border-radius:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  position:absolute;
  right:-3px;
  top:-3px}

.header .right_header .search {
position:relative}

.header .right_header .search .mycommon_dropdown {
width:420px;
  left:inherit !important;
  right:26px !important;
  top:-4px !important;
  transform:none !important;
  padding:0 !important;
  overflow:hidden}

@media (max-width: 767px) {
.header .right_header .search .mycommon_dropdown {
top:43px !important;
    right:-100px !important;
    width:calc(100vw - 20px) !important  }

}

.header .right_header .search .mycommon_dropdown .gs_input_row {
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-bottom:1px solid #f0f0f0}

.header .right_header .search .mycommon_dropdown .gs_input_row svg {
  flex-shrink:0;
  opacity:.5}

.header .right_header .search .mycommon_dropdown .input {
width:100%;
  height:32px;
  line-height:32px;
  color:#000;
  font-size:13px;
  border:none !important;
  outline:none !important;
  box-shadow:none !important;
  padding:0 !important;
  background:transparent}

.header .right_header .search .mycommon_dropdown .gs_results {
  max-height:420px;
  overflow-y:auto}

.header .right_header .search .mycommon_dropdown .gs_group_label {
  font-size:10px;
  font-weight:700;
  letter-spacing:.8px;
  text-transform:uppercase;
  color:#a0a0a0;
  padding:10px 14px 4px}

.header .right_header .search .mycommon_dropdown .gs_item {
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 14px;
  cursor:pointer;
  transition:background .15s}

.header .right_header .search .mycommon_dropdown .gs_item:hover {
  background:#fef2f4}

.header .right_header .search .mycommon_dropdown .gs_item_icon {
  width:28px;
  height:28px;
  border-radius:6px;
  background:#fef2f4;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0}

.header .right_header .search .mycommon_dropdown .gs_item_icon svg {
  width:13px;
  height:13px;
  fill:#e1003e}

.header .right_header .search .mycommon_dropdown .gs_item_text {
  min-width:0;
  flex:1}

.header .right_header .search .mycommon_dropdown .gs_item_title {
  font-size:13px;
  font-weight:600;
  color:#222;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis}

.header .right_header .search .mycommon_dropdown .gs_item_sub {
  font-size:11px;
  color:#999;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis}

.header .right_header .search .mycommon_dropdown .gs_item_arrow {
  color:#ccc;
  font-size:12px;
  flex-shrink:0}

.header .right_header .search .mycommon_dropdown .gs_empty {
  padding:20px 14px;
  text-align:center;
  font-size:12px;
  color:#aaa}

.header .right_header .search .mycommon_dropdown .gs_loading {
  padding:16px 14px;
  text-align:center;
  font-size:12px;
  color:#aaa}

.header .right_header .search .mycommon_dropdown .gs_group_label {
  display:flex;
  align-items:center;
  gap:6px}

.header .right_header .search .mycommon_dropdown .gs_group_count {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:16px;
  height:16px;
  padding:0 4px;
  border-radius:8px;
  background:#fef2f4;
  color:#e1003e;
  font-size:9px;
  font-weight:700}

.header .right_header .search .mycommon_dropdown .gs_pagination {
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:8px 14px;
  border-top:1px solid #f0f0f0;
  background:#fafafa}

.header .right_header .search .mycommon_dropdown .gs_page_btn {
  background:none;
  border:1px solid #e0e0e0;
  border-radius:4px;
  padding:4px 10px;
  font-size:12px;
  color:#555;
  cursor:pointer;
  transition:all .15s}

.header .right_header .search .mycommon_dropdown .gs_page_btn:hover:not(:disabled) {
  background:#fef2f4;
  border-color:#e1003e;
  color:#e1003e}

.header .right_header .search .mycommon_dropdown .gs_page_btn:disabled {
  opacity:.35;
  cursor:default}

.header .right_header .search .mycommon_dropdown .gs_page_num {
  font-size:11px;
  color:#999}

.header .right_header .notification {
position:relative}

.header .right_header .notification .dropdown-user {
width:300px;
  padding:15px 0 0;
  left:inherit !important;
  right:0px !important;
  top:43px !important;
  transform:none !important;
  border-radius:0px 0px 10px 10px}

@media (max-width: 767px) {
.header .right_header .notification .dropdown-user {
right:-64px !important  }

}

.header .right_header .notification .dropdown-user li {
padding-left:20px;
  padding-right:20px}

.header .right_header .notification .dropdown-user .dropdown-divider {
margin-top:12px;
  margin-bottom:12px}

.header .right_header .notification .tt1 {
font-size:12px;
  line-height:18px;
  font-family:"avenirheavy";
  font-weight:400;
  color:#000;
  position:relative;
  padding-left:15px}

.header .right_header .notification .tt1 span {
font-size:14px;
  font-family:"avenirblack";
  font-weight:400;
  color:#000}

.header .right_header .notification .tt1:before {
position:absolute;
  background:#6D007D;
  width:7px;
  height:7px;
  border-radius:20px;
  content:"";
  left:0;
  top:6px}

.header .right_header .notification .tt2 {
font-size:14px;
  color:#000;
  font-weight:600;
  padding-left:15px;
  margin-top:5px}

.header .right_header .notification .btn-sect {
display:flex;
  align-items:center;
  margin-top:8px}

.header .right_header .notification .accept {
font-size:14px;
  color:#6D007D;
  font-family:"avenirblack";
  font-weight:400;
  padding-left:15px;
  display:flex;
  align-items:center;
  gap:8px}

.header .right_header .notification .decline {
font-size:14px;
  color:#EF1855;
  font-family:"avenirblack";
  font-weight:400;
  padding-left:15px;
  display:flex;
  align-items:center;
  gap:8px}

.header .right_header .notification .view-all {
padding:10px;
  border-radius:0px 0 20px 20px;
  background:#F7F8FB;
  text-align:center;
  margin-top:20px}

.header .right_header .notification .view-all a {
font-size:12px;
  font-weight:600;
  color:#000}

.header .right_header .notification .bell {
position:relative}

.header .right_header .notification .bell span.cercle {
position:absolute;
  width:7px;
  height:7px;
  border-radius:25px;
  background:#EF1855;
  right:4px;
  top:1px;
  border:1px solid #fff}

.header .right_header .user {
position:relative;
  margin-left:10px}

@media (max-width: 767px) {
.header .right_header .user {
margin-left:5px  }

}

.header .right_header .user .dropdown-toggle {
background:url("../images/header/icon_arrow_red.svg") no-repeat right center;
  background-size:12px 7px;
  padding-right:20px}

.header .right_header .user .dropdown-toggle .userimg {
width:28px;
  min-width:28px;
  height:28px;
  border-radius:50px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #EAEAEA;
  border-radius:50px}

.header .right_header .user .dropdown-toggle .userimg img.mw_13 {
max-width:13px}

.header .right_header .user .mycommon_dropdown {
width:180px;
  position:absolute;
  right:0;
  top:47px !important;
  bottom:initial;
  transform:none !important;
  border-radius:0 0 10px 10px}

.header .right_header .user .mycommon_dropdown .user_settings {
width:100%}

.header .right_header .user .mycommon_dropdown .user_settings ul {
padding:0}

.header .right_header .user .mycommon_dropdown .user_settings ul li ~ li {
border-top:1px solid rgba(112,112,112,0.1)}

.header .right_header .user .mycommon_dropdown .user_settings ul li a {
font-size:14px;
  color:#000;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 15px;
  transition:all ease-in-out 0.4s}

.header .right_header .user .mycommon_dropdown .user_settings ul li a:hover {
background-color:#f7f7f7}

.header .right_header .user .mycommon_dropdown .user_settings ul li.logout a {
background:#C8001F;
  color:#fff;
  font-weight:600;
  justify-content:center;
  padding:7px 15px;
  border-radius:0 0 10px 10px}

.header .right_header .user .mycommon_dropdown .user_settings ul li.logout a:hover {
background-color:#6D007D}
