@font-face {
    font-family: 'robotobold';
    src: url('./font/robotobold-Regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotolight';
    src: url('./font/Roboto-Light-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'robotobold';
    src: url('./font/Roboto-Bold-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'robotoitalic';
    src: url('./font/Roboto-Italic-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
F
@font-face {
  font-family: 'icomoonsocial';
  src:  url('font/icomoon-social.eot?o2ythb');
  src:  url('font/icomoon-social.eot?o2ythb#iefix') format('embedded-opentype'),
    url('font/icomoon-social.ttf?o2ythb') format('truetype'),
    url('font/icomoon-social.woff?o2ythb') format('woff'),
    url('font/icomoon-social.svg?o2ythb#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="iconsocial-"], [class*="iconsocial-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoonsocial' !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.iconsocial-twitter:before {
  content: "\1f30f";
}
.iconsocial-facebook:before {
  content: "\1f30d";
}
.iconsocial-linkedin:before {
  content: "\1f30e";
}

html, body, div, span, applet, object, iframe, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video{
			margin: 0;
			padding: 0;
			border: 0;
            font-family: "robotolight";
            font-weight: 500;
            font-style: normal;
			font-size: 100%;
			vertical-align: baseline;
            transform-origin: center;
            transition: .3s ease-in-out;
            transition-delay: .01s;
        }
iframe{
    border: none;
}

html {
    height: 100%;
    max-height: 100% !important;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
    background-color: #112e53;
    background-repeat:no-repeat;
    background-image: url('./img/home.png');
}
body{
    overflow-x: hidden;
    min-height: 100%;
    height: 100%;
    width: 100%;
    max-height: 100% !important;
    overflow-y: hidden;
    color: #ffffff;
    padding-top: 46px !important;
    }
    h1, h2, h3, h4, h5, h6{
        font-family: "robotolight";
        font-weight: 600;
    }
    h1{font-size: 1.56rem} h2{font-size: 1.54rem}
    h3{font-size: 1.52rem} h4{font-size: 1.5rem}
    h5{font-size: 1.48rem} h6{font-size: 1.46rem}
.row > .col{
    min-height: 2px;
}

/**
OVERLAY MENU
**/

.overlay-menu-container{
    position: absolute;
    top: -82%;
    left: -30%;
    z-index: 4800;
    min-width: 160%;
    min-height: 90%;
    max-height: 90%;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5% 32% 2% 32%;
    border-bottom-left-radius: 43%;
    border-bottom-right-radius: 43%;
    background-color: hsla(213, 64%, 41%, 0.25);
    transition: .4s ease-in-out;
    transform-origin: center center;
    transform: scaleX(.68);
    will-change: transform;
    will-change: transform,opacity;



}
@keyframes pulsatingShadow {
    0%{
        box-shadow: 0px 0px 0px 0px #1c1e1f5e;
    }
    50%{
        box-shadow: 0px 0px 5px 2px #1c1e1f5e;
    }
    100%{
        box-shadow: 0px 0px 0px 0px #1c1e1f5e;
    }
}
.overlay-menu-container.pulsating:not(.open){
    box-shadow: 0px 0px 0px 0px #1c1e1f5e;
    animation: pulsatingShadow 2s infinite ease-in-out;
}
.overlay-menu-container.open{
    top: 0;

    transform: scaleX(1);
    background-color: hsl(226, 39%, 22%);
    border-bottom-left-radius: 48%;
    border-bottom-right-radius: 48%;
    box-shadow: 0px 0px 20px 0px #171717;
}
.overlay-menu-container > .overlay-menu-content{
    color: #6e7088;
    width: 100%;
    min-height: 90%;
    position: relative;
    left: 0;
    top: 0;
    visibility: hidden;
    opacity: 0;
    transform-origin: center center;
    transform: scale(0.02);
    transition: .3s ease-in-out;
    transition-delay: .164s;
    will-change: opacity;
    will-change: transform;
    will-change: transform,opacity;
}
.overlay-menu-container > .overlay-menu-content > h1,.overlay-menu-container > .overlay-menu-content > h2,.overlay-menu-container > .overlay-menu-content > h3,.overlay-menu-container > .overlay-menu-content > h4{
    color: #c7c8da;
}
.overlay-menu-container.open > .overlay-menu-content{
    visibility: visible;
    opacity: 1;
    transform: scale(1);
}
.overlay-menu-container > .overlay-menu-toggle-area {
    width: 39%;
    height: 75px;
    background-color: transparent;
    position: absolute;
    cursor: pointer;
    top: 90%;
    left: 28%;
    border-bottom-left-radius: 30%;
    border-bottom-right-radius: 30%;
    -webkit-highlight: none;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;
}
.overlay-menu-toggle{
    display: block;
    position: absolute;
    top: 97%;
    left: 49.48%;
    width: 44px;
    height: 28px;
    margin: 0 auto;
    cursor: pointer;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    transition: .8s ease-in-out;
    will-change: transform;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;

}
.overlay-menu-toggle.open{
    transform-origin: center;
    transform: rotate(90deg) translateX(-18px);
}
.overlay-menu-toggle > span{
    background: #f9f8f9;
    height: 2px;
    width: 100%;
    border-radius: 1px;
    display: block;
    position: absolute;
    cursor: pointer;
    left: 0;
    content: '';
    transition: 1s ease-in-out;
    will-change: transform;
}
.overlay-menu-toggle > span:nth-child(1){
    top: 4px;
    -webkit-transform-origin: left center;
    transform-origin: left center;

}
.overlay-menu-toggle.open > span:nth-child(1) {
    transform: rotate(-50deg) translateX(-5px) translateY(-1px);
    transform-origin: top center;
    width: 15px;
}
.overlay-menu-toggle.open > span:nth-child(3) {
    transform-origin: top center;
    transform: rotate(50deg) translateX(-3px) translateY(0px);
    width: 15px;
}
.overlay-menu-toggle > span:nth-child(2){
    top: 12px;
    -webkit-transform-origin: left center;
    transform-origin: left center;

}
.overlay-menu-toggle > span:nth-child(3){
    top: 20px;
    -webkit-transform-origin: left center;
    transform-origin: left center;
}


/**MAIN BODY CONTENT **/
.base-logo{
    z-index: 30;
    width: 54px;
    height: 54px;
    margin-left: 7%;
}

.base-logo img{
    width: 102%;
    height: auto;
    -webkit-highlight: none;
    user-select: none;
    -webkit-tap-highlight-color:transparent;
    -moz-tap-highlight-color:transparent;
}
.base-logo-top{
    width: 54px;
    height: 54px;
    margin-left: 1.4%;
    opacity: 0;
    will-change: opacity;
    transform-origin: center center;
    transition: .5s ease-in-out;
    transition-delay: .4s;

}
.overlay-menu-container.open > .base-logo-top{
    opacity: 1;
}
.base-logo-top img{
    width: 102%;
    height: auto;
    -webkit-highlight: none;
    user-select: none;
    -webkit-tap-highlight-color:transparent;
    -moz-tap-highlight-color:transparent;
}
img{
    -webkit-highlight: none;
    user-select: none;
    -webkit-user-drag: none;
    -o-user-drag: none;
    -moz-user-drag: none;
    -ms-user-drag: none;
}
a,h1,h2,h3,h4,h5,h6,p{
    user-select: none;
    cursor: text;
}
a{
    cursor: pointer;
}

/* OVERLAY MENU cont. */
.why-info{
    user-select: none;
    -webkit-user-select:none;
    -ms-user-select:none;
    -moz-user-select:none;
}
.why-info  .row:first-of-type {
    margin-left: -3%;
}
.why-info  h6{
    color: #c1c1c1;
    font-size: 1.04rem;
    line-height: .6;
}
.why-info  p{
    color: #a09c9c;
    font-size: 0.933rem;
    line-height: 1.48;
    margin-top: 12px;
    font-family: "robotolight";
}
.why-info  br {
    line-height: normal;
}


.menu-links  ul.text-links li > a{
    line-height: 1.462;
    font-size: 1.6rem;
    color: #c1c1c1;
    transform-origin: left center;
    transform: scale(1);
    transition: .4s ease-in-out;
    transition-delay: .04s;
    display: inline-block;
}
.menu-links  ul.text-links li > a:hover{
    transform: scale(1.168);
    color: #828090;

}
.menu-links  ul.icon-links li > a{
    line-height: 1.62;
    font-size: 1.98rem;
    display: inline-block;
    opacity: 1;
    color: #e5e6e8;
    transform-origin: left center;
    transform: scale(1);
    transition: .4s ease-in-out;
    transition-delay: .04s;
}
.menu-links  ul.icon-links li >a:hover{
    opacity: .44;
    transform: scale(1.14);
}
.menu-links  ul.icon-links li{
    text-align: right;
}

.menu-links ul.text-links li{
    text-align: left;

}

/* BASE CONTENT OF THE BODY DIV #BASE-CONTENT, NO TOP MODAL CONTENT*/
.cookie-consent{
    display: block;
    width: 100%;
    min-height: 40px;
    background-color: #172a48;
    position: fixed;
    bottom: 0;
    left: 0;
    z-index: 9000000001;
    transition-duration: .8s;
    transition-timing-function:cubic-bezier(0.47, 0, 0.75, 0.72);
    box-shadow: -1px -1px 11px 2px #000000;
}
.cookie-consent .row.rowxx{
    margin: 20px 10px;
}
.cookie-consent.closed{
    display: block;
    opacity:0.1;
    position: fixed;
    bottom: -14%;
}
.cookie-consent .flexit{
    display:flex;
    align-items:center;
    justify-content: space-between;
    
}
.consent-para p{
    font-size: 15px;
    line-height: 1.2;
    color:#fff;
    font-family: "robotolight";
}
.consent-btn .btn{
    color:#fff;
    background-color:#505598;
    text-transform: capitalize;
}
.consent-btn .btn:hover{
    background-color:#4267b2;
}
#base-content{
    text-align: center;
    justify-content: center;
    z-index: 30;
}
#base-content > p:first-child{
    color: #302c2c;
    font-size: 1.4rem;
    font-family: "robotolight";
    font-weight: 400;
}
#base-content >p:first-child span:first-of-type{
    color: #313532;
    font: inherit;
}
#base-content > h6:nth-child(2){
    color: #302c2c;
    font-size: 2.44rem;
    font-weight: 600;
    line-height: 1.3;
    font-family: "robotobold";
}
#base-content >h6:nth-child(2) span:first-of-type{
    color: #222c4e;
    font-family: "robotobold";
    font-size: 4.74rem;
    font-weight: 600;
    line-height: 1.1;
    font-kerning: none;
}
#base-content >.outline-white-btn:first-of-type{
    transform-origin: center center;
    transform: scale(1);
    transition: .4s ease-in-out;
    text-transform: uppercase;
    color: #f9f8f9;
    font-weight: 600;
    height: 44px;
    font-family: "robotolight";
    border: 3px solid #f9f8f9;
    background: hsla(228, 3%, 33%, 0.04);
    box-shadow: 0 0 1px hsla(0, 0%, 0%, 0.08);
    margin-top: 34px;
}
#base-content>.outline-white-btn:first-of-type:hover{
    transform: scale(1.044);
}


