.upl-main {
padding:10px 0;
}
.upl-container {
display:flex;
flex-direction:row;
justify-content: space-around;
width:100%;
margin:0 auto;
}
.upl-left-section {
height:800px;
width:60%;
border-radius:7px;
display:flex;
flex-direction: column;
justify-content: flex-end;
box-shadow: 1px 1px 15px 1px #ccc;
border-radius:7px 7px 7px 7px;
overflow:hidden;
}
.upl-left-section .upl-image {
min-height:565px;
height: 670px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.upl-left-section .upl-author {
margin-bottom:10px;
}
.upl-left-section .upl-title {
height:35px;
font-size: 18px;
font-weight: 700;
color: #0073aa;
padding:0 5%;
margin-bottom:10px;
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.upl-left-section .upl-excerpt {
height:100px;
padding:0 5%;
font-size: 18px;
overflow:hidden;
text-overflow: ellipsis;
margin-bottom:15px;
}
.upl-right-section {
width:35%;
height:800px;
display:flex;
flex-direction:column;
justify-content: flex-end;
justify-content: space-between;
}
.upl-top, .upl-bottom {
height:385px;
width:100%;
display:flex;
flex-direction: column;
justify-content: flex-end;
border-radius:7px;
box-shadow: 1px 1px 15px 1px #ccc;
border-radius:7px 7px 7px 7px;
overflow:hidden;
}
.upl-right-section .upl-image, .upl-second-section .upl-image {
min-height:210px;
height: 270px;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
.upl-right-section .upl-author, .upl-second-section .upl-author {
margin-bottom:5px;
}
.upl-right-section .upl-title, .upl-second-section .upl-title {
height:30px;
font-size: 16px;
color: #0073aa;
font-weight: 700;
margin-bottom:5px;
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding:0 5%;
}
.upl-right-section .upl-excerpt, .upl-second-section .upl-excerpt {
height:60px;
padding:0 5%;
font-size: 16px;
overflow:hidden;
margin-bottom:10px;
}
.upl-author img {
height: 50px;
width: 50px;
}
.upl-title a {
color: #0073aa;
outline: 0;
}
.upl-left-section .upl-author, 
.upl-right-section .upl-author, 
.upl-second-section .upl-author {
margin-top:-25px;
z-index:1;
}
.upl-left-section .upl-cat-date, 
.upl-right-section .upl-cat-date, 
.upl-second-section .upl-cat-date {
height:40px;
font-size:14px;
color: #9e9e9e;
border-top: 1px solid #ebebeb;
display:flex;
flex-direction:column;
justify-content: center;
padding-left:5%;
}
.upl-author img {
border-radius:50% !important;
margin-left:5%;
border: 3px solid #fff !important;
}
.upl-second-section {
margin-top:10px;
border:0px solid grey;
display:flex;
flex-direction:row;
flex-wrap:wrap;
align-content: flex-start;
}
.upl-second {
height:385px;
width:31.3%;
margin-left:1%;
margin-right:1%;
box-shadow: 1px 1px 15px 1px #ccc;
border-radius:7px 7px 7px 7px;
overflow:hidden;
margin-top:15px;
margin-bottom:15px;
box-sizing: border-box;
display:flex;
flex-direction:column;
justify-content: flex-end;
}
@media screen and (max-width: 1240px) {
.upl-left-section, .upl-right-section {
height:700px;
}
.upl-top, .upl-bottom, .upl-second {
height:335px;
}
.upl-left-section .upl-image {
height:480px;
}
.upl-left-section .upl-author {
margin-bottom:10px;
}
.upl-left-section .upl-title {
color: #0073aa;
height:30px;
line-height:28px;
}
.upl-left-section .upl-excerpt {
height:90px;
line-height:28px;
}
.upl-right-section .upl-image, .upl-second-section .upl-image {
height:170px;
}
.upl-right-section .upl-title, .upl-second-section .upl-title {
color: #0073aa;
height:30px;
line-height:28px;
}
.upl-right-section .upl-excerpt, .upl-second-section .upl-excerpt {
height: 50px;
line-height:22px;
}
}
@media screen and (max-width: 768px) {
.upl-container, .upl-second-section {
display:block;
margin:0 2.5%;
}
.upl-second-section  {
margin-top:40px;
}
.upl-second {
width:100%;
height:500px;
margin-bottom:50px;
}
.upl-left-section {
width:95%;
height:500px;
margin-bottom:50px;
}
.upl-second {
margin-top:0px;
margin-left:0;
margin-right:0;
}
.upl-left-section .upl-image, 
.upl-right-section .upl-image, 
.upl-second-section .upl-image {
height:260px;
}
.upl-left-section .upl-author, 
.upl-right-section .upl-author, 
.upl-second-section .upl-author {
margin-bottom:15px;
}
.upl-left-section .upl-title, 
.upl-right-section .upl-title, 
.upl-second-section .upl-title {
color: #0073aa;
height:30px;
font-size:26px;
margin-bottom:15px;
white-space:normal;
}
.upl-left-section .upl-excerpt, 
.upl-right-section .upl-excerpt, 
.upl-second-section .upl-excerpt {
height: 100px;
font-size:22px;
line-height:32px;
}
.upl-right-section {
width:95%;
display:block;
height:1050px;
}
.upl-right-section .upl-top, .upl-right-section .upl-bottom {
height:500px;
}
.upl-right-section .upl-top {
margin-bottom:50px;
}
.upl-left-section .upl-cat-date, 
.upl-right-section .upl-cat-date, 
.upl-second-section .upl-cat-date {
height:45px;
font-size:20px;
}
}
@media screen and (max-width: 414px) {
.upl-left-section .upl-image, 
.upl-right-section .upl-image, 
.upl-second-section .upl-image {
height:280px;
}
.upl-left-section .upl-author, 
.upl-right-section .upl-author, 
.upl-second-section .upl-author {
margin-bottom:10px;
}
.upl-left-section .upl-title, 
.upl-right-section .upl-title, 
.upl-second-section .upl-title {
color: #0073aa;
height:30px;
font-size:18px;
margin-bottom:10px;
}
.upl-left-section .upl-excerpt, 
.upl-right-section .upl-excerpt, 
.upl-second-section .upl-excerpt {
height: 100px;
font-size:18px;
line-height:24px;
}
.upl-left-section .upl-cat-date, 
.upl-right-section .upl-cat-date, 
.upl-second-section .upl-cat-date {
height:40px;
font-size:16px;
}
}