@charset "UTF-8";

body, 
body a,
body .main .bgcolour-light,
body .main .bgcolour-light a[href]:not( .btn ){
 color: #222
}
body .main .bgcolour-dark, 
body .main .bgcolour-dark a[href]:not( .btn ){
 color: #fff
}

.ui-frame-header a[href], .ui-frame-sidebar a[href]{
 text-decoration: none 
}

/*
 Images
 */

picture.img-contain{
 background-color: #f4f4f4
}

/*
 Modal
 */

.jquery-helpers-modal>a.cross:before,
.jquery-helpers-modal>a.cross:after{
 background-color: #FFF;
}

/*
 Alert
 */
 
.jquery-helpers-alert{
 background-color: #FFF;
 border-radius: 10px;
 box-shadow: 0 2px 10px 0 #0003
}
.jquery-helpers-alert .header{
 border-bottom: solid #d9dadc 1px;
 border-radius: 10px 10px 0 0;
}
.jquery-helpers-alert.fixed-bottom,
.jquery-helpers-alert.fixed-bottom .header{
 border-radius: 0
}
.jquery-helpers-alert .header p+p{
 font-size: 0.875rem;
 font-weight: 400;
}
.jquery-helpers-alert .message{
 font-size: 1rem
}
.jquery-helpers-alert .ajaxbox{
 box-shadow: inset 0 1px 5px 0 #0003
}

/*
 Alert cookie policy
 */
 
.jquery-helpers-alert.cookie-policy{
 background-color: #f4f4f4 
}
.jquery-helpers-alert.cookie-policy .controls .btn{
 padding: 0;
 margin-left: 14px
}

@media ( max-width: 350px ){
	
 .jquery-helpers-alert.cookie-policy .controls .btn{
  display: block;
  width: 100%;
  max-width: 100%;
  margin-left: 0
 }
 
}


/*
 header
 */
 
.ui-frame-header .header .logo>svg>path.svg-path-1{
 fill: #ff4e62
}
.ui-frame-header .header .logo>svg>path.svg-path-2{
 fill: #42464F
}
body.default-page-type .ui-frame-fixed-header a[href],
body.montage-page-type .ui-frame-fixed-header a[href]{
 color: inherit
}
body.default-page-type .ui-frame-fixed-header,
body.montage-page-type .ui-frame-fixed-header{
 background-color: rgba( 255, 255, 255, 1 );
 transition: linear background-color 50ms
}
body.montage-page-type.header-transparent .ui-frame-fixed-header{
 background-color: rgba( 255, 255, 255, 0 )
}

@media ( max-width: 1199px ){

 body.montage-page-type .ui-frame-fixed-header,
 body.montage-page-type.header-transparent .ui-frame-fixed-header{
  background-color: rgba( 255, 255, 255, 1 )
 }

}

@media ( min-width: 1200px ){
	
 body.montage-page-type.header-transparent .ui-frame-header .header .logo>svg>path.svg-path-2{
  fill: #ffffff
 }

}
.hamburger{
 background-color: #e9e9ed
}
.hamburger span, .hamburger span:before, .hamburger span:after{
 background-color: #42464F
}
.hamburger:hover{
 background-color: #d0d0d7;
}
.hamburger:hover span, .hamburger:hover span:before, .hamburger:hover span:after{
 background-color: #ff4e62
}

/*
 mainmenu
 */
 
.ui-frame-mainmenu.ui-group-header{
 background-color: #2d3638
}
.ui-frame-mainmenu a.mainmenu-toggle.cross:before,
.ui-frame-mainmenu a.mainmenu-toggle.cross:after{
 background-color: #FFF
}
.ui-frame-mainmenu{
 padding-right: 5px;
 border-right: 0
}
.ui-frame-mainmenu ul.primary-menu li li+li{
 margin-top: 5px
}
.ui-frame-mainmenu ul.primary-menu>li>a{
 padding: 7px 14px;
 min-height: 36px
}
.ui-frame-mainmenu ul.primary-menu li, 
.ui-frame-mainmenu ul.primary-menu li a[href]{
 color: #313640
}
.ui-frame-mainmenu ul.primary-menu li.active, 
.ui-frame-mainmenu ul.primary-menu li.active>a[href]{
 color: #1ba1e8
}
.ui-frame-mainmenu ul.primary-menu div.submenu-wrap{
 background-color: yellow
}	
.ui-frame-mainmenu ul.primary-menu div.submenu-wrap.l2-submenu-wrap{
 border-radius: 0 4px 4px 0
}
.ui-frame-mainmenu ul.primary-menu li.menu-item-has-children a>span{
 background-color: #ff0000
}
.ui-frame-mainmenu ul.primary-menu li.menu-item-has-children>a>span:before{
 border-color: #fff
}
.ui-frame-mainmenu ul.primary-menu>li>a{
 background-color: lime;
 transition: background-color 50ms
}
.ui-frame-mainmenu ul.primary-menu>li.active>a,
.ui-frame-mainmenu ul.primary-menu>li.submenu-open>a{
 background-color: pink
}
.ui-frame-mainmenu ul.primary-menu ul li>a{ 
 transition: color 100ms
}
 