/*ONE LINE FOOTER AT THE BOTTOM OF BODY */
footer.oneline{
    display: flex;
    justify-content: center;
    text-align: center;
    color: #dad9da;
    font-size: 1.01rem;
    line-height: 1.4;
    font-family: "robotolight";
    user-select: none;
    min-width: 100%;
    position: absolute;
    top: 92%;
    z-index: 1;
}
/** SLIDING TABS WITH BUTTONS **/

div.slidetabs{
    width: 100%;
    height: auto;
    max-width: 100%;
    display: block;
    position: relative;
    margin-top: 2.2%;
}
.slidetabs > .slidetabs-pagers{
    display: flex;
    position: relative;
    justify-content: space-around;
    padding-bottom: 6px;
    border-bottom: 2px solid #565fb9;
}
.slidetabs > .slidetabs-pagers >div.active{
    box-shadow: 0px 3px 0px 0px #565fb9;
}
/* HACK: carret ▼ */
.slidetabs > .slidetabs-pagers > div{
    display: block;
    overflow-x: hidden;
    overflow-y: hidden;
    cursor: pointer;
    text-align: center;
    font-family: "robotobold";
    font-weight: 600;
    line-height: 20px;
    font-size: 118%;
    color: #272946;
    margin-bottom: -4px;
    padding-bottom: 6px;
    user-select: none;
}
.slidetabs > .slidetabs-pagers > div:not(:first-of-type){
    margin-left: 10px !important;
}
.slidetabs-pagers > div:hover{
    transform: scale(1.08);
}
.slidetabs-pagers > div.active{
    color: #2e41ff;
    transform: scale(1.08);
}

