@font-face {
  font-family: 'knowledge-regular';
  src: url('https://static.reutersmedia.net/resources_v2/fonts/Knowledge-Regular.woff') format('woff');
}

@font-face {
  font-family: 'knowledge-medium';
  src: url('https://static.reutersmedia.net/resources_v2/fonts/Knowledge-Medium.woff') format('woff');
}

body { 
  padding: 0;
  margin: 0;
  width: 100%;
  background-color: #ffffff;
  overflow: hidden;
  height: 100%;
}

.wrapper {
  display: grid;
  grid-template-columns: 2fr 2fr 2fr;
  grid-template-rows: auto /* auto repeat(4, 1fr); */
  width: 100%;
  height: 100%;
}


#header-wrapper {
  grid-column: 1 / -1;
  width: 100%;
  border-bottom: 1px solid #cfcfcf;
}

#dianomi_ad_1 {
  grid-column: 1;
  grid-row: 2 / span 3;
  height: 100%;
}

#dianomi_ad_2 {
  grid-column: 1;
  grid-row: 5;
}

#dianomi_ad_3 {
  grid-column: 1;
  grid-row: 6;
}

#dianomi_ad_4 {
  grid-column: 2;
  grid-row: 2 / span 3;
  height: 100%;
}

#dianomi_ad_5 {
  grid-column: 2;
  grid-row: 5;
}

#dianomi_ad_6 {
  grid-column: 2;
  grid-row: 6;
}

#dianomi_ad_7 {
  grid-column: 3;
  grid-row: 2 / span 3;
}

#dianomi_ad_8 {
  grid-column: 3;
  grid-row: 5;
}

#dianomi_ad_9 {
  grid-column: 3;
  grid-row: 6;
}

#dianomi_ad_1 .text, #dianomi_ad_4 .text, #dianomi_ad_7 .text{
  display: flex;
  align-items: start;
  justify-content: start;
  padding-bottom: 40px;
}

 #dianomi_ad_1, #dianomi_ad_2, #dianomi_ad_4, #dianomi_ad_5, #dianomi_ad_7, #dianomi_ad_8 {
  border-right: 1px solid #cfcfcf;
  background: 
    linear-gradient(
      to right,
      transparent 0%,
      transparent 15px,
      #cfcfcf 0%,
      #cfcfcf calc(100% - 15px),
      transparent calc(100% - 15px),
      transparent 100%
    ) 
    bottom left
    / 100% 1px
    no-repeat;
}

#dianomi_ad_1 img, #dianomi_ad_4 img, #dianomi_ad_7 img {
    width: 100%;
    max-height: 220px;
    object-fit: cover; 
}

#dianomi_ad_2 img, #dianomi_ad_3 img, #dianomi_ad_5 img, #dianomi_ad_6 img, #dianomi_ad_8 img, #dianomi_ad_9 img{
	width: 120px;
  	height: 120px;
}

#dianomi_ad_2 a, #dianomi_ad_3 a, #dianomi_ad_5 a, #dianomi_ad_6 a, #dianomi_ad_8 a, #dianomi_ad_9 a{ 
	display: flex;
  	flex-direction: row-reverse;
  	justify-content: space-between;
  	align-items: start;
  	width: 100%;
    gap:5px;
} 

.subhero {
  height: 100%;
  width: 100%;
}
a {
  display: block;
  width: 100%;
  height: 100%;
  color: #464646;
  text-decoration: none;
}

.action:hover,
.dianomi_provider_short:hover {
  text-decoration: none;
}

.hero {
  box-sizing: border-box;
  border-right: 1px solid #cfcfcf;
  padding: 10px;
}

#dianomi_ad_7, #dianomi_ad_8, #dianomi_ad_9 {
  border-right: 0px
}

.hero:hover .maintext {
  text-decoration: underline;
}

.hero:focus {
  border: 0px solid #fa6400;
}

.action {
  display: none;
}

.hero img {
  transition: all 0.25s ease-in-out, opacity 0.25s ease-in-out 0.25s;
}

.hero:hover .subhero img {
  filter: brightness(0.8);
}

.text {
  display: flex;
  flex-direction: column-reverse;
}

.maintext {
  line-height: 24px;
  color: #404040;
  cursor: pointer;
  font-size: 18px;
  transition: all 0.3s ease;
  font-family: 'knowledge-medium', Arial, sans-serif;
}

#dianomi_ad_1 .dianomi_provider_short , #dianomi_ad_4 .dianomi_provider_short , #dianomi_ad_7 .dianomi_provider_short  {
  margin: 12px 0px 8px;
}

