/* ----------------------------------- Font */

@font-face {
    font-family: 'Ahkiobold';
    src: url('/fonts/ahkio-bold-webfont.eot');
    src: url('/fonts/ahkio-bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/ahkio-bold-webfont.woff2') format('woff2'),
         url('/fonts/ahkio-bold-webfont.woff') format('woff'),
         url('/fonts/ahkio-bold-webfont.ttf') format('truetype'),
         url('/fonts/ahkio-bold-webfont.svg#ahkiobold') format('svg');
    font-weight: normal;
    font-style: normal;

}


@font-face {
    font-family: 'Ahkioregular';
    src: url('/fonts/ahkio-regular-webfont.eot');
    src: url('/fonts/ahkio-regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('/fonts/ahkio-regular-webfont.woff2') format('woff2'),
         url('/fonts/ahkio-regular-webfont.woff') format('woff'),
         url('/fonts/ahkio-regular-webfont.ttf') format('truetype'),
         url('/fonts/ahkio-regular-webfont.svg#ahkioregular') format('svg');
    font-weight: normal;
    font-style: normal;

}

h1, .h1, h2 big, h3 big, h4 big, h5 big { font-size: 46px; }
h2, .h2 { font-size: 40px; }
h3, .h3 { font-size: 32px; }
h4, .h4 { font-size: 28px; }
h5, .h5 { font-size: 24px; }
h6, .h6 { font-size: 22px; }

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
	color: #000;
	font-family: 'Ahkioregular', cursive;
	line-height: 1.05;
	margin-bottom: 10px;
}

@media only screen and (max-width: 767px) and (orientation: portrait) {	
	h1, .h1 { font-size: 40px; }
	h2, .h2 { font-size: 36px; }
	h3, .h3 { font-size: 32px; }
	h4, .h4 { font-size: 28px; }
	h5, .h5 { font-size: 26px; }
	h6, .h6 { font-size: 22px; }
}


h1.verybig { font-size: 4vw; }
h2.verybig { font-size: 3.5vw; }
h3.verybig { font-size: 3.1vw; }
h4.verybig { font-size: 2.8vw; }
h5.verybig { font-size: 2.4vw; }
h6.verybig { font-size: 2.2vw; }
@media only screen and (max-width: 1100px) and (orientation: portrait) {	
	h1.verybig { font-size: 5vw; }
	h2.verybig { font-size: 4.5vw; }
	h3.verybig { font-size: 4.1vw; }
	h4.verybig { font-size: 3.8vw; }
	h5.verybig { font-size: 3.4vw; }
	h6.verybig { font-size: 3.2vw; }
}
@media only screen and (max-width: 992px) and (orientation: portrait) {	
	h1.verybig { font-size: 6vw; }
	h2.verybig { font-size: 5.5vw; }
	h3.verybig { font-size: 5.1vw; }
	h4.verybig { font-size: 4.8vw; }
	h5.verybig { font-size: 4.4vw; }
	h6.verybig { font-size: 4.2vw; }
}
@media only screen and (max-width: 767px) and (orientation: portrait) {	
	h1.verybig { font-size: 7vw; }
	h2.verybig { font-size: 6.5vw; }
	h3.verybig { font-size: 6.1vw; }
	h4.verybig { font-size: 5.8vw; }
	h5.verybig { font-size: 5.4vw; }
	h6.verybig { font-size: 5.2vw; }
}

/* ----------------------------------- Reverse columns */

.reverse-content .one-half, .reverse-content .one-third, .reverse-content .one-fourth{
    float:right;
    margin-right:0;
    margin-left: 2%;
}
.reverse-content .one-half.last, .reverse-content .one-third.last, .reverse-content .one-fourth.last{
    margin-left:0;
}


/* ----------------------------------- Burger manu */


.top-nav .pull {
    background: transparent !important;
	left: auto;
	right:0;
}

.mm-opened .top-nav .pullXXX {
	position: fixed;
}

.top-nav .pull:hover {
    background: transparent;
}
.top-nav .pull span.pull-txt {
    display: none;
}
.top-nav .pull span.pull-burger-icon{
	top: 25px;
}
.top-nav .pull span.pull-burger-icon span{
	background:#5f4b9b;
}





/* ----------------------------------- Quick navigation buttons */

body:not(.startpage) .quick-nav {
	display:none !important;
}


.quick-nav {
    padding: 2px 0;
	ackground: transparent;
}
.quick-nav ul.nav {
    margin: -150px 0 0 0 !important;
}