.slidetabs > .slidetabs-pages{
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    transition: .4s ease-in-out;
    overflow-x: hidden;
    margin-top: 12px;

}
.slidetabs > .slidetabs-pages > div{
    display: block;
    position: relative;
    transition: .4s ease-in-out;
    user-select: none;
    min-width: 100%;
    width: 100%;
    min-height: 100px;
    height: auto;
    padding-left: 8px;
    padding-right: 8px;
    color: black;
}

/** TOPMOST FULL SCREEN MODAL FOR MAIN ACTION UI**/

.topmodalfs{
    background-color: #ffffff;
    position: fixed;
	z-index: -3;
    display: block !important;
    justify-content: center;
	visibility: hidden;
	opacity: 0;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
    transform-origin: right center;
    transition: .66s cubic-bezier(0.18, -0.15, 0.95, 0.95);
	will-change: transform,opacity;

	-webkit-transform: scale(0.8);
	-moz-transform: scale(0.8);
	-ms-transform: scale(0.8);
	-o-transform: scale(0.8);
	transform: scale(.11) translateY(-1%) translateX(120%);
}
.topmodalfs.opening,.topmodalfs.closing{
    visibility: visible;
	z-index: 8999;
}
.topmodalfs.opened{
    visibility: visible;
	z-index: 8999;
	-webkit-overflow-scrolling: touch;
	opacity: 1;
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
    overflow: hidden;
	transform: scale(1) translateY(0) translateX(0);
}
.topmodalfs> .topmodalfs-header{
    position: fixed;
    display: flex;
    z-index: 0;
    justify-content: flex-end;
    width: 100%;
    height: 14%;
    max-height: 15%;
    background: #ffffff;


}
.topmodalfs-header>.icon-logo{
    width: 54px;
    width: 54px;
    position: fixed;
    top: 4.6%;
    left: 3.3%;
}
.topmodalfs-header >.icon-logo img{
        width: 102%;
        height: auto;
}
.topmodalfs-header>.topmodalfs-toggle{
    width: 36px;
    height: 36px;
    user-select: none;
    cursor: pointer;
    position: absolute;
    top: 38%;
    right: 3.33%;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;
}
.topmodalfs-toggle >span{
    height: 2.44px;
    width: 100%;
    border-radius: 1.4px;
    background: #282a39;
    display: block;
    position: relative;
    cursor: pointer;
    left: 0;
    content: '';
    top: 50%;
    transition: 1s ease-in-out;
    will-change: transform;
}
.topmodalfs-toggle>span:first-child{
    top: 55.44%;
    transform-origin: center center;
    transform: rotate(-45deg);
}
.topmodalfs-toggle>span:last-child{
    transform-origin: center center;
    transform: rotate(45deg);

}
.topmodalfs-body >.topmodalfs-body-nav{
    height:55%;
    width: 20%;
    overflow: hidden;
}

