/*----------------------------------
        Header & Menu Design
------------------------------------*/
#header {
    background: #eee;
    box-shadow: 0px 9px 26px -13px #000000db;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 3;
}
.Menus {}
.TopBar {
    display: flex;
    min-height: 60px;
    background: -moz-linear-gradient(11deg, #5330e9 0%, #975ffd 100%);
    background: -webkit-gradient(linear, left top, right top, color-stop(0%, #5330e9), color-stop(100%, #975ffd));
    background: -webkit-linear-gradient(11deg, #5330e9 0%, #975ffd 100%);
    background: -o-linear-gradient(11deg, #5330e9 0%, #975ffd 100%);
    background: -ms-linear-gradient(11deg, #5330e9 0%, #975ffd 100%);
    background: linear-gradient(79deg, hsl(252, 59%, 9%) 0%, hsl(262, 58%, 10%) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5330e9', endColorstr='#975ffd',GradientType=1 );
}
.SoftwareLogo {
    flex: 1
}
.SoftwareLogo img {
    width: 200px;
    margin-left: 25px;
    margin-top: 15px;
}
.searchBoxPortal {
    flex: 2;
}
.searchBoxPortal form{
    display: flex;
}
.searchBox {
    flex: 2;
}
.searchBoxContainer {
    border: 2px solid #fff;
    border-radius: 30px;
    margin-top: 12px;
}
.searchBox form {}
.searchBox form input {
    background-color: transparent;
    border: none;
    margin: 0;
    padding: 0;
    color: #fff;
    word-wrap: break-word;
    outline: none;
    display: flex;
    -webkit-tap-highlight-color: transparent;
    min-width: 93%;
    height: 30px;
    box-sizing: border-box;
    padding: 5px 5px 5px 12px;
    display: block;
}

.searchBoxPortal form input {
    background-color: transparent;
    border: none;
    margin: 0;
    padding: 0;
    color: #fff;
    word-wrap: break-word;
    outline: none;
    display: flex;
    flex: 100%;
    -webkit-tap-highlight-color: transparent;
    height: 30px;
    box-sizing: border-box;
    padding: 5px 5px 5px 12px;

}

select#iGlobalOfficeID {
    background: transparent;
    color: #fff;
    border: none;
    margin-left: 20px;
	width: 300px;
}

select#iGlobalOfficeID option{
    color: black;
}

select#iGlobalSearchType {
    background: transparent;
    color: #fff;
    border: none;
    margin-left: 20px;
	width: 100px;
}

select#iGlobalSearchType option{
    color: black;
}

.searchBoxContainer form input::placeholder {
    color: #fff;
}

.searchBoxContainer .button {
    position: relative;
    right: 2px;

    color: #fff;
    font-size: 20px;
    text-align: center;
    padding-top: 10px;
    background: transparent;
    border: none;
    float: right;
    cursor: pointer;
}

.Logout {
    flex: 1;
}
.Logout a {
    color: #fff;
}
.Logout a:hover {
    color: #b7b7b7;
    transition: 500ms;
}
.LogoutBox {
    display: flex;
    justify-content:flex-end;
    margin-right: 20px;
    margin-top: 10px;
}
.OutIcon {
    margin-right: 10px;
}
.OutIcon i {
    font-size: 35px;
}
.OutText p {
    font-size: 12px;
}
.SecondBar {
    display: flex;
    background: #1B2A47;
}
.TitleSection {
    flex: 1;
}
.TitleSection h2 {
    margin-top: 10px;
    color: rgba(255, 147, 51, 0.81);
}
.MenuSection {
    flex: 4
}

/*---------------------------------------
        User Information Section
---------------------------------------*/
.UserInfo {
    display: flex;
    background: #fff;
    margin-top: 20px;
    margin-bottom: 20px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
    border-radius: 4px;
    min-height: 80px;
}
.UserAvater {}
.UserAvater img {
    width: 60px;
    border-radius: 50px;
    margin-left: 6px;
    margin-top: 5px;
    border: 5px solid #f1a7003b;
}
.UserDetails {
    margin-left: 20px;
}
.UserDetails h3 {
    color: #1B2A479c;
    padding-left: 0px;
    font-size: 18px;
    margin-top: 10px;
}
.UserDetails b {
    color: #3333338c;
}
.UserDetails a {
  font-size: 12px;
  color: #3333338c;
}


/*----------------------------
        Menu Section
-----------------------------*/
.MenuSection {
    flex: 4;
    position: relative;
    margin-top: 10px;
}



/*----------------------
        Home Buttons
----------------------------*/
.buttons {
    width: 60%;
    margin: 0 auto;
    background: #ffffff;
    overflow: hidden;
    min-height: 202px;
    border-radius: 10px;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
}
.buttons h2 {
    background: #3E048A;
    text-align: center;
    padding: 5px;
}
.button-left {
    width: 50%;
    float: left;
}
.button-right {
    width: 50%;
    float: right;
}
.actionButton {
    width: 62%;
    margin: 0 auto;
    margin-top: 40px;
    text-align: center;
}
.actionButton a, .ButtonCommon {
    padding: 10px;
    display: block;
    width: 100%;
    border-radius: 8px;
    border: 2px solid #3e048a;
    color: #3e048a;
    text-transform: uppercase;
}
.actionButton a:hover, .ButtonCommon:hover {
    /* background: rgb(83,80,129);
    background: -moz-linear-gradient(90deg, rgba(239, 170, 35, 0.31) 13%, rgba(251, 6, 23, 0.44) 54%, rgba(0, 130, 216, 0.62) 94%);
    background: -webkit-linear-gradient(90deg, rgba(239, 170, 35, 0.31) 13%, rgba(251, 6, 23, 0.44) 54%, rgba(0, 130, 216, 0.62) 94%);
    background: linear-gradient(90deg, rgba(239, 170, 35, 0.31) 13%, rgba(251, 6, 23, 0.44) 54%, rgba(0, 130, 216, 0.62) 94%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#535081",endColorstr="#2e00ff",GradientType=1); */
    background: #3e048a;
    border: 2px solid #3e048a;
    color: #fff;
    transition: 0.3s all ease;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
}
.abuton1 {
    background: url(../images/icons/dual/request-magenta.svg) no-repeat;
    background-size: 30px;
    background-position: 15px;
}
.abuton2 {
    background: url(../images/icons/dual/history-magenta.svg) no-repeat;
    background-size: 26px;
    background-position: 7px;
}
.abuton3 {
    background: url(../images/icons/dual/statistics-magenta.svg) no-repeat;
    background-size: 28px;
    background-position: 15px;
}
.abuton4 {
    background: url(../images/icons/dual/Inventory-magenta.svg) no-repeat;
    background-size: 30px;
    background-position: 5px;
}
.abuton5 {
    background: url(../images/icons/dual/shipped-magenta.svg) no-repeat;
    background-size: 30px;
    background-position: 135px;
}
.abuton6 {
    background: url(../images/icons/dual/recieved-magenta.svg) no-repeat;
    background-size: 30px;
    background-position: 245px;
}
.abuton1:hover {
    background: #3E048A url(../images/icons/dual/request-white.svg) no-repeat !important;
    background-size: 30px !important;
    background-position: 15px !important;
}
.abuton2:hover {
    background: #3E048A url(../images/icons/dual/history-white.svg) no-repeat !important;
    background-size: 26px !important;
    background-position: 10px !important;
}
.abuton3:hover {
    background: #3E048A url(../images/icons/dual/statistics-white.svg) no-repeat !important;
    background-size: 28px !important;
    background-position: 15px !important;
}
.abuton4:hover {
    background: #3E048A url(../images/icons/dual/Inventory-white.svg) no-repeat !important;
    background-size: 30px !important;
    background-position: 5px !important;
}
.abuton5:hover {
    background: #3E048A url(../images/icons/dual/shipped-white.svg) no-repeat !important;
    background-size: 30px !important;
    background-position: 10px !important;
}
.abuton6:hover {
    background: #3E048A url(../images/icons/dual/recieved-white.svg) no-repeat !important;
    background-size: 30px !important;
    background-position: 363px !important;
}
/*-------------------------------
        Login Page Design
--------------------------------*/
.loginPage{
	margin:0;
	padding:0;
	border:0;			/* This removes the border around the viewport in old versions of IE */
	width:100%;
	min-width:600px;    	/* Minimum width of layout - remove line if not required */
	z-index: 1;
	/* font-family: 'Dense', 'Open Sans', sans-serif; */
	/* font-family: 'Roboto', sans-serif; */
	/* font-family: 'Ubuntu', sans-serif; */
	font-family: 'Poppins', sans-serif;
	/* font-family: 'Exo', sans-serif; */

}
.main-video {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    min-width: 100%;
    z-index: -2;

}
.loginoverlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: -1;
	background: #152036 url(../svg/bg.svg) no-repeat;
    background-size: 100%;
	background-position: 0px -100px;
	background-attachment: fixed;
}
.loginBox {
    position: relative;
    width: 30%;
    margin: 0 auto;
    background: linear-gradient(90deg, rgba(83, 80, 129, 0.22) 13%, rgba(214, 0, 15, 0.45) 54%, rgba(46, 0, 255, 0.25) 94%);
    box-shadow: 0px 0px 40px -7px #000000db;
    overflow: hidden;
    margin-top: 100px;
    border-radius: 4px;
    box-sizing: border-box;
    padding: 20px;
}
.IntranetInterface {}
.branding {
    min-height: 60px;
    margin-left: -20px;
    margin-top: -20px;
    width: 111%;
    background: rgba(255, 255, 255, 0.89);
}
.branding img {
    width: 210px;
    display: block;
    margin: 0 auto;
    padding-top: 5px;
}

.loginForm {}
.LoginType {
    color: #fff;
    text-align: center;
    padding-left: 0;
    margin-top: 20px;
    margin-bottom: 20px;
}
.InputControl {
    min-width: 90%;
    border-radius: 4px;
    padding: 7px;
    display: block;
	background-color: rgb(232, 240, 254);
    margin-right: auto;
    margin-left: auto;
    border: 2px solid #fff;
    margin-bottom: 10px;
}
.SubmitControl {
    margin-bottom: 30px;
    margin-top: 30px;
    min-width: 90%;
    padding: 10px;
    border: 2px solid #fff;
    border-radius: 2px;
    text-transform: uppercase;
    background: #1B2A47;
    color: #fff;
    display: block;
    cursor: pointer;
    border-radius: 10px;
    margin-right: auto;
    margin-left: auto;
}
.SubmitControl:hover {
    color: #fff;
    border: 2px solid transparent;
    background: linear-gradient(90deg, rgba(55, 50, 132, 0.65) 13%, rgba(214, 0, 15, 0.94) 54%, rgba(40, 5, 199, 0.67) 94%);
    transition: 0.3s all ease;
}
.Message {}
.loginFormFotter {
    background: #fff;
    margin-left: -20px;
    min-height: 60px;
    margin-bottom: -23px;
    min-width: 111%;
}
.loginFormFotter h2 {
    text-align: center;
    padding-top: 12px;
    padding-left: 0;
    font-size: 25px;
    color: #3a519ade;
}
.Message {
    text-align: center;
    margin-bottom: 15px;
}

/*------------------------------
        Pages Design
-------------------------------*/
.ContentFlat {
    width: 95%;
    margin: 0 auto;
    padding: 10px;
    border-radius: 4px;
    border: 1px solid rgba(0,0,0,.03);
    box-shadow: 0 2px 2px rgba(0,0,0,.24), 0 0 2px rgba(0,0,0,.12);
}
.ContentFlat h4 {
    padding: 10px;
    width: 100%;
    margin-left: -9px;
    border-radius: 4px 4px 0px 0px;
    margin-top: -9px;
    color: rgba(0,0,0,.54);
    background: rgba(0,0,0,.03);
}
.toogleButton {
    color: #fff;
    background: #1B2A47;
    border: 2px solid #1B2A47;
    padding: 5px;
    border-radius: 4px;
    display: block;
    width: 200px;
    text-align: right;
    padding-right: 15px;
}
.toogleButton:hover {
	color: #fff;
}

.Leftnav {
    background: rgba(27, 42, 71, 0.7490196078431373);
    min-height: 400px;
    border-radius: 5px;
}
.LeftnavTitle {
    background: #000000ba;
    width: 100%;
    padding-top: 5px;
    padding-bottom: 5px;
    border-radius: 5px 5px 0 0;
}
.LeftnavTitle h2{
    text-align: center;
}
.sectionHeader {
    background: #1B2A47;
    width: 100.01%;
    margin-left: -5px;
    margin-top: -5px;
    min-height: 32px;
    border-radius: 0 5px 0 0;
    padding: 5px;
}
.sectionHeader h3 {
    margin: 0;
    padding-left: 10px;
    line-height: 27px;
    color: #ffffff;
}

.legendBar {
    margin: 0 auto;
    border: 1px solid rgba(72, 17, 144, 0.4);
    box-shadow: 0 2px 2px rgba(0,0,0,.24), 0 0 2px rgba(0,0,0,.12);
    border-radius: 4px;
}
fieldset {
    border-radius: 4px;
    min-height: 50px;
}
legend {
    width: 14%;
    position: absolute;
    background: #3e048af2;
    color: #fff;
    padding: 10px;
    border-radius: 4px;
    top: -20px;
    display: flex;
    height: 20px;
}
legend img {
    width: 20px;
    margin-right: 5px;
}
.service-buttons {
    width: 26%;
    margin-top: 18px;
}
form#CFForm_1 {
    width: 100%;
}
.smallSearchbnt {
    padding-top: 3px;
    padding-bottom: 3px;
    border-radius: 6px;
    border: 1px solid #1B2A47;
    color: #f3f3f3;
	text-align: center;
    width: 95%;
    cursor: pointer;
    background: #1B2A47 !important;
}
.UpArrow {
    background: #333333c7 url(../images/icons//dual/uparrow.svg) no-repeat;
    background-size: 20px;
    background-position: 7px;
}
.DownArrow {
    background: #333333c7 url(../images/icons//dual/downarrow.svg) no-repeat;
    background-size: 20px;
    background-position: 7px;
}
.ExcesButton {
    background: #1B2A47;
    padding: 5px;
    border-radius: 4px;
    color: #fff;
    display: flex;
    width: 143px;
    height: 27px;
    float: right;
    margin-top: -45px;
}
.ExcesButton img {
    margin-top: 2px;
    margin-left: 5px;
}
.ExcesButton p {
    margin-left: 7px;
    margin-top: 4px;
}
.TableBox {
    border-radius: 4px;
    color: #444;
    margin-top: 7px;
}
.TableBoxPadding {
    box-sizing: border-box;
    padding: 20px;
}
.inventorysSearchUpper {
    display: flex;
    min-width: 100%;
}
.inventorysSearchDown {
    display: flex;
    min-width: 100%;
    margin-top: 30px;
}
.inItem {
    flex: 1;
    margin-right: 10px;
    margin-left: 10px;
}
.inItem select {
    min-width: 100%;
}
.inItem p {
    font-weight: bold;
}
.dItem {
    margin-left: 10px;
    margin-right: 10px;
}
.dItem1 {
    flex: 1;
}
.dItem2 {
    flex: 2;
}
.dItem3 {
    flex: 1;
}
.inSubmit {
    overflow: hidden;
    background: #d2d0d094;
    border-radius: 0 0 4px 4px;
    min-height: 70px;
}
.inSubmit input.btn {
    color: #fff;
    padding: 8px;
    text-transform: uppercase;
    width: 400px;
    border-radius: 4px;
    float: right;
    margin-top: 18px;
    margin-right: 17px;
    font-weight: 600;
    letter-spacing: 4px;
    background: #1B2A47;
    border-color: #1B2A47;
    text-align: center;
}

/*------------------------------
        Table Design
-------------------------------*/
.table-container {}
.tableContainer {
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
    border-radius: 4px;
}
.ContentCard {
    min-height: 400px;
    border-radius: 5px;
}
.content-left {
    width: 48%;
    float: left;
    margin-right: 4%;
}
.content-right {
    width: 48%;
    float: right;
}
.ContentBox {
    box-shadow: 0px 0px 70px #131527;
    margin-bottom: 30px;
}
.searchCard {
    background: #1B2A47;
    width: 250px;
    padding: 10px;
    border-radius: 4px 4px 0 0;
    color: #fff;
}
.searchCard img {
    float: left;
    margin-left: 5px;
    margin-right: 8px;
}
.infopanel {
    background: #1B2A47;
    margin-top: 30px;
    width: 250px;
    padding: 10px;
    border-radius: 4px 4px 0 0;
    color: #fff;
}
.infopanelflat {
    background: linear-gradient(79deg, hsl(252, 59%, 9%) 0%, hsl(262, 58%, 10%) 100%);
    margin-top: 10px;
    min-width: 220px;
    padding: 10px;
    border-radius: 4px 4px 0 0;
    position: relative;
    color: #ffffff;
}
.infopanel img, .infopanelflat img {
    float: left;
    margin-left: 5px;
    margin-right: 5px;
}

.infopanel h1, .infopanelflat h1 {
    margin: 0;
    color: #fff;
    padding: 0 0 0 40px;
}
.infopanel h2, .infopanelflat h2 {
    margin: 0;
    color: #fff;
    padding: 0 0 0 40px;
}
.infopanel h3, .infopanelflat h3 {
    margin: 0;
    color: #fff;
    padding: 0 0 0 40px;
}
.infopanel p, .infopanelflat p {
    position: absolute;
    color: #fff;
    right: 15px;
    top: 13px;
    font-size: 14px;
}
.infopanelflat p a {
    color: #fff;
    margin-right: 10px;
    font-size: 16px;
}
.infopanelflat p a:hover {
    color: #b7b7b7;
    transition: 500ms;
}
.infopanel p a img, .infopanelflat p a img {
    float: none;
    margin-left: 5px;
    margin-right: 5px;
}
.infopanelflat p select {
    background: transparent;
    color: #fff;
    border: none;
    margin-left: 20px;
	width: 200px;
}
.infopanelflat p select option{
     color: black;
}
.infopanelLong {
    width: 300px !important;
}
/* Basic Table design */

.tableHeader h2 {
    padding-left: 10px;
    padding-top: 12px;
    color: #fff;

}
.tableHeader h2 i {
    font-size: 20px;
}
#spanleft {
    float: left;
}
#spanright {
    float: right;
    padding-right: 10px;
    font-size: 13px;
}
table {
    background: transparent;
}
.contentTable {
    text-align: center;
    width:100%;
}
.tablePadding {
    box-sizing: border-box;
    padding: 20px;
}
.tablehead {
    text-align: center;
    background: #333333c7;
}

