/* ========================================================================
 * Revision Date: 12/07/2016
 * ========================================================================
 * IPC 2016 Base Skin 
 * ========================================================================
 */

/* For design only - Use this to quickly hide items such as the nav bar or header during design */
.hide {
    display: none;
}

/***** Outer elements and Sheet Style *****/
body {
    margin: 0;
    font-size: 10pt;
    font-family: 'Open Sans', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
    cursor: default;
}

#ipc-main {
    background: #FFFFFF !important;
    font-size: 10pt;
    font-family: 'Open Sans', Arial, 'Arial Unicode MS', Helvetica, Sans-Serif;
    cursor: default;
}

.ipc-backend {
    width: 100% !important;
}

.ipc-frontend {
    width: 1000px !important;
}

.ipc-sheet {
    background: #FFFFFF !important;
    border-top: none;
}


/***** Header *****/

.ipc-header {
	background-size: auto;
    background-color: #fff !important;
    background-repeat: no-repeat;
    background-position: center top;
}

@media (max-width: 1248px) {
    .ipc-header {
        background-color: #fff !important;
        background-repeat: no-repeat;
        background-position: center top;
    }
}

/***** Telerik&HTML Navigation *****/
/*Navigation Bar Styles*/
.ipc-nav {
    background: #004B85;
    border-top: 4px solid #D7E9FD;
    padding: 1px;
    text-align: center;
}

.desktop .ipc-nav {
    min-width: 300px !important;
    max-width: 100% !important;
    padding-left: 6px;
    padding-right: 6px;
}

/*Responsive Toggle Button*/
.ipc-nav .ipc-menu-btn {
    background: #004B85;
    border: 1px solid #404040;
}

    .ipc-nav .ipc-menu-btn span {
        background: #E0E0E0;
    }

    .ipc-nav .ipc-menu-btn:hover span {
        background: #f3f3f3;
    }

/***** The following style ensures Multi Level Navigation *****/
* {
}

/***** Horizontal Mega Menu *****/
ul.ipc-hmenu > li:before {
    content: ' ';
    top: 0;
    left: -5px;
    width: 5px;
    height: 42px;
    background: url('images/menuseparator.png') center center no-repeat;
}

/* Top Level Items ipc-hmenu-toplevel */
ul.ipc-hmenu > li > a, .ipc-hmenu-toplevel {
    margin: 0 auto;
    background: #004B85;
    color: white;
    line-height: 38px;
    height: 42px;
    text-decoration: none;
    text-align: center;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid transparent;
    padding: 0 22px;
    cursor: pointer;
}

    /* Top Level Items Active */
    ul.ipc-hmenu > li > a.active {
        /*No style, but some projects mark the active link in a different colour. */
    }

    /* Top Level Items when Hovered */
    ul.ipc-hmenu > li > a:hover, .desktop ul.ipc-hmenu > li:hover > a {
        background: #004B85;
        color: #D7E9FD;
    }

/* Top Level Menu Options Only */
.ipc-hmenu > li > a, .ipc-hmenu > li > a:link, .ipc-hmenu > li > a:visited, .ipc-hmenu > li > a.active, .ipc-hmenu > li > a:hover {
    font-size: 10pt;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    text-transform: uppercase;
    text-align: left;
}

/* Style applies to all link items in the menu regardless of the level */
.ipc-hmenu ul a, .ipc-hmenu ul a:link, .ipc-hmenu ul a:visited, .ipc-hmenu ul a.active, .ipc-hmenu ul a:hover {
    height: 32px;
    min-width: 7em;
    border: 0 solid transparent;
    text-align: left;
    line-height: 32px;
    font-size: 10pt;
    text-decoration: none;
    text-transform: uppercase;
    margin: 0;
}

/***** Vertical Dropdown Menu *****/
ul.ipc-vmenu > li:before {
    position: absolute;
    display: block;
    content: ' ';
    top: 0;
    left: -5px;
    width: 5px;
    height: 42px;
    background: url('images/menuseparator.png') center center no-repeat;
}

