@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100;200;300;400;500;600;700;800&display=swap') ;
@import url('https://fonts.googleapis.com/css2?family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap') ;
@import url('https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap') ;
@font-face {
font-family : 'icomoon';
src : url("../fonts/icomoon/icomoon.eot?srf3rx");
src : url("../fonts/icomoon/icomoon.eot?srf3rx#iefix") format("embedded-opentype"), url("../fonts/icomoon/icomoon.ttf?srf3rx") format("truetype"), url("../fonts/icomoon/icomoon.woff?srf3rx") format("woff"), url("../fonts/icomoon/icomoon.svg?srf3rx#icomoon") format("svg");
font-weight : normal;
font-style : normal;
}
body {
font-family : "Rubik", serif;
font-size : 15px;
line-height : 1.6;
color : #000;
background : #f5f5f5;
}
#page, a {
transition : 0.5s;
}
#page {
position : relative;
overflow-x : hidden;
width : 100%;
height : 100%;
}
.offcanvas #page {
overflow : hidden;
position : absolute;
}
.offcanvas #page:after {
transition : 2s;
position : absolute;
top : 0;
right : 0;
bottom : 0;
left : 0;
z-index : 9999;
background : rgb(0, 0, 0, 0.7);
content : "";
}
a {
color : #2a5595;
}
a:active, a:focus, a:hover {
color : #f7b633;
outline : 0;
text-decoration : none;
}
p {
margin-bottom : 20px;
}
figure, h1, h2, h3, h4, h5, h6 {
color : #000;
font-weight : 400;
margin : 0 0 20px;
}
::-webkit-selection {
color : #fff;
background : #f7b633;
}
::-moz-selection {
color : #fff;
background : #f7b633;
}
::selection {
color : #fff;
background : #f7b633;
}
.qf-nav {
background-color : #ffffff;
top : 0;
left : 0;
right : 0;
position : fixed;
margin : 0 auto;
z-index : 9999;
}
.menu-1 {
display : flex;
flex-direction : column;
justify-content : center;
}
@media screen and (max-width: 768px) {
.qf-nav {
margin : 0;
}
}
.qf-nav .top-menu {padding : 13px 17px;border-bottom : 4px solid #ffd100;box-shadow: -4px 4px 6px 0 rgb(0 0 0 / 28%);}
.qf-nav #qf-logo {
font-size : 24px;
margin : 0;
padding : 0;
text-transform : uppercase;
font-weight : 700;
}
.qf-nav #qf-logo a {
position : relative;
color : #fff;
}
@media screen and (max-width: 768px) {
.qf-nav .menu-1 {
display : none !important ;
}
}
.qf-nav ul {
padding : 0;
margin : 8px 0 0;
}
.qf-nav ul li {
padding : 0;
margin : 0;
list-style : none;
display : inline;
font-weight : 400;
}
.qf-nav ul li a {
font-size : 16px;
padding : 30px 12px;
color : rgb(25 68 116);
transition : 0.5s;
}
.qf-nav ul li a:hover {
color : #f7b633;
}
.qf-nav ul li a, .qf-nav ul li.has-dropdown {
position : relative;
}
.qf-nav ul li.has-dropdown .dropdown {
max-width : 280px !important ;
width : max-content;
box-shadow : 0 14px 33px -9px rgb(0 0 0 / 85%);
z-index : 1005;
visibility : hidden;
opacity : 0;
position : absolute;
top : 25px;
left : 0;
text-align : left;
background : #fff;
padding : 20px;
border-radius : 4px;
transition : 0s;
}
.qf-nav ul li.has-dropdown .dropdown:before {
bottom : 100%;
left : 40px;
border : #ffffff00 solid;
content : " ";
height : 0;
width : 0;
position : absolute;
pointer-events : none;
border-bottom-color : #fff;
border-width : 8px;
margin-left : -8px;
}
.qf-nav ul li.has-dropdown .dropdown li {
display : block;
margin-bottom : 7px;
}
.qf-nav ul li.has-dropdown .dropdown li:last-child {
margin-bottom : 0;
}
.qf-nav ul li.has-dropdown .dropdown li a {
padding : 2px 0;
display : block;
color : #000000;
line-height : 1.3;
text-transform : none;
font-size : 15px;
letter-spacing : 0;
}
.qf-nav ul li.has-dropdown .dropdown li a:hover {
color : #ffac00;
}
.qf-nav ul li.has-dropdown:focus a, .qf-nav ul li.has-dropdown:hover a {
color : #f7b633;
}
.qf-nav ul li.btn-cta a {
padding : 30px 0 !important ;
color : #fff;
}
.qf-nav ul li.btn-cta a span {
background : #f7b633;
padding : 4px 10px;
display : inline-block;
transition : 0.3s;
border-radius : 100px;
}
.qf-nav ul li.btn-cta a:hover span {
box-shadow : 0 14px 20px -9px rgb(0, 0, 0, 0.75);
}
.qf-nav ul li.active > a {
color : #f7b633 !important ;
position : relative;
}
.qf-nav ul li.active > a:after {
opacity : 1;
transform : translate3d(0,0,0);
}
#qf-counter, #qf-hero .flexslider .slides li, .qf-bg {
background-size : cover;
background-position : top center;
background-repeat : no-repeat;
}
#qf-hero .flexslider .slides li, .qf-bg {
position : relative;
}
@media screen and (max-width: 992px) {
#qf-hero {
margin-top : 74px !important ;
}
}
@media screen and (max-width: 768px) {
#qf-hero {
margin-top : 64px !important ;
}
}
.qf-video {
overflow : hidden;
}
@media screen and (max-width: 992px) {
.qf-video {
height : 450px;
}
}
.qf-video a {
z-index : 1001;
position : absolute;
top : 50%;
left : 50%;
margin-top : -45px;
margin-left : -45px;
width : 90px;
height : 90px;
display : table;
text-align : center;
background : #fff;
box-shadow : 0 14px 30px -15px rgb(0, 0, 0, 0.75);
border-radius : 50%;
}
.qf-video a i {
text-align : center;
display : table-cell;
vertical-align : middle;
}
.qf-video .overlay {
position : absolute;
top : 0;
left : 0;
right : 0;
bottom : 0;
background : rgb(0, 0, 0, 0.3);
transition : 0.5s;
}
.qf-video:hover .overlay {
background : rgb(0, 0, 0, 0.7);
}
.qf-video:hover a {
transform : scale(1.1);
}
#qf-hero {
min-height : 650px;
background : url(../images/loader.gif) center center no-repeat #fff;
width : 100%;
float : left;
margin-top : 100px;
}
@media all and (max-width: 1200px) {
#qf-hero {
margin-top : 80px;
}
}
#qf-hero .btn {
font-size : 24px;
}
#qf-hero .btn.btn-primary {
padding : 14px 30px !important ;
}
#qf-hero .flexslider {
border : 0;
z-index : 1;
margin-bottom : 0;
}
#qf-hero .flexslider .slides {
position : relative;
overflow : hidden;
}
#qf-hero .flexslider .slides li {
background-position : bottom center;
min-height : 650px;
}
#qf-hero .flexslider .slides li .overlay {
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          right: 0;
          opacity: .8;
          background: #4c9db4;
          /* Old browsers */
          background: -moz-linear-gradient(45deg, #4583bd 0%, #0b1093 100%);
          /* FF3.6-15 */
          background: -webkit-linear-gradient(45deg, #181268 0%, #0b1093 100%);
          /* Chrome10-25,Safari5.1-6 */
          background: -o-linear-gradient(45deg, #4583bd 0%, #0b1093 100%);
          background: linear-gradient(12deg, #4583bd 0%, #0b1093 100%);
          /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
          filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#43DDE6', endColorstr='#9870FC',GradientType=1 );
          /* IE6-9 fallback on horizontal gradient */
          }
#qf-hero .flexslider .flex-control-nav {
bottom : 7em;
z-index : 1000;
}
#qf-hero .flexslider .flex-control-nav li a {
background : rgb(255, 255, 255, 0.2);
box-shadow : none;
cursor : pointer;
}
#qf-hero .flexslider .flex-control-nav li a.flex-active {
cursor : pointer;
background : 0 0;
background : #f7b633;
}
#qf-hero .flexslider .flex-direction-nav {
display : none;
}
#qf-hero .flexslider .slider-text {
display : grid;
opacity : 0;
height : 650px;
z-index : 9;
flex-direction : row;
align-content : space-evenly;
justify-content : space-evenly;
flex-wrap : nowrap;
justify-items : center;
}
#qf-hero .flexslider .slider-text > .slider-text-inner {
display : flex;
vertical-align : middle;
height : 650px;
padding : 2em;
flex-direction : column;
justify-content : center;
}
@media screen and (max-width: 768px) {
#qf-hero .flexslider .slider-text > .slider-text-inner {
text-align : center;
display : flex;
flex-direction : column;
align-content : stretch;
justify-content : center;
align-items : stretch;
}
}
#qf-hero .flexslider .slider-text > .slider-text-inner span i {
font-size : 24px;
color : #f7af1d;
}
#qf-hero .flexslider .slider-text > .slider-text-inner h1 {
padding : 0;
color : #fff;
margin : 0 0 30px;
font-size : 50px;
text-shadow : 4px 4px 6px rgb(0 0 0);
line-height : 1.3;
font-weight : 500;
}
#qf-hero .flexslider .slider-text > .slider-text-inner h2 {
padding : 0;
font-size : 22px;
line-height : 1.5;
margin : 0 0 20px;
font-weight : 300;
text-shadow : 4px 4px 6px rgb(0 0 0);
color : #fff;
}
@media screen and (max-width: 768px) {
#qf-hero .flexslider .slider-text > .slider-text-inner h1 {
margin-bottom : 10px;
line-height : 1.2;
font-size : 37px;
}
}
@media screen and (max-width: 768px) {
#qf-hero .flexslider .slider-text > .slider-text-inner h2 {
font-size : 18px;
line-height : 1.4;
}
}
#qf-about .qf-heading2 h2, #qf-hero .flexslider .slider-text > .slider-text-inner h2 a, .about-flex .staff-img .desc-staff h3, .about-flex .staff-img .desc-staff span, .project-entry .project-img .icon i, article .blog-img .icon i {
color : #fff;
}
#qf-hero .flexslider .slider-text > .slider-text-inner .heading-section {
font-size : 50px;
}
@media screen and (max-width: 768px) {
#qf-hero .flexslider .slider-text > .slider-text-inner .heading-section {
font-size : 30px;
}
}
#qf-hero .flexslider .slider-text > .slider-text-inner s .qf-lead {
font-size : 20px;
color : #f7b633;
}
#qf-hero .flexslider .slider-text > .slider-text-inner s .qf-lead .icon-heart {
color : #d9534f;
}
#qf-hero .flexslider .slider-text > .slider-text-inner .btn {
font-size : 12px;
text-transform : uppercase;
letter-spacing : 2px;
color : #fff;
padding : 20px 30px !important ;
border : 0;
}
#qf-hero .flexslider .slider-text > .slider-text-inner .btn.btn-learn, .downloadreport a:hover {
background : #f7b633;
color : #fff;
}
#qf-hero .flexslider .slider-text > .slider-text-inner .btn:hover {
background : #000 !important ;
}
@media screen and (max-width: 480px) {
#qf-hero .flexslider .slider-text > .slider-text-inner .btn {
width : 100%;
}
}
.qf-light-grey {
background : #fafafa;
}
#qf-about, #qf-blog, #qf-contact, #qf-project, #qf-services, #qf-testimony {
padding : 7em 0;
clear : both;
}
#qf-intro, #qf-subscribe {
clear : both;
}
#qf-intro .tabulation {
margin-top : -6.8em;
z-index : 1;
}
#qf-intro .tab-content {
padding : 3em 2em !important ;
background : #fff;
}
#qf-intro .nav-tabs, #qf-intro .nav-tabs li {
display : flex;
flex-wrap : wrap;
}
#qf-intro .nav-tabs {
margin : 0 !important ;
border : 0;
width : 100%;
}
#qf-intro .nav-tabs li {
width : 25%;
text-align : center;
text-transform : uppercase;
font-weight : 500;
font-size : 14px;
}
@media screen and (max-width: 768px) {
#qf-intro .nav-tabs li {
font-size : 10px;
}
}
#qf-intro .nav-tabs li a {
width : 100%;
margin : 0;
border : 0;
padding : 2.7em 1em !important ;
background : rgb(255, 255, 255, 0.5);
color : #4d4d4d;
border-radius : 0;
}
#qf-intro .nav-tabs li a i {
font-size : 18px;
}
@media screen and (max-width: 768px) {
#qf-intro .nav-tabs li a i {
display : block;
}
}
#qf-intro .nav-tabs li.active {
border-bottom : 1px solid #fff;
}
#qf-intro .nav-tabs li.active a {
color : #000;
border : 0;
background : #fff;
bottom : 0 !important ;
}
.services-img {
height : 320px;
display : block;
}
@media screen and (max-width: 768px) {
.services-img {
margin-bottom : 20px;
}
}
.services-desc {
padding : 0 1em;
}
@media screen and (max-width: 768px) {
.services-desc {
padding : 0;
}
}
.services-desc ul li {
list-style : none;
margin-bottom : 10px;
}
.services {
margin-bottom : 30px;
position : relative;
background : #fff;
}
.services .icon {
line-height : 64px;
position : absolute;
top : 20px;
left : 0;
right : 0;
}
.qf-video a i, .services .icon i {
font-size : 40px;
color : #f7b633;
}
.services .desc {
padding : 90px 20px 20px;
}
.project-entry .desc h3, .services .desc h3 {
font-size : 19px;
font-weight : 500;
text-transform : uppercase;
margin : 7px;
}
.bg-primary-color {
background : #f7b633;
}
.bg-primary-color p {
color : #fff !important ;
}
.blog-img, .insta-img, .project-img, .qf-about-img, .services-img, .staff-img, .thumb-img {
background-size : cover;
background-position : center center;
background-repeat : no-repeat;
position : relative;
}
.aside-stretch {
background : #f7b633;
}
.aside-stretch:after {
position : absolute;
top : 0;
right : 100%;
bottom : 0;
content : "";
width : 360%;
background : #f7b633;
}
@media screen and (max-width: 768px) {
.aside-stretch, .aside-stretch:after {
background : 0 0;
}
}
.no-gutters {
margin-right : 0;
margin-left : 0;
}
.project-entry {
display : block;
background : #fff;
position : relative;
transition : 0.2s;
}
.project-entry .project-img {
width : 100%;
height : 350px;
display : table;
position : relative;
z-index : 0;
}
.project-entry .project-img:after, article .blog-img:after {
position : absolute;
top : 0;
bottom : 0;
left : 0;
right : 0;
content : "";
background : rgb(0, 0, 0, 0.4);
opacity : 0;
transition : 0.9s;
z-index : -1;
}
.project-entry .project-img .icon, article .blog-img .icon {
display : table-cell;
vertical-align : middle;
z-index : 1;
opacity : 0;
transition : 0.3s;
}
.project-entry .desc {
padding : 2.5em 2em;
display : block;
}
.project-entry .desc h3 {
font-size : 16px;
margin-bottom : 0;
}
.project-entry .desc h3 a, article .entry h2 a {
color : #000;
}
.project-entry:hover {
top : -1px;
box-shadow : 0 12px 62px -13px rgb(0, 0, 0, 0.11);
}
.about-flex .staff-img:hover .desc-staff, .project-entry:hover .project-img .icon, .project-entry:hover .project-img:after, article:hover .blog-img:after, article:hover .icon {
opacity : 1;
}
.project-entry, .project-single {
margin-bottom : 30px;
}
.thumb-wrap {
display : block;
width : 100%;
float : left;
}
.thumb-wrap .thumb-img {
width : 100%;
display : block;
height : 150px;
margin-bottom : 30px;
}
.project-single-desc {
width : 100%;
float : left;
padding : 3em;
background : #fff;
margin-bottom : 1em;
}
.project-single-desc h2, .project-single-desc h5 {
margin-bottom : 40px;
font-size : 24px;
text-transform : uppercase;
font-weight : 500;
}
.project-single-desc h5 {
margin-bottom : 10px;
font-size : 16px;
}
.project-single-desc span {
padding : 10px;
}
.project-single-desc .list {
width : 100%;
float : left;
margin : 0;
padding : 0;
}
.project-single-desc .list li {
list-style : none;
width : 100%;
display : block;
margin-bottom : 20px;
}
.project-single-desc .list li .title {
font-weight : 500;
color : #000;
width : 50%;
float : left;
}
.downloadreport {
width : 100%;
float : left;
font-size : 16px;
font-weight : 500;
}
.downloadreport a {
width : 100%;
float : left;
padding : 3em 2em;
background : #fff;
}
#qf-testimony {
background : #fff;
}
#qf-testimony .owl-theme .owl-controls .owl-nav [class*="owl-"] {
transition : 0.3s;
border-radius : 1px;
background : 0 0;
padding : 5px;
opacity : 1;
}
#qf-testimony .owl-theme .owl-controls .owl-nav [class*="owl-"] .owl-direction {
background : 0 0;
color : #000;
box-shadow : none;
border : 0;
font-size : 20px;
}
#qf-testimony .testimony-slide {
display : block;
position : relative;
height : auto;
width : 100%;
}
#qf-testimony .testimony-slide span {
font-size : 18px;
font-weight : 400;
display : block;
color : #000;
margin-bottom : 20px;
}
#qf-testimony .testimony-slide figure {
display : block;
width : 100%;
position : absolute;
top : -70px;
left : 0;
right : 0;
}
#qf-testimony .testimony-slide figure img, .qf-counters .icon i {
border-radius : 50%;
}
#qf-testimony .testimony-slide figure img {
width : 140px;
margin : 0 auto;
}
#qf-testimony .testimony-slide blockquote {
border : 0;
margin : 0 auto;
width : 100%;
position : relative;
padding : 3em 0 0;
color : #000;
}
#qf-testimony .testimony-slide blockquote p {
font-size : 14px;
}
#qf-testimony .testimony-wrap {
padding : 3em;
width : 100%;
float : left;
}
#qf-testimony .owl-stage-outer {
padding-top : 6em;
}
#qf-counter {
position : relative;
}
.counter-entry {
padding : 7em 0;
}
@media screen and (max-width: 768px) {
.counter-entry {
padding : 4em 0;
}
}
.qf-counters {
background-size : cover;
background-attachment : fixed;
background-position : center center;
}
#qf-about .overlay, .qf-counters .overlay {
position : absolute;
top : 0;
left : 0;
right : 0;
bottom : 0;
}
.qf-counters .overlay {
z-index : 0;
background : rgb(0, 0, 0, 0.4);
}
.qf-counters .icon {
width : 100px;
height : 100px;
display : table;
margin : 0 auto 20px;
}
.qf-counters .icon i {
display : table-cell;
vertical-align : middle;
width : 100px;
height : 100px;
font-size : 50px;
color : #fff;
background : #f7b633;
}
.qf-counters .icon-white i {
background : #fff;
color : #f7b633;
}
@media screen and (max-width: 768px) {
.qf-counters .icon-white i {
background : #f7b633;
color : #fff;
}
}
.qf-counters .qf-counter {
font-size : 40px;
display : block;
color : #fff;
font-family : "Poppins", Arial, sans-serif;
width : 100%;
font-weight : 500;
margin-bottom : 0.3em;
}
.qf-counters .qf-counter-label {
color : rgb(255, 255, 255, 0.7);
text-transform : uppercase;
font-size : 14px;
letter-spacing : 5px;
display : block;
}
article {
margin-bottom : 3em;
}
article .blog-img {
display : block;
height : 300px;
display : table;
z-index : 0;
}
#qf-about, article .blog-img, article .entry {
position : relative;
width : 100%;
}
article .entry {
margin-top : 0;
z-index : 1;
background : #fff;
padding : 2em;
}
article .entry h2 {
font-weight : 500;
font-size : 20px;
line-height : 1.7;
}
article .entry h2 a:hover {
color : #f7b633;
}
article .entry .meta-2 {
color : #b3b3b3;
}
article .entry .meta-2 span {
margin-right : 10px;
}
article .entry .meta-2 span i {
color : #666;
}
.about-wrap {
width : 100%;
float : left;
padding-bottom : 0;
}
@media screen and (max-width: 768px) {
.about-wrap {
padding-bottom : 3em;
}
}
#qf-about {
z-index : 0;
display : block;
}
#qf-about .overlay {
content : "";
background : rgb(0, 0, 0, 0.5);
z-index : -1;
}
#qf-about .qf-heading2 p {
color : rgb(255, 255, 255, 0.7);
}
.qf-about-img {
height : 603px;
}
.about-flex {
width : 100%;
float : left;
display : flex;
flex-wrap : wrap;
}
.about-flex .col-half {
width : 50%;
float : left;
}
@media screen and (max-width: 768px) {
.about-flex .col-half {
width : 100%;
}
}
.about-flex .col-half:last-child {
background : #fff;
}
.about-flex .staff-img {
float : left;
width : 50%;
height : 300px;
position : relative;
display : table;
}
@media screen and (max-width: 768px) {
.about-flex .staff-img {
height : 200px;
}
}
.about-flex .staff-img .desc-staff {
background : #f7b633;
display : table-cell;
vertical-align : middle;
text-align : center;
transition : 0.3s;
opacity : 0;
}
.about-flex .desc {
padding : 4em;
display : block;
}
@media screen and (max-width: 768px) {
.about-flex .desc {
padding : 1.5em;
}
}
.fancy-collapse-panel .panel-default > .panel-heading {
padding : 0;
}
.panel, .panel-heading a {
box-shadow : none !important ;
}
.panel-heading a {
padding : 15px 25px;
display : block;
width : 100%;
font-weight : 500;
font-size : 14px;
text-transform : uppercase;
background-color : #f7b633;
color : #fff;
position : relative;
}
.panel {
border : 0;
}
.panel-heading a:after {
font-family : "icomoon";
content : "\e115";
position : absolute;
right : 20px;
font-size : 12px;
font-weight : 400;
top : 50%;
line-height : 1;
margin-top : -5px;
}
.panel-heading a.collapsed:after {
content : "\e114";
}
.panel-heading a.collapsed {
background : #fafafa;
border : #e6e6e6 solid 1px !important ;
color : #333333;
}
.panel-heading a.collapsed {
background : #fafafa;
border : #e6e6e6 solid 1px !important ;
color : #333;
}
.panel-body {
padding : 1.5em;
margin-top : 5px;
border : #e6e6e6 solid 1px !important ;
}
.about-desc h3 {
font-weight : 500;
}
.staff-img2 {
float : left;
width : 100%;
height : 300px;
position : relative;
display : table;
}
@media screen and (max-width: 768px) {
.staff-img2 {
margin-bottom : 30px;
}
}
.staff-img2 .desc-staff {
background : #f7b633;
display : table-cell;
vertical-align : middle;
text-align : center;
transition : 0.3s;
opacity : 0;
}
.staff-img2 .desc-staff h3, .staff-img2 .desc-staff span {
color : #fff;
}
.staff-img2:hover .desc-staff {
opacity : 1;
}
.contact-info-wrap-flex {
display : flex;
flex-wrap : wrap;
width : 100%;
margin-bottom : 3em;
}
.contact-info-wrap-flex .con-info {
width : 24%;
background : #fff;
padding : 1.5em;
margin-left : 10px;
}
.contact-info-wrap-flex .con-info:first-child {
margin-left : 0;
}
@media screen and (max-width: 768px) {
.contact-info-wrap-flex .con-info {
width : 100%;
margin : 4px !important ;
}
}
.contact-info-wrap-flex p {
margin-bottom : 0;
color : #000;
}
.contact-info-wrap-flex p a {
color : #000;
}
input[type="text"] {
height : 50px;
}
.form-group {
margin-bottom : 30px;
}
@media screen and (max-width: 768px) {
.form-group #fname {
margin-bottom : 30px;
}
}
.form-group label {
font-weight : 400;
}
.form-group .btn-modify {
text-transform : uppercase;
letter-spacing : 1px;
font-weight : 700;
font-size : 13px;
padding : 10px 15px;
}
.qf-social-icons {
margin : 0;
padding : 0;
}
.qf-social-icons li, .qf-social-icons li a {
display : inline-block;
}
.qf-social-icons li {
margin : 0;
padding : 0;
list-style : none;
}
.qf-social-icons li a {
color : #f7b633;
padding-left : 10px;
padding-right : 10px;
}
#box-manufacturer-logotypes h3, .qf-social-icons li a i {
font-size : 20px;
}
.qf-heading {
margin-bottom : 5em;
}
.qf-heading h2 {
font-size : 30px;
font-weight : 500;
text-transform : uppercase;
}
#qf-subscribe {
background : #ededed;
padding : 5em 0;
}
#qf-subscribe .qf-heading, section.lattest-product-area.pb-40.category-list {
margin-bottom : 20px;
}
#qf-subscribe .qf-heading p {
font-size : 18px;
}
.qbstp-header-subscribe {
display : flex;
flex-wrap : wrap;
width : 100%;
padding : 0;
}
.qbstp-header-subscribe .col-three-forth {
width : 70%;
}
.qbstp-header-subscribe .col-one-third {
width : 30%;
}
.qbstp-header-subscribe .col-one-third, .qbstp-header-subscribe .col-three-forth {
display : table;
height : 50px;
float : left;
}
@media screen and (max-width: 768px) {
.qbstp-header-subscribe .col-one-third, .qbstp-header-subscribe .col-three-forth {
width : 50%;
}
}
.qbstp-header-subscribe .form-control {
background : 0 0;
}
.qbstp-header-subscribe .form-group {
position : relative;
width : 100%;
display : table-cell;
vertical-align : middle;
}
@media screen and (max-width: 480px) {
.qbstp-header-subscribe .form-group {
width : 100%;
}
}
.qbstp-header-subscribe .form-group input::-webkit-input-placeholder {
color : #333;
}
.qbstp-header-subscribe .form-group input::-moz-input-placeholder {
color : #333;
}
.qbstp-header-subscribe .form-group input::-ms-input-placeholder {
color : #333;
}
.qbstp-header-subscribe .form-group input::-o-input-placeholder {
color : #333;
}
.qbstp-header-subscribe #email {
font-size : 14px;
width : 100%;
border : 0;
border-bottom : 1px solid #ccc;
color : #333 !important ;
}
.qbstp-header-subscribe button {
border-top-left-radius : 0 !important ;
border-bottom-left-radius : 0 !important ;
background : #f7b633;
color : #fff;
border : 0;
padding : 10px 20px;
text-transform : uppercase;
height : 50px;
width : 100%;
display : block;
}
.instagram .insta-img {
height : 80px;
display : block;
width : 33.3333%;
float : left;
}
@media screen and (max-width: 480px) {
.footer-bottom p, .single-footer-widget p {
font-size : 13px;
margin-bottom : 10px !important ;
}
.single-footer-widget p {
font-size : 12px;
}
.links {
margin-bottom : 10px;
}
.single-footer-widget {
margin-bottom : 15px !important ;
}
.links p {
margin-bottom : 5px !important ;
}
.links a {
color : #f7b633;
}
}
#qf-footer {
background : #25282a;
color : rgb(255, 255, 255, 0.6) !important ;
}
#qf-footer .contact-information {
background : #1e2022;
padding : 1.5em 0;
margin-bottom : 5em;
}
#qf-footer .contact-information .info-wrap .icon {
display : block;
margin-bottom : 10px;
}
#qf-footer .contact-information .info-wrap .icon i {
color : #fff;
font-size : 20px;
}
#qf-footer .contact-information .info-wrap p {
font-size : 13px;
}
#qf-footer .contact-information .info-wrap a {
color : rgb(255, 255, 255, 0.5);
}
@media screen and (max-width: 768px) {
#qf-footer .qf-widget {
margin-bottom : 40px;
width : 100%;
float : left;
}
}
#qf-footer .qf-footer-links, #qf-offcanvas ul {
padding : 0;
margin : 0;
}
@media screen and (max-width: 768px) {
#qf-footer .qf-footer-links {
margin-bottom : 30px;
}
}
#qf-footer .qf-footer-links li {
padding : 0;
margin : 0 0 10px;
list-style : none;
display : block;
}
#qf-footer .qf-footer-links li span {
display : block;
font-size : 13px;
}
#qf-footer .qf-footer-links li a {
color : rgb(255, 255, 255, 0.9);
text-decoration : none;
}
#qf-footer .qf-footer-links li a i {
padding-right : 10px;
color : #f7b633;
}
#qf-footer .qf-footer-links li a:hover {
text-decoration : underline;
}
#qf-footer .qf-social-icons li a {
padding-left : 10px;
padding-right : 10px;
}
#qf-footer .qf-social-icons li a:first-child {
padding-left : 0;
}
#qf-footer h4 {
margin-bottom : 30px;
font-size : 13px;
color : #e6e6e6;
text-transform : uppercase;
letter-spacing : 5px;
font-weight : 700;
}
#qf-footer .copy {
background : #f7b633;
padding : 1.2em 0;
}
#qf-footer .copy p {
margin-bottom : 0;
color : #000;
}
#qf-footer .copy p small a {
color : rgb(0, 0, 0, 0.7);
}
#map {
width : 100%;
height : 500px;
position : relative;
}
@media screen and (max-width: 768px) {
#map {
height : 200px;
}
}
#qf-offcanvas {
position : absolute;
width : 300px;
background : #000;
right : 0;
top : 0;
bottom : 0;
padding : 75px 30px 40px 31px;
overflow-y : auto;
display : none;
transform : translateX(300px);
transition : 0.3s;
z-index : 10000;
}
@media screen and (max-width: 768px) {
#qf-offcanvas {
display : block;
}
}
.offcanvas #qf-offcanvas {
transform : translateX(0);
}
#qf-offcanvas a {
color : rgb(255 255 255 / 80%);
text-transform : uppercase;
}
#qf-offcanvas a:hover, #qf-offcanvas ul li > ul {
color : rgb(255, 255, 255);
}
#qf-offcanvas ul li {
padding : 0;
margin-bottom : 10px;
list-style : none;
border-bottom : 1px solid #1e208b;
font-size : 18px;
}
#qf-offcanvas ul li > ul {
padding-left : 20px;
list-style : none;
border-bottom : 0 solid #1e208b;
margin-top : 10px;
display : none;
}
#qf-offcanvas ul li > ul li {
font-size : 15px;
color : rgb(255, 255, 255);
border-bottom : none;
}
#qf-offcanvas ul li.offcanvas-has-dropdown > a {
display : block;
color : rgb(255, 255, 255);
position : relative;
}
#qf-offcanvas ul li.offcanvas-has-dropdown > a:after {
position : absolute;
right : 0;
font-family : 'icomoon';
speak : none;
font-style : normal;
font-weight : normal;
font-variant : normal;
text-transform : none;
line-height : 1;
content : "\e0c5";
font-size : 20px;
color : rgb(255, 255, 255, 0.2);
transition : 0.5s;
}
#qf-offcanvas ul li.offcanvas-has-dropdown.active a:after {
transform : rotate(-180deg);
}
.gototop {
position : fixed;
bottom : 20px;
right : 20px;
z-index : 999;
opacity : 0;
visibility : hidden;
transition : 0.5s;
}
.gototop.active {
opacity : 1;
visibility : visible;
}
.gototop a {
width : 50px;
height : 50px;
display : table;
background : #f7b633;
color : #fff;
text-align : center;
border-radius : 4px;
}
.gototop a i {
height : 50px;
display : table-cell;
vertical-align : middle;
}
.gototop a:active, .gototop a:focus, .gototop a:hover {
text-decoration : none;
outline : 0;
}
.qf-nav-toggle {
cursor : pointer;
text-decoration : none;
top : 0.6em !important ;
position : absolute;
right : 0;
padding : 6px 0 0;
margin : 0 auto;
display : none;
height : 44px;
width : 44px;
z-index : 2001;
border-bottom : none !important ;
}
.qf-nav-toggle.active i::after, .qf-nav-toggle.active i::before {
background : #444;
}
.qf-nav-toggle:active, .qf-nav-toggle:focus, .qf-nav-toggle:hover {
outline : 0;
border-bottom : none !important ;
}
.qf-nav-toggle i, .qf-nav-toggle i::after, .qf-nav-toggle i::before {
width : 25px;
height : 2px;
background : #252525;
transition : all 0.2s ease-out;
}
.qf-nav-toggle i {
position : relative;
display : inline-block;
color : #252525;
font : 700 14px/0.4 Helvetica;
text-transform : uppercase;
text-indent : -55px;
}
.qf-nav-toggle i::after, .qf-nav-toggle i::before {
content : "";
position : absolute;
left : 0;
}
.qf-nav-toggle.qf-nav-white > i {
color : #fff;
background : #fff;
}
.qf-nav-toggle.qf-nav-white > i::after, .qf-nav-toggle.qf-nav-white > i::before {
background : #fff;
}
.qf-nav-toggle i::before {
top : -7px;
}
.qf-nav-toggle i::after {
bottom : -7px;
}
.qf-nav-toggle:hover i::before {
top : -10px;
}
.qf-nav-toggle:hover i::after {
bottom : -10px;
}
.qf-nav-toggle.active i {
background : 0 0;
}
.qf-nav-toggle.active i::before {
top : 0;
transform : rotateZ(45deg);
background : #fff;
}
.qf-nav-toggle.active i::after {
bottom : 0;
transform : rotateZ(-45deg);
background : #fff;
}
@media screen and (max-width: 768px) {
.qf-nav-toggle {
display : block;
position : fixed;
top : 1.5em !important ;
z-index : 99999;
}
}
.btn {
margin-right : 4px;
margin-bottom : 4px;
font-size : 16px;
font-weight : 400;
border-radius : 0;
transition : 0.5s;
padding : 8px 20px;
}
.btn.btn-md {
padding : 8px 20px !important ;
}
.btn.btn-lg {
padding : 18px 36px !important ;
}
.btn:active, .btn:focus, .btn:hover {
box-shadow : none !important ;
outline : 0 !important ;
}
.btn-primary {
background : #f7b633;
color : #fff;
border : #f7b633 solid 2px;
}
.btn-primary:active, .btn-primary:focus, .btn-primary:hover {background: #014695 !important;border-color: #014695 !important;}
.btn-primary.btn-outline {background : #62626224;color : #ffffff;border : #ffffff solid 2px;/* box-shadow : -1px 3px 2px 0 rgb(0 0 0 / 43%); */}
.btn-primary.btn-outline:active, .btn-primary.btn-outline:focus, .btn-primary.btn-outline:hover {/* background: #000000; */color : #fff;}
.btn-success {
background : #5cb85c;
color : #fff;
border : #5cb85c solid 2px;
}
.btn-success:active, .btn-success:focus, .btn-success:hover {
background : #4cae4c !important ;
border-color : #4cae4c !important ;
}
.btn-success.btn-outline {
background : 0 0;
color : #5cb85c;
border : #5cb85c solid 2px;
}
.btn-success.btn-outline:active, .btn-success.btn-outline:focus, .btn-success.btn-outline:hover {
background : #5cb85c;
color : #fff;
}
.btn-info {
background : #5bc0de;
color : #fff;
border : #5bc0de solid 2px;
}
.btn-info:active, .btn-info:focus, .btn-info:hover {
background : #46b8da !important ;
border-color : #46b8da !important ;
}
.btn-info.btn-outline {
background : 0 0;
color : #5bc0de;
border : #5bc0de solid 2px;
}
.btn-info.btn-outline:active, .btn-info.btn-outline:focus, .btn-info.btn-outline:hover {
background : #5bc0de;
color : #fff;
}
.btn-warning {
background : #f0ad4e;
color : #fff;
border : #f0ad4e solid 2px;
}
.btn-warning:active, .btn-warning:focus, .btn-warning:hover {
background : #eea236 !important ;
border-color : #eea236 !important ;
}
.btn-warning.btn-outline {
background : 0 0;
color : #f0ad4e;
border : #f0ad4e solid 2px;
}
.btn-warning.btn-outline:active, .btn-warning.btn-outline:focus, .btn-warning.btn-outline:hover {
background : #f0ad4e;
color : #fff;
}
.btn-danger {
background : #d9534f;
color : #fff;
border : #d9534f solid 2px;
}
.btn-danger:active, .btn-danger:focus, .btn-danger:hover {
background : #d43f3a !important ;
border-color : #d43f3a !important ;
}
.btn-danger.btn-outline {
background : 0 0;
color : #d9534f;
border : #d9534f solid 2px;
}
.btn-danger.btn-outline:active, .btn-danger.btn-outline:focus, .btn-danger.btn-outline:hover {
background : #d9534f;
color : #fff;
}
.btn-outline {
background : 0 0;
border : gray solid 2px;
font-size : 16px;
transition : 0.3s;
}
.btn-outline:active, .btn-outline:focus, .btn-outline:hover {
box-shadow : none;
}
.btn.with-arrow {
position : relative;
transition : 0.3s;
}
.btn.with-arrow i {
visibility : hidden;
opacity : 0;
position : absolute;
right : 0;
top : 50%;
margin-top : -8px;
transition : 0.2s;
}
.btn.with-arrow:hover {
padding-right : 50px;
}
.btn.with-arrow:hover i {
color : #fff;
right : 18px;
visibility : visible;
opacity : 1;
}
.row-pb-lg {
padding-bottom : 7em !important ;
}
.row-pb-md {
padding-bottom : 5em !important ;
}
.row-pb-sm {
padding-bottom : 2em !important ;
}
.nopadding {
padding : 0 !important ;
margin : 0 !important ;
}
.qf-loader {
position : fixed;
left : 0;
top : 0;
width : 100%;
height : 100%;
z-index : 9999;
background : url(../images/loader.gif) center no-repeat #fff;
}
.js .animate-box {
opacity : 0;
}
.white-text-with-blue-shadow {
text-shadow : 1px 1px 2px #000, 0 0 1em #dcdcff, 0 0 0.2em #0d0733;
color : #fff;
}
.blog_categorie_area {
padding-top : 80px;
padding-bottom : 80px;
}
.categories_post {
position : relative;
text-align : center;
cursor : pointer;
}
.categories_post img {
max-width : 100%;
}
.categories_post .categories_details {
position : absolute;
left : 20px;
right : 20px;
bottom : 20px;
background : rgb(34, 34, 34, 0.8);
color : #fff;
transition : all 0.3s linear;
display : flex;
align-items : center;
padding : 10px;
justify-content : center;
}
.categories_post .categories_details h5 {
margin-bottom : 0;
font-size : 18px;
line-height : 26px;
text-transform : uppercase;
color : #fff;
position : relative;
}
.categories_post .categories_details p {
font-weight : 300;
font-size : 14px;
line-height : 26px;
margin-bottom : 0;
}
.categories_post .categories_details .border_line {
margin : 10px 0;
background : #fff;
width : 100%;
height : 1px;
}
.categories_post:hover .categories_details {
background : rgb(255, 186, 0, 0.8);
}
.organic-breadcrumb {
background : url(../img/banner/common-banner.jpg) center no-repeat;
background-size : cover;
margin-top : 100px;
margin-bottom : 30px;
}
@media (max-width: 1200px) {
.organic-breadcrumb {
margin-top : 90px;
}
}
@media (max-width: 991px) {
.organic-breadcrumb {
margin-top : 75px;
}
}
@media (max-width: 767px) {
.organic-breadcrumb {
margin-top : 100px;
}
}
#category .organic-breadcrumb {
margin-bottom : 100px;
}
.breadcrumb-banner {
padding : 25px 0;
}
.breadcrumb-banner h1 {
font-weight : 600;
color : #2a5595;
font-size : 2em;
}
@media (max-width: 767px) {
.breadcrumb-banner h1 {
font-size : 30px;
margin-bottom : 5px;
}
}
.breadcrumb-banner p {
margin-bottom : 0;
color : #fff;
}
.breadcrumb-banner nav a {
display : inline-block;
color : #818181;
font-weight : 400;
}
.breadcrumb-banner nav a span {
display : inline-block;
margin : 0 10px;
}
@media (max-width: 1680px) {
.breadcrumb-banner .col-first {
font-size : 16px;
text-align : center;
}
}
@media (max-width: 991px) {
.breadcrumb-banner .col-first {
width : 48%;
text-align : center;
}
}
@media (max-width: 767px) {
.breadcrumb-banner .col-first {
width : 100%;
font-size : 16px;
text-align : center;
}
breadcrumb-banner .col-first h1 {
margin-bottom : 7px !important ;
}
}
.footer-area {
background-color : #0f1041;
color : #fff;
}
.footer-area h6 {
color : #fff;
margin-bottom : 25px;
font-size : 18px;
font-weight : 600;
}
@media (max-width: 767px) {
.footer-area h6 {
margin-bottom : 15px;
}
}
.copy-right-text a, .copy-right-text i, .footer-social a:hover i {
color : #033888;
}
.instafeed {
margin : -5px;
}
.instafeed li {
overflow : hidden;
width : 25%;
}
.instafeed li img {
margin : 5px;
}
.footer-social a, .footer-social i {
transition : all 0.3s 0s ease;
}
.footer-social a {
padding-right : 25px;
}
.footer-social i {
color : #ccc;
}
@media (max-width: 991px) {
.single-footer-widget {
margin-bottom : 40px;
}
}
.single-footer-widget .form-inline {
display : inline-block;
width : 100%;
}
.single-footer-widget input {
border : 0;
width : 80% !important ;
font-weight : 300;
background : #fff;
color : #777;
padding-left : 20px;
border-radius : 0;
font-size : 14px;
}
.single-footer-widget input:focus {
outline : 0;
box-shadow : none;
}
.single-footer-widget input.placeholder {
color : #ccc;
}
.single-footer-widget input:-moz-placeholder {
color : #ccc;
}
.single-footer-widget input::-moz-placeholder {
color : #ccc;
}
.single-footer-widget input::-webkit-input-placeholder {
color : #ccc;
}
.single-footer-widget .bb-btn {
color : #fff;
font-weight : 300;
border-radius : 0;
z-index : 9999;
cursor : pointer;
}
.single-footer-widget .info {
position : absolute;
margin-top : 5%;
color : #fff;
font-size : 12px;
}
.single-footer-widget .info.valid {
color : green;
}
.single-footer-widget .info.error {
color : red;
}
.single-footer-widget .click-btn {
color : #fff;
border-radius : 0;
border-top-left-radius : 0;
border-bottom-left-radius : 0;
padding : 6px 12px;
border : 0;
}
.single-footer-widget .click-btn:focus {
outline : 0;
box-shadow : none;
}
.single-footer-widget ::-moz-selection {
background-color : #191919 !important ;
color : #777;
}
.single-footer-widget ::selection {
background-color : #191919 !important ;
color : #777;
}
.single-footer-widget ::-webkit-input-placeholder {
color : #777;
font-weight : 300;
}
.single-footer-widget :-moz-placeholder {
color : #777;
opacity : 1;
font-weight : 300;
}
.single-footer-widget ::-moz-placeholder {
color : #777;
opacity : 1;
font-weight : 300;
}
.single-footer-widget :-ms-input-placeholder {
color : #777;
font-weight : 300;
}
.single-footer-widget ::-ms-input-placeholder {
color : #777;
font-weight : 300;
}
.footer-text {
padding-top : 80px;
}
@media (max-width: 991px) {
.footer-text {
padding-top : 40px;
}
}
.footer-text a, .footer-text i {
color : #033888;
}
.section_gap_75 {
padding : 35px 0;
}
.inner-shadow {
background : #fff;
}
.single-product {
padding : 15px;
margin-top : 16px;
margin-bottom : 16px;
border-radius : 3px 3px 10px 10px;
min-height : 280px;
}
.single-product img, .single-product img:hover {
aspect-ratio : 1/1;
bottom : 30px;
box-shadow : 0 10px 30px rgb(0, 0, 0, 0.1);
position : relative;
}
.single-product img {
border : #e7e7e7 solid 1px;
transition : all 300ms cubic-bezier(0.34,1.61,0.7,1);
transform : translate(0,0);
}
.single-product img:hover {
transform : translate(0,5px);
}
.product-details {
margin-top : -10px;
width : 95%;
}
.product-moreinfo {
position : absolute;
bottom : 18px;
right : 24px;
}
.product-moreinfo .icon {
display : inline-block;
top : 15px;
right : 5px;
width : 24px;
background : #f7b633;
height : 24px;
border-radius : 22px;
}
.product-moreinfo .icon::after, .product-moreinfo .icon::before {
display : block;
position : absolute;
content : "";
top : 10px;
left : 6px;
width : 10px;
height : 2px;
background : #fff;
}
.product-moreinfo .icon::after {
top : 6px;
left : 10px;
width : 2px;
height : 10px;
}
.product-details h4 {
font-size : 16px;
font-weight : 500;
margin-bottom : 0;
}
@media (max-width: 767px) {
.product-details h4 {
font-size : 17px;
font-weight : 500;
margin-bottom : 0;
}
}
.related-product-area {
background : #e6f0f8;
padding-top : 40px;
padding-bottom : 40px;
}
.single-related-product {
margin-bottom : 20px;
}
.single-related-product H6 {
font-weight : 500;
margin-top : 10px;
margin-bottom : 10px;
}
.single-related-product .description {
font-size : 12px;
line-height : 15px;
color : #9b9b9b;
}
.section-title h1 {
font-size : 31px;
font-weight : 500;
margin : 0 0 15px;
}
.list-bullets {
padding : 0;
}
ul.list-bullets {
padding : 0 10px;
text-transform : uppercase;
}
.list-bullets li {
display : flex;
align-items : center;
justify-content : flex-start;
flex-direction : row;
font-size : 14px;
font-weight : 500;
color : red;
margin-bottom : 3px;
}
.list-bullets li a {
color : #707070;
}
.list-bullets li a:hover {
color : #f2af11;
}
.list-bullets, ol.custom-numbers {
list-style : none;
}
ol.custom-numbers li {
counter-increment : my-awesome-counter;
}
ol.custom-numbers li::before {
content : counter(my-awesome-counter) ". ";
color : #2b90d9;
font-weight : 700;
}
.card-body > h4 > a, .qf.card {
font-family : "Rubik", serif !important ;
}
.card-body > h4 > a {
font-size : 16px;
font-weight : 600;
color : #000;
text-transform : uppercase;
}
.accordion .accordion-item {
border-bottom : 1px solid #e5e5e5;
}
.accordion .accordion-item button[aria-expanded="true"] {
border-bottom : 1px solid #03b5d2;
}
.accordion button {
position : relative;
display : block;
text-align : left;
width : 100%;
padding : 0.6em 0;
color : #033888;
font-size : 1em;
font-weight : 500;
border : 0;
background : 0 0;
outline : 0;
}
.accordion button:focus, .accordion button:hover {
cursor : pointer;
color : #03b5d2;
}
.accordion button:focus::after, .accordion button:hover::after {
cursor : pointer;
color : #03b5d2;
border : #03b5d2 solid 1px;
}
.accordion button .accordion-title {
padding : 1em 1.5em 1em 0;
}
.accordion button .icon {
display : inline-block;
position : absolute;
top : 15px;
right : 5px;
width : 22px;
height : 22px;
border : solid 1px;
border-radius : 22px;
}
.accordion button .icon::after, .accordion button .icon::before {
display : block;
position : absolute;
content : "";
top : 9px;
left : 5px;
width : 10px;
height : 2px;
background : currentColor;
}
.accordion button .icon::after {
top : 5px;
left : 9px;
width : 2px;
height : 10px;
}
.accordion button[aria-expanded="true"] {
color : #03b5d2;
}
.accordion button[aria-expanded="true"] .icon::after {
width : 0;
}
.accordion .accordion-content, .accordion button[aria-expanded="true"] + .accordion-content {
opacity : 1;
max-height : 6000px;
transition : all 200ms linear;
will-change : opacity, max-height;
}
.accordion .accordion-content {
opacity : 0;
max-height : 0;
overflow : hidden;
transition : opacity 200ms linear, max-height 200ms linear;
}
.accordion .accordion-content p {
margin-bottom : 10px;
}
.accordion-content {
margin-top : 10px;
background : #fff;
padding-left : 10px;
padding-right : 10px;
}
.accordion .accordion-content h6 {
margin-top : 10px;
margin-bottom : 0;
font-size : 17px;
font-weight : 500;
}
.pagination {
display : inline-flex;
padding-left : 0;
margin : 20px 0;
border-radius : 0;
flex-wrap : wrap;
}
.pagination > li {
display : inline;
}
.pagination > li > a, .pagination > li > span {
position : relative;
display : inline-block;
padding : 0.5em 1em;
text-decoration : none;
color : inherit;
background-color : #fff;
border : rgb(0, 0, 0, 0.1) solid 1px;
margin-left : -1px;
}
.pagination > li:first-child > a, .pagination > li:first-child > span {
margin-left : 0;
border-top-left-radius : 4px;
border-bottom-left-radius : 4px;
}
.pagination > li:last-child > a, .pagination > li:last-child > span {
border-top-right-radius : 4px;
border-bottom-right-radius : 4px;
}
.pagination > li > a:focus, .pagination > li > a:hover, .pagination > li > span:focus, .pagination > li > span:hover {
z-index : 2;
color : inherit;
background-color : #eee;
}
.pagination .active {
background : #c8ddf2;
}
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
z-index : 3;
color : #fff;
background-color : #28a745;
border-color : #509821;
cursor : default;
}
.pagination > .disabled > a, .pagination > .disabled > a:focus, .pagination > .disabled > a:hover, .pagination > .disabled > span, .pagination > .disabled > span:focus, .pagination > .disabled > span:hover {
opacity : 0.5;
cursor : not-allowed;
}
.green {
background : #387800;
color : white;
}
.blue {
background : #242974;
color : white;
}
.orange {
background : #df9200;
color : white;
}
.red {
background : #cb001a;
color : white;
}
.cyan {
background : #0064ff;
color : white;
}
.magenta {
background : #7314c7;
color : white;
}
.green h3, .blue h3, .orange h3, .magenta h3, .red h3, .cyan h3 {
color : white;
}
.myBox {
text-align : center;
border-bottom : 2px solid transparent;
border-image : linear-gradient(0.25turn, rgb(255, 249, 34), rgb(255, 0, 128), rgb(56, 2, 155, 0));
border-image-slice : 1;
width : 100%;
}