123movies-seo/resources/scss/_global.scss

1062 lines
19 KiB
SCSS
Raw Normal View History

2024-08-24 23:08:42 +03:00
/* global css strat */
.container-fluid {
padding-left: 50px;
padding-right: 50px;
}
@media (max-width: 767px) {
.container-fluid {
padding-left: 15px;
padding-right: 15px;
}
}
@media (min-width: 1550px) {
.col-xxl-12 {
flex: 0 0 100%;
-ms-flex: 0 0 100%;
max-width: 100%;
}
.col-xxl-11 {
flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
max-width: 91.66667%;
}
.col-xxl-10 {
flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
max-width: 83.33333%;
}
.col-xxl-9 {
flex: 0 0 75%;
-ms-flex: 0 0 75%;
max-width: 75%;
}
.col-xxl-8 {
flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
max-width: 66.66667%;
}
.col-xxl-7 {
flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
max-width: 58.33333%;
}
.col-xxl-6 {
flex: 0 0 50%;
-ms-flex: 0 0 50%;
max-width: 50%;
}
.col-xxl-5 {
flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
max-width: 41.66667%;
}
.col-xxl-4 {
flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
max-width: 33.33333%;
}
.col-xxl-3 {
flex: 0 0 25%;
-ms-flex: 0 0 25%;
max-width: 25%;
}
.col-xxl-2 {
flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
max-width: 16.66667%;
}
.col-xxl-1 {
flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
max-width: 8.33333%;
}
}
@media (max-width: 480px) {
.col-xs-12 {
flex: 0 0 100%;
-ms-flex: 0 0 100%;
max-width: 100%;
}
.col-xs-11 {
flex: 0 0 91.66667%;
-ms-flex: 0 0 91.66667%;
max-width: 91.66667%;
}
.col-xs-10 {
flex: 0 0 83.33333%;
-ms-flex: 0 0 83.33333%;
max-width: 83.33333%;
}
.col-xs-9 {
flex: 0 0 75%;
-ms-flex: 0 0 75%;
max-width: 75%;
}
.col-xs-8 {
flex: 0 0 66.66667%;
-ms-flex: 0 0 66.66667%;
max-width: 66.66667%;
}
.col-xs-7 {
flex: 0 0 58.33333%;
-ms-flex: 0 0 58.33333%;
max-width: 58.33333%;
}
.col-xs-6 {
flex: 0 0 50%;
-ms-flex: 0 0 50%;
max-width: 50%;
}
.col-xs-5 {
flex: 0 0 41.66667%;
-ms-flex: 0 0 41.66667%;
max-width: 41.66667%;
}
.col-xs-4 {
flex: 0 0 33.33333%;
-ms-flex: 0 0 33.33333%;
max-width: 33.33333%;
}
.col-xs-3 {
flex: 0 0 25%;
-ms-flex: 0 0 25%;
max-width: 25%;
}
.col-xs-2 {
flex: 0 0 16.66667%;
-ms-flex: 0 0 16.66667%;
max-width: 16.66667%;
}
.col-xs-1 {
flex: 0 0 8.33333%;
-ms-flex: 0 0 8.33333%;
max-width: 8.33333%;
}
}
.mt-15 {
margin-top: 15px;
}
.mt-20 {
margin-top: 20px;
}
.mt-30 {
margin-top: 30px;
}
.mt-40 {
margin-top: 40px;
}
.mt-50 {
margin-top: 50px;
}
.mt-80 {
margin-top: 80px;
}
.mb-15 {
margin-bottom: 15px;
}
.mb-20 {
margin-bottom: 20px;
}
.mb-30 {
margin-bottom: 30px;
}
.mb-50 {
margin-bottom: 50px;
}
.mb-none-30 {
margin-bottom: -30px;
}
.mb-none-50 {
margin-bottom: -50px;
}
.mt-100 {
margin-top: 100px;
}
.pt-90 {
padding-top: 90px;
}
.pb-90 {
padding-bottom: 90px;
}
.pt-120 {
padding-top: 120px;
}
@media (max-width: 991px) {
.pt-120 {
padding-top: 90px;
}
}
@media (max-width: 575px) {
.pt-120 {
padding-top: 80px;
}
}
.pb-120 {
padding-bottom: 120px;
}
@media (max-width: 991px) {
.pb-120 {
padding-bottom: 90px;
}
}
@media (max-width: 575px) {
.pb-120 {
padding-bottom: 80px;
}
}
.pt-150 {
padding-top: 150px;
}
@media (max-width: 1199px) {
.pt-150 {
padding-top: 120px;
}
}
@media (max-width: 991px) {
.pt-150 {
padding-top: 90px;
}
}
.pb-150 {
padding-bottom: 150px;
}
@media (max-width: 1199px) {
.pb-150 {
padding-bottom: 120px;
}
}
@media (max-width: 991px) {
.pb-150 {
padding-bottom: 90px;
}
}
.pt-80 {
padding-top: 80px;
}
.pb-80 {
padding-bottom: 80px;
}
.mt-100 {
margin-top: 100px;
}
.bd-top {
border-top: 2px solid rgba(255, 255, 255, 0.05);
}
.bd-bottom {
border-bottom: 2px solid rgba(255, 255, 255, 0.05);
}
@media (min-width: 1360px) {
.container {
max-width: 1240px;
}
}
.bg_img {
background-size: cover;
background-position: center;
}
.text-small {
font-size: 12px !important;
}
.dark--overlay {
position: relative;
}
.dark--overlay::before {
position: absolute;
content: "";
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #1b1b3f8a;
-webkit-box-shadow: inset 1px 0px 105px 105px #0d0d31;
-moz-box-shadow: inset 1px 0px 105px 105px #0d0d31;
box-shadow: inset 1px 0px 105px 105px #0d0d31;
}
select option {
background-color: #0d0d31;
}
label {
color: #777777;
margin-bottom: 13px;
}
.nice-select {
width: 100%;
min-height: 50px;
line-height: 50px;
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
-o-border-radius: 3px;
}
.nice-select .list {
width: 100%;
box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.15);
}
.card {
border-color: #1b1b3f;
background-color: #1b1b3f;
}
.card-header {
background-color: #1b1b3f;
border-bottom: 1px solid #ee005f6e;
}
.card-body {
background-color: #1b1b3f;
}
.has--img {
position: relative;
}
.has--img .section--img {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.03;
}
.section-header {
margin-bottom: 35px;
margin-top: -8px;
border-bottom: 2px solid #ffffff29;
}
.section-title {
font-size: 28px;
padding-bottom: 5px;
}
.hover--effect-1 {
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.hover--effect-1:hover {
-webkit-transform: translateY(-5px) scale(1.05);
-ms-transform: translateY(-5px) scale(1.05);
transform: translateY(-5px) scale(1.05);
}
.video-button {
position: absolute;
width: 105px;
height: 105px;
color: #ffffff;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
background-color: #ee005f;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
justify-content: center;
align-items: center;
animation: pulse 2000ms linear infinite;
-webkit-animation: pulse 2000ms linear infinite;
-moz-animation: pulse 2000ms linear infinite;
}
.video-button:hover {
color: #ffffff;
}
.video-button::before,
.video-button::after {
position: absolute;
content: "";
width: 100%;
height: 100%;
left: 0;
top: 0;
border-radius: 74px;
background-color: #ee005f;
opacity: 0.15;
z-index: -10;
}
.video-button::before {
z-index: -10;
animation: inner-ripple 2000ms linear infinite;
-webkit-animation: inner-ripple 2000ms linear infinite;
-moz-animation: inner-ripple 2000ms linear infinite;
}
.video-button::after {
z-index: -10;
animation: outer-ripple 2000ms linear infinite;
-webkit-animation: outer-ripple 2000ms linear infinite;
-moz-animation: outer-ripple 2000ms linear infinite;
}
.video-button i {
font-size: 52px;
}
@-webkit-keyframes outer-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
80% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
100% {
-webkit-transform: scale(2.5);
-ms-transform: scale(2.5);
transform: scale(2.5);
opacity: 0;
}
}
@-moz-keyframes outer-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
80% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
100% {
-webkit-transform: scale(2.5);
-ms-transform: scale(2.5);
transform: scale(2.5);
opacity: 0;
}
}
@-ms-keyframes outer-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
80% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
100% {
-webkit-transform: scale(2.5);
-ms-transform: scale(2.5);
transform: scale(2.5);
opacity: 0;
}
}
@keyframes outer-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
80% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
100% {
-webkit-transform: scale(2.5);
-ms-transform: scale(2.5);
transform: scale(2.5);
opacity: 0;
}
}
@-webkit-keyframes inner-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
30% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
}
@-moz-keyframes inner-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
30% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
}
@-ms-keyframes inner-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
30% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
}
@keyframes inner-ripple {
0% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
30% {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
opacity: 0.5;
}
100% {
-webkit-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
opacity: 0;
}
}
.pagination {
justify-content: center;
}
.pagination .page-item {
background-color: #1b1b3f;
}
.pagination .page-item:first-child {
padding-left: 15px;
}
.pagination .page-item:first-child .page-link {
padding: 5px 15px;
font-size: 28px;
}
.pagination .page-item:first-child .page-link::after {
display: none;
}
.pagination .page-item:last-child {
padding-right: 15px;
}
.pagination .page-item:last-child .page-link {
padding: 5px 15px;
font-size: 28px;
}
.pagination .page-item:last-child .page-link::after {
display: none;
}
.pagination .page-item.disabled .page-link {
background-color: transparent;
}
.pagination .page-item.active .page-link::after {
opacity: 1;
}
.pagination .page-item .page-link {
background-color: transparent;
border: none;
color: #bfbfbf;
padding: 15px 15px;
display: block;
position: relative;
}
.pagination .page-item .page-link:hover::after {
opacity: 1;
}
.pagination .page-item .page-link:focus {
box-shadow: none;
}
.pagination .page-item .page-link::after {
position: absolute;
content: "";
width: 100%;
height: 3px;
background-color: #ee005f;
bottom: 0;
left: 0;
opacity: 0;
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.d-pagination {
margin-top: 50px;
}
.d-pagination .pagination {
margin: -5px;
}
.d-pagination .pagination li {
margin: 5px 5px;
}
.d-pagination .pagination li.active a {
background-color: #ee005f;
color: #ffffff;
border-color: #ee005f;
}
.d-pagination .pagination li.active a:hover {
background-color: #ee005f;
color: #ffffff;
}
.d-pagination .pagination li a {
border-radius: 50% !important;
-webkit-border-radius: 50% !important;
-moz-border-radius: 50% !important;
-ms-border-radius: 50% !important;
-o-border-radius: 50% !important;
color: #bfbfbf;
font-weight: 500;
width: 45px;
height: 45px;
border: 1px solid #e5e5e5;
text-align: center;
line-height: 28px;
}
.d-pagination .pagination li a:hover {
color: #ee005f;
background-color: transparent;
border-color: #ee005f;
}
.cmn-list {
margin-top: 20px;
}
.cmn-list li + li {
margin-top: 15px;
}
.cmn-list li {
position: relative;
padding-left: 40px;
}
.cmn-list li::before {
position: absolute;
content: "";
top: 5px;
left: 0;
width: 20px;
height: 10px;
border-left: 1px solid #ee005f;
border-bottom: 1px solid #ee005f;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.cmn-list-2 {
margin-top: 20px;
}
.cmn-list-2 li + li {
margin-top: 10px;
}
.cmn-list-2 li {
position: relative;
padding-left: 45px;
}
.cmn-list-2 li:nth-last-of-type(3n + 3)::before {
border-color: #a22546;
}
.cmn-list-2 li:nth-last-of-type(3n + 2)::before {
border-color: #f7a139;
}
.cmn-list-2 li:nth-last-of-type(3n + 1)::before {
border-color: #3097d1;
}
.cmn-list-2 li::before {
position: absolute;
content: "";
top: 5px;
left: 0;
width: 20px;
height: 10px;
border-left: 1px solid red;
border-bottom: 1px solid red;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
}
.number-list--style {
list-style-type: decimal;
padding-left: 15px;
}
.number-list--style li span {
font-weight: 500;
color: #ee005f;
}
.cmn-accordion .card + .card {
margin-top: 15px;
}
.cmn-accordion .card {
border: none;
background-color: transparent;
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
-o-border-radius: 0;
}
.cmn-accordion .card-header {
background-color: transparent;
padding: 0;
margin-bottom: 0 !important;
border: 1px solid rgba(255, 255, 255, 0.1);
border-radius: 5px !important;
-webkit-border-radius: 5px !important;
-moz-border-radius: 5px !important;
-ms-border-radius: 5px !important;
-o-border-radius: 5px !important;
}
.cmn-accordion .card-header .acc-btn {
display: block;
width: 100%;
justify-content: space-between;
background-color: transparent;
cursor: pointer;
position: relative;
text-align: left;
padding-right: 50px;
}
.cmn-accordion .card-header .acc-btn:focus {
outline: none;
}
.cmn-accordion .card-header .acc-btn.collapsed .plus-icon::after {
-webkit-transform: translate(-50%, -50%) rotate(0deg);
-ms-transform: translate(-50%, -50%) rotate(0deg);
transform: translate(-50%, -50%) rotate(0deg);
}
.cmn-accordion .card-header .acc-btn .text {
font-weight: 500;
font-size: 18px;
padding: 10px;
}
@media (max-width: 991px) {
.cmn-accordion .card-header .acc-btn .text {
font-size: 18px;
}
}
@media (max-width: 575px) {
.cmn-accordion .card-header .acc-btn .text {
font-size: 15px;
}
}
.cmn-accordion .card-header .acc-btn .plus-icon {
position: absolute;
width: 70px;
right: 0;
top: 0;
height: 100%;
border-left: 1px solid rgba(255, 255, 255, 0.1);
}
.cmn-accordion .card-header .acc-btn .plus-icon::before {
position: absolute;
content: "";
top: 50%;
left: 50%;
width: 15px;
height: 2px;
background-color: #bfbfbf;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.cmn-accordion .card-header .acc-btn .plus-icon::after {
position: absolute;
content: "";
top: 50%;
left: 50%;
height: 15px;
width: 2px;
background-color: #bfbfbf;
-webkit-transform: translate(-50%, -50%) rotate(90deg);
-ms-transform: translate(-50%, -50%) rotate(90deg);
transform: translate(-50%, -50%) rotate(90deg);
-webkit-transition: all 0.3s;
-o-transition: all 0.3s;
transition: all 0.3s;
}
.cmn-accordion .card-body {
padding: 20px 20px;
}
.tab-content {
padding: 30px 0 0;
}
blockquote {
padding: 30px;
background-color: #0d0d31;
margin-top: 30px;
}
@media (max-width: 575px) {
blockquote {
padding: 20px;
}
}
blockquote p {
font-size: 18px;
color: #ffffff;
margin-top: 0 !important;
}
@media (max-width: 575px) {
blockquote p {
font-size: 16px;
}
}
.nice-select.open {
border-color: #ee005f;
}
.page-breadcrumb {
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 10px;
}
.page-breadcrumb li {
color: #ffffff;
text-transform: capitalize;
}
.page-breadcrumb li::after {
content: "-";
color: #ffffff;
margin: 0 5px;
}
.page-breadcrumb li:first-child::before {
content: "\f015";
font-family: "Font Awesome 5 Free";
font-weight: 900;
color: #ee005f;
margin-right: 6px;
}
.page-breadcrumb li:last-child::after {
display: none;
}
.page-breadcrumb li a {
color: #ffffff;
text-transform: capitalize;
}
#lightcase-overlay {
z-index: 9999;
}
#lightcase-case {
z-index: 99999;
}
.scroll-to-top {
height: 45px;
width: 45px;
display: inline-block;
z-index: 99999;
cursor: pointer;
text-align: center;
background-color: #ee005f;
line-height: 50px;
box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.25);
margin-top: -15px;
border-radius: 50%;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
-o-border-radius: 50%;
-webkit-transform: translateY(-25px);
-ms-transform: translateY(-25px);
transform: translateY(-25px);
}
.scroll-to-top .scroll-icon {
font-size: 24px;
color: #ffffff;
display: inline-block;
}
a[class*="lightcase-icon-"].lightcase-icon-close {
top: 100px;
right: 50px;
}