.quick-nav ul.nav li{
    margin: 0 0 20px 0 !important;
}

.quick-nav a .quick-icon {
    display: none;
}
.quick-nav a{
	background:#a778b1;
	padding:10px 40px;
	border-radius: 30px;
	text-transform:uppercase;
}
.quick-nav a:hover{
	background:#5f4b9b;
}

.quick-nav .quick-nav-text{
	color:#fff !important;
}


.quick-nav a {
    position: relative;
}
.quick-nav a:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border: 2px solid #5f4b9b;
	border-radius:30px;
	margin:3px;
}

.quick-nav a:hover:after {
    border: 2px solid #a778b1;
}



.quick-nav a span.besporty-logo{
    margin:0 -5px;
}
.quick-nav a span.besporty-logo span{
    opacity:0;
}
.quick-nav a span.besporty-logo::before{
    content: '';
    dispaly:inline-block;
    width:100px;
    height:40px;
    background: url("https://www.besporty.se/theme/sporty/logo.png") no-repeat;
    background-position: center;
    background-size: 80px 37px;
    position: absolute;
    top:3px;
}

@media only screen and (min-width: 767px) and (max-width: 1050px) {
.quick-nav a span.besporty-logo::before{
	top:2px;
	width:80px;
    background-size: 60px 28px;
}
}	
@media only screen and (max-width: 767px) {
.quick-nav a span.besporty-logo::before{
	top:2px;
	width:90px;
    background-size: 65px 30px;
}

.quick-nav ul.nav li {
	padding: 7px 10px !important;
	margin: 0 !important;
}

}	
@media only screen and (max-width: 420px){
.quick-nav a span.besporty-logo::before{
	top:1px;
	width:67px;
    background-size: 50px 23px;
}	
}


@media only screen and (min-width: 768px){
	html.mm-opened:not(.mm-opening) body{
		overflow-y:scroll;
	}
	html.mm-opened:not(.mm-opening) body .mm-menu>.mm-panel{
		overflow-y:hidden;
	}	
}

@media only screen and (max-width: 767px) and (orientation: portrait) {	

	.quick-nav ul.nav li{
		display:block;
		margin: 0 5px 0 5px !important;
	}
	.quick-nav ul.nav li a{
		width: 60vw;
		display: inline-block;	
	}	
	
	.quick-nav ul.nav {
		margin: -300px 0 0 0 !important;
		font-size: 22px;
	}
	
	.slideshow-title {
		font-size: 80px !important;
		margin-left:20px;
	}	
	
}




@media only screen and (max-width: 479px){
	.payoff {
		font-size: 18px;
	}
}


@media only screen and (max-width: 419px){
	.payoff {
		font-size: 18px;
		width:calc(100vw - 170px);		
	}
	
	.quick-nav ul.nav {
		font-size: 16px;
	}

}

@media only screen and (max-width: 359px){
	.payoff {
		font-size: 16px;
	}
	.hide-for-verysmall{
		display:none;
	}
	.quick-nav .quick-nav-text {
		font-size: 16px;
	}

}

body:not(.startpage) .quick-nav{
	display:none;
}




/* ----------------------------------- header */

.header{
    background: #fff;
	background-position:50% 50%;
	background-size:100% auto;
}


.logo {
    left: 10px;
}
.payoff {
    padding: 0 0 0 110px !important;
	width:calc(100vw - 200px);
	text-transform:uppercase;
}

@media only screen and (min-width: 768px){
	
	div#headerslidernav {
		margin-top:-10px;
	}	
	

	
    .header {
        height: 180px;
    }
    .payoff {
        padding: 0 !important;
        width: auto !important;
        top: auto !important;
        position:relative !important;
        margin:0 !important;
        text-align:center;
        transform: translateY(0);
    }

    .logo {
        position: relative;
        top: auto;
        left: 50%;
        margin-left:-70px;
    }  

    .logo img{
        width:125px !important;
        margin-top:10px;
    }      

    body.startpage div#headerslider, body.startpage .welcome-video-dimensions, body.startpage div#headerslider>div, body.startpage div#headerslider>div>div {
        height: calc(100vh - 180px) !important;
    }
    
}




							
/* ----------------------------------- Photo glow effect */

a.addglow {
    position:relative;
    display:block;
}
a.addglow img.round-photo{
    max-width:100%;
	display: block;
	margin: auto;
}

