/***********************************************************************
 *      Main Body Tags
 *      basic font colours, weight, sizes for body headers and links
 ***********************************************************************/
@font-face {
  font-family: Heebo;
  src: url(./Heebo-VariableFont_wght.ttf);
}

body {
    margin:0 0;
    color:#000000;
    background-color:#F5F6F7;
    font-family:Heebo;
    text-align:left;
}

#utilityheader {
    width: 100%;
    background: #0075BE;
    height: 80px;
}

div h1 {
    font-family: Heebo;
    font-size: 14px;
    letter-spacing: 0.25px;
    line-height: 32px;
    color: #0075BE;
    width: 100%;
    margin: 0px;
}

#homepage_right_column{
    margin: 16px;
}

div #sectionHeader {
    font-family: Heebo;
    font-size: 24px;
    font-weight: 300;
    letter-spacing: 0px;
    line-height: 32px;
    color: #001928;
    margin: 32px 0px 16px 0px;
}

div #searchHeader{
    font-family: Heebo;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.25px;
    line-height: 24px;
    margin-bottom: 4px;
    color: #001928;
}

#searchInput, #irSuggestedId{
    font-family: Heebo;
    background-color: #FFFFFF;
    border: 1px solid #646C76;
    border-radius: 4px;
    padding: 12px 30px 12px 8px;
    width: -moz-available;
    width: -webkit-fill-available;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
}

#searchInput:focus {
  box-shadow: 0 0 0 2px #E6F9FE,0 0 0 3px #005587;
}

#helperText{
    font-family: Heebo;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.25px;
    line-height: 16px;
    color: #646C76;
    margin: 8px 0px 0px 0px;
}

#search_button {
    font-family: Heebo;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0.25px;
    line-height: 24px;
    text-align: center;
    text-transform: uppercase;
    color: #0075BE;
    border: 2px solid #0075BE;
    border-radius: 28px;
    padding: 4px 16px 4px 16px;
    margin: 24px 0px 32px 0px;
    background: border-box;
}

#search_button:focus, #search_button:hover {
    border: 2px solid #005587;
    border-radius: 16px;
    color: #005587;
    background-color: #E6F9FE;
    box-shadow: 0 0 0 2px #E6F9FE, 0 0 0 3px #005587;
}

#topTenList, #suggestedList {
    list-style-type: none;
    border-radius: 4px;
    padding: 16px 16px 16px 16px;
    background-color: #FFFFFF;
    box-shadow: 0 0 2px 0 rgba(0,25,40,0.012), 0 2px 2px 0 rgba(0,25,40,0.07);
    margin: 0px 0px 8px 0px;
}

#irMultiResponseList{
    list-style-type: none;
    padding: 0px;
    margin: 0px 0px 8px 0px;
}

#topTenList:focus {
    border: 1px solid #0075BE;
}

ul#topTen, ul.none {
    padding: 0px;
    margin: 0px;
}

a#helpnSupport {
    font-weight: 500;
    text-decoration: underline;
    color: #0075BE;
    background: url(../images/linkAccessibleBlue.svg);
    width: 80px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: right;
    padding-right: 24px;
}

a#helpnSupport:focus, a#helpnSupport:hover {
    color: #005587;
    border-radius: 4px;
    background: url(../images/linkUltramarine.svg);
    background-color: rgba(255,255,255,0);
    box-shadow: 0 0 0 2px #e6f9fe, 0 0 0 3px #005587;
    background-repeat: no-repeat;
    background-position: right;
    padding-right: 24px;
}

a#contactUs {
    font-weight: 500;
    text-decoration: underline;
    color: #0075BE;
}

a#contactUs:focus, a#contactUs:hover {
    color: #005587;
    border-radius: 4px;
    background-color: rgba(255,255,255,0);
    box-shadow: 0 0 0 2px #e6f9fe, 0 0 0 3px #005587;
}

#ui-id-1 {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    display:block;
}

.ui-widget-content {
    color: #FFFFFF;
    border: 1px solid #D9DCE1;
    box-shadow: 0 2px 4px 0 rgba(0,0,0,0.5);
}

.ui-menu-item{
    font-family: Heebo;
}

.ui-menu-item:hover, .ui-menu-item:focus {
    background-color: #EFEFF1;
}

#suggestedList a:link,#suggestedList a:visited,#suggestedList a:active {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    text-decoration: none;
}

