﻿/* This file is best edited in an editor that understands  CSS  syntax.  We recommend "Visual Studio Code" which is free and makes it easy to write CSS.*/
/* We would recommend that this file only be modified by people with at least a basic unserstanding of CSS. */

/* If a section is left blank, then the standard Frontier colors and style will be used.*/

/* We have disabled the classes below by adding the XX-  to the start of each class.
   To use a section, simply remove the XX- from the class name and adjust the parameters.
   e.g.  change   .XX-clientLogo   to    .clientLogo
*/

/* The logo that appears on the top of some pages.
   A logo with a transparent background is usually best as it lets the color of the current background show through.
*/
.clientLogo
{
    margin-left: 5px;
}
/* The background that appears on some pages.  NOTE: on some pages, the background is controlled by the clientBackgroundInternal setting.*/
.clientBackground
{
  background-image:none;  /*override the standard image*/
  background-color: white;
}

/* The background that appears on data-entry or mostly text screens. It was found that some colourful backgrounds make it quite difficult to read
   the text on the screen.  On these pages, you can use an alternate background colour.  If your standard background colour or image is ok, then 
   you can just duplicate the setting here.
*/
.XX-clientBackgroundInternal {
    /* background-image: url('images/your_background.jpg'); */
    background-color: antiquewhite;
}



/* You can place your own footer logo here.  Remember that this will mainly be shown on mobile phones, so we recommend a logo around the 180px wide by 55px high. 
   Remember to adjust the noted items with the height and width of your logo.  A logo with a transparent background is usually best as it lets the color of
   the background show through.
*/
.XX-clientFooterLogo
{
  display: block;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: url(../Content/images/Logo/oys_logo.png) no-repeat;
  width: 180px; /* Width of new image */
  height: 54px; /* Height of new image */
  padding-left: 180px; /* Equal to width of new image */
  padding-top: 10px;
  background-position-x: center;
  background-position-y: center;
}

/* This controlls the layout of the client Footer and client Footer text.
   If you only have a logo on the footer, but no text, you may wish to turn off the float, so that your logo appears in the center. */
.XX-clientFooterMain
{
     float: none !important; 
     margin: auto;
     width: 180px;
}
/* Use this to control the background color of the footer.*/
.XXclientFooter
{
    background-color: darkorange;
}
/* if you only have a logo on the footer, but no text, you may wish to hide the standard text.*/
.clientFooterText
{
    /* below is the standard settings for the text.*/
    /*text-align: left;
    padding-left: 100px; 
    padding-top: 10px;*/
    color: white;
}



/* Buttons on the bottom of some pages are broken into recommended buttons and secondary buttons.  
   This section controls the look of the recommended buttons.  Note there is a :hover setting that can change the look of the button when the user hovers over it. */
.recommendedButton 
{
    color: white; /*text color*/
    background-color: #dc6d1e; /*button color*/
}
.recommendedButton:hover 
{
    color: #dc6d1e;
    background-color: white;
}

/* Buttons on the bottom of some pages are broken into recommended buttons and secondary buttons.  
   This section controls the look of the secondary buttons.  Note there is a :hover setting that can change the look of the button when the user hovers over it. */
.secondaryButton 
{
    color: white;
    background-color: #dc6d1e;
}
.secondaryButton:hover 
{
    color: #dc6d1e;
    background-color: white;
}

.mapButton:hover 
{
    background-color: blue;
}



/* The "snap" drawers are the slide out panes used for the main menu, the search box and the attachments box.  
   This section controls the background colour of the left box.
*/
.XX-snap-drawer-left
{
    background-color: aqua !important;
}
/* The "snap" drawers are the slide out panes used for the main menu, the search box and the attachments box.  
   This section controls the background colour of the right box.
*/
.XX-snap-drawer-right
{
    background-color:bisque !important;
}
.ftrSnapTextSmall 
{
    color: white !important;
}
.ftrSnapTextSmall:hover 
{
    color: #dc6d1e !important;
}
   

/* controls the look of the Vacancy and Saved applications lists. */
.XX-clientVacancyContainer
{
    background-color: darkolivegreen;
}

.XX-clientVacancyListHeader
{
    background-color: aquamarine !important;
    color: darkgreen !important;
}
.XX-clientVacancyListRow
{
    background-color: aqua;
}


/* Controls the size and color of the icons shown at the top of the application pages.  You can hide this to increase screen real-estate.*/
.XX-clientIconApplication
{
    visibility: hidden;
    width: 0; 
    height: 0; 
    margin-top: 0; 
    margin-bottom: 0;
}


/* controls the look of the application 'grid' type screens (e.g. REF).*/
/* controls the look of the overall area of the grid*/
.XX-clientPopupGrid
{
    background-color: darkmagenta;
}
/* controls the look of the header of the grid*/
.XX-clientListHeader 
{
    background-color: aquamarine !important;
        color: darkgreen !important;
}
/* you can control the look of the odd and even rows.*/
.XX-clientListEvenRow
{
    background-color: aqua !important;
}
.XX-clientListOddRow
{
    background-color: aquamarine !important;
}
/* Controls the look of the 'popup' dialog pages used to enter each record on 'grid' type screens (e.g. REF). */
.XX-clientDialog  
{
    background-color:aqua !important;
    color: darkgreen !important;
}
/* buttons on the popup dialogs used for entering multiple records, such as the REF records, or on confirmation popups, such as delete.*/
.XX-clientDialogButtonPrimary
{
    background-color: darksalmon !important;
}


label.resetLabel 
{
    color: #0c57a5;
}

/* The table container is used in places like the vacancy detailed description and error and confirmation pages.*/
.XX-clientTableContainer
{
    color: black !important;
    background-color:antiquewhite !important;
}