.topmodalfs-body >.topmodalfs-body-content{
    height:100%;
    width: 83%;
    overflow: hidden;
    padding: 1% 4%;
    color: #000018;
}
.topmodalfs-body .topmodalfs-body-content > div.page{
    height: 104%;
    width: 120%;
    overflow-x: hidden;
    overflow-y: auto;
}
.topmodalfs-body .topmodalfs-body-content > div.page > *{
    width: 100%;
    padding-right: 10%;
    padding-left: 6%;
}
.topmodalfs > .subpage{
    transition: .44s ease-in-out;
    transform-origin: left center;
    position: fixed;
    width: 0.002px;
    height: 0;
    display: block;
    visibility: hidden;
    overflow: hidden;
    background: #fff;
    opacity: 0;
    will-change: transform,opacity;
}
.topmodalfs > .subpage.open{
    position: fixed;
    display: block;
    visibility: visible;
    overflow-x: hidden;
    overflow-y: hidden;
    opacity: 1;
}
.subpage > .subpage-modal{
    transition: .44s ease-in-out;
    transform-origin: bottom center;
    position: fixed;
    top: 45px;
    margin: 0 auto;
    width: 100%;
    height: 1px;
    display: block;
    visibility: hidden;
    overflow: hidden;
    background: #fff;
    opacity: .7;
    will-change: transform,opacity;
}
.subpage > .subpage-modal.open{
    position: fixed;
    display: block;
    visibility: visible;
    overflow-x: hidden;
    overflow-y: auto;
    opacity: 1;
    width: 100%;
    height: 100%;
}
.arrow-back.subpage-back{
    cursor: pointer;
    display: block;
    width: 26px;
    height: 26px;
    position: absolute;
    top: 10px;
    left: 30px;
    -webkit-tap-highlight-color: transparent;
    -moz-tap-highlight-color: transparent;
    -o-tap-highlight-color: transparent;
    -ms-tap-highlight-color: transparent;
}
.arrow-back.subpage-back img{
    width: 72%;
    height: auto;
    user-select: none;
}
.subpage .subpage-header h1{
    color: #27273c;
    font-family: "robotobold";
    font-weight: 600;
    font-size: 1.8rem;
    line-height: 0;
}
.subpage .subpage-content{
    width: 114.2%;
    height: 100%;
    margin: 0 auto;
    padding-left: 2%;
    padding-right: 16%;
    overflow-y: auto;
    overflow-x: hidden;
}
.subpage-content p, .subpage-content ul > li, .subpage-content ol > li span{
    text-align: left;
    font-size: .996rem;
    font-weight: 400;
    user-select: none;
    font-family: "robotobold";
    color: #000;
}
.subpage-content h6{
    font-family: "robotobold";
    color: #27273c;
    font-weight: 600;
    font-size: 18px;
}
ol.bluedot-ol{
    list-style-type:disc;
    list-style-position: outside;
    margin-left: 15px;
}
ol.bluedot-ol > li{
    line-height: normal;
    color: #3647e3;
    cursor: text;

}
.callout-infocard{
    transition: .6s ease-in-out;
    will-change: transform,box-shadow;
    transform-origin: center center;
    display: block;
    width: 100%;
    max-width: 325px;
    margin: auto;
    transform: scale(1);
    min-height: 180px;
    box-shadow: 4px 5px 14px -3px #262a47b5;
}
.callout-infocard:hover{
    box-shadow: 0px 0px 2px 0px #262a47b5;
    transform: scale(0.984);

}
.callout-infocard > .callout-header{
    width: 100%;
    min-height: 30px;
    display: block;
    text-align: center;
    padding: 10px 20px;
}
.callout-infocard > .callout-body{
    width: 100%;
    min-height: 40px;
    display: block;
    text-align: center;
    padding: 2px 18px;
}
.callout-infocard.hourly-info{
    background-color: #262a47;
    max-width: 318px;
}
.callout-infocard.hourly-info > .callout-header > p{
    line-height: 1;
    margin: 4px auto;
}
.callout-infocard.hourly-info > .callout-header >img{
    display: inline-block;
    width: 40px;
    height: auto;
    user-select: none;
    cursor: text;
    margin: auto auto;
}
.callout-infocard.hourly-info p{
    color: #fff;
    font-family: "robotolight";
    font-weight: 400;
    font-size: 16px;
    text-align: center;
    line-height: normal;
}
.callout-infocard.hourly-info > .callout-footer{
    width: 100%;
    min-height: 30px;
    display: block;
    margin-bottom: 0;

}
.callout-infocard.hourly-info > .callout-footer > .callout-footer-btn{
    display: block;
    width: 100%;
    height: 38px;
    line-height: 38px;
    background-color: #2e41ff;
    cursor: pointer;
    user-select: none;
    text-align: center;
    text-decoration: none;
    color: #ededf2;
    font-family: "robotolight";
    font-weight: 400;
    font-size: 15px;
}
.callout-infocard.hourly-info > .callout-footer > .callout-footer-btn:hover{
    background-color: #2196F3;
}
div.pricing-card{
    transition: .6s ease-in-out;
    will-change: transform,box-shadow;
    transform-origin: center center;
    display: block;
    width: 100%;
    max-width: 314px;
    margin: auto;
    transform: scale(1);
    min-height: 180px;
    background: #585858;
    box-shadow: 4px 5px 14px -3px #262a47b5;
}
div.pricing-card:hover{
    box-shadow: 0px 0px 2px 0px #262a47b5;
    transform: scale(0.984);
}
.pricing-card > .pricing-card-header{
    width: 100%;
    min-height: 50px;
    padding-top: 10px;
    padding-bottom: 5px;

}
.pricing-card > .pricing-card-header h4{
    color: #fff;
    font-family: "robotolight";
    font-weight: 600;
    font-size: 26px;
    text-transform: uppercase;
    text-align: center;
    line-height: 2px;
}
.pricing-card > .pricing-card-header p{
    color: #fff;
    font-family: "robotolight";
    font-weight: 600;
    font-size: 16px;
    text-align: center;
    line-height: 18px;
}