/*
 Sidebar scrollbar
 */

.ui-frame-container.fixed-sidebar .ui-frame-mainmenu .mainmenu__outer{ /* Firefox */
 scrollbar-width: thin;
 scrollbar-gutter: auto;
 scrollbar-color: #f8f2ec transparent
}
.ui-frame-container.fixed-sidebar .ui-frame-mainmenu .mainmenu__outer::-webkit-scrollbar{ /* Chrome, Edge, and Safari */
 width: 8px;
}
.ui-frame-container.fixed-sidebar .ui-frame-mainmenu .mainmenu__outer::-webkit-scrollbar-track{
 background-color: transparent
}
.ui-frame-container.fixed-sidebar .ui-frame-mainmenu .mainmenu__outer::-webkit-scrollbar-thumb{
 background-color: #f8f2ec;
 border-radius: 6px
}

/*
 Pagelayout Sidemenu
 */
 
.pagelayout-sidemenu>.sidemenu>.outer>.inner{
 background-color: #f4f4f4	
}
.pagelayout-sidemenu>.sidemenu ul li+li{
 border-top: solid #f1f1f1 1px	
}
.pagelayout-sidemenu>.sidemenu ul li.active>a{
 text-decoration: underline
}
.pagelayout-sidemenu>.sidemenu li.level-1>a,
.pagelayout-sidemenu>.sidemenu li.level-1>span{
 font-weight: 700;
 margin-bottom: 10px
}

/* 
 Tick, Cross, Arrow 
 */

