/* ---------------- site specific */

.agency-logo{
	width: 127px;
	margin-top: 7px;
}
.agency-footer-logo{
	width: 100px;
	margin: 50px 0;
}

@media only screen and (max-width: 940px) {
	.agency-logo{
		width: 100px !important;
		margin-top: 5px;
	}
	.agency-footer-logo{
		width: 85px;
		margin: 40px 0;
	}
}
@media only screen and (max-width: 414px) {
	.agency-logo{
		width: 90px !important;
		margin-top: 5px;
	}
	.agency-footer-logo{
		width: 80px;
		margin: 40px 0 10px 0;
	}
}

/* common */

.invisible{
	opacity: 0;
}
.inline{
	display: inline;
}

@media only screen and (min-width: 541px) {
	.hide_on_desktop{
		display: none;
	}
}
@media only screen and (max-width: 540px) {
	.hide_on_mobile{
		display: none !important;
	}
}

/* animations */

.sf_appear{
	-o-transition: opacity .3s ease-in-out;
	-ms-transition: opacity .3s ease-in-out;
	-moz-transition: opacity .3s ease-in-out;
	-webkit-transition: opacity .3s ease-in-out;
	transition: opacity .3s ease-in-out;
	opacity:0;
}

/* staff */

.staff_pic,
.staff_pic_big{
	width: 50px;
	height: 50px;
	background-position: center center;
	border-radius: 25px;
	background-color: var(--col-lightgrey);
}
.staff_pic_big{
	width:140px;
	height:140px;
	border-radius: 75px;
}

/* we are kult */

.team_box{
	width: 100%;
	text-align: center;
}
.team_circle{
	width: 150px;
	height: 150px;
	border-radius: 75px;
	background: black;
	text-align: center;
	color:white;
	overflow:hidden;
	padding-top: 40px;
	display: inline-block;
	margin: 10px 10px;
}
.team_hr{
	width:80px;
	height: 1px;
	background: white;
	display: block;
	margin: 10px 0;
}
.team_name{
	font-size: 1em;
	color: white;
}
.team_title{
	font-size: .8em;
	color: white;
}
.team_circle:hover{
	background: var(--col-highlight);

}
.team_circle:hover > .team_name,
.team_circle:hover > .team_title{
	font-weight: 700;
}


/* models */

.model_pic_container{
	position: relative;
	width:100%;
	height:10px;
	background-position: top center;
	background-size: cover;
	background-color: var(--col-lightgrey);
	display: flex;
	justify-content: center;
	transition: 0.3s all;
	overflow: hidden;
	padding-bottom: calc(100% * var(--image_aspect));
}
.col_model_sedcard_landscape .model_pic_container{
	padding-bottom: calc((100% - var(--model_columns_sedcard) * var(--row-margin) ) / 2 * var(--image_aspect) );
}

.model_pic{
	position: absolute;
	top:0;
	width: 100%;
	height: 100%;
}
.model_pic.bg_image{
	background-position: top center;
}
.model_pic .external_link{
	position: absolute;
	bottom: var(--padding-bottom);
	right: var(--padding-right);
	padding: 7px 3px 5px 3px;
	background: rgba(255,255,255,.6);
}

.model_pic_overlay{
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	display: flex;
	background: rgba(0,0,0,.6);
}
.model_pic_container:hover .model_pic_overlay{
	opacity: 1;
}
.model_pic_shortlist_badge,
.model_pic_overlay_shortlist_badge{
	position: absolute;
	top:0;
	width: 100%;
	padding: 20px 10px 0 0;
	text-align: right;
	z-index: 5;
}
.model_pic_overlay_shortlist_badge{
	position: relative;
}
.model_pic_overlay_model_data{
	flex:1;
	width: 90%;
}
.model_pic_overlay_model_data li{
	font-size: 100%;
	color: white;
}
.model_pic_overlay_model_data li b{
	color: white;
}
.model_pic_overlay_shortlist_button{
	display:flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 10px 0;
	color: white;
	text-align: center;
	background: black;
}
.model_pic_overlay_shortlist_button:hover{
	font-weight: 600;
}

