@import url(reset.css);

html {
    font-size: 16px;
}
body {
    font-family: 'Poppins', sans-serif;
    /* margin-top: 72px; */
    font-weight: 300;
    background: #F5F6FC;
}

body, html, main {
    /* important */
    height: 100%;
}

.wrapper {
    width: 100%;
    overflow-x: hidden;
}

/** common styles **/

.blue {
     color: #374FC7;
}
.dark-blue {
    color: #1F2937;

}
.light-blue {
    color: #3F8ED0;
}
.black {
    color: #000;
}

.text-semibold {
    font-weight: 600;
}
.text-bold {
    font-weight: 700;
}
.text-medium {
    font-weight: 500;
}
.text-light-300 {
    font-weight: 300;
}
.font-16 {
    font-size: 16px;
}
.font-40 {
    font-size: 40px;
}
.font-20 {
    font-size: 20px;
}
.font-24 {
    font-size: 24px;
}
.font-28 {
    font-size: 28px;
}
.font-48 {
    font-size: 48px;
}
.font-36 {
    font-size: 36px;
}
.no-underline {
    text-decoration: none;
}
.underline {
    text-decoration: underline;
}

header {
    padding: 10px 35px;
    display: flex;
    justify-content: space-between;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 2;
    background: rgba(255,255,255,.95);
}
header .right-section a:last-child {
    margin-left: 20px;
}

.page-wrapper.page-landing .lodonfair-logo {
    /* margin-top: 120px; */
}
.page-wrapper.page-landing, .page-wrapper.signup {
    min-height: 100vh;
    background: rgb(218,227,255);
background: linear-gradient(0deg, rgba(218,227,255,1) 0%, rgba(255,255,255,1) 100%);
position: relative;
}

.page-wrapper.page-landing .main-content {
    display: flex;
    justify-content: space-between;
    /* padding: 0 180px; */
    width: 100%;
}

.page-wrapper.page-landing .main-content {
    font-size: 60px;
    line-height: 75px;
}

