﻿@import url("/DublinTheme/Theme.DublinTheme.css?2128");

/*
    How to generate a theme for your company: 
    
        1 - Go to http://labs.outsystems.net/ThemeCustomizer/GenerateDublin.aspx
        2 - Copy the generated CSS
        3 - Paste it here

*/

/*------------------------------------*\
             Import Font
\*------------------------------------*/

/*------------------Import of marketing fonts------------------*/

@font-face {
    font-family: "Inter";
    src: url(/MembershipPortal/css/fonts/Inter-VariableFont_opsz,wght.ttf) ;
    src: url('/MembershipPortal/css/fonts/inter-variablefont_opszwght.woff') format('woff'),
         url('/MembershipPortal/css/fonts/inter-variablefont_opszwght.woff2') format('woff2');
    font-optical-sizing: auto;
}

@font-face {
    font-family: 'ArizonaFlareMedium';
    src: url('/MembershipPortal/css/fonts/ABCArizonaFlare-Medium.otf');
    src: url('/MembershipPortal/css/fonts/ABCArizonaFlare-Medium.otf') format('opentype'),
        url('/MembershipPortal/css/fonts/ABCArizonaFlare-Medium.woff') format('woff'),
        url('/MembershipPortal/css/fonts/ABCArizonaFlare-Medium.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Regular.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Regular.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Regular.svg#Open-Sans') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Bold.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Bold.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Bold.svg#Open-Sans') format('svg');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Italic.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Italic.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Italic.svg#Open-Sans') format('svg');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Open-Sans';
    src: url('/SilkUIFonts/fonts/OpenSans-Semibold.eot');
    src: url('/SilkUIFonts/fonts/OpenSans-Semibold.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.woff') format('woff'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/OpenSans-Semibold.svg#Open-Sans') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald';
    src: url('/SilkUIFonts/fonts/Oswald-Regular.eot');
    src: url('/SilkUIFonts/fonts/Oswald-Regular.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/Oswald-Regular.woff') format('woff'),
         url('/SilkUIFonts/fonts/Oswald-Regular.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/Oswald-Regular.svg#oswaldregular') format('svg');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald';
    src: url('/SilkUIFonts/fonts/Oswald-Bold.eot');
    src: url('/SilkUIFonts/fonts/Oswald-Bold.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/Oswald-Bold.woff') format('woff'),
         url('/SilkUIFonts/fonts/Oswald-Bold.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/Oswald-Bold.svg#oswaldbold') format('svg');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Oswald';
    src: url('/SilkUIFonts/fonts/Oswald-Light.eot');
    src: url('/SilkUIFonts/fonts/Oswald-Light.eot?#iefix') format('embedded-opentype'),
         url('/SilkUIFonts/fonts/Oswald-Light.woff') format('woff'),
         url('/SilkUIFonts/fonts/Oswald-Light.ttf') format('truetype'),
         url('/SilkUIFonts/fonts/Oswald-Light.svg#oswaldlight') format('svg');
    font-weight: 300;
    font-style: normal;
}

/*------------------------------------*\
             Font Definition
\*------------------------------------*/

html, body, a, select, form, fieldset, table, tr, td, img, input, button, select, textarea, optgroup, option {
    font-family: "Inter", arial, helvetica, sans-serif;
}

.TileIcon_text, .TileNumber_text, .TileIconText_label, .Heading1, .Heading2, .Heading3, .Heading4, .Header_title a, .EditableTable thead td, .TableRecords_Header {
    font-family: "Inter", arial, helvetica, sans-serif;
}

/*------------------------------------*\
              Font Classes
\*------------------------------------*/

/* Font Oswald classes */

.Oswald_Regular {
    font-family: 'Oswald',Meiryo;
    font-weight: 400;
}

.Oswald_Bold {
    font-family: 'Oswald',Meiryo;
    font-weight: 700;
}

.Oswald_Light {
    font-family: 'Oswald',Meiryo;
    font-weight: 300;
}

/* Font OpenSans classes */

.OpenSans_Regular {
    font-family:  'Open-Sans', Meiryo, sans-serif;
    font-weight: 400;
}

.OpenSans_Bold {
    font-family:  'Open-Sans', Meiryo, sans-serif;
    font-weight: 700;
}

.OpenSans_Italic {
    font-family:  'Open-Sans',Meiryo, sans-serif;
    font-style: italic;
}

.OpenSans_Semibold {
    font-family:  'Open-Sans',Meiryo, sans-serif;
    font-weight: 600;
}
.inter-regular {
  font-family: "Inter", sans-serif;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

:root {
    --color-error: #91000C;
    --main-bg-color: #EDEAE2;
    --color-primary: #0D2239;
    --color-secondary: #8CC5FE;
    --color-primary-hover: #5E6C7B;
    --color-secondary-hover: #8CC5FE;
    --color-link: #205f9E;
    --color-link-hover: #153F69;
}

html, body {
    background-color: white;
    color: var(--color-primary);
    font-size: 18px;
    margin: 0;
    padding: 0;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

h2{
    margin: 0px;;
}

h3{
    margin: 0px;;
}

/***Link rewrite***/
a,
a:link,
a:visited {
    font-size: 18px;
    font-weight: normal;
    color:var(--color-link);
    text-decoration: none;
}

a:hover {
    font-size: 18px;
    font-weight: normal;
    color:var(--color-link-hover);
    text-decoration: underline;
}

a {
    font-size: 18px;
    font-weight: 600;
}

.labhead{
    background-color: var(--color-error);
    padding: 4px 8px;
    box-shadow: none;
    margin-bottom: 10px;
    font-size: 18px;
    color: #fff !important;
    width:220px ;
    margin-left: 0;
}
.memberdetailssection{
    /* clear: both; */
    width: 100%;
    margin-bottom: 15px;
}

.ContentDescription{
    font-family: "Inter", arial, helvetica, sans-serif;
    font-size: 18px;  
    padding-left:5px;
}

.outercontainer{
    font-family: "Inter", arial, helvetica, sans-serif;
    background: #fff !important;
    font-size: 18px;
    /*98% to be able to show the shadow on the right side of the containers*/
    width: 98%;
    max-width: 1000px;
    margin: 0 auto;
}

.Clearfix-section {
    content:"";
    clear:both;
    display:block;
}

.ColumnHeading{
    font-family: "Inter", arial, helvetica, sans-serif;
    background-color: #e8ebef;
    font-size: 18px;
    font-weight: bold;
    padding:10px;
}

.ColumnData{
    font-family: "Inter", arial, helvetica, sans-serif;
    font-size: 13px;
    padding: 12px 10px;
}


table thead tr th {
    text-transform: inherit !important;
}

table {
    border-radius: 0 !important; 
}

.Button {
    background-color: white;
    font-family: "Inter", arial, helvetica, sans-serif;
    padding: 12px;
    font-size: 14px;
    border-radius: 4px;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    box-shadow: none;
    height: 100%;
}
.Button:hover{
    background-color: var(--color-primary);
    font-family: "Inter", arial, helvetica, sans-serif;
    padding: 12px;
    font-size: 14px;
    border-radius: 4px;
    color: white;
    border: 1px solid var(--color-primary);
    box-shadow: none;
    height: 100%;
}

.Button_Primary{

}
.Button_Primary:hover{

}

.Button_Secondary {
    min-width: 80px;
    background-color: white;
    font-family: "Inter", arial, helvetica, sans-serif;
    padding: 12px;
    font-size: 14px;
    border-radius: 4px;
    color: var(--color-primary);
    border: 1px solid var(--color-primary);
    box-shadow: none;
    height: 100%;
}

.Button_Secondary:hover{
    min-width: 80px;
    background-color: var(--color-primary);
    font-family: "Inter", arial, helvetica, sans-serif;
    padding: 12px;
    font-size: 14px;
    border-radius: 4px;
    color: white;
    border: 1px solid var(--color-primary);
    box-shadow: none;
    height: 100%;
}

.Button_Default{
    background-color: var(--color-primary);
    font-family: "Inter", arial, helvetica, sans-serif;
    font-weight: 600;
    border-radius: 4px;
    color: white;
    padding: 12px;
    font-size: 14px;
    height: 100%;
    cursor: pointer;
}

.Button_Default:hover{
    background-color: var(--color-primary-hover);
    color: white;
    border: 1px solid var(--color-primary-hover);
}

.Button.ButtonDefault,
.Button.Is_Default{
    background-color: var(--color-primary);
    color: white;
    border: 1px solid var(--color-primary);
    text-shadow: none;
}

.Button.ButtonDefault:hover, .Button.Is_Default:hover {
    background-color: var(--color-primary-hover);
    color: white;
    border: 1px solid var(--color-primary-hover);
    text-shadow: none; 
}

input.Button {
    line-height: normal;
}

.desktop .Button.ButtonDefault:hover, .desktop .Button.Is_Default:hover {
    border: 1px solid var(--color-primary-hover);
    background-color: var(--color-primary-hover);
}

.containersection {
    box-shadow: 1px 2px 7px 1px #d6d6d6;
    padding: 15px 5px 10px 5px;
}

.triangle_pointer {
    margin: 6px 5px 0 0;
}


.Button[disabled],.Button:disabled {
    background-color: #d4d4d4;
    font-family: "Inter", arial, helvetica, sans-serif;
    border: 1px solid #d4d4d4;
    border-radius: 4px;
    color: var(--main-bg-color) !important;
}

.labfields
{
    font-weight: bold;
}

.labForm{
    color: var(--color-primary);
    font-weight: bold;
    font-size: 18px;
}
.labbold{
 font-weight: bold;
 }
 
select {
    height: 28px;
    padding: 0px 20px 0px 8px;
    line-height: 1;
    width: auto !important;
    border-radius:0 !important;
    color: var(--color-primary);
    font-size: 18px;
}


input.input_height  {
    border-radius:0 !important;
}

.blue_heading {
    color: var(--color-primary);
    line-height: 27px;
    font-size: 18px;
    font-weight:700;
}

.SquareBullet{
    font-family: "Inter", arial, helvetica, sans-serif;
    background-repeat: no-repeat;
    color: var(--color-primary);
    font-size: 18px;
    line-height: 17px;
    background-image: url(/MembershipPortal/img/bullet.png?2390);
    padding-left: 16px;
    padding-bottom: 8px;
    background-position: 1px 4px;
}

.Validationerror{
    background: url(/MembershipPortal/img/errorimg.svg   ) no-repeat scroll 16px 16px #ffd9d7;
    color: var(--color-error);
    -moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    padding: 16px 16px 16px 70px;
    margin-bottom: 20px;
    border: 1px solid #ffd9d7;
    border-radius: 4px 4px 4px 4px;
    font-size: 14px;
}

.ValidationInfo{
    background: url(/MembershipPortal/img/infoimg.svg   ) no-repeat scroll 16px 16px #c5e2fe;
    -moz-border-radius: 4px 4px 4px 4px;
    -webkit-border-radius: 4px 4px 4px 4px;
    padding: 16px 16px 16px 70px;
    margin-bottom: 20px;
    border: 1px solid #c5e2fe;
    border-radius: 4px 4px 4px 4px;
    font-size: 14px;
}

.Validationcontent {   
    background-repeat: no-repeat;
    background-position: 0 49%;
    display: list-item;
    list-style-type: disc;
    margin-bottom: 6px;
}
.Bullet_mark {
    position: relative;
}
.Bullet_mark:after {
    position: absolute;
    color: black;
    content: "";
    top: 6px;
    background-color: black;
    width: 5px;
    height: 5px;
    z-index: 999;
    left: -13px;
    border-radius: 50%;
}


.TableRecords_Header {
    background-color: var(--main-bg-color);
    border-bottom: none;
    color: var(--color-primary);
    font-size: 16px; 
    font-weight: bold;
    letter-spacing: 1px;
    padding: 8px;
    text-transform: uppercase;
}

.TableRecords {
    border: none;
    border-radius: 4px;
    padding: 0;
}

.TableRecords_OddLine,
.TableRecords_EvenLine {
    font-size: 16px;;
    padding: 10px;
    vertical-align: middle;
    border:none;
    background-color: #fff;
}

.TableRecords_EvenLine .ddltypemanage {
   background-color: #fff;
}
.TableRecords_OddLine .ddltypemanage {
   background-color: #fff;
}
.Form .ddltypemanage.ReadOnly, .ddltypemanage {
    text-indent: 0px;
    font-size:  18px;
}

.modular-box-wide {
    background-color: #FFFFFF;
    float: none;
    vertical-align: top;
    display: inline-block;
    zoom: 1;
    padding: 20px;
    margin: 10px 0px 10px 0px;
    box-shadow: 3px 3px 5px 2px #D6D6D6;
    width: 99%;
}

.RenewalDate{    
    font-family: "Inter", arial, helvetica, sans-serif;
    font-size: 18px;
    line-height: 17px;
    color: var(--color-primary);
}

.redTitleLabel {
    color: var(--color-primary);
    font-size: 44px;
    padding-left: 8px;
    padding-right: 8px;
    font-family: "ArizonaFlareMedium", arial, helvetica, sans-serif;
}

.redTitleLabelSmall {
    color: var(--color-primary);
    font-size: 38px;
    padding-left: 8px;
    padding-right: 8px;
    font-family: "ArizonaFlareMedium", arial, helvetica, sans-serif;
}

.modulat_box{
    background-color: #FFFFFF;
    width: 100%;
    float: none;
    vertical-align: top;
    display: inline-block;
    padding-top: 10px;
    padding-bottom: 10px;
    margin: 10px 20px 10px 0;
    box-shadow: 3px 3px 5px 2px #D4D4D4;
}

.modulat_box a{
    color: var(--color-primary);
    font-family: "Inter", arial, helvetica, sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 18px;
}

.modulat_box_text{
    margin-top:10px;
    margin-left: 8px;
    margin-right: 8px;
    font-size: 18px;
    line-height: 27px;
    display: block;
}

.TableRecords_OddLine:last-child, .TableRecords_EvenLine:last-child, .TableRecords_Header:last-child {
    padding-right: 8px;
}

.TableRecords_OddLine:first-child, .TableRecords_EvenLine:first-child, .TableRecords_Header:first-child {
    padding-left: 8px;
}

.Columnsection
{
    box-sizing: border-box;
    width: 48%;
}

textarea,
select,
input {
    border: 1px solid #999792;
    border-radius: 4px;
    box-shadow: inset 0 2px 3px 0 rgba(0,0,0,.06);
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    color: var(--color-primary);
    font-size: 18px;
}

.Form label {
    color: var(--color-primary);
}

textarea,
select,
input[type="text"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
input[type="date"],
input[type="month"],
input[type="time"],
input[type="week"],
input[type="number"],
input[type="email"],
input[type="url"],
input[type="search"],
input[type="tel"],
input[type="color"],
.Form input.ReadOnly,
.Form textarea.ReadOnly,
.Form select.ReadOnly {
    background-color: #fff;
    border: 1px solid #999792;
    color: var(--color-primary);
    font-size: 18px;
    vertical-align: middle;
    padding: 8px 16px;
    height: 42px;
}


textarea.ReadOnly[readonly="readonly"], textarea.ReadOnly[disabled="disabled"], .Form select.ReadOnly[disabled="disabled"], .Form input.ReadOnly[readonly="readonly"], .Form input.ReadOnly[disabled="disabled"], textarea[disabled="disabled"], textarea[readonly="readonly"], select[disabled="disabled"], input[readonly="readonly"], input[disabled="disabled"] {
    background-image: none;
    color: #999;
    background-color: #f5f5f5;
    cursor: not-allowed;
}
input[type="text"]:focus, input[type="password"]:focus {
    border: 1px solid var(--color-link);
    box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, .06);
}

.Feedback_AjaxWait {
    top:30%;
    right: 45%;
}

.ContactWarning{
    color: var(--color-error);
}

.labelWeight{
    font-weight: bold;
}

.Termcondition{
    font-family: "Inter", arial, helvetica, sans-serif;
    font-size: 18px;
    color: var(--color-primary);
    cursor: pointer;
}

/*-Firefox hack css-*/
/*@-moz-document url-prefix() {
    select {
    height: 28px;
    padding: 0px 20px 0px 8px;
    line-height: 1;
    width: auto !important;
    border-radius:0 !important;
    color: #292929;
    font-size: 18px;
}

}*/

/**Button Yes/no **/
.YesNoDiv .ButtonGroup_button.Button:first-child{
    opacity: 1;
    border: 1px solid var(--color-primary);
    border-radius: 4px;;
    background-color: white;
    background-image: none;
    color: var(--color-primary);
    font-weight: bold;
    padding: 6px 10px;
    background-size: auto;
    background-repeat: repeat;
    background-position: center center;
    font-size: 16px;
    font-style: normal;
    text-align: center;
    width: 180px;
    height: 40px;
    text-decoration: none;
}

.YesNoDiv .ButtonGroup_button.Button:last-child{
    margin-left: 20px;
    opacity: 1;
    border: 1px solid var(--color-primary);
    border-radius: 4px;
    background-color: white;
    background-image: none;
    color: var(--color-primary);
    font-weight: bold;
    padding: 6px 10px;
    background-size: auto;
    background-repeat: repeat;
    background-position: center center;
    font-size: 16px;
    font-style: normal;
    text-align: center;
    width: 180px;
    height: 40px;
    text-decoration: none;
}

.YesNoDiv .ButtonGroup_button.Button:hover{
    background: var(--color-primary);
    color: white;
}
.YesNoDiv .ButtonGroup_button.Button.active{
    background: var(--color-primary);
    color: white;
}

.YesNoDiv .ButtonGroup_button *{
    margin-top: 5px;
}

.phone .YesNoDiv .ButtonGroup .ButtonGroup_button.Button{
    width: 48%;
    height: 45px;
}
.phone .YesNoDiv .ButtonGroup .ButtonGroup_button.Button:last-child{
    width: 48%;
    margin-left: 4%;
    height: 45px;
}

.AcademicDetail{
    background-color: var(--main-bg-color);
    padding: 10px;
    position: relative;
    color: var(--color-primary);
    font-size: 16px;
    width: 49%
}

/*Popup fix*/
.os-internal-ui-widget-overlay {
    position: fixed;
    top: 0px;
    left: 0px;
    background-color: transparent;
    opacity: 0.3;
}

.os-internal-Popup .os-internal-ui-dialog, .os-internal-Popup.os-internal-ui-dialog {
    -webkit-box-shadow: 2px 2px 5px 0px rgba(148,148,148,1) !important;
    -moz-box-shadow: 2px 2px 5px 0px rgba(148,148,148,1) !important;
    box-shadow: 2px 2px 5px 0px rgba(148,148,148,1) !important;
}

.MainPopup {
    background: var(--main-bg-color);
    display: table-cell;
    padding: 14px 16px;
    vertical-align: top;
}

.desktop .Button:hover, .desktop a.Button:hover {
    background-color: var(--color-primary);
    text-decoration: none;
}

.ValidationMessage {
    color: var(--color-error);
    display: block;
    font-size: 12px;
}

.Feedback_AjaxWait .Loader {
    left: 15px;
}

/*List navigation*/
span.ListNavigation_CurrentPageNumber, span.ListNavigation_CurrentPageNumber:hover {
    background-color: #fff;
    box-shadow: none;
    color: #999;
    cursor: default;
}

span.ListNavigation_CurrentPageNumber, span.ListNavigation_CurrentPageNumber:hover {
    color: #999;
    cursor: default;
}

a.ListNavigation_PageNumber:link, span.ListNavigation_CurrentPageNumber, span.ListNavigation_Ellipsis {
    background-color: #fff;
    border-right: 1px solid #17365D;
    color: #17365D;
}
/* Remove undo arrow from forms */
.Form input.SmartInput_Changed.ReadOnly + a.SmartInput_Undo, .Form textarea.SmartInput_Changed.ReadOnly + a.SmartInput_Undo, .Form select.SmartInput_Changed.ReadOnly + a.SmartInput_Undo {
    display: none; 
}

.ListItemBullet {
    display: list-item;
    list-style-type: disc;
    margin-left: 1em;
}