.dianomi_provider_short {
  text-decoration: none !important;
  font-size: 16px;
  display: block !important;
  font-weight: 400;
  line-height: 16px;
  color: #6e6e6e;
  font-family: 'knowledge-regular', Arial, sans-serif;
  margin: 0px 0px 8px;
}

.line2 {
  font-weight: 500;
  width: 100%;
  display: block;
  font-family: 'knowledge-medium', Arial, sans-serif;
  font-size: 20px;
  color: #404040;
  text-align: left;
  margin: 0px;
  padding: 10px 15px 10px;  
}

.logohover {
  background-repeat: no-repeat;
  width: 110px;
  height: 12px;
  position: absolute;
  bottom: 0;
  right: 0;
  transition: background 400ms ease-in-out;
  z-index: 1;
}

.logohover:hover {
  background: url('/img/uploads/VfG99MCoyKoAAGpDgiIAAAAI.png') no-repeat right;
  background-color: #fff;
  height: 12px;
  background-size: 54px 10px;
}

@media (max-width: 1024px) and (min-width: 768px) {
  #dianomi_ad_2 img, #dianomi_ad_3 img, #dianomi_ad_5 img, #dianomi_ad_6 img, #dianomi_ad_8 img, #dianomi_ad_9 img {
	width: 90px;
  	height: 90px;
  }
}
@media (max-width: 768px) {
  .wrapper {
    display: flex;
    flex-wrap: wrap; 
    justify-content: space-between;
  }

  .hero {
    width: 100%;
    border-bottom: 1px solid #cfcfcf;
    border-right: 0px;
    margin-bottom: 10px;
  }

  #dianomi_ad_1, #dianomi_ad_4 {
    width: 100%; 
    flex-basis: 100%; /* force ads on own row */
  }

  #dianomi_ad_2, #dianomi_ad_3 {
    flex-basis: calc(50%); /* half-width */
  }

  #dianomi_ad_5, #dianomi_ad_6, #dianomi_ad_7, #dianomi_ad_8, #dianomi_ad_9 {
    width: 100%; 
  }

  #dianomi_ad_1 { order: 1; }
  #dianomi_ad_2 { 
    order: 2;
    border-right: 0px;
    background: 
    	linear-gradient(
      	to bottom, 
      	transparent 0%,
      	transparent 15px,
      	#cfcfcf 0%,
      	#cfcfcf calc(100% - 15px),
      	transparent calc(100% - 15px),
      	transparent 100%
    	)
    top right  
    / 1px 100%  
    no-repeat;
  }
  #dianomi_ad_3 { order: 3; }
  #dianomi_ad_4 { order: 4; }
  #dianomi_ad_5 { order: 5; }
  #dianomi_ad_6 { order: 6; }
  #dianomi_ad_7 { order: 7; }
  #dianomi_ad_8 { order: 8; }
  #dianomi_ad_9 { order: 9; }

  #dianomi_ad_2 img, #dianomi_ad_3 img {
    width: 100%;
    height: auto;
    aspect-ratio: 2 / 1;
    object-fit: cover;
  }

  #dianomi_ad_7 img {
    width: 120px;
    height: 120px;
  }

  #dianomi_ad_7 a {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: start;
    width: 100%;
    gap: 5px;
  }

  #dianomi_ad_2 a, #dianomi_ad_3 a {
    flex-direction: column;
    width: 100%;
  }

  #dianomi_ad_1, #dianomi_ad_3, #dianomi_ad_4, #dianomi_ad_5, #dianomi_ad_7, #dianomi_ad_8 {
    border-right: 0px;
    background: none;
  }
}

.sub-line2 {
  color: #999;
  display: flex;
  font-size: 12px;
  position: absolute;
  right: 10px;
  top: 15px;
  font-weight: 400;
  z-index: 1;
  width: auto;
  -webkit-font-smoothing: antialiased;
}

.sub-line2 a {
  font-size: 12px;
  color: #999;
  text-decoration: none;
  font-weight: 600;
  width: auto;
}

.sub-line2 img {
  width: 60px;
  height: auto;
  border: none;
  outline: none;
}

.sub-line2{
    display: flex;
    align-content: center;
    align-items: flex-start;
}

.sub-line2 span{
      font-family: Arial, sans-serif;
    font-weight: bold;
  color: #404040;
  padding-left:5px;
}

img.dianomi-lg {
    display: inline;
}
  img.dianomi-lg2 {
    display: none;
    max-width: 25px;
    height: auto;
    filter: invert(1);
    padding: 0;
}

@media screen and (max-width: 375px){
img.dianomi-lg {
    display: none;
}
  img.dianomi-lg2 {
    display: inline;
}
      .sub-line2 span {
      padding: 0px;
    }
  .sub-line2{
  top: 6px;
        align-items: center;
        align-content: center;
    align-items: center;
  }
  
}