.page-wrapper.page-landing .main-content .london-fair-tagline span {
    background: #395AC9;
    background: -webkit-linear-gradient(to top left, #395AC9 12%, #43ADD4 100%);
    background: -moz-linear-gradient(to top left, #395AC9 12%, #43ADD4 100%);
    background: linear-gradient(to top left, #395AC9 12%, #43ADD4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.page-wrapper.page-landing .main-content .london-fair-tagline .text-light-300 {
    line-height: normal;
    margin-top: 30px;
}

.page-wrapper.page-take .container-fluid {
    min-height: calc( 100vh ) !important;
}

.page-wrapper.page-take .question > div {
    font-size: 48px ;
    padding: 0 10%;
}
.page-wrapper.steps .step-img img {
    /* max-width: 227px;
    padding-top: 10%; */
    max-width: 60%;
}
.page-wrapper.steps .steps-text .number {
    font-size: 140px;
    line-height: 140px;
    font-weight: 300;
}
.page-wrapper.steps .steps-text .number-text {
    font-size: 40px;
    color: #4B5563;
}


.page-wrapper.steps .steps-text .step .show-on-scroll {
    left: 80px;
    position: relative;
}
.page-wrapper.steps .steps-text .step:before {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
}
.page-wrapper.steps .steps-text .step1 {
    margin-top: 250px;
}
.page-wrapper.steps .steps-text .step2 {
    margin-top: 150px;
}
.page-wrapper.steps .steps-text .step3 {
    margin-top: 150px;
}
.page-wrapper.steps .note-text {
    max-width: 70%;
    margin-bottom: 150px;
}

.page-wrapper.free-upgrade {
    padding: 0 180px;
}

.has-full-border {
    position: relative;
}
.has-full-border::before {
    position: absolute;
    width: 1px;
    height: 100%;
    left: 50%;
    background: #000;
    content: "";
}

.page-wrapper.signup .device-image {
    position: absolute;
    /* border: solid 1px #FF0000; */
}

.page-wrapper.gallery {
    background: #1F2937;
    color: #FFF;
}
.page-wrapper.gallery .art-slide-container  {
    padding-left: 210px;
}
.page-wrapper.gallery .slider-art .tns-item img {
    /* border:solid 10px #2A2A2A */
    max-height: 55vh;
}

.page-wrapper.gallery .slider-art .caption .name {
    font-weight: 500;
    font-size: 20px;
    margin-top: 40px;
}
.page-wrapper.gallery .slider-art .caption .title {
    font-style: italic;
    font-size: 16px;
}
.page-wrapper.gallery .slider-art .caption .year {
    font-size: 16px;
    font-weight: 500;
}
.page-wrapper.gallery .tns-controls {
   text-align: right;
}
.page-wrapper.gallery .tns-controls button[data-controls="next"] {
    margin-left: 30px;
    margin-right: 30px;
}
.page-wrapper.gallery .tns-controls button[data-controls="next"],
.page-wrapper.gallery .tns-controls button[data-controls="prev"] {
   font-size: 0;
   position: relative;
}
.page-wrapper.gallery .tns-controls button[data-controls="next"]:before {
    content: ">";
    font-size: 50px;
}
.page-wrapper.gallery .tns-controls button[data-controls="prev"]:before {
    content: "<";
    font-size: 50px;
}
.modal .modal-body {
    padding: 30px;
    padding-top: 10px;
}
.modal .close-btn-wrap {
    margin-top: 20px;

    text-align: right;
    margin-right: 30px;
}
.terms-condition-landing  {
    list-style: decimal;
    padding-left: 15px;
    margin-top: 5px;
}

.terms-condition-landing li {
    margin-top: 10px;
}

/* .page-wrapper.gallery .popup {
    position: fixed;
    width: auto;
    height: 100vh;
    z-index: 1;
    left: 50%;
    top: 0;
    transform: translateX(-50%)
}
.page-wrapper.gallery .popup:before {
    position: fixed;
    left: 0;
    top: 0;
    width: 100vh;
    height: 100vh;
    content: "";
    background: rgba(0,0,0,.6);
    z-index: -1;
} */


.header-padding {
    margin-top: 100px;
}

#socials img{
    max-height: 20px;
}

#socials a {
    text-decoration: none;
}

.section{
    min-height: 100%;
    background-size: cover;
    background-attachment: fixed;
    background-repeat: no-repeat;
    background-position: center center;
}

/** From mobile **/
@media (max-width: 575px) {
}
/** From small **/
@media (min-width: 576px) {
}

@media (max-width: 767px) {
    body {
        background-color: #FFF;
        overflow-x: hidden;
    }
    .page-wrapper.page-landing .main-content {
        font-size: 28px;
        line-height: 40px;
    }
    .page-wrapper.page-landing .main-content .london-fair-tagline .font-24 {
        font-size: 14px;
    }
    .page-wrapper.page-landing .main-content .art-img img {
        max-width: 50%;
    }
    .page-wrapper.page-landing .lodonfair-logo img {
        max-height: 45px;
    }
    .page-wrapper.gallery .slider-art .tns-item img {
        max-height: 300px;
    }
    .page-wrapper.gallery .art-slide-container {
        padding-left: 30px;
    }
    #tns1 > .tns-item {
        padding-right: 30px !important;
    }
    .page-wrapper.page-take img {
        max-height: 120px;
    }
    .page-wrapper.page-take .question > div {
        font-size: 30px;
    }

    .page-wrapper.steps .steps-text .number {
        font-size: 100px;
        line-height: 100px;
    }
    .page-wrapper.steps .steps-text .number-text {
        font-size: 25px;
        max-width: calc(100% - 40px);
    }
    .page-wrapper.steps .note-text {
        max-width: none;
        padding-right: 15px;
    }
    .has-full-border:before {
        display: none;
    }
    .min-vh-100 {
        min-height: auto !important;
    }
    .page-wrapper.gallery, .page-wrapper.steps {
        padding-top: 50px;
        padding-bottom: 50px;
    }
    .page-wrapper.steps .steps-text .step1 {
        margin-top: 0;
    }
    .page-wrapper.steps .step-img img {
        max-height: 265px;
        max-width: 300px;
    }
    .page-wrapper.steps .note-text {
        margin-bottom: 50px;
    }
    .page-wrapper.free-upgrade {
        padding: 30px;
    }
    .font-28 {
        font-size: 18px;
    }
    .page-wrapper.signup .device-image {
        display: none;
    }
    .page-wrapper.signup {
        min-height: auto!important;
        padding:50px 20px;

    }
    .page-wrapper.steps,
    .page-wrapper.signup {
        background: #F5F6FC;
    }
    .page-wrapper.steps .steps-text .step,
    .page-wrapper.steps .steps-text .step.is-visible {
        left: 40px !important;
    }
    .page-wrapper.steps .note-text {
        padding-right: 0;
        max-width: calc(100% - 40px);
    }

    .page-wrapper.steps .steps-text .step .show-on-scroll {
        left: 40px;
    }

}
/** From medium **/
@media (min-width: 768px) {
    .page-wrapper.page-landing .main-content {
        font-size: 35px;
        line-height: 45px;
    }
    .page-wrapper.page-landing .main-content .london-fair-tagline .font-24 {
        font-size: 18px;
    }
    .page-wrapper.page-landing .lodonfair-logo img {
        max-height: 65px;
    }
    .page-wrapper.steps .steps-text .number {
        font-size: 100px;
        line-height: 100px;
    }
    .page-wrapper.steps .steps-text .number-text {
        font-size: 25px;
    }
    .page-wrapper.steps .note-text {
        max-width: none;
        padding-right: 15px;
    }
    .page-wrapper.free-upgrade {
        padding: 0 50px;
    }
    .page-wrapper.steps .note-text {
        max-width: 70%;
    }

    .page-wrapper.steps .steps-text .step1 {
        margin-top: 0px;
    }
    .page-wrapper.steps .steps-text .step .show-on-scroll {
        left: 30px;
        width: calc(100% - 40px);
    }
    .page-wrapper.steps .steps-text .step.step2 .show-on-scroll,
    .page-wrapper.steps .steps-text .step.step3 .show-on-scroll{
        left: 300px;
    }

    .page-wrapper.steps .steps-text .step.step2 .show-on-scroll.is-visible,
    .page-wrapper.steps .steps-text .step.step3 .show-on-scroll.is-visible{
        transition-property: left;
        transition-duration: 1s;
        left: 30px;
    }

    .page-wrapper.signup .device-image.img8.is-visible {
        bottom: 100px;
        left: 30px;
    }
    .page-wrapper.signup .device-image.img7.is-visible {
        bottom: 0;
        left: 20%;
    }
    .page-wrapper.signup .device-image.img6.is-visible {
        bottom: 0;
        right: 10px;
    }
    .page-wrapper.signup .device-image.img5.is-visible {
        bottom: 25%;
        right: -10px;
    }
    .page-wrapper.signup .device-image.img4.is-visible {
        top: 0;
        right: 0;
    }
    .page-wrapper.signup .device-image.img3.is-visible {
        top: 0px;
        right: 25%;
    }
    .page-wrapper.signup .device-image.img2.is-visible {
        top: 0;
        left: 40%;
    }
    .page-wrapper.signup .device-image.img1.is-visible {
        left: 30px;
        top: 0;
    }

    .page-wrapper.signup .device-image.img2,
    .page-wrapper.signup .device-image.img3,
    .page-wrapper.signup .device-image.img4,
    .page-wrapper.signup .device-image.img5,
    .page-wrapper.signup .device-image.img8 {
        max-width: 150px;
    }
    .page-wrapper.signup .device-image.img1,
    .page-wrapper.signup .device-image.img6,
    .page-wrapper.signup .device-image.img7 {
        max-width: 300px;
    }
    .page-wrapper.signup .device-image.img1,
    .page-wrapper.signup .device-image.img2,
    .page-wrapper.signup .device-image.img7,
    .page-wrapper.signup .device-image.img8 {
        transition-property: left;
        transition-duration: 1s;
         left: -300px;
    }
    .page-wrapper.signup .device-image.img3,
    .page-wrapper.signup .device-image.img4,
    .page-wrapper.signup .device-image.img5,
    .page-wrapper.signup .device-image.img6 {
        transition-property: right;
        transition-duration: 1s;
         right: -300px;
    }


    .page-wrapper.steps .step-img img {
        margin-top: 60px;
    }

}
/** From L **/
@media (min-width: 992px) {
    .page-wrapper.page-landing .main-content {
        font-size: 50px;
        line-height: 62px;
    }
    .page-wrapper.page-landing .main-content .london-fair-tagline .font-24 {
        font-size: 20px;
    }
    .page-wrapper.page-landing .lodonfair-logo img {
        max-height: 65px;
    }
}
/** From XL **/
@media (min-width: 1200px) {
    .page-wrapper.page-landing .main-content {
        font-size: 50px;
        line-height: 62px;
    }
    .page-wrapper.page-landing .main-content .london-fair-tagline .font-24 {
        font-size: 20px;
    }
    .page-wrapper.page-landing .lodonfair-logo img {
        max-height: 65px;
    }
}
/** From XXL **/
@media (min-width: 1400px) {
    .page-wrapper.steps .steps-text .step.step2 .show-on-scroll,
    .page-wrapper.steps .steps-text .step.step3 .show-on-scroll{
        left: 300px;
    }
    .page-wrapper.steps .steps-text .step.step1 .show-on-scroll{
        left: 80px;
    }
    .page-wrapper.steps .steps-text .step.step2 .show-on-scroll.is-visible,
    .page-wrapper.steps .steps-text .step.step3 .show-on-scroll.is-visible{
        transition-property: left;
        transition-duration: 1s;
        left: 80px;
    }

    .page-wrapper.signup .device-image.img8 {
        bottom: 100px;
        left: 30px;
    }
    .page-wrapper.signup .device-image.img7 {
        bottom: 0;
        left: 20%;
    }
    .page-wrapper.signup .device-image.img6 {
        bottom: 0;
        right: 10px;
    }
    .page-wrapper.signup .device-image.img5 {
        bottom: 25%;
        right: 10%;
    }
    .page-wrapper.signup .device-image.img4 {
        top: 0;
        right: 0;
    }
    .page-wrapper.signup .device-image.img3 {
        top: 0px;
        right: 25%;
    }
    .page-wrapper.signup .device-image.img2 {
        top: 0;
        left: 40%;
    }
    .page-wrapper.signup .device-image.img1 {
        left: 30px;
        top: 0;
    }
    .page-wrapper.signup .device-image.img8.is-visible {

        left: 30px;
    }
    .page-wrapper.signup .device-image.img7.is-visible {

        left: 20%;
    }
    .page-wrapper.signup .device-image.img6.is-visible {
        bottom: 0;
        right: 10px;
    }
    .page-wrapper.signup .device-image.img5.is-visible {

        right: 10%;
    }
    .page-wrapper.signup .device-image.img4.is-visible {

        right: 0;
    }
    .page-wrapper.signup .device-image.img3.is-visible {

        right: 25%;
    }
    .page-wrapper.signup .device-image.img2.is-visible {

        left: 40%;
    }
    .page-wrapper.signup .device-image.img1.is-visible {
        left: 30px;
    }

    .page-wrapper.signup .device-image.img2,
    .page-wrapper.signup .device-image.img3,
    .page-wrapper.signup .device-image.img4,
    .page-wrapper.signup .device-image.img5,
    .page-wrapper.signup .device-image.img8 {
        max-width: 200px;
    }
    .page-wrapper.signup .device-image.img1,
    .page-wrapper.signup .device-image.img6,
    .page-wrapper.signup .device-image.img7 {
        max-width: 500px;
    }
    .page-wrapper.signup .device-image.img1,
    .page-wrapper.signup .device-image.img2,
    .page-wrapper.signup .device-image.img7,
    .page-wrapper.signup .device-image.img8 {
        transition-property: left;
        transition-duration: 1s;
         left: -300px;
    }
    .page-wrapper.signup .device-image.img3,
    .page-wrapper.signup .device-image.img4,
    .page-wrapper.signup .device-image.img5,
    .page-wrapper.signup .device-image.img6 {
        transition-property: right;
        transition-duration: 1s;
         right: -300px;
    }


}

@media (min-width: 768px) and (max-width: 1198px) {
    .page-wrapper.gallery .art-slide-container {
        padding-left: 80px;
    }
}