a.addglow::after {
    content:'';
    position:absolute;
    display:block;
    top:0;
    left:0;
    bottom:0;
    right:0;
    background:url("https://public.besporty.se/img/funkykidz/funkykidz-roundglow.png") no-repeat;
    background-position:50% 50%;
    background-size:auto 101.5%;
}





span.overlay-photo {
    display:block;
    position:absolute;
    bottom:0;
    left:50%;
    z-index:100;
}
span.overlay-photo img{
    width:40vw;
    max-width:250px !important;
    margin-left:-280px;
}


/* ----------------------------------- White button */

.button-white{
	display:block;text-transform:uppercase;color:#005ca0 !important;padding:30px 0;font-size:28px;background:#fff;padding:20px 30px;border-radius:70px;margin-bottom:30px;max-width:400px;
}


/* ----------------------------------- Radial effect to quick search */


.bg-radial.content-wrap .content-wrap{ 
    background:transparent !important;
}
.bg-radial .content .quick-search{ 
    background:transparent;
    height: 40vw;
}

.bg-radial.content-wrap .content .quick-search {
    background: transparent;
    height: 40vw;
    max-width: 800px;
    margin: auto;	
}

.bg-radial.content-wrap .content .quick-search-col {
    width: 48% !important;
	margin-right:1% !important;
	margin-left:1% !important;
}
.bg-radial.content-wrap .content .quick-search-col.quick-search-col1 {
    width: 100% !important;
    margin: 30px 0 20px 0;
}
.bg-radial.content-wrap .content .quick-search-col.quick-search-col4 {
    display:none;
}
.content-wrap .content .quick-search-col .quick-search-input{
    border-radius:10px;
    border:2px #450c5d solid;
	margin-bottom:0 !important;
}
@media only screen and (max-width: 767px) {
    .content .quick-search-col {
        width: 48%;
    }
}


body.centersearchpage .quick-search{
	display:none;
}

body.centersearchpage div#headerslider {
    margin-bottom:20px;
}

					
div#headerslidernav {
    display: flex;
    vertical-align: bottom;
    justify-content: center;
    align-items: flex-end;
	margin-top:-20px;
}				


.content-wrap .content .quick-search {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.content .quick-search {
	margin-top: 20px;
	background: transparent;
}	
.content .quick-search-title {
    color: #5f4b9b;
	display:none;
}
.content .quick-search-col.quick-search-col4 {
    display:none;
}
.content .quick-search-col {
    width: 49%;
}
.content .quick-search-col.quick-search-col3 {
    margin-right:0;
}

@media only screen and (min-width: 768px){
	
	div#headerslidernav {
		margin-top:-10px;
	}	
	

	
    .header {
        height: 180px;
    }
    .payoff {
        padding: 0 !important;
        width: auto !important;
        top: auto !important;
        position:relative !important;
        margin:0 !important;
        text-align:center;
        transform: translateY(0);
    }

    .logo {
        position: relative;
        top: auto;
        left: 50%;
        margin-left:-70px;
    }  

    .logo img{
        width:125px !important;
        margin-top:10px;
    }      
    
    h2.payoff::before {
        content: '';
        dispaly:inline-block;
        width:121px;
        height:170px;
        background-position: center;
        background-size: 121px 170px;
        position: absolute;
        margin-left:-200px;
        top:-128px;
    }

    body.startpage div#headerslider, body.startpage .welcome-video-dimensions, body.startpage div#headerslider>div, body.startpage div#headerslider>div>div {
        height: calc(100vh - 180px) !important;
    }
    
}




body.startpage .xspace, body.centersearchpage .xspace {
	display:none !important;
}

body.startpage .center-button{
	display:none;
}	



.content-wrap.content-cloud {
    position:relative;
}
.content-wrap.content-cloud .content{
    position: absolute;
    top: 0;
    padding: 0;
    width: 100%;
    max-width: 100%;
}
.content-wrap.content-cloud .content .quick-search{
    background:transparent;
}



