/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: COMMON Customization         */
/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: Custom hover behaviour, to match revealdigital.com */
a:hover
{
  color:#a92523;
  text-decoration: underline;
}
a
{
  color:#d4312f;
  text-decoration:underline;
}
/* INDEPENDENTVOICES CUSTOMISATION: Custom primary color, from revealdigital.com */
/* svg elements need "fill" instead of "color", annoyingly */
a svg, button svg
{
  fill: #dd3333;  /* Bootstrap's "brand-primary" colour */
}
a:hover svg, button:enabled:hover svg
{
  fill: black;  /* To match the link hover behaviour */
}
.btn-light
{
  color: #dd3333;  /* Bootstrap's "brand-primary" colour */
}

/* INDEPENDENTVOICES CUSTOMISATION: UI Customization */
html, body
{
  font-family: Roboto, sans-serif!important;
}

/* INDEPENDENTVOICES CUSTOMISATION: Set width */
div#navbarwrapper.other, div#headerbottomcell.other, div#breadcrumbswrapper.other, div#content.other, div#footercontent.other
{
  max-width: 1500px;
  margin-left: auto;
  margin-right: auto;
}

/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: HEADER Customization         */
/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: Header style */
header#header {
  background-color: #f5f5f5;
  box-shadow: 0px 1px 3px #b0b0b0;
  margin-bottom: 5px;
}

/* INDEPENDENTVOICES CUSTOMISATION: Top navbar style */
div#topnavbar {
  background-color: #273039;
  text-transform: uppercase;
  display: none;
}

div#navbarwrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
          align-items: center;
}

div#topnavbar ul li.nav-item {
  padding: 8px;
}

div#topnavbar ul li.nav-item:first-of-type {
  padding-left: 0px;
}

div#topnavbar ul li.nav-item:last-of-type {
  padding-right: 0px;
}

div#topnavbar ul li.nav-item a {
  color: #c1c1c1;
  font-size: 15px;
}

div#topnavbar ul li.nav-item a.active {                                                                  
  color: white;
  text-decoration: underline;                                                                            
  font-weight: bold;                                                                                     
}
div#topnavbar ul li.nav-item a:hover {                                                                   
  color: white;                                                                                          
}                                                                                                        

/* INDEPENDENTVOICES CUSTOMISATION: Header bottom cell style */
div#headerbottomcell {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: start;
  -ms-flex-align: start;
          align-items: flex-start;
  font-size: 90%;
  border-bottom: 0;
}

/* INDEPENDENTVOICES CUSTOMISATION: Smaller logo image */
div#bannerlogo {
  padding-top: 15px;
  padding-bottom: 15px;
  width: calc(100% - 68px);
  -ms-flex-preferred-size: unset;
  flex-basis: unset;
}
div#bannerlogo img {
  width: 100%;
}

/* INDEPENDENTVOICES CUSTOMISATION: Navbar collapsed style */
div#navbarcollapsed {   
  display: block !important;
}
div#navbarcollapsed a {   
  float: right;
}

/* INDEPENDENTVOICES CUSTOMISATION: User links style */
ul#userlinks {
  display: none;
}
ul#userlinks a {
  padding: 0.5rem;
}

/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: BREADCRUMBS Customization    */
/*===============================================================*/
.breadcrumb
{
  background-color: transparent;
  border: 0px;
  font-size: 14px;
}

/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: HOMEPAGE Customization         */
/*===============================================================*/
div#homepagemiddlecolumn
{
  margin-right: 0;
}

/* INDEPENDENTVOICES CUSTOMISATION: Styling for header in home page */
div#homepagecontent h2 {
  font-weight: 700;
}

/* INDEPENDENTVOICES CUSTOMISATION: Styling for sampler in home page left column */
div#homepagesampler {
  padding: 10px;
  background-color: #d0d0d0;
  box-shadow: 0px 0px 3px black;
}

/* INDEPENDENTVOICES CUSTOMISATION: Styling for stats in home page left column */
div#homepagestats
{
  margin-top: 1rem; 
}

/* INDEPENDENTVOICES CUSTOMISATION: Remove "gray-out" by the client's requirements */
div.panojsinverthighlight 
{
  background-color: unset;
}

/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: FOOTER Customization         */
/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: Footer style */
footer#footer {
  border: 0px;
  box-shadow: 0px 0px 3px #303030;
  background-color: #f5f5f5;
}

/* INDEPENDENTVOICES CUSTOMISATION: Footer content style */
div#footercontent
{
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}


/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: Addition Customiation        */
/*===============================================================*/

div.publicationsource {
  padding-left: 20px;
}


/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: RESPONSIVENESS Customization */
/*===============================================================*/
/* INDEPENDENTVOICES CUSTOMISATION: Set logo style on larger screen over 450px */
@media only screen and (min-width: 451px) {   
  /* INDEPENDENTVOICES CUSTOMISATION: Smaller logo image (341px wide, with 30px padding) */
  div#bannerlogo {
    -ms-flex-preferred-size: 371px;
    -webkit-flex-basis: 371px;
    flex-basis: 371px;  /* Limit to 371px on big screens (need to use this instead of max-width for Safari) */
  }
  div#bannerlogo img {
    width: auto;
  }
}

/* INDEPENDENTVOICES CUSTOMISATION: Set style on larger screen over 800px */
@media only screen and (min-width: 801px) {   
  /* INDEPENDENTVOICES CUSTOMISATION: Show top navbar and user links while hide navbar collapsed on larger screens */
  div#topnavbar {   
    display: block;
  }
  div#navbarcollapsed {   
    display: none !important;
  }
  ul#userlinks {
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
  }
}

/* INDEPENDENTVOICES CUSTOMISATION: Set style on larger screen over 1000px */
@media only screen and (min-width: 1001px) {   

  /* INDEPENDENTVOICES CUSTOMISATION: Footer content style */
  div#footercontent
  {
    -webkit-box-orient: horizontal;              
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row; 
  }
} 