#irMultiResponseListItem a:link,#irMultiResponseListItem a:visited,#irMultiResponseListItem a:active {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    text-decoration: none;
}

#topTenList a:link,#topTenList a:visited,#topTenList a:active {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    text-decoration: none;
}

.tripleColContainer {
    padding-bottom: 56px;
}

a:hover{
    text-decoration:none;color:#333;
}

li.ui-menu-item a {
    padding: 8px 0.4em !important;
}

li#irMultiResponseListItem {
    border-radius: 4px;
    padding: 16px 16px 16px 16px;
    background-color: #FFFFFF;
    box-shadow: 0 0 2px 0 rgb(0 25 40 / 1%), 0 2px 2px 0 rgb(0 25 40 / 7%);
    margin: 0px 0px 8px 0px;
}

blockquote{
    margin:5px;
}

p a:link, p a:visited, p a:active {
    font-weight: 500;
    text-decoration: underline;
    color: #0075BE;
}

div h2 {
    font-family: Heebo;
    font-size: 16px;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
}

div a:link. a:visited, a:active {
    color: -webkit-link;
    text-decoration: underline;
}

/***********************************************************************
 *      Main Layout Tags
 *      Containers to set the Layout of the page
 ***********************************************************************/
.logo{
    margin:0px auto;
    text-align:left;
    width:300px;
    padding:0px;
}

.frame {text-align:center;width:300px;margin:0px auto 5px;}

.content{width:300px;text-align:left;float:left;}

.results{
    background:#F9F9F9 none repeat scroll 0 0;
    border:1px solid #CCCCCC;
    margin:4px 0;
    text-align:left;
    width:298px;
    min-height:20px;
    font-size:11px;
}

.topTen{
    text-align:left;
    width:236px;
    float:right;
    background-color:#F9F9F9;
    border: 1px solid #CCCCCC;
    margin: 4px 0px 10px 4px;

}

h2.sectionHeader.title{
    font-family: Heebo;
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.3px;
    line-height: 16px;
    color: #001928;
    margin: 0px 0px 8px 0px;
}

h2 {
    font-family: Heebo;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    margin: 0px 0px 8px 0px;
}

#ourRating1 {
    font-family: Heebo;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.25px;
    line-height: 24px;
    text-align: center;
    text-transform: uppercase;
    color: #0075BE;
    border: none;
    background: url(../images/checkBlue.svg);
    width: 80px;
    height: 28px;
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 6px;
}

#ourRating1:focus, #ourRating1:hover{
    border-radius: 4px;
    color: #005587;
    background: #E6F9FE;
    box-shadow: 0 0 0 2px #E6F9FE, 0 0 0 3px #005587;
    background-image: url(../images/checkUltramarine.svg);
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 6px;
}

h2.responseCaption {
    font-family: Heebo;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
}

#ourRating2 {
    font-family: Heebo;
    font-size: 14px;
    font-weight: bold;
    letter-spacing: 0.25px;
    line-height: 24px;
    text-align: center;
    text-transform: uppercase;
    color: #0075BE;
    border: none;
    background: url(../images/closeBlue.svg);
    width: 80px;
    height: 28px;
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 6px;
}

#ourRating2:focus, #ourRating2:hover {
    border-radius: 4px;
    color: #005587;
    background: #E6F9FE;
    box-shadow: 0 0 0 2px #E6F9FE, 0 0 0 3px #005587;
    background-image: url(../images/closeUltramarine.svg);
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 6px;
}

#inputError {
    display: none;
    font-family: Heebo;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.25px;
    line-height: 16px;
    color: #C81414;
    background: url(../images/inlineError.svg);
    height: 16px;
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 0px;
    margin: 8px 0px 8px 0px;
}

#clearSreach:focus {
    background: url(../images/closeUltramarine.svg);
    height: 24px;
    width: 24px;
    box-shadow: 0 0 0 2px #E6F9FE, 0 0 0 3px #005587;
    background-repeat: no-repeat;
    background-position: 0px;
    float: right;
    border-radius: 4px;
    position: relative;
    bottom: 38px;
    right: 1%;
}

div#clearSreach {
    display: none;
    background: url(../images/closeGranite.svg);
    height: 24px;
    width: 24px;
    background-repeat: no-repeat;
    background-position: 0px;
    float: right;
    position: relative;
    bottom: 38px;
    right: 1%;
}

