html{
    height: 100%;
}
/*
// IE10 in Windows (Phone) 8
//
// Support for responsive views via media queries is kind of borked in IE10, for
// Surface/desktop in split view and for Windows Phone 8. This particular fix
// must be accompanied by a snippet of JavaScript to sniff the user agent and
// apply some conditional CSS to *only* the Surface/desktop Windows 8. Look at
// our Getting Started page for more information on this bug.
//
// For more information, see the following:
//
// Issue: https://github.com/twbs/bootstrap/issues/10497
// Docs: http://getbootstrap.com/getting-started/#support-ie10-width
// Source: http://timkadlec.com/2013/01/windows-phone-8-and-device-width/
// Source: http://timkadlec.com/2012/10/ie10-snap-mode-and-responsive-design/
*/
@-ms-viewport {
    width: auto !important;
}

input, textarea, button { margin-top:10px }

/* Required field START */
a {
    color: #015A9C;
}


.panel > .panel-heading {
    background-image: none;
    background-color: #015A9C;
    color: white;
}

.required-field-block {
    position: relative;   
}

.required-field-block .required-icon {
    display: inline-block;
    vertical-align: middle;
    margin: -0.25em 0.25em 0em;
    background-color: #E8E8E8;
    border-color: #E8E8E8;
    padding: 0.5em 0.8em;
    color: rgba(0, 0, 0, 0.65);
    text-transform: uppercase;
    font-weight: normal;
    border-radius: 0.325em;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-transition: background 0.1s linear;
    -moz-transition: background 0.1s linear;
    transition: background 0.1s linear;
    font-size: 75%;
}
	
.required-field-block .required-icon {
    background-color: transparent;
    position: absolute;
    top: 0em;
    right: 0em;
    z-index: 10;
    margin: 0em;
    width: 30px;
    height: 30px;
    padding: 0em;
    text-align: center;
    -webkit-transition: color 0.2s ease;
    -moz-transition: color 0.2s ease;
    transition: color 0.2s ease;
}

.required-field-block .required-icon:after {
    position: absolute;
    content: "";
    right: 1px;
    top: 1px;
    z-index: -1;
    width: 0em;
    height: 0em;
    border-top: 0em solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 30px solid transparent;
    border-left: 0em solid transparent;
    border-right-color: inherit;
    -webkit-transition: border-color 0.2s ease;
    -moz-transition: border-color 0.2s ease;
    transition: border-color 0.2s ease;
}