@media only screen and (max-width: 940px) {
	.model_pic_shortlist_badge,
	.model_pic_overlay_shortlist_badge{
		padding: 12px 10px 0 0;
	}
}

@media only screen and (max-width: 600px) {
	.model_pic_shortlist_badge,
	.model_pic_overlay_shortlist_badge{
	}
	.model_pic_overlay_model_data li{
		font-size: 85%;
	}
}
@media only screen and (max-width: 520px) {
	.model_pic_shortlist_badge,
	.model_pic_overlay_shortlist_badge{
	}
	.model_pic_overlay_model_data li{
		font-size: 80%;
		line-height: 110%;
	}
}

/* sedcard */

.model_data{
	margin-right: 10px;
	white-space: nowrap;
}
.margin_model_data{
	margin: 10px 0 6px 0;
}
.special_image{
	height: 80vh;
}

/* pages */

.page_pic{
	width:100%;
	padding-bottom: calc(100% * .65);
	height:100%;
	background-position: center center;
	background-size: cover;
	background-color: var(--col-lightgrey);
	display: flex;
	justify-content: center;
}

.page_pic_overlay{
	position: absolute;
	top:0;
	width: 100%;
	height:100%;
	background-color: rgba(0,0,0,.5);
	display: flex;
	justify-content: center;
	align-items: center;
}

/* common images */

.dragarea{
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:20%;
	background: url("../../images/common/grid_dot.png") ;
}

/* background images */

.bg_cover{
	-moz-background-size: cover;-webkit-background-size: cover;-o-background-size: cover;background-size: cover;
	background-position: center center;
}
.bg_cover_top_center{
	background-position: top center !important;
}
.bg_contain{
	-moz-background-size: contain;-webkit-background-size: contain;-o-background-size: contain;background-size: contain;
	background-position: center center;
}
.bg_fixed{
    background-position: bottom center;
    background-attachment: scroll;
}
@media  {
    .bg_fixed {
        background-repeat: no-repeat;

        background-attachment:fixed;
    }
}
.bg_parallax{

}


/* vimeo video */

.video_container{
	width:100%;
	padding-bottom: calc(100% * .56);
	height:100%;
	background-position: center center;
	background-size: cover;
	background-color: var(--col-lightgrey);
	display: flex;
	justify-content: center;
}
.video_list_item{
	width: 100%;
	margin-bottom: 1rem;
}
.video_list_item img{
	margin-bottom: 0;
}
.video_title{
	font-size: 130%;
	letter-spacing: 2px;
	font-weight: 300;
	margin-top: 5px;
}
.video_preview_text{
	padding-left: var(--padding-left);
	font-size: 90%;
}
.video_play_now{
	font-size: 60%;
	background: var(--col-greyborder);
	text-align: center;
}
.video_play_now span{
	position: relative;
	letter-spacing: 1px;
	font-weight: 500;
}
.video_hover:hover{
	background-color: var(--col-lightgrey);
	cursor: pointer;
}

/* agency */

.agency_overlay{
	width:100%;
	height: 100%;
	background-color: rgba(0,0,0,.8);
}
.agency_text{
	width:60%;
	padding: 20% 0;
	font-size: 150%;
	line-height: 135%;
	letter-spacing: 2px;
}
.contact_container{
	margin: 20% 0;
}
.become_a_model_overlay{
	width:100%;
	height: 100%;
	background-color: rgba(0,0,0,.5);
}
.become_a_model_text{
	width:60%;
	padding: 20% 0;
	text-align: center;
	font-size: 400%;
	line-height: 135%;
	letter-spacing: 2px;
}

.horizontal_scroller_container{
	flex-wrap: nowrap;
 overflow-x: hidden;
 -webkit-overflow-scrolling: touch;
 -ms-overflow-style: -ms-autohiding-scrollbar;
}

.with_selection .select_toggle span{
	display: inline-block;
}
.with_selection.selected .select_toggle span{
	transform: rotate(45deg);
}

.navigate_back{
	position: absolute;
	left: 0px;
}

/* carousel */

.carousel{
	overflow: hidden;
	position: relative;
}