div#irResponseBody, #irRatingAccepted {
    background: white;
    border-radius: 4px;
    padding: 24px 16px 24px 16px;
    box-shadow: 0 0 2px 0 rgba(0,25,40,0.012),0 2px 2px 0 rgba(0,25,40,0.07);
    margin-bottom: 8px;
    overflow: scroll;
}

#ResponseNoMatch{
    background: white;
    border-radius: 4px;
    padding: 40px 16px 56px 16px;
    box-shadow: 0 0 2px 0 rgba(0,25,40,0.012),0 2px 2px 0 rgba(0,25,40,0.07);
    margin-bottom: 8px;
    font-family: Heebo;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
}
div#ratingFormBody {
    background: white;
    border-radius: 4px;
    padding: 12px 8px 12px 8px;
    box-shadow: 0 0 2px 0 rgba(0,25,40,0.012), 0 2px 2px 0 rgba(0,25,40,0.07);
    margin-bottom: 32px;
}

div#searchNoMatch {
    background-image: url(../images/search.svg);
    background-repeat: no-repeat;
    height: 96px;
    display: block;
    width: 120px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 16px;
}

div#irSuggestedTitle {
    margin-bottom: 8px;
}

.intelliSuggestTitle, #topQuestions, #multiResponseMsgHead {
    font-family: Heebo;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    margin: 0px 0px 8px 0px;
}

h3 {
    font-family: Heebo;
    font-size: 18px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
    margin: 0px 0px 8px 0px;
}

div#Response {
    font-family: Heebo;
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.15px;
    line-height: 24px;
    color: #001928;
}

.footer{
    clear:both;
    text-align:right;
    width:298px;
}
.footer img{border:0;}
/***********************************************************************
 *      Margin and Padding tags
 *      Sets spaces and paddings to fit the look of the page
 ***********************************************************************/
 
 
.spacer{
    padding:10px;
    clear:both;
}

.resultsMargin{
    margin:2px 5px;
}


.padInputfield{
    padding:8px 0px 10px 10px;
}

.padTopTen{
    padding:5px 10px;
}

.padResponse{
    padding:4px 0px 10px 10px;
}

.padRating{
    padding:0 0px 5px 10px;
}

.padFroms{
    padding:14px 0px 10px 10px;
}

.seperator{
    border-bottom: 1px solid #CCCCCC;
}



/***********************************************************************
 *      Item Specific tags
 *      Sets Styles specific to items, rather then a whole container
 ***********************************************************************/
 
 /********* Custom Template not showing Top Ten Button, *********************
 ********* Summary Button, Email a Friend or Escalation Block **************/
 .toptenbutton, .summarybutton,  .usefulLinks, .escalationLink, .directional {display:none;}
 
.directional{padding-left:2px;}
.exquestion  {font-style:italic;}


.questionForm{
    background-color:#efefef;
    border: 1px solid #cccccc;
    height:65px;
    padding-top:4px;
}

.selectBox{width:190px;height:18px;border:1px solid #CCCCCC;}
.inputField{width:190px;height:18px;border:1px solid #CCCCCC;}
.askimage{float:left;padding:5px 10px;}

.buttons{
    
    margin:5px 0px;
    display:block;
    
}

.askbuttons{
    width:202px;
    margin:5px 0px;
    display:block;
    border-top:1px solid #cccccc;
    border-left:1px solid #cccccc;
    border-bottom:1px solid #aaaaaa;
    border-right:1px solid #aaaaaa;
}
.askbuttonhover{
    width:202px;
    margin:5px 0px;
    display:block;
    border-top:1px solid #aaaaaa;
    border-left:1px solid #aaaaaa;
    border-bottom:1px solid #cccccc;
    border-right:1px solid #cccccc;
}

#irTopQuestionsItems ol{
    padding-left:20px;
}
#irTopQuestionsItems li{
    padding-bottom:3px;
}

.titles {
    font-weight:bold;
    line-height:150%;
}


.selectFields{width:200px;border:1px solid #CCCCCC;}

.ratingForm{line-height:130%;padding:3px;}
.rating{font-weight:bold;padding:0 5px;}
.rated{color:#000000;text-align:center;padding:10px 0px;}
.error{color:#000000;text-align:center;padding:10px 0px;}


.usefulLinks{
    float:right;
    padding:0 10px;
}
.links{display:inline;}

.escalation {margin:5px 0;}
.escalationTitle {}

.poweredby{border:0;}


#irTopQuestionsItems  li {padding:3px 5px;}


