.qcld-main-container-style-5 h1{
margin: 0;
padding: 12px 0;
line-height: normal; 
font-size: 22px;
font-weight: 600;
}
.qcld-main-container-style-5 h2{
margin: 0;
padding: 12px 0;
line-height: normal; 
font-size: 20px;
font-weight: 600;
}
.qcld-main-container-style-5 h3{
margin: 0;
padding: 12px 0;
line-height: normal; 
font-size: 18px;
font-weight: 600;
}
.qcld-main-container-style-5 p{
margin: 0;
padding: 0;
line-height: 22px;
}
.qcld-main-container-style-5 ul{
margin: 0;
padding: 0;
}
.qcld-main-container-style-5 ul li{
margin: 0;
padding: 0;
list-style: none; 
}
.qcld-main-container-style-5 .style-5 .ca-menu.column4{
padding: 0 !important;
margin: 20px auto;
width: 100%;
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column3{
padding: 0 !important;
margin: 20px auto;
width: 100%;
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column2{
padding: 0 !important;
margin: 20px auto;
width: 100%;
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column1{
padding: 0 !important;
margin: 20px auto;
width: 100%;
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu li a{
text-align: center;
width: 100%;
height: 100%;
display: flex;
color: #333;
position: relative;
flex-direction: column;
justify-content: center;
}
.qcld-main-container-style-5 .style-5 .ca-icon {
color: #222;
width: 100%;
text-align: center;
-webkit-transition: all 400ms linear;
-moz-transition: all 400ms linear;
-o-transition: all 400ms linear;
-ms-transition: all 400ms linear;
transition: all 400ms linear;
box-sizing: border-box;
font-size: 50px;
}
.qcld-main-container-style-5 .style-5 .featured-section {
border-color: transparent transparent #ffeb3b;
border-style: solid;
border-width: 0 0 35px 25px;
top: -5px;
height: 0;
position: absolute;
right: 5px;
width: 0;
z-index: 1;
-moz-transform: rotate(75deg);
-webkit-transform: rotate(75deg);
-o-transform: rotate(75deg);
-ms-transform: rotate(75deg);
transform: rotate(270deg);
border-radius: 0 6px 0 0;
}
.qcld-main-container-style-5 .style-5 .featured-section i {
position: absolute;
left: -10px;
top: 17px;
color: #3d7dfc;
}
.qcld-main-container-style-5 .style-5 .ca-main{
font-size: 22px ;
width: 100%;
text-align: center;
opacity: 0.8;
text-align: center;
margin: 0 0 10px ;
padding: 0 20px ;
box-sizing: border-box;
}
.qcld-main-container-style-5 .style-5 .ca-sub{
text-align:center;
color: #000;
font-size: 14px ;
width: 100%;
text-align: center;
opacity: 0;
margin: 0 ;
box-sizing: border-box;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover{
background-color: #f2faff;
border-color: #fff;
border-color: #1ca2fc2e !important;
border: 1px solid #1ca2fc2e !important;   
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-icon{
color: #555;
display: none;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-main{
display: block;
top: 45px;
font-size: 18px ;
padding: 0 30px ;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-sub{
opacity: 1;
font-size: 14px ;
padding: 0 20px;
}
.qcld-main-container-style-5 .style-5 .ca-icon img{
width: 50px;
height: 50px;
transition: all 300ms linear 0s;
margin: 0 auto;
-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-icon img{
color: #fff004;
width: 70px;
height: 70px;
}
.qcld-main-container-style-5 .qcopd-list-column {
width: 100%;
} .qcld-main-container-style-5 .style-5 .upvote-section {
color: #777;
font-size: 10px;
position: absolute;
text-align: center;
top: 15px;
width: auto;
z-index: 999;
}
.qcld-main-container-style-5 .style-5 .ca-content-audio audio {
width: 220px;
height: 36px;
}
.qcld-main-container-style-5 .style-5 .upvote-btn:hover, .qcld-main-container-style-5 .style-5 .ca-menu li:hover .upvote-btn{
cursor: pointer;
color: #81D742;
}
.qcld-main-container-style-5 .style-5 .upvote-btn, .style-5 .upvote-count{
display: inline-block;
}
.qcld-main-container-style-5 .style-5 .upvote-btn {
text-align: center;
padding-top: 10px;
z-index: 805;
font-size: 12px;
}
.qcld-main-container-style-5 .style-5 .upvote-count {
font-size: 10px;
margin-top: -5px;
z-index: 800;
}
.qcld-main-container-style-5 .style-5 .upvote-section .upvote-btn, .qcld-main-container-style-5 .style-5 .upvote-section .upvote-count {
color: #000;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease;
}
.qcld-main-container-style-5 .style-5 .upvote-section .upvote-btn:hover, .qcld-main-container-style-5 .style-5 .ca-menu li:hover .upvote-btn, .qcld-main-container-style-5 .style-5 .ca-menu li:hover .upvote-count{
color: #000;
opacity: 0.8;
}
@-webkit-keyframes smallToBig{
from {
-webkit-transform: scale(0.1);
}
to {
-webkit-transform: scale(1);
}
}
@-moz-keyframes smallToBig{
from {
-moz-transform: scale(0.1);
}
to {
-moz-transform: scale(1);
}
}
@-ms-keyframes smallToBig{
from {
-ms-transform: scale(0.1);
}
to {
-ms-transform: scale(1);
}
}
@-webkit-keyframes moveFromBottom {
from {
-webkit-transform: translateY(100%);
}
to {
-webkit-transform: translateY(0%);
}
}
@-moz-keyframes moveFromBottom {
from {
-moz-transform: translateY(100%);
}
to {
-moz-transform: translateY(0%);
}
}
@-ms-keyframes moveFromBottom {
from {
-ms-transform: translateY(100%);
}
to {
-ms-transform: translateY(0%);
}
} .qcld-main-container-style-5 .direction-rtl .qc-grid-item, .direction-rtl .qc-grid-item h3
{
direction: rtl ;
}
.qcld-main-container-style-5 .direction-rtl .qc-grid-item .ca-icon {
direction: rtl ;
}
.qcld-main-container-style-5 .direction-rtl .qc-grid-item .ca-content {
direction: rtl;
}
.qcld-main-container-style-5 .direction-rtl .qc-grid-item h3 {
margin-right: 10px;
}
.qcld-main-container-style-5 .style-5 .ca-main {
font-size: 16px;
padding: 12px 0 !important;
width: 100%;
margin: 0 !important;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-main {
display: none;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover .ca-sub {
opacity: 1;
padding: 0 20px;
display: block;
}
.qcld-main-container-style-5 .qc-grid-item{
width: 100% !important;
}
.qcld-main-container-style-5 .style-5 .ca-menu li{
float: left;
list-style: none;
box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.04);
border-radius: 4px 4px 4px 0;
background: #fff;
padding: 12px 2px 2px 2px;
margin: 8px 10px !important;
position: relative;
min-height: 280px;
transition: all linear 0.3s;
border: 1px solid #fff;
height: auto;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
border: 1px solid #eee;
box-shadow: none !important;
box-shadow: 8px 8px 50px 0px rgba(0, 0, 0, 0.08) !important;
border-radius: 6px;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:before {
position: absolute;
z-index: -1;
content: '';
right: 0;
bottom: 0;
width: calc(100% - 13px);
height: calc(100% - 6px);
background-color: #666666;
-webkit-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
-khtml-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
-moz-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
-ms-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
-o-transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: all 0.25s cubic-bezier(0.645, 0.045, 0.355, 1);
border-radius: 0 0 6px 0;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover:before {
bottom: -6px;
right: -6px;
}
.qcld-main-container-style-5 .ca-menu li .ca-sub {
height: 115px;
overflow: auto;
display: none;
}
.qcld-main-container-style-5 .new-icon-section {
border-color: transparent transparent #54ba1d;
border-style: solid;
border-width: 0 10px 20px 10px;
top: 20px;
height: 0;
position: absolute;
left: -14px; z-index: 1;
-moz-transform: rotate(75deg);
-webkit-transform: rotate(75deg);
-o-transform: rotate(75deg);
-ms-transform: rotate(75deg);
transform: rotate(89deg);
border-radius: 0 6px 0 0;
color: #fff;
font-size: 14px;
}
.qcld-main-container-style-5 span.qcopd-list-item-author {
position: absolute;
bottom: 6px;
font-size: 12px;
}
.qcld-main-container-style-5 .style-5 .ca-menu li:hover span.qcopd-list-item-author{
display: none;
}
.qcld-main-container-style-5 .style-5 .featured-section {
width: 0 !important;
height: auto !important;
right: 5px !important;
border-width: 0 0 35px 25px !important;
background: transparent !important;
border-color: transparent transparent #ffeb3b !important;
}
.qcld-main-container-style-5 .style-5 .bookmark-section.bookmark-section-style-5 {
position: absolute;
bottom: 10px;
}
.qcld-main-container-style-5 .advertise-block.tpl-default {
width: 100% !important;
display: flex !important;
align-items: center !important;
align-content: center !important;
justify-content: center !important;
flex-wrap: nowrap !important;
}
.qcld-main-container-style-5 .advertise-block.tpl-default p{
display: flex !important;
align-items: center !important;
} @media (min-width:320px) {
.qcld-main-container-style-5 .style-5 .ca-menu.column4 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column3 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column2 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column1 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
} @media (min-width:480px) {
.qcld-main-container-style-5 .style-5 .ca-menu.column4 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column3 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column2 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column1 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
} @media (min-width:992px) {
.qcld-main-container-style-5 .style-5 .ca-menu.column4 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column3 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column2 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column1 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
} @media (min-width:1220px) {
.qcld-main-container-style-5 .style-5 .ca-menu.column4 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column3 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column2 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr 1fr;
}
.qcld-main-container-style-5 .style-5 .ca-menu.column1 {
display: grid;
grid-auto-rows: 1fr;
grid-template-columns: 1fr;
}
}