.pricing-card > .pricing-card-price{
    background: rgb(242,148,33);
    background: linear-gradient(15deg, rgb(82, 79, 255) 20%, rgb(30, 226, 72) 100%);
    width: 100%;
    min-height: 40px;
    padding-top: 5px;
    padding-bottom: 5px;
}
.pricing-card.galaxy > .pricing-card-price{
    background: rgb(232, 149, 5);
    background: linear-gradient(15deg, rgb(149, 1, 83) 20%, rgb(240, 61, 53) 100%);
}
.pricing-card.galaxy-cluster > .pricing-card-price{
    background: rgb(232, 149, 5);
    background: linear-gradient(15deg, rgb(149, 1, 83) -4%, rgb(225, 131, 14) 100%);
}
.pricing-card.universe > .pricing-card-price{
    background: rgb(232, 149, 5);
    background: linear-gradient(15deg, rgb(246, 137, 2) 5%, rgb(255, 19, 19) 100%);
}
.pricing-card > .pricing-card-price p{
    color: #e7e7ea;
    font-family: "robotolight";
    font-weight: 600;
    font-size: 26px;
    text-align: center;
    line-height: 14px;
}
.pricing-card.starter > .pricing-card-price p{
    color: #262a47;
}

.pricing-card > .pricing-card-body{
    width: 100%;
    min-height: 120px;
    padding-top: 20px;
    padding-bottom: 20px;
}
.pricing-card > .pricing-card-body ul{
    display: block;
    margin: auto;
}
.pricing-card-body ul > li{
    color: #fff;
    font-family: "robotolight";
    font-weight: 600;
    font-size: 14px;
    text-align: center;
    line-height: 1.55;
    padding: 3px 2px;
    border-bottom: 1px solid rgba(222, 222, 222, 0.06);
}
.block-btn-primary{
    display: block;
    max-width: 100%;
    height: 38px;
    line-height: 38px;
    background-color: #2e41ff;
    cursor: pointer;
    user-select: none;
    text-align: center;
    text-decoration: none;
    color: #ededf2;
    font-family: "robotolight";
    font-weight: 600;
    font-size: 15px;
}
.pricing-card > .pricing-card-body .block-btn-primary{
    margin: 18px auto 8px;
    max-width: 44% !important;
}
.block-btn-primary:hover{
    background-color: #2196F3;
}