/* Gray Heading of table */
.tableheadgray {
    background: #F2F2F2 !important;
}
.tableheadgray tr th {
    cursor: pointer;
    padding: 8px;
    color: #1d2a50b3 !important;
}
/* gray heading end */
.tablehead tr {
    text-align: center;
}
.tablehead tr th {
    color: #black;
    text-align: center;
    border-radius: 0px !important;
}

.tableBody {}
.tableBody tr {
    border-bottom: 1px solid #80808052;
}
.tableBody tr td {
    box-sizing: border-box;
    padding: 5px;
}
.tableBody tr td a {}
.tableBody tr td a span{}

/*------------------------------
        Button Design
-------------------------------*/

.generalButton {
    border: 1px solid;
    border-radius: 51px;
    padding: 6px;
    padding-left: 30px;
    padding-right: 30px;
    border-radius: 50px;
    background: transparent;
    /* box-shadow: 0 4px 5px 0 rgba(0, 0, 0, 0.05), 0 1px 10px 0 rgba(0, 0, 0, 0), 0 2px 4px 1px rgba(0, 0, 0, 0.18); */
}
.generalButton img {
    width: 20px;
}
.buttonMagenta {
    border: 1px solid #481190 !important;
    color: #fff;
    background: #481190;
    border-radius: 4px;
}
.buttonYellow {
    border: 1px solid #efaa23 !important;
    color: #fff;
    background: #efaa23;
    border-radius: 4px;
}
.buttonMagenta:hover {
    border: 1px solid #482385 !important;
    color: #ffffff;
    background: #482385;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
}
.buttonYellow:hover {
    border: 1px solid #ffbe47a8 !important;
    color: #fff;
    box-shadow: 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12), 0 2px 4px -1px rgba(0,0,0,.2);
}
.soSearch {
    background: #481190 url(../global/images/icons/contractt.svg) no-repeat !important;
    background-size: 20px;
    background-position: 10px;
}
.newSO {}