html,body{background:#fff}h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:'Luckiest Guy',cursive;color:#fff}.logo{top:5px;left:100px}.logo img{width:98px !important}.payoff{padding:0 10px 0 220px;color:#252160}.cntbox h1,.cntbox h2,.cntbox h3,.cntbox h4,.cntbox h5,.cntbox h6,.cntbox .h1,.cntbox .h2,.cntbox .h3,.cntbox .h4,.cntbox .h5,.cntbox .h6{color:#252160}h1 a,h2 a,h3 a,h4 a,h5 a,h6 a{color:#212721}.top-nav .pull{background:#252160}.top-nav .pull:hover{background:#322d7d;color:#fff}.quick-nav{background:#a00}.quick-nav .quick-icon{background:#252160;color:#fff}.quick-nav a,.quick-nav a:hover,.quick-nav .quick-nav-text{color:#fff}@media only screen and (max-width:1050px){.quick-nav ul.nav{zoom:.95}}.content .quick-search{background:#be3131}.content .quick-search-title{font-size:24px;padding-top:5px;color:#fff}.content .quick-search-button{background:#252160 !important}.tabs-nav li a:hover,.tabs-nav li.active a{color:#a00}a,a>*{color:#a00}a:hover,a>*:hover{color:#212721}.button,input[type="submit"],input[type="reset"],input[type="button"],button{background:#a00;border:1px #a00 solid;color:#fff !important}.button:hover,input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover,button:hover,.button:focus,input[type="submit"]:focus,input[type="reset"]:focus,input[type="button"]:focus,button:focus{background:#252160;color:#fff !important}.backbutton,a.backbutton{background:#a00 url(/img/arrow_prev_white.png) 5px 50% no-repeat !important;color:#fff !important}.backbutton:hover,a.backbutton:hover{background:#252160 url(/img/arrow_prev_white.png) 5px 50% no-repeat !important;color:#fff !important}.content-wrap{background:#a00}.top-nav>ul li a,.top-nav div>ul li a{color:#2a2a2a}.top-nav>ul li a:hover,.top-nav div>ul li a:hover,.top-nav>ul li a:active,.top-nav>ul li.current a{color:#a00}.main-nav a{background:#252160}.main-nav a:hover,.main-nav .hover>a{color:#fff !important;background:#fafafa}.main-nav a:hover,.main-nav .hover>a,.main-nav .current>a{background:#a00;color:#fff}.content,.content a{color:#000}.content .popover-content{color:#212721 !important}.cntbanner img{min-width:100%;max-width:100%}.cntbox{background:#fff;border:1px #fff solid;color:#212721}.cntbox a,.content .popover-content a{color:#a00}a.cntbox:hover{background:#fff7ac}.cntbox .cntbox hr{background:transparent;color:#5287c9;border:0;border-bottom:3px #a00 dotted}.cntbox .cntinnerbox,.cntbox .regform{background:#e8e7ef}.cntbanner-overlay-cnt{background:url(/img/trans-white70.png)}span.paragraph{color:#212721}span.lnk{color:#a00}.side-col h3{color:#fff}.side-col .cntbox h3{color:#a00}.side-col .cntbox h4{border-bottom:1px #dcdcdc solid;color:#9c9c9c}.side-col .cntbox .bigsize{color:#5c92bb}.slideshow-additional-effect-1,.slideshow-additional-effect-2,.slideshow-button{display:none}.slideshow-animation{left:72% !important;top:170px !important}.slideshow-title{color:#fff;text-shadow:5px 5px #252160}@media only screen and (min-width:768px){.footer .groupbox{width:19.2%;margin-right:1%;font-size:13px}}@media only screen and (max-width:767px){.footer .groupbox{width:48%;margin-right:1%;margin-left:1%;font-size:13px;float:left;margin-bottom:0}.footer .groupbox:last-child{margin-right:25%;margin-left:25%}}@media only screen and (max-width:767px){.slideshow-animation{top:100px !important}.slideshow-title{position:relative;bottom:50px}}@media only screen and (max-width:480px){.slideshow-animation #canvas{width:480px !important;height:auto !important}.slideshow-animation{top:-30px !important;left:55% !important}.slideshow-title{position:relative;bottom:70px}}.sub-nav .current>a,.sub-nav a:hover{color:#252160 !important}.special-list{font-family:'Luckiest Guy',cursive;font-size:24px}.special-list li{color:#a00}.special-list li:hover{color:#252160}.funky-tooltip+.tooltip>.tooltip-inner{border:3px #a00 solid;line-height:20px;font-size:15px;color:#252160 !important}.acc-lnk a{background-image:url(img/accordion-content-buttons.png)}.acc-lnk.active a,.acc-lnk.active a span,.acc-lnk.active a:hover,.acc-lnk.active a:hover span{color:#252160}@media only screen and (max-width:359px){.logo{left:80px;top:4px}.logo img{width:100px}.payoff{padding:0 10px 0 190px}}




.vjs-poster{
	background-size:cover !important;
}


.header{
	background-position:50% 50%;
    background: #fff url("https://public.besporty.se/img/funkykidz/funkykidz-bg.jpg") no-repeat;
    background-size:cover;	
}

.content-wrap {
    background: #f9f9f9 !important;
}

.page {
    background: #fff;
	background-position:50% 50%;
	background-size:100% 100%;
}

.quick-nav {
    background: transparent;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .quick-nav a, .quick-nav a:hover, .quick-nav .quick-nav-text {
    color: #000;
}


.logo {
    left: 10px;
}
.payoff {
    padding: 0 0 0 120px !important;
	width:calc(100vw - 210px);
	text-transform:uppercase;
}


.cntbox .cntinnerbox, .cntbox .regform {

}

.quick-nav a{
	background:#2d2c60;
}
.quick-nav a:hover{
	background:#c2201d;
}

.quick-nav a:after {
    border: 2px solid #225ea0;
}
.quick-nav a:hover:after {
    border: 2px solid #941513;
}


.top-nav .pull span.pull-burger-icon span{
	background:#2d2c60;
}

							body.startpage div#headerslider, body.startpage .welcome-video-dimensions, body.startpage div#headerslider>div,  body.startpage div#headerslider>div>div {
								width: 100vw !important;
								height:calc(100vh - 80px) !important;
								transform:scale(1) !important;
								top:0 !important;
								left:0 !important;
							}


							body.startpage .welcome-video-dimensions video {

								object-fit: cover;
								object-position: 50% 10%;
								z-index:-100;

							}


							body.startpage .slide div a.button{
								opacity:0 !important;
							}

							body.startpage div#headerslider {
								z-index:1;
								position:relative;margin:0;top:0px;left:0px;width:100vw  !important;height:0;overflow:hidden;visibility:hidden;
							}
							body.startpage .headerslider-slides {
								cursor:default;position:relative;top:0px;left:0px;width:100vw  !important;height:calc(100vh - 80px) !important;overflow:hidden;
							}
							body.startpage .headerslider-slides .slide-content{
								position:absolute;top:0;left:0;width:100vw  !important;height:calc(100vh - 80px) !important;
							}
							body.startpage div#headerslider>div {
								z-index:-1;
							}		
							body.startpage .headerslider-slides .slide {
								width:100vw  !important;
								height:calc(100vh - 80px) !important;
							}	

							@media only screen and (max-width: 767px) and (orientation: portrait) {	
								body.startpage .slide-scaleupmobile .headerslider-slides .slide {
									width:100vw !important;
									height:calc(100vh - 80px) !important;
								}		
								
								body.startpage .slide-scaleupmobile .slideshow-caption{
									width:100vw !important;
								}
							}
							
							
							