/* model fullscreen overlay */

body.with-fullscreen-modal{
	position: fixed;
	width: 100%;
	overflow-x: hidden;
	overflow-y: scroll !important;
}

.fullscreen_slideshow{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100vh;
	background: rgba(255,255,255,.98);
	z-index: 100;
}

.fullscreen_slideshow_close{
	position: absolute;
	top:3%;
	right:0;
	width: 8%;
	font-size: 3rem;
	text-align: center;
	z-index: 201;
	cursor: pointer;
}
.fullscreen_slideshow_container{
	position: relative;
	margin: auto;
	width: 88%;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	background-position: center center;
	background-size: contain;
}
.vertical_centered_arrow{
	position: absolute;
	width: 6%;
	height: 100vh;
	height: calc(var(--vh, 1vh) * 100);
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	z-index: 200;
	font-size: 3rem;
}
.vertical_centered_arrow > :hover{
	cursor: pointer;
}
.fullscreen_slideshow .carousel{
	height: 100%;
	position: relative;
}
.fullscreen_slideshow .carousel-cell,
.fullsize .carousel-cell {
	width: 100%; /* full width */
	height: 100%; /* height of carousel */
	background-color: white;
	position: relative;
}
.fullscreen_slideshow .carousel-cell img{
	max-height: 100%;
	width: 100%;
}

.fullsize.carousel{
	height:calc( 100vh - var(--header) - 60px );
}
.fullsize.carousel .carousel-cell{
	height: calc( 100vh - var(--header) - 60px );
	width: 100%;
}

.aspect-ratio-container .carousel{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
}
.aspect-ratio-container .carousel .flickity-viewport,
.aspect-ratio-container .carousel .flickity-slider{
	width: 100%;
	height: 100%;
}
.aspect-ratio-container .carousel .carousel-cell{
	width: 100%;
	height: 100%;
}
.aspect-ratio-container .carousel .carousel-cell .bg_image,
.fullsize.carousel .carousel-cell .bg_image{
	height: 100%;
	width: 100%;
	background-size: cover;
	background-position: top center;
}





@media only screen and (max-width: 768px) {
	.fullscreen_slideshow_close{
		top:2%;
		font-size: 2rem;
	}
	.vertical_centered_arrow{
		font-size: 2rem;
	}
}

@media only screen and (max-width: 414px) {
	.fullscreen_slideshow_close{
		top:2%;
		font-size: 1.3rem;
	}
	.vertical_centered_arrow{
		font-size: 1.5rem;
	}
}

/* carousel */

.v-fade{
	/* display: flex !important; override v-show display: none */
	transition: opacity 0.5s;
	display: block !important;
}

.v-fade[style*="display: none;"] {
	opacity: 0;
	pointer-events: none; /* disable user interaction */
	user-select: none; /* disable user selection */
}

/* carousel lazyload */
.v-fade[style*="display: none;"] .carousel-lazyload{
	display: none;
}
.v-fade .carousel-lazyload{
	display: none;
}
.v-fade .carousel-cell.is-selected .carousel-lazyload,	/* selected carousel-cell */
.v-fade .carousel-cell.is-selected + .carousel-cell .carousel-lazyload,	/* carousel-cell after selected carousel-cell */
.v-fade .carousel-lazyload.lazyload-loaded	/* already loaded images */
{
	display: block;
}


/* search */

.search-container{
	background-color: white;
	position: fixed;
	top: -100vh;
	width: 100%;
	height: 100vh;
	transition: all 0.5s;
	z-index: 10;
	padding-top: 12px;
	display: flex;
	flex-flow: column;
}
.search-is-active .search-container{
	top:0;
}
.search-input-text-container{
	margin-top: 30px;
}
.search-input-text, .search-input-text:focus{
	padding: 4px 5px 0 5px;
	border-top: none;
	border-right: none;
	border-left: none;
	border-bottom: 1px solid var(--col-greyborder) !important;
	color: black;
}
.search-result-list{
	margin-top: 50px;
	overflow-y: auto;
	flex: 1;
	padding-right: 5%;
	padding-left: 5%;
	width: 100%;
}