/*--------------------------- Pages------------------------------------------- */
.page.how-page,.page.services-page,.page.portfolio-page,.page.company-page,.page.contact-page{
    height: 100%;
    position: relative;
}


.how-page .time-paths{
    width: 100%;
    height: 100%;
    overflow: hidden;
    display: flex;
    align-content: center;
    justify-content: center;
}
.how-page .time-paths > img{
    width: 100%;
    height: auto;
}
.how-page .timeline-iconized{
    width: 100%;
    height: auto;
    position: absolute;
    top:0;
    padding-top: 6.88%;
    background-color: #fff;
}
.timeline-iconized .iconized-layout{
    display: flex;
    justify-content: flex-start;
    padding-bottom: 14%;
}
.iconized-layout > .icon{
    width: 30%;
    padding-top: 5%;
}
.iconized-layout > .icon img{
    width: 55px;
    height: auto;
}
.iconized-layout > .text > h6 span img{
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-left: 12px;
    cursor: pointer;
}
.iconized-layout > .text > p{
    user-select: none;
    line-height: 1.33;
    font-size: 1.38vw;
    margin-top: -1px;
    text-align: left;
    font-family: "robotolight";
    font-weight: 600;
    width: 100%;
}
.time-paths{
    width: 100%;
}
#timeline-iconized-svg{
    width: 100%;
    height: auto;
}
svg#howitworks-iconized-doc{
    width: 100%;
    height: 100%;
}
.howitworks_tileinfo{
    cursor: pointer;
    transform: translateX(12px) translateY(-1px);
}
.howitworks_dayheader{
    cursor: text;
    user-select: none;
    font-size: 1.2rem;
    font-family: "robotobold";
}
.howitworks_daypara{
    cursor: text;
    user-select: none;
    font-family: "robotobold";
    font-weight: 400;
    font-size: .88rem;
}