/* Top Level Items ipc-vmenu-toplevel */
ul.ipc-vmenu > li > a, .ipc-vmenu-toplevel {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    border: 1px solid transparent;
    background: #004B85;
    padding: 0 22px;
    margin: 0 auto;
    position: relative;
    display: block;
    height: 42px;
    cursor: pointer;
    text-decoration: none;
    color: #FFFFFF;
    line-height: 38px;
    text-align: center;
}

    /* Top Level Items Active */
    ul.ipc-vmenu > li > a.active {
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        padding: 0 22px;
        margin: 0 auto;
        font-weight: bold;
        font-style: normal;
        text-decoration: none;
        text-transform: uppercase;
    }

    /* Top Level Items when Hovered */
    ul.ipc-vmenu > li > a:hover, .desktop ul.ipc-vmenu > li:hover > a {
        background: #003964;
        color: white;
    }

/* Top Level Menu Options Only */
.ipc-vmenu > li > a, .ipc-vmenu > li > a:link, .ipc-vmenu > li > a:visited, .ipc-vmenu > li > a.active, .ipc-vmenu > li > a:hover {
    font-size: 10pt;
    font-weight: bold;
    font-style: normal;
    text-decoration: none;
    text-transform: uppercase;
    text-align: left;
}

/* Style applies to all link items in the menu regardless of the level */
.ipc-vmenu ul a, .ipc-vmenu ul a:link, .ipc-vmenu ul a:visited, .ipc-vmenu ul a.active, .ipc-vmenu ul a:hover {
    display: block;
    white-space: nowrap;
    height: 32px;
    min-width: 7em;
    text-align: left;
    line-height: 32px;
    text-decoration: none;
    text-transform: uppercase;
    margin: 0;
}

/**** Inner Menu Classes for both kinds of menus ****/

/*This is the box that shows up when a top menu item is hovered. Change this background-color attribute to change its colour. */
.ipc-hmenu-mega-menu, ul.ipc-hmenu > li ul, ul.ipc-vmenu > li ul {
    border-radius: 4px;
    background-color: #F0F0F0;
    position: absolute;
}

/* Classes for Inner Items in the menu */
.ipc-hmenu-noselectable {
    font-weight: bold !important;
    color: #000000;
    cursor: default;
}

    .ipc-hmenu-noselectable:hover {
        color: #000011;
        cursor: default;
    }

.ipc-hmenu-selectable {
    color: #000000;
}

    .ipc-hmenu-selectable:hover {
        border-radius: 4px;
        border: 1px solid #a3aec4;
        background-color: #FFFFFF;
    }

/***** Body Elements *****/

/* Fixed width content section of the page */
.ipc-layout-wrapper {
    padding: 10px;
}

/* This class wraps and centers any element */
.ipc-container {
    margin: 0px auto;
    display: table;
}

/***** Footer *****/

