/* `Containers
----------------------------------------------------------------------------------------------------*/

.container {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  grid-template-areas:
    'header'
    'navigation'
    'slideshow'
    'highlighted'
    'help'
    'breadcrumb'
    'content_cont'
    'sidebar_first'
    'sidebar_second'
    'footer_left'
    'footer_right'
    'copyright';
    
  max-width: 480px;
}

@media all and (min-width: 481px) and (max-width: 960px) {

  .container {
    display: grid;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
    grid-template-areas:
      'header header'
      'navigation navigation'
      'slideshow slideshow'
      'highlighted highlighted'
      'help help'
      'breadcrumb breadcrumb'
      'content_cont content_cont'
      'sidebar_first sidebar_second'
      'footer_left footer_right'
      'copyright copyright';
    min-width: 480px;
    max-width: 960px;
    margin: auto;
    padding-right: 2em;
    padding-left: 2em;
    align-items: start;
  }
  .sidebar-first {
    padding-right: 1em;
  }
  .sidebar-second {
    padding-left: 1em;
  }

}

@media all and (min-width: 961px) {
  .container {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr) ) ;
    grid-template-areas:
      'header header header header header'
      'navigation navigation navigation navigation navigation'
      'slideshow slideshow slideshow slideshow slideshow'
      'highlighted highlighted highlighted highlighted highlighted'
      'help help help help help'
      'breadcrumb breadcrumb breadcrumb breadcrumb breadcrumb'
      'sidebar_first content_cont content_cont content_cont sidebar_second'
      'footer_left footer_left ....  footer_right footer_right'
      '.... copyright copyright copyright  ....';      
    max-width: 90%;
    margin-left: auto;
    margin-right: auto;
    padding-right: 2em;
    padding-left: 2em;
    align-items: start;
  }
}

.content_container {
    grid-area: content_cont;
    display: grid;
    grid-template-columns: minmax(0,1fr);
    grid-template-areas:
      'title'
      'tabs'
      'content';
    padding-left: 1em;
    padding-right: 1em;
}

.header {
  grid-area: header;
}

.header img {
  display: block;
  width: 100%;
  height: auto;
}

.form-search {
  width: 90%;
}

.navigation {
  grid-area: navigation;
}

.slideshow {
  grid-area: slideshow;
  float: center;
}

.highlighted {
  grid-area: highlighted;
}

.help {
  grid-area: help;
}

.breadcrumb {
  grid-area: breadcrumb;
}

.title {
  grid-area: title;
}

.tabs {
  grid-area: tabs;
}

.sidebar-first {
  grid-area: sidebar_first;
  padding-top: 1em;
  width: 100%;
}

.content {
  grid-area: content;
}

.sidebar-second {
  grid-area: sidebar_second;
  padding-top: 1em;
  width: 100%;
}

.footer-left {
  grid-area: footer_left;
}

.footer-right {
  grid-area: footer_right;
}

.copyright {
  grid-area: copyright;
}

#header {
  padding-top: 0px;
  padding-bottom: 5px;
  overflow: hidden;
}

#slideshow  {
  clear:both;
}


#footer{
  padding-top: 1em;
  padding-bottom: 1em;
}

#copyright{
  padding-top: 1em;
  padding-bottom: 1em;
  float: center;
}

body {
  background-position: left top;
  background-size: auto;
  background-repeat: repeat;
}

.sidebar-first .block, .sidebar-second .block {
  box-shadow: 2px 2px 2px grey;
  border: 1px solid black;
  border-radius: 5px;
  padding: 1em 1em 1em 1em;
  margin-top: 1em;
  margin-bottom: 1em;
}

.sidebar-first .block, .sidebar-second .block, .region-sidebar-first .block .content, .region-sidebar-second .block .content {
  background: unset;
  background-image: url('/themes/custom/inis_ull/images/bg-hatch.gif');
}

a {
  word-break: break-all;
}

.links ul li a, a.more,
input[type="submit"], input[type="reset"], input[type="button"] { color:#fefefe; padding:7px 15px; text-shadow: 0 1px 1px #003547; font-weight:bold; border:none;
font-family: "Lucida Grande","Lucida Sans Unicode",Segoe UI,Helvetica,Arial,sans-serif; cursor:pointer;
/* radius */
-webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; 
/* shadow */
-webkit-box-shadow: 0px 1px 2px #939da2; -moz-box-shadow: 0px 1px 2px #939da2; box-shadow: 0px 1px 2px #939da2; }

.links ul li a:hover, a.more:hover,
input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover { text-decoration:none; }

.content img {
  padding: 1em;
}
.caption > figcaption {
    padding-left: 1em;
    padding-right: 1em;
}