﻿/*background */
.buddy-background {background: url(/SPEAK_WEB_Patterns/img/Buddyhero.svg);background-size: cover;background-position: center;}
.phone .buddy-background {background: url(/SPEAK_WEB_Patterns/img/buddymobile.png?10878);background-size: cover;background-position: center;}
.faq-background {background: url(/SPEAK_WEB_Patterns/img/buddybackground.svg);background-size: contain;background-repeat: no-repeat;background-position: center;background-size: 100%;}
.phone .faq-background {background:none;}

/* Use in screen where the header is transparent */
.carousel .tns-nav {margin-top: var(--space-none);}
.phone .header-center {display: flex;justify-content: flex-end;height: 100%;}
.phone .header-left {display:flex;flex: 1;}
.layout .header {background-color: transparent;box-shadow: none;left: 0;position: absolute;right: 0;top: 0;z-index: 100;}
.header-top {margin-top: 17px;}
.phone .header-top {margin-top: 0;}
.layout-top .header .ThemeGrid_Container {margin: var(--space-none) auto;padding: var(--space-none) var(--space-none);max-width: 1264px;}
.phone .layout-top .header .ThemeGrid_Container {margin: var(--space-none) auto;padding: var(--space-none) var(--space-none);width: 100%;padding-left: 5%;padding-right: 5%;}
.layout .main {padding-top: 0;}
.transparent-menu-header.header-menu-link a {color: #fff !important;}
.transparent-menu-header.header-menu-link a:hover {opacity:0.8;}
.phone .transparent-menu-header.header-menu-link a {color: var(--color-text-01)!important;padding-left: var(--space-none);}
.header-menu-link  {color: #fff !important;}
.transparent-menu-header .Button {color: #000;border: none;}
.transparent-menu-header .Button:hover {color: #fff;border: none;}
.menu-icon-line {background-color: black}

/* frearrange bullets points in mobile */
.phone .buddy-bullets {flex-direction: column;}
.phone .buddy-bullets-text {margin-left:0; margin-right:0; text-align:center;}
.phone .buddy-bullets-image {display: flex; flex-direction: row; justify-content: center;}
.phone .buddy-bullets-reverse {flex-direction:column-reverse;}
.phone .buddy-bullets-image-reverse {flex-direction: row-reverse;}