.ipc-footer {
    background: #FFFFFF;
    background: -webkit-linear-gradient(top, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    background: -moz-linear-gradient(top, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    background: -o-linear-gradient(top, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    background: -ms-linear-gradient(top, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    -svg-background: linear-gradient(top, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    background: linear-gradient(to bottom, #D1D1D1 0, #F0F0F0 90%, #E0E0E0 90%, #E0E0E0 100%) no-repeat;
    font-size: 10pt;
    text-align: center;
    border-top: 2px solid #495F88 !important;
    padding: 10px;
    margin: 10px auto 0;
}

    .ipc-footer a, .ipc-footer a:link {
        color: #1F5CE0 !important;
        text-decoration: none;
    }

        .ipc-footer a:visited {
            color: #5974A6 !important;
            text-decoration: none;
        }

        .ipc-footer a:hover {
            color: #5080E7 !important;
            text-decoration: underline;
        }

        .ipc-footer a, .ipc-footer a:link, .ipc-footer a:visited, .ipc-footer a:hover, .ipc-footer td, .ipc-footer th, .ipc-footer caption {
            /*All text inside footer: font-size, spacing and fonttype can be overriden*/
            font-size: 10pt;
            line-height: 175%;
        }

    .ipc-footer li {
        font-size: 10pt;
        line-height: 125%;
    }

/***** Web Controls *****/

/***** Inputs *****/
.ipc-textbox {
    background: #FFFFFF;
    border: 1px solid #CCC;
    color: #004B85;
    font-size: 10pt;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 4px 0;
}

.ipc-listbox {
    background: #FFFFFF;
    border: 1px solid #CCC;
    color: #004B85;
    font-size: 10pt;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 4px 0;
}
/***** Search inputs *****/
.ipc-search {
    background: #A7AABB !important;
    color: #000000 !important;
    font-size: 10pt;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    padding: 4px 0;
}

.ipc-search-button {
    background: url('images/searchicon.png') center center no-repeat;
    width: 24px;
    height: 36px;
    float: left;
    border: none;
    cursor: pointer;
    vertical-align: middle;
}

/***** Special Button *****/
.ipc-button-special {
    background: #004B85;
    color: #FFFFFF;
    height: 64px;
    line-height: 32px;
    font-size: 10pt;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
    border-width: 0;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    position: relative;
    display: inline-block;
    overflow: visible;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,0.2);
}

    .ipc-button-special:hover {
        background: #28364B;
        color: #CCCED7 !important;
    }


/***** Buttons *****/
.ipc-button {
    background: #004B85;
    color: #FFFFFF;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border-width: 0;
    font-size: 10pt;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    display: inline-block;
    overflow: visible;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,0.2);
	top: -7px;
	left: -107px;
	width: 125px;
	height: 25px;
}
.ipc-button-red {
    background: #f44336;
    color: #FFFFFF;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border-width: 0;
    font-size: 10pt;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    display: inline-block;
    overflow: visible;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,0.2);
	top: -7px;
	left: -107px;
	width: 125px;
	height: 25px;
}

    .ipc-button:hover {
        background: #64AD45;
        color: #FFFFFF;
    }

    .ipc-button:disabled {
        background: #808080 !important;
        color: #000000 !important;
    }

/***** Dropdown *****/
.ipc-dropdown {
    border: 1px solid #000000;
    color: black;
    font-size: 10pt;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    height: 24px;
}
.ipc-req-dropdown {
    border: 1px solid #FF0000;
    color: black;
    font-size: 10pt;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    height: 24px;
}
/***** Checkbox *****/
.ipc-checkbox {
    cursor: pointer;
    font-size: 10pt;
    line-height: 16px;
    color: black;
    height: 20px;
}

    .ipc-checkbox:hover {
        background: #B9DBF5;
    }

    /*Label rendered next to the checkbox*/
    .ipc-checkbox label {
        padding: 0;
    }

/***** Radiobuttons *****/
.ipc-radiobutton {
    cursor: pointer;
    font-size: 10pt;
    line-height: 16px;
    color: #373A47;
    height: 20px;
}

    .ipc-radiobutton:hover {
        background: #B9DBF5;
    }

    /*Label rendered next to the radiobutton*/
    .ipc-radiobutton label {
        padding: 0;
    }

/***** Labels *****/
    .ipc-page-title {
        justify-content: center;
		color: black ;
        font-size: 24pt !important;
        margin-top: 100px !important;
	    font-weight: bold;

    }

.ipc-label {
    color: black ;
    font-size: 10pt;
    padding: 5px;
    display: inline-block;
    vertical-align: baseline;
}

.ipc-explain-label {
    font-size: 11pt;
    color: #000000;
    padding-top: 5px;
    padding-left: 10px;
    display: block;
    padding: 5px 5px;
    border-left: 5px solid #51d021;
    border-radius: 5px;
    background-color: #EFEFEF;
    box-shadow: 0px 0px 5px 1px #000040;
    width: 90%;
    margin: 0 auto;
    text-align: left;
}

    .ipc-explain-label:empty {
        font-size: 10pt;
        color: #000000;
        padding-top: 5px;
        padding-left: 10px;
        display: none !important;
        padding: 5px 10px;
        border-left: 5px solid #51d021;
        border-radius: 5px;
        background-color: white;
        box-shadow: 0px 0px 5px 1px #9b9c9e;
        /* margin-left: 40px; */
        width: 90%;
        margin: 0 auto;
        /* margin-right: 40px; */
        text-align: left;
    }

@media (max-width: 768px) {
    .ipc-explain-label {
        /* margin-left: 10px; */
    }
}

.ipc-error-label {
    color: red;
    font-size: 10pt;
    font-weight: bold;
    padding: 5px;
}

.ipc-small-red-label {
    color: red;
    font-size: 10pt;
    padding: 5px;
}

.ipc-bold-label {
    font-weight: bold;
    font-size: 10pt;
    padding: 5px;
}

.ipc-big-bold-label {
    font-weight: bold;
    font-size: 14pt;
    padding: 5px;
}

.ipc-bold-blue-label {
    font-weight: bold;
    color: blue;
    padding: 5px;
}

.ipc-explain-label {
    color: black;
    padding: 5px;
    font-style: italic;
}

.ipc-req-label {
    color: #FF2400;
    font-size: 10pt;
    padding: 10px;
    font-weight: bold;
}

.ipc-White-Label {
	font-family: Arial;
	font-size: 10pt;
	font-weight: bold;
	color: #FFFFFF;
	text-decoration: none;
}

.ipc-Dashboard-White-Label {
    font-family: Arial;
    font-size: 16pt;
    font-weight: bold;
    color: #FFFFFF;
    text-decoration: none;
}

.ipc-Dashboard-Black-Label {
    font-family: Arial;
    font-size: 16pt;
    font-weight: normal;
    color: #000000;
    text-decoration: none;
}

.ipc-small-label {
    color: black;
    font-size: 8pt;
}

/***** Links *****/
.ipc-link {
    color: #004B85;
}

    .ipc-link:hover {
        color: #5D6167;
    }

.ipc-login-link {
    color: #004B85;
    text-align: right;
}

/***** Grids & Tables *****/
.ipc-grid {
    text-align: center;
    vertical-align: middle;
    padding: 5px;
}

.ipc-grid-topper {
    background: #E9E8E7;
    border: 1px solid #000000;
    color: #050663;
    font-size: 10pt;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    padding: 4px;
}

.ipc-grid-header {
    background: #004B85;
    color: #FFFFFF;
    font-size: 10pt;
    padding: 5px;
}

    .ipc-grid-header > a {
        color: inherit;
    }

.ipc-grid-row {
    background: #FFFFFF;
    color: #000000;
    font-size: 10pt;
}

.ipc-grid-row-alternating {
    background: #E9E8E7;
    color: #000000;
    font-size: 10pt;
}

.ipc-grid-row-selected {
    background: #C0D6E4;
    color: #000000;
    font-size: 10pt;
}

.ipc-grid-commanditem {
    background: #8b8b8a;
}

    .ipc-grid-commanditem a {
        background: #2F2F2F;
        font-weight: bold;
        color: #FFFFFF;
        -webkit-border-radius: 2px;
        -moz-border-radius: 2px;
        border-radius: 2px;
        border-width: 0;
        height: 32px;
        line-height: 32px;
        font-size: 10pt;
        padding: 5px;
        text-decoration: none;
    }

        .ipc-grid-commanditem a:hover {
            background: #BA1115;
            color: #FFFFFF;
        }

.ipc-grid-footer {
    background: #004B85;
    color: #FFFFFF;
    font-size: 10pt;
    padding: 5px;
}

    .ipc-grid-footer a {
        color: inherit;
    }

        .ipc-grid-footer a:hover {
            color: #BA1115;
        }


.ipc-grid-pager {
    background: #8b8b8a;
    color: #FFFFFF;
}

    .ipc-grid-pager a {
        color: inherit;
        text-decoration: none;
    }

        .ipc-grid-pager a:hover {
            color: #BA1115;
        }

/***** Images *****/
.ipc-img-left {
    float: left;
    text-align: center;
    margin: 0px 15px 15px 0px;
}

/***** Video Containers *****/
.video-container {
    position: relative;
    width: 750px;
    margin: 0 100px 0 -100px;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

    .video-container iframe,
    .video-container object,
    .video-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

.videoWrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    padding-top: 25px;
    height: 0;
}

    .videoWrapper iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

@media all and (max-width: 768px) {
    .video-container {
        max-width: 300px;
        margin: 0 auto;
        position: relative;
        padding-bottom: 56.25%;
        padding-top: 30px;
        height: 0;
        overflow: hidden;
    }

        .video-container iframe,
        .video-container object,
        .video-container embed {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }
}
/***** Telerik Controls *****/
/*Added by using the DateInput-CssClass attribute*/
/*DatePicker Inner Textbox (DateInput)*/
.ipc-datepicker-textbox {
    background-color: #E9E8E7 !important;
    border: 0px solid white !important;
}

.ipc-calendar-title {
    background: #3CA2B0;
    color: #FFFFFF;
    font-weight: bold;
}

.ipc-calendar-header {
    background: #2EB2CB;
    color: #FFFFFF;
}

.ipc-calendar-day {
    background: #E1FBFE;
    color: #000000;
}

.ipc-calendar-day-hover {
    background: #456594 !important;
}

.ipc-calendar-weekend {
    background: #FAFFFF;
    color: #000000;
}

.ipc-calendar-othermonth {
    background: #FAFFFF;
    color: darkgrey;
}

.ipc-calendar-selected {
    background: #456594 !important;
    color: #FFFFFF;
}

.ipc-calendar-disabled {
    background: #6D87A0;
    color: #000000;
}

/*RadUpload*/

.ipc-upload input[type=text] {
    background: #000000 !important;
    border: 1px solid #E9E8E7 !important;
    color: #2F2F2F !important;
    font-size: 10pt !important;
    -webkit-border-radius: 2px !important;
    -moz-border-radius: 2px !important;
    border-radius: 2px !important;
    padding: 4px 0 !important;
}

.ipc-upload input[type=button] {
    background: #2F2F2F !important;
    font-weight: bold !important;
    color: #FFFFFF !important;
    -webkit-border-radius: 4px !important;
    -moz-border-radius: 4px !important;
    border-radius: 4px !important;
    border-width: 0 !important;
    font-size: 10pt !important;
    text-align: center !important;
    vertical-align: middle !important;
    cursor: pointer !important;
    position: relative !important;
    display: inline-block !important;
    overflow: visible !important;
    -webkit-box-sizing: content-box !important;
    -moz-box-sizing: content-box !important;
    box-sizing: content-box !important;
    box-shadow: inset 0 -2px 0 rgba(0,0,0,0.5);
}

    .ipc-upload input[type=button]:hover {
        background: #BA1115 !important;
        color: #FFFFFF !important;
    }

/*RadTabStrip*/

.ipc-tabstrip-bar {
    background: #004F94 !important;
    height: 32px;
}

.ipc-tabstrip-tab {
    background: #127C22 !important;
    color: #FFFFFF !important;
    height: 32px;
    line-height: 32px;
    margin-right:2px;
}

.ipc-tabstrip-tab-hovered {
    background: #BA1115 !important;
    color: #FFFFFF !important;
}

.ipc-tabstrip-tab-selected {
    background: #FEFF04 !important;
    color: #000000 !important;
}

.ipc-tabstrip-tab-disabled {
    background: #808080 !important;
    color: #000000 !important;
}

.ipc-centered-box {
    margin: 0 auto;
    padding: 10px 20px;
    width: 800px;
    background: white;
    border: 5px solid #808080;
}

@media (max-width: 768px) {
    .ipc-centered-box {
        width: 80%;
    }
}

@media (max-width: 350px) {
    .ipc-centered-box {
        width: 100%;
    }
}


.ipc-floating-box {
    width: 250px;
    height: 263px;
    margin: 5px;
    padding: 20px;
    display: inline-block;
    text-align: center;
}


.ipc-large-centered-box {
    margin: 0 auto;
    padding: 10px 20px;
    width: 1200px;
    background: white;
    border: 1px solid #808080;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

@media (max-width: 768px) {
    .ipc-large-centered-box {
        width: 80%;
    }
}

@media (max-width: 350px) {
    .ipc-large-centered-box {
        width: 100%;
    }
}