.required-field-block .required-icon .text {
	color: #B80000;
	font-size: 26px;
	margin: -3px 0 0 12px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
/*
input,
select,
textarea {
    max-width: 280px;
}

*/

a.completebutton
{
background: url(/Content/Images/CompleteButton.png) no-repeat top left;
display: block;
width: 112px;
height: 24px;
text-indent: -9999px; /* hides the link text */
}

.button-wrapper  {
    margin-bottom:5px;
}

img {
    max-width: 100%;
    height: auto;
}

footer {    
    background:#888;
    text-align: center;
}

.hottopics{
    background: #015A9C;
    color: yellow;
    text-align: center;
    height: 100%;
}

.hottopics > a {
    color: yellow;
}

.hottopics > p > a {
    color: yellow;
}

.infopanel{
    background: #cccccc;
    height: 100%;
}


.roundedcorners {
    padding: 15px;
    border-radius: 25px;
    border: 2px solid #999999;
}

.headermenuline {
    text-align: left;
    background: green;
    height: 5px; 
}

.headerimages {
/*
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
*/
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
    -webkit-box-pack: center; 
    -moz-box-pack: center; 
    -ms-flex-pack: center; 
    -ms-flex-pack: justify;
    -webkit-justify-content: space-between;
    justify-content: space-between; 
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;    
    /*justify-content: space-between;*/
    align-items: flex-start;
}

.qheaderrightlogo {
    background:transparent;
    /*float:right;*/
}​

.qheaderleftlogo {
   /*float:left;*/
   background:transparent;
}



.webpartright{
    text-align: right
}
@media (max-width: 560px) {
    .headerimages {
        -webkit-box-pack: center; 
        -moz-box-pack: center; 
        -ms-flex-pack: center; 
        -webkit-justify-content: center;
        justify-content: center; 
        -webkit-flex-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
    }
    .qheaderleftlogo {
        float:center;
    }
    .qheaderrightlogo {
        display: none;
    }
    .webpartright{
        text-align: left
    }
}

.secmenu{
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    margin-top: 10px;
    -webkit-overflow-scrolling: touch;
}

.secmenu:before,
.secmenu:after {
    display: table;
    content: " ";
}

.secmenu:after {
    clear: both;
}

.secmenu:before,
.secmenu:after {
    display: table;
    content: " ";
}

.secmenu:after {
    clear: both;
}

.secmenu.in {
    overflow-y: auto;
}


.secmenu > li {
    position: relative;
    display: flex;
}

.secmenu > li > a {
    padding-top: 5px;
    padding-right: 15px;
    padding-bottom: 5px;
    padding-left: 5px;
}

.secmenu > li > a:hover,
.secmenu > li > a:focus {
    text-decoration: none;
    background-color: transparent;/*#eeeeee;*/
}


.webpart{
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
    margin-top: 10px;
    -webkit-overflow-scrolling: touch;
}

.webpart:before,
.webpart:after {
    display: table;
    content: " ";
}

.webpart:after {
    clear: both;
}

.webpart:before,
.webpart:after {
    display: table;
    content: " ";
}

.webpart:after {
    clear: both;
}

.webpart.in {
    overflow-y: auto;
}


.webpart > li {
    position: relative;
    display: flex;
}

.webpart > li > a {
    padding-top: 5px;
    padding-right: 15px;
    padding-bottom: 5px;
    padding-left: 5px;
}

.webpart > li > a:hover,
.webpart > li > a:focus {
    text-decoration: none;
    background-color: #eeeeee; /*transparent;#eeeeee;*/
}

@media (min-width: 768px) {
    .secmenu > ul{
        text-align: right;
    }
    .secmenu > li {
        text-align: right;
        -webkit-justify-content: flex-end;
        justify-content: flex-end;
    }
    .secmenu > li > button{
        text-align: right;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }
    .secmenu > li > a {
        text-align: right;
        padding-top: 0px;
        padding-right: 15px;
        padding-bottom: 0px;
        padding-left: 5px;
        width: auto;
    }
    .secmenu > li > a > b {
        text-align: right;
    }
    .secmenu > li > img {
        text-align: right;
        width: 100%;
    }
    .webpartright{
        text-align: left
    }
}

@media (max-width: 767px) {
    .secmenu{
      margin-top: 2px;
    }
    .secmenu > li > button{
        text-align: left;
        padding-top: 0px;
        padding-right: 0px;
        padding-bottom: 0px;
        padding-left: 0px;
    }
    .secmenu > li > a {
        text-align: left;
    }
    .secmenu > li > b {
        text-align: left;
    }
    .secmenu > li > img{
        display: none;
    }
}

.secmenu-collapse {
    overflow-x: visible;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch;
}

.secmenu-collapse:before,
.secmenu-collapse:after {
    display: table;
    content: " ";
}

.secmenu-collapse:after {
    clear: both;
}

.secmenu-collapse:before,
.secmenu-collapse:after {
    display: table;
    content: " ";
}

.secmenu-collapse:after {
    clear: both;
}

.secmenu-collapse.in {
    overflow-y: auto;
}


@media (min-width: 768px) {
    .secmenu-collapse {
        width: auto;
        border-top: 0;
        box-shadow: none;
    }
    .secmenu-collapse.collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 0;
        overflow: visible !important;
    }
    .secmenu-collapse.in {
        overflow-y: visible;
    }
    .secmenu-collapse .secmenu-text:last-child {
        margin-right: 15px;
    }
}


.HolyGrail {
    /*
    display: -webkit-box;
    display: -webkit-flex;
    
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
*/

  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */

    height: 100%; /* 1, 3 */
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -webkit-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction: column;
    overflow-y:scroll;
}

.HolyGrail-header,
.HolyGrail-footer {
/*
  -webkit-box-ordinal-group: 0;  
  -moz-box-ordinal-group: 0;     
  -ms-flex-order: 0;     
  -webkit-order: 0;  
  order: 0;
*/
  -webkit-box-ordinal-group: 0;  
  -moz-box-ordinal-group: 0;     
  -ms-flex-order: 0;     
  -webkit-order: 0;  
  order: 0;
/*
    -webkit-box-flex: 0;
    -moz-box-flex: 0;
    -webkit-flex: 0;
    -ms-flex-order: 0;
    -ms-flex: 0;
*/
    flex: none;  

}

.HolyGrail-body {
    display: -webkit-box;
    display: -webkit-flex;

    display: -moz-box;
    display: -ms-flexbox;
    display: flex;

    -webkit-box-flex:1 0 auto;
    -webkit-flex:1 0 auto;
    -ms-flex:1 0 auto;
    -moz-box-flex: 1;	
    flex: 1 0 auto; /* 2 */
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -webkit-flex-direction:column;
    -ms-flex-direction:column;
    flex-direction:column;
    padding: 0;
}