.service-link-paths,.services-tiles{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.services-link-paths{
    display: flex;
    justify-content: center;
    align-content:center;

}
.services-tiles{
    width: 100%;
    height: auto;
    position: absolute;
    top:0;
    padding-top: 3.81%;
}
.services-tiles > .row > .col .heading{
    display: flex;
    justify-content: flex-start;
    align-content: flex-start;
}
.services-tiles > .row > .col.flex-center > div{
    width: 33.3333%;
    padding-top: 6%;
}
.services-tiles > .row > .col .heading img{
    margin-left: -10px;
    display: inline-block;
    width: 48px;
    height: 48px;
    margin-top: 14px;
}
.services-tiles > .row > .col .heading h2{
    text-align: center;
    user-select: none;
    cursor: text;
    font-family: "robotobold";
    margin-left: 14px;
    margin-top: 28px;
}
.services-tiles > .row > .col .para{
    margin-top: -8%;
    padding-top: 0;
}
.services-tiles > .row > .col .para p{
    text-align: left;
    font-size: .91rem;
    font-weight: 400;
    user-select: none;
    font-family: "robotobold";
    color: #606060;
}
.services-tiles > .row > .col .para a{
    display: block;
    text-decoration: none;
    user-select: none;
    color: inherit;
    font-size: 1.1em;
    font-family: "robotobold";
    margin-top: -4%;
}

.flex-center{
    display: flex;
    align-content: center;
    justify-content: center;
}



/* MEDIA QUERIES FOR VARIOUS ELEMENTS {Above portrait phones and tablet} */
@media only screen and (min-width: 780px){
    .menu-links{
        margin-top: 58px !important;
    }
    .menu-links  ul.text-links{
        margin-left: 36%;
    }
    .topmodalfs>.topmodalfs-body{
        position: relative;
        display: flex;
        justify-content: flex-end;
        width: 100%;
        height: 85%;
        top: 10%;
        max-height: 86%;
        padding: 2% 3% 1% 3.6%;
        overflow-y: hidden;
        z-index: 0;
    }
    .topmodalfs > .subpage{
        right: 1%;
        top: 5%;
        height: 95%;
        width: 100%;
    }
    .topmodalfs > .subpage.open{
        width: 72%;
        height: 95%;
        padding:40px;
        padding-top: 48px;
    }
    .subpage > .subpage-header{
        display: block;
        position: fixed;
        top: 6px;
        left: 12px;
        height: 60px;
        width: 100%;
    }
    .topmodalfs-body > .topmodalfs-body-nav{
        margin-top: 4%;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .gonext{
        background: orange;
        display: none;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks{
        width: 98%;
        height: 100%;
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .goprev{
        background: orange;
        display: none;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links li:first-of-type{
        display: none !important;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links li > a{
        text-align: left;
        line-height: 1.6;
        font-size: 2.6vw;
        font-family: "robotolight";
        font-weight: 500;
        color: #bcbcbd;
        cursor: pointer;
        user-select: none;
        display: inline-block;
        transform: scale(1);
        transform-origin: left center;
        transition: .4s ease-in-out;
        transition-delay: .1s;

    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks > ul.text-links li > a:hover{
        color: #80818a;
        transform: scale(1.128);

    }

    .topmodalfs-body > .topmodalfs-body-nav > .golinks > ul.text-links li.active > a{
        color: #434554;
        transform: scale(1.148);

    }
    .layout-divider-1{
        height: 14vh;
    }
    .timeline-iconized{
        display: none !important;
    }
    .time-paths{
        display: block !important;
        visibility: visible !important;
    }
}
/* MEDIA QUERIES FOR VARIOUS ELEMENTS {smartphones, iPhone, portrait 480x320 phones} */
@media only screen and (max-width:779px)  {
    .cookie-consent.closed{
        bottom:-18%;
    }
    .cookie-consent .row.rowxx {
    margin: 26px 0px;
    }
    .consent-btn .btn {
    height: 56px;
    line-height: 56px;
    font-size: 18px;
    width: 132px;
}
.consent-para p {
    font-size: 20px;
}
    .base-logo-top{
        margin-left: 40.98% !important;
    }
    .base-logo{
        margin-left: 44.98% !important;
        margin-top: 34px !important;
    }
    .menu-links  ul.text-links li{
        text-align: left;
    }
    .menu-links{
        margin-top: 58px !important;
    }
    .menu-links  ul.text-links{
        margin-left: 12%;
        transform-origin: top center;
        transition: .3s ease-in-out;
        transform: scale(1.32632);
    }
    .menu-links  ul.icon-links{
        margin-left: 12%;
        transform-origin: top left;
        transition: .3s ease-in-out;
        transform: scale(1.22632) translateX(2px) translateY(18px);
    }
    .overlay-menu-toggle{
        left: 48.28% !important;
    }
    #base-content{
        transform-origin: top center;
        transform: scale(.894);
    }
    #base-content > p:first-child{
        font-size: 28px !important;
    }
    #base-content >.outline-white-btn:first-of-type{
        transform: scale(1.3);
    }
    .topmodalfs > .topmodalfs-body{
        position: relative;
        display: flex;
        justify-content: flex-end;
        width: 100%;
        height: 86%;
        top: 12%;
        max-height: 86%;
        padding: 1.62% 3% 1% 3.6%;
        overflow-y: hidden;
        z-index: 0;
    }
    .topmodalfs > .subpage{
        left: 0;
        top: 0;
        height: 95%;
    }
    .topmodalfs > .subpage.open{
        width: 100%;
        height: 100%;
        padding-top: 70px;
    }
    .topmodalfs-body .topmodalfs-body-content > div.page > *{
        padding-right: 8%;
    }
    .subpage > .subpage-header{
        display: block;
        position: fixed;
        top: -1px;
        height: 60px;
        width: 102%;
        background-color: #282a39;
        box-shadow: 0 1px 20px 0px #78787e;
    }
    .arrow-back.subpage-back{
        display: block;
        width: 40px;
        height: 40px;
        position: absolute;
        top: 22px;
        left: 12px;
    }
    .subpage > .subpage-modal{
        top: 60px !important;
    }
    .slidetabs1{
        margin-top: 12% !important;
    }
    .subpage > .subpage-header h1{
        line-height: 1;
        font-size:22px;
        color: #fff;
    }
    .subpage-content p,.subpage-content ul > li, .subpage-content ol > li span{
        font-size: 1.432em;
    }
    .subpage-content h6{
        font-size: 22px;
    }
    .callout-infocard{
        max-width: 360px !important;
    }
    .callout-infocard.hourly-info > .callout-footer > .callout-footer-btn{
        font-size: 24px;
        height: 58px;
        line-height: 58px;
    }
    .callout-infocard.hourly-info p{
        font-size: 22px;
    }
    .callout-infocard.hourly-info > .callout-header >img{
        width: 66px;
    }
    div.pricing-card{
        max-width: 100%;
        margin-bottom: 50px;
    }
    .topmodalfs-body > .topmodalfs-body-nav{
        background: hsla(0, 0%, 58%, 0.11);
        position: fixed;
        height: 8% !important;
        width: 65% !important;
        top: 4%;
        display: flex;
        justify-content: center;
        transform-origin: center;
        transform: rotate(0deg);
        left: 19%;
        overflow-x: hidden !important;
        overflow-y: hidden !important;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .gonext{
        background: hsla(261, 17%, 32%, 0.08);
        display: block;
        width: 16%;
        height: 100%;
        cursor: pointer;
        -webkit-highlight:none;
        -webkit-highlight-color:transparent;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks{
        width: 68%;
        height: 100%;
        overflow-x: hidden;
        overflow-y: hidden;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .goprev{
        background: hsla(261, 17%, 32%, 0.08);
        display: block;
        width: 16%;
        height: 100%;
        cursor: pointer;
        -webkit-highlight:none;
        -webkit-highlight-color:transparent;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .gonext:hover,.topmodalfs-body > .topmodalfs-body-nav > .goprev:hover{
        background: hsla(247, 20%, 20%, 0.2);
    }
    .topmodalfs-body-nav > .goprev > span,.topmodalfs-body-nav > .gonext > span{
        font-family: sans-serif;
        color: #292738;
        text-align: center;
        line-height: 1;
        padding-left: 10px;
        font-size: 2.8rem;
        user-select: none;

    }
    .topmodalfs-body-nav > .gonext > span:only-child{
        display: inline-block;
        text-align: center;
        line-height: 1;
        margin-left: -1px;
        padding-bottom: 14px;
        padding-right: 1px;
    }
    .topmodalfs-body-nav > .goprev > span:only-child{
        display: inline-block;
        text-align: center;
        line-height: 1;
        margin-left: -1px;
        padding-bottom: 14px;
        padding-right: 1px;
    }

    .topmodalfs-body > .topmodalfs-body-content{
        height:100% !important;
        width: 100% !important;
        overflow: hidden !important;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links{
        overflow: hidden;
        height: 100%;
        max-height: 100%;
        width: 100%;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links li > a{
        text-align: center;
        line-height: 2;
        font-size: 1.7rem;
        width: 100%;
        color: #35374a;
        cursor: pointer;
        user-select: none;
        display: inline-block;
        transform: scale(1);
        transform-origin: center center;
        transition: .4s ease-in-out;
        transition-delay: .1s;

    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links li > a:hover{
        line-height: 2;
        font-size: 1.588rem;
        width: 100%;
        color: #35374a;
        transform: scale(1.168);

    }
    .topmodalfs-body .topmodalfs-body-content > div.page{
        width:112%;
    }
    .topmodalfs-body > .topmodalfs-body-nav > .golinks ul.text-links li > a.active{
        color: #434554;
        transform: scale(1.088);

    }
    .iconized-layout > .text > h6 span img {
    display: inline-block;
    width: 23px;
    height: 23px;
    margin-left: 5px;
    cursor: pointer;
}
.iconized-layout > .text > h6{
    font-size: 1.7rem;
    text-align: center;
    font-family: "robotobold";
    font-weight: 600;
}
.iconized-layout > .text > p{
    text-align: center;
    font-size: 5.38vw;
    font-family: "robotolight";
    font-weight: 600;
}
.timeline-iconized .iconized-layout {
    display: block;
    justify-content: center;
    margin: 0 auto;
}
.iconized-layout > .icon {
    width: 100%;
    padding-top: 4%;
    display: inline-flex;
    justify-content: center;
}
.iconized-layout > .icon img {
    width: 96px;
    height: 96px;
    margin: 0 auto;
}
.timeline-iconized{
    display: block !important;
}
.time-paths{
    display: block !important;
    visibility: hidden !important;
}
.services-tiles > .row > .col.flex-center > div{
    width: 100%;
    padding-top: 6%;
}
.services-tiles > .row > .col .para p {
    text-align: center;
    font-size: 1.4em;
}
.services-tiles > .row > .col .heading {
    display: block;
}
.services-tiles > .row > .col .heading img{
    margin-left: 0;
    display: inline-block;
    width: 100%;
    height: 48px;
    margin-top: 14px;
}
.services-tiles > .row > .col .heading h2{
    text-align: center;
    padding-bottom: 30px;
    margin-top: 1%;
}
.services-tiles > .row > .col .para a{
    text-align: center;
    display: block;
    font-size: 1.4em;
}
.services-page .service-link-paths{
    visibility: hidden !important;
}

}
