.ship-oinais-portal-top {
 display: flex;
}
/* TODO: add responsive support */
/* @media (max-width: 800px) {
  .ship-oinais-portal-top {
    flex-direction: column;
  }
} */

.ship-oinais-portal-top h2, .ship-oinais-portal-top h3, h3.gate-article-title a, h2.ship-oinais-portal-title {
  color: black;
}

.gate-article-item {
 float: right;
 width: 270px;
 margin-right: 20px
}

.gate-article-item:nth-child(4n+1) {
 clear: right;
 margin-right: 0px;
}

.ship-oinais-events-title:hover {
 color: #b5176e;
}

.gate-articles-end {
 clear: right;
 margin-bottom: 30px;
}

.ship-oinais-portal-top .ship-oinais-video {
 flex: 2;
 margin-left: 45px;
}
.ship-oinais-portal-top .ship-oinais-events {
 flex: 1;
    width: 35%;
}
.ship-oinais-portal-top > .ship-oinais-event {
    width: 65%;
}
.ship-oinais-portal-top > .ship-oinais-event > .ship-oinais-event {
 margin-left: 530px;
}
.ship-oinais-portal-top .ship-oinais-video {
 float: left;
 margin-top: 25px;
}
.ship-oinais-portal-top .ship-oinais-events-title {
 line-height: 1;
 margin-top: 0;
 font-size: 22px;
}
.ship-oinais-portal-top .ship-oinais-events .ship-oinais-event {
 margin-bottom: 32px;
 padding: 12px;
}

.ship-oinais-portal-top  .ship-oinais-portal-title {
  font-weight: 600;
 font-size: 32px;
 margin: 0;
}
.ship-oinais-portal-top .ship-oinais-events .ship-oinais-event-date {
  color: black;
 font-size: 16px;
 margin: 0;
}
.ship-oinais-portal-top .ship-oinais-events .ship-oinais-event-description {
  color: black;
 font-size: 14px;
 margin: 0;
}

.ship-oinais-portal-articles > .ship-oinais-events {
    color: black;
}

@media only screen and (max-width: 1180px) {
 .ship-oinais-portal-top {
  display: block;
 }
 .ship-oinais-portal-top .ship-oinais-events {
     width: auto;
	 margin: 10px;
 }
 .ship-oinais-portal-top > .ship-oinais-event {
     width: auto;
  margin: 0 10px;
 }
 .ship-oinais-portal-top > .ship-oinais-event >  .ship-oinais-event {
  margin: 0 10px;
 }
	
 .ship-oinais-portal-top > .ship-oinais-event >  .ship-oinais-event {
  margin: 10px;
 }

 .ship-oinais-portal-top .ship-oinais-video {
  margin: 10px;
 }
	
 .ship-oinais-portal-articles > .ship-oinais-events {
	margin: 10px;
}
	
 .gate-article-item:nth-child(4n+1) {
 margin-right: 20px;
}
 
}


@media only screen and (max-width: 770px) {
 .ship-oinais-portal-top .ship-oinais-video {
  text-align: center;
  float: none;
 }
}