.HolyGrail-content {
    margin-top: 0;
    padding: 15px;
}

.HolyGrail-nav {
    -webkit-box-ordinal-group: -1;
    -moz-box-ordinal-group: -1;
    -ms-flex-order: -1;
    -webkit-order:-1;
    min-width: 150px;
    order: -1;
}

.HolyGrail-nav,
.HolyGrail-sidebar {
    padding: 0;
    /*
    border-radius: 3px;
    background: rgba(147, 128, 108, 0.1);
    */
}

.homegrid{
/*
  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */
*/	
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
   /* 
    -webkit-flex-flow: row wrap;
    -webkit-column-count: 2;
    flex-flow: row wrap;
    */
    -ms-flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;

    -webkit-flex-direction:row;
    -ms-flex-direction:column;
    flex-direction:row;

    flex-flow: row wrap;
    font-weight: bold;
    text-align: center;
    -ms-flex: 0 1 auto;
    
    flex: 1;
    /*min-width: 205px;*/
    max-width: 100%;
    /*width: 470px;*/
    padding: 10px;
    margin: auto;
    /*  justify-content: space-around;*/
    -webkit-box-pack: center; 
    -moz-box-pack: center; 
    -ms-flex-pack: center; 
    
    -ms-flex-align: center;
    -webkit-justify-content: center;
    justify-content: center; 
    -webkit-flex-align: center;
    -webkit-align-items: center;
}

.homegrid > a{
    margin: 8px;
}

@media (min-width: 768px) {
    .HolyGrail-body {
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -webkit-flex-direction:row;
        -ms-flex-direction:row;
        flex-direction:row
    }
    .HolyGrail-content {
        -webkit-box-flex:1;
        -webkit-flex:1;
        -ms-flex:1;
        flex:1;
        padding: 5px;
        margin: 0;
    }
    .HolyGrail-nav{
        /*
        -webkit-box-flex:0 1 auto;
        -webkit-flex:0 1 auto;
        -ms-flex:0 1 auto;
        flex:0 1 auto;
        
        -webkit-box-flex:0 0 200px;
        -webkit-flex:0 0 200px;
        -ms-flex:0 1 200px;
        flex: 0 0 200px;
        
        -webkit-box-flex:0 1 12em;
        -webkit-flex:0 1 12em;
        -ms-flex:0 1 12em;
        -moz-box-flex: 0 1 12em;
        flex: 0 1 15em;  
*/

        -webkit-justify-content: flex-start;
        -ms-flex-pack:start;
        justify-content: flex-start;

       -webkit-flex: 0 0 auto;  /* was 150px  */
       -ms-flexbox: 0 0 auto;
       flex: 0 0 auto;

        border-right-style: solid;
        border-right-width: 1px;
        border-right-color: #428bca;      
        /*
        min-width: 180px;        
        max-width: 350px;
        */
    }

    .HolyGrail-sidebar {
        -webkit-justify-content: flex-start;
        -ms-flex-pack:start;
        justify-content: flex-start;

       -webkit-flex: 0 0 auto;  /* was 150px  */
       -ms-flexbox: 0 0 auto;
       flex: 0 0 auto;
        /*
        -webkit-box-flex:0;
        -webkit-flex:0 0 12em;
        -ms-flex:0 0 12em;
        -moz-box-flex: 0 0 12em;
        flex: 0 0 12em;  
        max-width: 200px;
*/
    }
}

@media (max-width: 560px) {
    .HolyGrail-sidebar {
        text-align: center;
        -webkit-justify-content: center;
        -ms-flex-pack:center;
        align-items: center;
        justify-content: center;
    }
    .HolyGrail-sidebar > div {
        text-align: center;
        -webkit-justify-content: center;
        -ms-flex-pack:center;
        align-items: center;
        justify-content: center;
    }
    .HolyGrail-sidebar > table {
        text-align: center;
        -webkit-justify-content: center;
        -ms-flex-pack:center;
        align-items: center;
        justify-content: center;
    }
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
 }

.menuheadertext {
    font-family: Arial;
    text-align: right;
    font-weight: bold;
    font-size: 18px;
    font-stretch: condensed;
}

.caps{
    font-variant: small-caps;
}

.greentext{
    color: green;
}
/*
.editor-multiline-field textarea {
    width: 300px;
    height: 200px;
}

*/

.responsive-video {
position: relative;
padding-bottom: 56.25%;
padding-top: 60px; overflow: hidden;
}


.responsive-video iframe,
.responsive-video object,
.responsive-video embed,
.responsive-video video {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}