a.arrow:before{ border: solid #000 0 }
a.arrow.lined:after{ background-color: #000 }

/*
 Carousel
 */
 
.carousel-- a.arrow:before{
 border-color: #fff
}
.carousel-- .pagination>ul>li>a:before{
 background-color: #fff; 
 border-color: #fff
}
.carousel-- .pagination>ul>li.active.focus>a:before{
 background-color: #222;
 border-color: #222
}

/*
 Pagination
 */

.carousel-- .pagination>ul>li>a:before,
.testimonials-- .pagination>ul>li>a:before{
 background-color: #fff; 
 border-color: #fff
}
.carousel-- .pagination>ul>li.active.focus>a:before,
.testimonials-- .pagination>ul>li.active.focus>a:before{
 background-color: #222;
 border-color: #222
}


/*
 Form
 */

input, select, textarea{
 border-color: transparent;
 background-color: #fff;
 color: #222
}

button.btn,
a.btn, 
a[href].btn, 
span.btn{
 font-size: 14px;
 height: 40px;
 line-height: 40px;
 text-transform: uppercase;
 background-color: #1ba1e8;
 color: #fff
}
button.btn.purple,
a.btn.purple, 
a[href].btn.purple, 
span.btn.purple{
 background-color: #6535c8
}
button.btn.green,
a.btn.green, 
a[href].btn.green, 
span.btn.green{
 background-color: #6535c8
}
button.btn.white,
a.btn.white, 
a[href].btn.white, 
span.btn.white{
 background-color: #fff;
 color: #1ba1e8;
 border-color: #1ba1e8
}

.wys .btn,
.cookie-policy .btn{
 box-shadow: 6px 6px 12px -6px rgba(0,0,0,0.5);
}


/*
 Radial FX
 */
 
@media ( min-width: 1200px ){
	
 button.btn,
 a.btn, 
 a[href].btn, 
 span.btn{
  transition: ease background-color 500ms
 }
 button.btn:hover,
 a.btn:hover,
 a[href].btn:hover,
 span.btn:hover{
  background-color: #1b6dcb
 }
 button.btn.purple:hover,
 a.btn.purple:hover, 
 a[href].btn.purple:hover, 
 span.btn.purple:hover{
  background-color: #422382
 }
 button.btn.green:hover,
 a.btn.green:hover, 
 a[href].btn.green:hover, 
 span.btn.green:hover{
  background-color: #422382
 }
 button.btn.white:hover,
 a.btn.white:hover, 
 a[href].btn.white:hover, 
 span.btn.white:hover{
  background-color: #e0f3fd
 }

 button.btn.radial-in,
 a.btn.radial-in, 
 a[href].btn.radial-in, 
 span.btn.radial-in{
  position: relative;
  transition: none;
  overflow: hidden
 }
 button.btn.radial-in:hover,
 a.btn.radial-in:hover, 
 a[href].btn.radial-in:hover, 
 span.btn.radial-in:hover{
  background-color: #1ba1e8
 }
 .btn.radial-in>span{
  position: relative;
  z-index: 1
 }
 .btn.radial-in:after{
  content: '';
  display: block;
  position: absolute;
  top: 100%;
  left: -25%;
  width: 150%;
  padding-top: 150%;
  border-radius: 999px;
  background-color: #1b6dcb;
  transition: ease 250ms
 }

 .btn.radial-in:hover:after{
  top: -150%;
  border-radius: 999px;
 }
 button.btn.purple.radial-in:hover,
 a.btn.purple.radial-in:hover, 
 a[href].btn.purple.radial-in:hover, 
 span.btn.purple.radial-in:hover{
  background-color: #6535c8
 }
 .btn.purple.radial-in:after{
  background-color: #422382
 }
 button.btn.green.radial-in:hover,
 a.btn.green.radial-in:hover, 
 a[href].btn.green.radial-in:hover, 
 span.btn.green.radial-in:hover{
  background-color: #6535c8
 }
 .btn.green.radial-in:after{
  background-color: #422382
 }
 button.btn.white.radial-in:hover,
 a.btn.white.radial-in:hover, 
 a[href].btn.white.radial-in:hover, 
 span.btn.white.radial-in:hover{
  background-color: #fff
 }
 .btn.white.radial-in:after{
  background-color: #e0f3fd
 }
 
}


/*
 Forms in pagelayout area
 */
 
.pagelayout input, 
.pagelayout select, 
.pagelayout textarea{
 border-color: #d9dadc;
}

/*
 Validiation basic colours
 */
 
.form-message>span{
 color: #fff
}
.form-message.success>span{
 background-color: #339900 
}
.form-message.failed>span{
 background-color: #cc0000 
}
.form-message>span>a.cross:before,
.form-message>span>a.cross:after{
 background-color: #fff 
}
.field-group label.asterisk,
.field-group .label.asterisk,
.field-group.required label:not( .no-asterisk ):after,
.field-group.required .label:not( .no-asterisk ):after{
 content: ' \002a'
}
.field-group.required.flag label, 
.field-group.required.flag .label{
 color: #cc0000      
}
input[type="text"].flag,
input[type="password"].flag,
input[type="number"].flag,
input[type="email"].flag,
input[type="tel"].flag,
input[type="url"].flag,
input[type="color"].flag,
textarea.flag,
select.flag,
input[type="checkbox"].styled.flag+label,
input[type="radio"].styled.flag+label{
 border-color: #cc0000 !important
}


/*
 Wys
 */
 
 
 
/*
 Footer
 */
 
.footer{
 background-color: transparent
}
.footer, .footer a{
 color: #42464F
}
.footer .logo>svg>path.svg-path-1{
 fill: #ff4e62
}
.footer .logo>svg>path.svg-path-2{
 fill: #42464F
}
.footer .footer-menu{
 background-color: #d9d9d9
}
.footer .footer-menu a{
 text-decoration: none 
}
.footer .copyrite-contact{
 background-color: #fff
}
.footer ul.social a.twitter{
 background-color: #1da1f2;
 border-color: #1da1f2
}
.footer ul.social a.facebook{
 background-color: #1877F2;
 border-color: #1877F2
}
.footer ul.social a.linkedin{
 background-color: #0A66C2;
 border-color: #0A66C2
}
.footer ul.social a.youtube{
 background-color: #E31746;
 border-color: #E31746
}
.footer .QRCode{
 background-color: #000	
}

@media ( min-width: 1200px ){
	
 .footer a{
  transition: ease color 300ms
 }
 .footer a:hover{
  color: #ff4e62
 }
}


/*
 At end styles
 */

.btn.icon-button{
 position: relative
}
.btn.icon-button:before{
 content: '';
 display: block;
 position: absolute;
 background-size: contain;
 background-repeat: no-repeat;
 z-index: 1	
}
.btn.icon-button.login-button:before{
 background-image: url( "../images/login.svg" );
}

@media ( max-width: 575px ){
	
 .btn.icon-button-mobile{
  position: relative
 }
 .btn.icon-button-mobile:before{
  content: '';
  display: block;
  position: absolute;
  background-size: contain;
  background-repeat: no-repeat;
  z-index: 1	
 }
 .btn.icon-button-mobile.signup-button:before{
  background-image: url( "../images/signup.svg" );
 }
 
 .btn.icon-button-mobile:before,
 .btn.icon-button:before{
  top: 16px;
  left: 50%;
  width: 40px;
  height: 27px;
  margin-left: -12px
 }
 
}

@media ( min-width: 576px ){
	
 .btn.icon-button{
  padding-right: 47px
 }
 .btn.icon-button:before{
  width: 15px;
  height: 17px;
  top: 50%;
  right: 15px;
  margin-top: -8.5px;
 }
 
}

/*
 Additional styles
 */ 

img.svg-shadow text{
 font-family: 'Ubuntu';
}






/*
 Development helpers
 */


.jquery-helpers-modal>a{
 border: dashed 1px #FFF 
}
.resources-- .category,
.file--{
 border: dashed 1px #444
}