div#headerslidernav {
    display: flex;
    vertical-align: bottom;
    justify-content: center;
    align-items: flex-end;
	margin-top:-20px;
}			

							
.header {
    background: #fff;
    background-size:cover;
}



@media only screen and (min-width: 768px){
	
	div#headerslidernav {
		margin-top:-10px;
	}	
	

	
    .header {
        height: 180px;
    }
    .payoff {
        padding: 0 !important;
        width: auto !important;
        top: auto !important;
        position:relative !important;
        margin:0 !important;
        text-align:center;
        transform: translateY(0);
    }

    .logo {
        position: relative;
        top: auto;
        left: 50%;
        margin-left:-85px;
    }  

    .logo img{
        width:170px !important;
        margin-top:10px;
    }      
    
    h2.payoff::before {
        content: '';
        dispaly:inline-block;
        width:121px;
        height:170px;
        background: url("https://public.besporty.se/img/maskot-trix.png") no-repeat;
        background-position: center;
        background-size: 121px 170px;
        position: absolute;
        margin-left:-200px;
        top:-128px;
    }

    body.startpage div#headerslider, body.startpage .welcome-video-dimensions, body.startpage div#headerslider>div, body.startpage div#headerslider>div>div {
        height: calc(100vh - 180px) !important;
    }
	
	.bg-radial.content-wrap .content .quick-search {
		height: 30vw;
	}

}


.bg-radial.content-wrap{ 
    background:#fff url(https://public.besporty.se/img/trixbollskola/trix-radial.jpg) no-repeat !important;
    background-position:50% 100% !important;
    background-size:100% auto !important;	
}