/*
--------------------------------------------------------
(c) 2020 VIEVEX Stefan Altenhofen - all rights reserved
--------------------------------------------------------
*/

/************************************************/
/********************  FONT  ********************/
/************************************************/

/*
This CSS resource incorporates links to font software which is the valuable copyrighted
property of Monotype Imaging and/or its suppliers. You may not attempt to copy, install,
redistribute, convert, modify or reverse engineer this font software. Please contact Monotype
Imaging with any questions regarding Web Fonts:  http://www.fonts.com
*/

@import url("https://fast.fonts.net/t/1.css?apiType=css&projectid=c3a17d98-f3db-409b-a10c-571b91fa3879");
    @font-face{
        font-family:"Gilroy W05 Thin";
        src:url("Fonts/84f4f17d-9786-4c9a-a0b8-3dee0e4dfdae.woff2") format("woff2"),url("Fonts/2f1cfe4e-e0a8-4527-9476-b841ff9bc45b.woff") format("woff");
    }
    @font-face{
        font-family:"Gilroy W05 Light";
        src:url("Fonts/a6096205-61ed-4c16-b76c-a56dd651ad33.woff2") format("woff2"),url("Fonts/18f98fc7-4ddd-4d5e-94c0-c9b74a2325bd.woff") format("woff");
    }
    @font-face{
        font-family:"Gilroy W05 Regular";
        src:url("Fonts/b261487c-2966-4089-8551-6555085406ad.woff2") format("woff2"),url("Fonts/bf190033-35ff-42cf-b90c-f5321a94a3df.woff") format("woff");
    }
    @font-face{
        font-family:"Gilroy W05 Medium";
        src:url("Fonts/94b9ba0e-1690-4966-8af8-7d8a1c22c221.woff2") format("woff2"),url("Fonts/fd4654af-3e2f-4601-bb81-d6b08f68d9f0.woff") format("woff");
    }
    @font-face{
        font-family:"Gilroy W05 Bold";
        src:url("Fonts/e62d07e6-5c21-45b8-8427-79c95511907d.woff2") format("woff2"),url("Fonts/e667d70b-2326-4c62-8f38-200c31c3b08c.woff") format("woff");
    }
    @font-face{
        font-family:"Gilroy W05 Heavy";
        src:url("Fonts/83cf0941-dd13-44b9-8dc0-b9161de3268e.woff2") format("woff2"),url("Fonts/fae2b2de-865c-4574-8d42-33a62836725d.woff") format("woff");
    }


/*******************************************************/
/********************  HTML / BODY  ********************/
/*******************************************************/

* 
{
-webkit-text-size-adjust: none;
-moz-text-size-adjust: none,
-webkit-text-size-adjust: none;
-ms-text-size-adjust: none;
font-size-adjust: none;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}

html
{
width: auto;
min-width: 100%;
height: auto;
min-height: 100%;
margin: 0px;
padding: 0px;
}

body
{
background: #fff;
width: auto;
min-width: 100%;
height: auto;
min-height: 100%;
margin: 0px;
padding: 0px;
color: rgba(34,34,34,1);
font-size: calc(10px + .35vw);
font-family: 'Gilroy W05 Medium', sans-serif;
line-height: calc(15px + 0.35vw);
-webkit-font-smoothing: antialiased;
}

a,
a:active
{
color: rgba(34,34,34,1);
text-decoration: none;
}

a:hover
{
color: rgba(34,34,34,1);
text-decoration: none;
}

ul 
{
list-style-type: none;
}

::-moz-selection { background: rgba(0,0,0,1); }
::selection { background: rgba(0,0,0,1); }




/**** ANCHOR TEST ****/

.atest > a {
    pointer-events:none;
}



/******************************************************/
/********************  VVX GLOBAL  ********************/
/******************************************************/

.h10
{
height: 10%;
}
.h20
{
height: 20%;
}
.h30
{
height: 30%;
}
.h40
{
height: 40%;
}
.h50
{
height: 50%;
}
.h60
{
height: 60%;
}
.h70
{
height: 70%;
}
.h80
{
height: 80%;
}
.h90
{
height: 90%;
}
.h100
{
height: 100%;
}

.w5
{
width: 5%);
}
.w10
{
width: 10%;
}
.w15
{
width: 15%;
}
.w20
{
width: 20%;
}
.w30
{
width: 30%;
}
.w33
{
width: 33.333%;
} 
.w40
{
width: 40%;
}
.w50
{
width: 50%;
}
.w60
{
width: 60%;
}
.w66
{
width: 66.666%;
} 
.w70
{
width: 70%;
}
.w80
{
width: 80%;
}
.w90
{
width: 90%;
}
.w100
{
width: 100%;
}

.flex 
{
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: -webkit-flexbox;
display: flex; 
flex: 1 0 auto;
} 

@media (max-width: 1280px) 
{
.flex 
{
flex-direction: column;
flex-wrap: wrap;
}
}

@media (max-width: 1280px) 
{
.flexsub
{
width: 100%; 
}
}

.flexstart
{
align-items: flex-start;
}

.flexrow 
{
flex-direction: row;
} 

.flexwrap 
{
flex-wrap: wrap;
}

.ord0 
{
order: 0;
}
.ord1
{
order: 1;
}



.pd10
{
padding: 10px;
}
.pd15
{
padding: 15px;
}
.mg10
{
margin: 10px;
}
.mg15
{
margin: 15px;
}

.bg_fff
{
background-color: rgba(255,255,255,1);
}
.bg_000
{
background-color: rgba(0,0,0,1);
}
.bg_dce2e6
{
background: rgba(37,40,43,0.01);
background-image: -webkit-linear-gradient(60deg, rgba(37,40,43,0.1), rgba(39,43,47,0.2));
background-image: -moz-linear-gradient(60deg, rgba(37,40,43,0.1), rgba(39,43,47,0.2));
background-image: -o-linear-gradient(60deg, rgba(37,40,43,0.1), rgba(39,43,47,0.2));
background-image: linear-gradient(60deg, rgba(37,40,43,0.1), rgba(39,43,47,0.2));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(37,40,43,0.8)', endColorstr='rgba(39,43,47,0.6)',GradientType=0 ); 
}

.bgBasic
{
background: rgba(34,34,34,1);
background-image: -webkit-linear-gradient(60deg, rgba(37,40,43,1), rgba(39,43,47,1));
background-image: -moz-linear-gradient(60deg, rgba(37,40,43,1), rgba(39,43,47,1));
background-image: -o-linear-gradient(60deg, rgba(37,40,43,1), rgba(39,43,47,1));
background-image: linear-gradient(60deg, rgba(37,40,43,1), rgba(39,43,47,1));
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(37,40,43,1)', endColorstr='rgba(39,43,47,1)',GradientType=0 ); 
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
}


.bo_fff
{
border: 1px solid #fff;
}
.bo_000
{
border: 1px solid #000;
}
.bo_dce2e6
{
border: 1px solid rgba(34,34,34,0.1);
}




.shadow
{
box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.05);
}

.rd15
{
border-radius: 15px;
}


.line
{
position: relative;
width: 100%;
height: 1px;
margin: 15px 0 15px 0;
border-bottom: 1px solid rgba(34,34,34,.1);
}

.line2
{
position: relative;
width: 100%;
height: 1px;
margin: 15px 0 15px 0;
border-bottom: 1px solid rgba(255,255,255,.1);
}

/*************************************************/
/********************  LOGIN  ********************/
/*************************************************/

.introText
{
position: absolute;
min-height: 100%;
height: auto;
overflow: auto;
padding: 0;
margin: 0;
display: -webkit-flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}


.content
{
position: relative;
min-height: 100vh;
height: auto;
overflow: auto;
padding: 0;
margin: 0;
display: -webkit-flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);
}

.login
{
position: relative;
background: rgba(0,0,0,.8);
padding: 40px;
margin: 5vh auto 5vh auto;
border-radius: 15px;
color: rgba(255,255,255,1);
-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1);
}

@media (max-width: 1280px) 
{
.login
	{
	position: relative;
	width: 90vw;
	margin: 5vh 5vw 5vh 5vw;
	}
}

.login a
{
font-size: calc(8px + 0.35vw);
color: rgba(255,255,255,1);
}

.login h1,
.login h2
{
color: rgba(255,255,255,1);
text-align: center;
line-height: 150%;
}

.login label 
{
position: relative;
z-index: 99;
top: -35px;
left: 30px;
font-size: 20px;
color: rgba(255,255,255,0.8);
} 

.login input,
.login select
{
position: relative;
width: 100%;
height: 50px;
border: 0px;
outline: none;
border: 1px solid #fff;
border-radius: 25px;
background: rgba(0,0,0,.2);
padding: 0px 0px 0px 60px !important;
margin: 20px 0 0 10px;
resize: none;
color: rgba(255,255,255,0.5);
-webkit-appearance: none; /* Webkit */
-moz-appearance: none; /* FF */
-ms-appearance: none; /* Edge */
appearance: none; /* Future */
}

@media (max-width: 1280px) 
{
.login input,
.login select
	{
	font-size: 16px;
	}
}

.input-container select option 
{
background-color: rgba(0,0,0,.2); !important;
color: #fff !important;
}

/* IE11 */
select::-ms-expand 
{
display: none;
}

.login button
{
position: relative;
width: 40%;
height: 50px;
border: 0px;
outline: none;
border: 1px solid #fff;
border-radius: 25px;
background: rgba(0,0,0,.2);
margin: 2vh 1vw 1vh 1vw;
resize: none;
color: rgba(255,255,255,0.5);
}

.login input:hover,
.login select:hover,
.login button:hover
{
color: rgba(255, 255, 255, 1.0); 
outline:none;
border: 1px solid rgba(201,74,67,1);
-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
} 

.login input:focus,
.login select:focus,
.login button:focus 
{
color: rgba(255, 255, 255, 1.0); 
outline:none;
border: 1px solid rgba(201,74,67,1);
-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.05);
} 

.help-block
{
position: relative;
z-index: 99;
top: 5px;
color: rgba(201,74,67,1);
text-align: center;
}

input:-webkit-autofill::first-line,
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus 
{
-webkit-text-fill-color: #fff;
transition: background-color 5000s ease-in-out 1s;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
color: rgba(255, 255, 255, 0.3);
}
::-moz-placeholder { /* Firefox 19+ */
color: rgba(255, 255, 255, 0.3); 
}
:-ms-input-placeholder { /* IE 10+ */
color: rgba(255, 255, 255, 0.3); 
}
:-moz-placeholder { /* Firefox 18- */
color: rgba(255, 255, 255, 0.3); 
}

@media (max-width: 1280px) 
{
.clearDevice
	{
	display: none;
	}
}
/****************************************************************/
/********************  SPINNER / TRANSITION  ********************/
/****************************************************************/

.spinner 
{
position: fixed;
z-index: 9998;
top: 0vh;
left: 0vw;
width: 100vw;
height: 100vh;
background-color: #fff;
}

.spinner_circle
{
position: fixed;
z-index: 9999;
top: 50vh;
left: 50vw;
-moz-transform: matrix(1, 0, 0, 1, -50, -50); 
-webkit-transform: matrix(1, 0, 0, 1, -50, -50); 
-o-transform: matrix(1, 0, 0, 1, -50, -50); 
-ms-transform: matrix(1, 0, 0, 1, -50, -50);  
transform: matrix(1, 0, 0, 1, -50, -50); 
}


.cssload-loader {
		width: 49px;
		height: 49px;
		border-radius: 50%;
		margin: 3em;
		display: inline-block;
		position: relative;
		vertical-align: middle;
	background:rgb(0,0,0);
}
.cssload-loader,
.cssload-loader:before,
.cssload-loader:after {
		animation: 1.15s infinite ease-in-out;
		-o-animation: 1.15s infinite ease-in-out;
		-ms-animation: 1.15s infinite ease-in-out;
		-webkit-animation: 1.15s infinite ease-in-out;
		-moz-animation: 1.15s infinite ease-in-out;
}
.cssload-loader:before,
.cssload-loader:after {
		width: 100%; 
		height: 100%;
		border-radius: 50%;
		position: absolute;
		top: 0;
		left: 0;
}

.cssload-loader { animation-name: cssload-loader;
		-o-animation-name: cssload-loader;
		-ms-animation-name: cssload-loader;
		-webkit-animation-name: cssload-loader;
		-moz-animation-name: cssload-loader; }


@keyframes cssload-loader {
		from { transform: scale(0); opacity: 1; }
		to	 { transform: scale(1); opacity: 0; }
}

@-o-keyframes cssload-loader {
		from { -o-transform: scale(0); opacity: 1; }
		to	 { -o-transform: scale(1); opacity: 0; }
}

@-ms-keyframes cssload-loader {
		from { -ms-transform: scale(0); opacity: 1; }
		to	 { -ms-transform: scale(1); opacity: 0; }
}

@-webkit-keyframes cssload-loader {
		from { -webkit-transform: scale(0); opacity: 1; }
		to	 { -webkit-transform: scale(1); opacity: 0; }
}

@-moz-keyframes cssload-loader {
		from { -moz-transform: scale(0); opacity: 1; }
		to	 { -moz-transform: scale(1); opacity: 0; }
}


/***************************************************/
/********************  BEACONS  ********************/
/***************************************************/

.beacon
{
position: absolute;
z-index: 98;
width: calc(30px + .35vh);
height: calc(30px + .35vh);
overflow: visible;
font-size: 3em;
box-shadow: 0 0 0 rgba(255,0,0,.4); 
border-radius: 50%;
background: rgba(19,43,67,1);
-webkit-animation: beacon 2s infinite;
animation: beacon 2s infinite;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
outline: none;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}

.beaconTarget
{
background-image: url("../_gfx/vvx.beacon.target.svg");
}
.beaconMedia
{
background-image: url("../_gfx/vvx.beacon.media.svg");
}
.beaconInfo
{
background-image: url("../_gfx/vvx.beacon.info.svg");
}
.beaconLocation
{
background-image: url("../_gfx/vvx.beacon.location.svg");
}
.beaconPdf
{
background-image: url("../_gfx/vvx.beacon.pdf.svg");
}
.beaconLink
{
background-image: url("../_gfx/vvx.beacon.link.svg");
}
.beaconSpeak
{
background-image: url("../_gfx/vvx.beacon.speak.svg");
}

.beacon:hover
{
width: calc(35px + .35vh);
height: calc(35px + .35vh);
}

.beacon a
{
position: absolute;
z-index: 98;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
width: 80%;
height: 80%;
border-radius: 50%;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out; 
}

@-webkit-keyframes beacon
{
	0% 
	{
	box-shadow:0 0 0 0 rgba(255,255,255,.8)
	}
	70%
	{
	box-shadow:0 0 0 30px rgba(255,255,255,.0)
	}
	to
	{
	box-shadow:0 0 0 0 rgba(255,255,255,.0)
	}
}

@keyframes beacon
{
	0%
	{
	box-shadow:0 0 0 0 rgba(255,255,255,.8)
	}
	70%
	{
	box-shadow:0 0 0 30px rgba(255,255,255,.0)
	}
	to
	{
	box-shadow:0 0 0 0 rgba(255,255,255,.0)
	}
	0%
}

/**************************************************/
/********************  ARROWS  ********************/
/**************************************************/

.arrow-down > a,
.arrow-up > a,
.arrow-left > a,
.arrow-right > a
{
font-size: calc(4vh + .35vw);
margin: 10px;
color:rgba(255, 255, 255, 1);
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
} 

@media (max-width: 1280px) 
{
.arrow-down > a,
.arrow-up > a,
.arrow-left > a,
.arrow-right > a
	{
display: none;
	}
}

.arrow-down > a
{
position: absolute;
z-index: 97;
bottom: 0px;
left: 50%;
-webkit-transform: translate(-50%);
-ms-transform: translate(-50%);
transform: translate(-50%);
}

.arrow-up > a
{
position: absolute;
z-index: 97;
top: 0px;
left: 50%;
-webkit-transform: translate(-50%);
-ms-transform: translate(-50%);
transform: translate(-50%);
}

.arrow-left > a
{
position: fixed;
z-index: 97;
top: 50%;
left: 0px;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

.arrow-right > a
{
position: fixed;
z-index: 97;
top: 50%;
right: 0px;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}

.arrow-up > a:hover
{
color: rgba(255,255,255, .8); 
background: transparent;
top: -5px;
} 

.arrow-down > a:hover
{
color: rgba(255,255,255, .8); 
background: transparent;
bottom: -5px;
} 

.arrow-left > a:hover
{
color: rgba(255,255,255, .8); 
background: transparent;
left: -5px;
} 

.arrow-right > a:hover
{
color: rgba(255,255,255, .8); 
background: transparent;
right: -5px;
} 

.arrow-down > a:focus,
.arrow-up > a:focus,
.arrow-left > a:focus,
.arrow-right > a:focus
{
background: transparent;
border: 0px;
outline: none;
}

/*******************************************************/
/********************  USER ONLINE  ********************/
/*******************************************************/


#userOnline
{
position: fixed;
top: 12px;
right: 150px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
width: auto;
min-width: 25px;
height: auto;
min-height: 25px;
border-radius: 50%;
background: rgba(210,73,65,1);
font-size: 0.8em;
font-weight: 400;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); 
}

/*************************************************/
/********************  LIVE  ********************/
/*************************************************/


.live
{
position: fixed;
z-index: 100;
top: 15px;
right: 220px;
font-size:12px;
font-weight:900;
color: #fff;
letter-spacing: 2px;
background: transparent;
}

@media (max-width: 1280px) 
{
.live
	{
	top: 18px;
	right: 100px;
	}
}

.live:before
{
display: inline-block;
content: "";
width: 12px;
height: 12px;
background: rgba(210,73,65,1);
border-radius: 50%;
margin-right: 5px;
margin-bottom: -1px;
-webkit-animation: live 3s infinite;
animation: live 3s infinite;
}


@-webkit-keyframes live
{
	0% 
	{
	box-shadow:0 0 0 0 rgba(210,73,65,.4)
	}
	70%
	{
	box-shadow:0 0 0 9px rgba(210,73,65,0)
	}
	to
	{
	box-shadow:0 0 0 0 rgba(210,73,65,0)
	}
}

@keyframes live
{
	0%
	{
	box-shadow:0 0 0 0 rgba(210,73,65,.4)
	}
	70%
	{
	box-shadow:0 0 0 9px rgba(210,73,65,0)
	}
	to
	{
	box-shadow:0 0 0 0 rgba(210,73,65,0)
	}
}


/*************************************************/
/********************  PAGES  ********************/
/*************************************************/

.main
{
position: absolute;
width: 100vw;
height: auto;
min-height: 100vh;
padding: 50px 0 0 0;
display: flex;
flex-flow: column;
overflow: auto;
}

.index,
.welcome,
.lobby,
.exhibition,
.exhibitors,
.sponsors,
.stage,
.room,
.breakout,
.feedback,
.luckydraw,
.team,
.hosts,
.user,
.faq
{
position: relative;
width: 100vw;
height: auto;
max-height: calc(100vh - 50px);
overflow: hidden;
flex-grow : 0;
flex-wrap: wrap;
background-image: url('');  
background-repeat: no-repeat; 
background-position: center top; 
background-size: 100% auto;
}

.index,
.welcome,
.lobby,
.exhibition,
.exhibitors,
.sponsors,
.room,
.breakout,
.feedback,
.luckydraw,
.team,
.hosts,
.user,
.faq
{
position: relative;
width: 100vw;
height: auto;
max-height: calc(100vh - 50px);
overflow: hidden;
flex-grow : 0;
flex-wrap: wrap;
background-image: url('');  
background-repeat: no-repeat; 
background-position: center top; 
background-size: 100% auto;
}

.stage
{
position: relative;
width: 100vw;
height: auto;
max-height: 100vh;
overflow: hidden;
flex-grow : 0;
flex-wrap: wrap;
background-image: url('');  
background-repeat: no-repeat; 
background-position: center top; 
background-size: 100% auto;
}

.page
{
position: relative;
width: calc(100vh / 9 * 16);
max-width: 100vw;
height: auto;
overflow: hidden;
flex-grow : 0;
flex-wrap: wrap;
margin: 0px auto 0px auto;
padding: 0;
background-image: url('');  
background-repeat: no-repeat; 
background-position: center center; 
background-size: 100% auto;
-webkit-box-shadow: 0px -6px 12px 0px rgba(0,0,0,.3);
-moz-box-shadow: 0px -6px 12px 0px rgba(0,0,0,3);
box-shadow: 0px -6px 12px 0px rgba(0,0,0,.3);
}

.pagebg
{
}

.pagebg:after
{ 
padding-top: 56.25%; 
/* 16:9 ratio */ 
display: block; 
content: ''; 
}



.stage_sub
{
position:absolute;
width: 64.8%;
height: auto;
max-height: 100vh;
display: inline-block; 
left: 50.5%;
top: 39.2%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
}

.library_sub
{
position: relative; 
padding-bottom: 56.25%; /* ratio 16x9 */
height: 0; 
overflow: hidden; 
width: 100%;
height: auto;
}

.library_sub iframe,
.stage_sub iframe
{
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
border: none;
}

.index:after,
.welcome:after,
.lobby:after,
.exhibition:after,
.stage:after,
.room:after,
.feedback:after,
.luckydraw:after,
.stage_sub:after,
.library_video:after
{ 
padding-top: 56.25%; 
/* 16:9 ratio */ 
display: block; 
content: ''; 
}


.agenda:after,
.exhibitors:after,
.sponsors:after,
.library:after,
.team:after,
.hosts:after,
.user:after,
.faq:after
{ 
padding-bottom: 50px;
display: block; 
content: ''; 
}


.breakout:after
{ 
padding-bottom: 0px;
display: block; 
content: ''; 
}

.intro,
.exhibitors,
.sponsors,
.exhibitor_details,
.team,
.library,
.hosts,
.user,
.faq
{
position: relative;
min-height: 100vh;
height: auto;
padding: 0 10% 0 10%;
display: flex;
flex-wrap: wrap;
}


.agenda
{
position: relative;
min-height: 100vh;
height: auto;
padding: 0 10% 0 10%;
}

.intro_sub,
.exhibitor_sub,
.exhibitor_details_sub,
.team_sub,
.agenda_sub,
.user_sub
{
position: relative;
z-index: 96;
display: inline;
padding: 15px;
margin: 15px;
font-size: 0.9em;
border-radius: 15px;
}

@media (max-width: 1280px) 
{
.intro_sub,
.exhibitor_sub,
.exhibitor_details_sub,
.library_sub,
.team_sub,
.user_sub,
.agenda_sub
	{
	width: 80%;
	}
}



/**************************************************/
/********************  FOOTER  ********************/
/**************************************************/

.footer
{
position: relative;
z-index: 95;
width: 100vw;
flex-grow : 1;
padding: 1em;
border-top: 1px solid rgba(255,255,255,1);
-webkit-box-shadow: 0px -6px 12px 0px rgba(0,0,0,.175);
-moz-box-shadow: 0px -6px 12px 0px rgba(0,0,0,.175);
box-shadow: 0px -6px 12px 0px rgba(0,0,0,.175);
font-size: calc(6px + 0.35vw);
color: rgba(255,255,255,.5);
background: rgba(74,82,91,1.0);
}

.footer a,
.footer a:hover,
.footer a:focus,
.footer a:active
{
font-size: calc(6px + 0.35vw);
color: rgba(255,255,255,.5);
padding: 0 4px 0 4px;
}

/**************************************************/
/********************  AGENDA  ********************/
/**************************************************/

.agendaDateSelect
{
position: relative;
width: auto;
height: auto;
margin: 2px;
padding: 12px 20px 12px 20px;
background: #aaa;
border-radius: 8px;
font-size: 12px;
color: #fff;
text-align: center;
vertical-align: middle;
border: none;
outline:none;
cursor: pointer;
}

.agendaDateSelect:hover
{
background: #ccc;
}

.agenda_flaggroup
{
position: absolute;
top: 20px;
right: 20px;
text-align: right;
}

.agenda_flag 
{
position: relative;
width: auto;
height: auto;
margin: 2px;
padding: 2px 10px 2px 10px;
background: #aaa;
border-radius: 8px;
font-size: 10px;
color: #fff;
text-align: center;
vertical-align: middle;
}

.agenda_user_txt {
position: relative;
width: auto;
height: auto;
border-radius: 15px;
padding: 10px;
font-size: 0.8em;
overflow: auto;
} 

.agenda_user_txt h12 
{
position: relative;
font-size: 1.2em;
font-weight: 900;
padding-bottom: 0px;
display: block;
} 

.agenda_sub span
{
position: relative;
font-size: 0.8em;
color: rgba(0,0,0,0.4);
} 

.agenda_sub span > a
{
color: rgba(0,0,0,0.4);
text-decoration: underline dashed;
} 

.agenda_description 
{
font-size: 1em;
line-height: 1.5em;
color: #000;
} 

.agenda_timeline_date
{
z-index: 90;
font-size: 40px;
color: rgba(34,34,34,1);
font-weight: 600;
} 

.agenda_timeline_time
{
position: absolute;
z-index: 90;
top: 12px;
right: 55px;
font-size: 40px;
font-weight: 700;
color: rgba(34,34,34,.1);
} 

@media (max-width: 1280px) 
{
.agenda_timeline_time
	{
	left: 30px;
	}
}

.agenda_timeline_line 
{
position: absolute;
z-index: 90;
top: 0px;
right: 30px;
height: calc(100% + 30px);
border-right: 2px solid rgba(34,34,34,0.3);
} 

.agenda_timeline_dot
{
position: absolute;
z-index: 90;
top: 16px;
right: -11px;
width: 20px;
height: 20px;
border-radius: 50%;
border: 2px solid rgba(34,34,34,0.3);
background: rgba(255,255,255,1);
} 

@media (max-width: 1280px) 
{
.agenda_timeline_line,
.agenda_timeline_dot
	{
	display: none;
	}
}

.agenda_user_img 
{
position: relative;
width: 8vh;
height: 8vh;
border-radius: 4vh;
background: rgba(34,34,34,0.2);
overflow: hidden;
float: left;
margin: 0 30px 0 0;
} 

.agenda_user_img img 
{
position: absolute;
width: auto;
height: 100%;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
} 

.agenda_user_img span 
{
width: 8vh;
height: 8vh;
font-size: 4vh;
line-height: 8vh;
border-radius: 4vh;
overflow: hidden;
text-align: center;
vertical-align: middle;
color: rgba(255, 255, 255, 0.3);
text-shadow: 0 15px 20px rgba(0, 0, 0, 0.07); 
} 


/************************************************/
/********************  USER  ********************/
/************************************************/

.user_img 
{
position: relative;
width: 12vh;
height: 12vh;
border-radius: 6vh;
background: rgba(74,82,91,0.3);
margin: 0 auto;
overflow: hidden;
} 

.user_img img 
{
position: absolute;
width: auto;
height: 100%;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
} 

.user_img span 
{
width: 12vh;
height: 12vh;
font-size: 6vh;
line-height: 12vh;
border-radius: 6vh;
overflow: hidden;
text-align: center;
vertical-align: middle;
color: rgba(255, 255, 255, 0.3);
text-shadow: 0 15px 20px rgba(0, 0, 0, 0.07); 
}

.user_txt 
{
position: relative;
font-size: 14px;
line-height: 200%;
} 

.user_txt h12 {
position: relative;
padding-top: 4vh;
font-size: 18px;
font-weight: 600;
line-height:	1.7em;
text-align: center;
} 

.user_txt a 
{
color: #000;
border-bottom: #eee;
text-decoration: unterline;
} 

.user_txt a:hover 
{
color: #000;
} 



/**********************************************************/
/********************  WIDGET BUTTONS  ********************/
/**********************************************************/

.widgets
{
position: fixed;
z-index: 999;
right: 20px;
bottom: 100px;
max-width: 60px;
} 

@media (max-width: 1280px) 
{
.widgets	
	{
position: fixed;
z-index: 97;
right: 8px;
max-width: 40px;
	}
}

.widgets button
{
position:relative;
width: 60px;
height: 60px;
border-radius: 30px;
border: 0px;
margin: 20px 0 0 0;
padding: 0;
font-size: 30px;
color: rgba(255, 255, 255, 0.8); 
background: rgba(210,73,65,1);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
} 

@media (max-width: 1280px) 
{
.widgets button
	{
position:relative;
width: 40px;
height: 40px;
border-radius: 20px;
border: 0px;
margin: 20px 0 0 0;
padding: 0;
font-size: 20px;
color: rgba(255, 255, 255, 0.8); 
background: rgba(74,82,91,1.0);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
	}
}

.widgets button:hover 
{
color: rgba(255, 255, 255, 1); 
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.4); 
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);    
} 

.widgets button:focus 
{
outline:none;
border: none;
} 

/***************************/
/***** WIDGET CONTAINER ****/
/***************************/

.widget
{
position: fixed;
z-index: 99;
width: 20vw;
left: 30px;
margin: 80px 0px 65px 0px;
padding: 15px;
font-size: 0.8em;
display: none;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}


@media (max-width: 1280px) 
{
.widget
	{
	position: fixed;
	z-index: 99;
	width: 80vw;
	max-height: 50vh;
	left: calc(50vw - 40vw);
	margin: 65px auto 65px auto;
	padding: 15px;
	font-size: 0.8em;
	order:2;
	display: none;	
	}
}

.widget_sub,
.user_container_sub
{
position: relative;
z-index: 97;
width: 100%;
height: 100%;
margin: 0px; 
padding: 15px;
border-radius: 15px;
overflow: auto;
color: rgba(0,0,0,1);
} 

.widget_sub h4,
.user_container_sub h4
{
border-radius: 10px 10px 0px 0px;
width: calc(100% + 30px); 
margin: -15px 0 15px -15px;
padding: 15px 15px 15px 15px;
font-family: 'Gilroy W05 Bold', sans-serif;
color: rgba(255,255,255,1);
background-color:rgba(0, 0, 0, 0.5);
text-transform: uppercase;
}  

.widget_sub p,
.user_container_sub p
{
position: absolute;
z-index: 99;
font-size: 150%;
top: 0px;
right: 20px;
cursor: pointer;
color: rgba(255,255,255,1);
}


/************************/
/***** WIDGET POPUP *****/
/************************/

.widget_popup
{
position: fixed; 
z-index: 999;
width: 30vw;
height: auto;
left:  calc(50% - 15vw);
bottom: 80px;
display: none;
color: rgba(255,255,255,1);
}
.widget_popop_message
{
width: 100%;
height: auto;
overflow: hidden;
color: rgba(255,255,255,1);
-moz-hyphens: auto;
-o-hyphens: auto;
-webkit-hyphens: auto;
-ms-hyphens: auto;
hyphens: auto; 
}

.widget_popop_message a,
.widget_popop_message a:hover
{
color: rgba(255,255,255,1);
}


/********************************************/
/***** WIDGET CHAT + QAA + FEEDBACK NEW *****/
/********************************************/

.widgetQuestionOutput,
.widgetChatOutput
{
margin: 0;
padding: 0;
max-height: 50vh;
overflow: auto;
}

.widgetQuestionOutput li,
.widgetChatOutput li
{
display: block;
border-radius: 5px 20px 20px 20px;
padding: 15px;
margin: 10px;
background: rgba(0,0,0,.3);
color: #fff;
overflow: auto;
}

.widgetQuestionOutputDSM button,
.widgetQuestionOutput button,
.widgetChatOutput button
{
position: relative;
float: right;

width: 40px;
height: 40px;
border-radius: 50%;
background: rgba(0,0,0,.2);
border: none;
outline:none;
color: rgba(255,255,255,.5);
font-size: calc(12px + .35vw);
margin: 10px 0 0 10px;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.widgetQuestionOutputDSM button:hover,
.widgetQuestionOutput button:hover,
.widgetChatOutput button:hover
{
background: rgba(0,0,0,.3);
color: rgba(255,255,255,1);
}

.widgetQuestionOutputDSM
{
margin: 0;
padding: 0;
height: 100vh;
overflow: auto;
}

.widgetQuestionOutputDSM li
{
display: block;
border-radius: 5px 20px 20px 20px;
padding: 15px;
margin: 10px;
background: rgba(0,0,0,.3);
color: #fff;
font-size: calc(20px + .35vw);
line-height: 120%;
overflow: auto;
}









.widget input[type=text]
{
position: relative;
width: 70%;
height: 50px;
border: 0px;
outline: none;
border-radius: 25px;
background: rgba(0,0,0,0.2);
padding: 0px 20px 0px 20px;
margin: 20px 0 0 10px;
font-size: 100%;
line-height: 120%;
resize: none;
color: rgba(255,255,255,0.5);
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.user_sub input[type=text]
{
position: relative;
width: 70%;
height: 50px;
border: 0px;
outline: none;
border-radius: 25px;
background: rgba(0,0,0,0.2);
padding: 0px 20px 0px 20px;
margin: 20px 0 0 10px;
font-size: 100%;
line-height: 120%;
resize: none;
color: rgba(0,0,0,0.5);
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}


@media (max-width: 1280px) 
{
.user_sub input[type=text]
	{
width: 80%;
height: 30px;
margin: 0 0 5px 0;
	}
}

.user_container_sub label
{
position: relative;
width: 120px;
height: 50px;
text-align: right;
margin: 10px 0 0 0;
padding: 12px 20px 0 0;
float: left;
}

@media (max-width: 1280px) 
{
.user_container_sub label
	{
width: 80px;
height: 30px;
margin: 0 0 0 10%;
padding: 10px 0 0 0;
text-align: left;
	}
}

.user_container_sub button
{
position: relative;
width: auto;
height: 50px;
border: 0px;
outline: none;
border-radius: 25px;
background: rgba(0,0,0,0.2);
padding: 0px 20px 0px 20px;
margin: 30px 0 0 10px;
resize: none;
font-size: 100%;
line-height: 120%;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

@media (max-width: 1280px) 
{
.user_container_sub button
	{
width: 60%;
height: 30px;
margin: 10px 0 0 0;
padding: 0;
	}
}

.widget textarea
{
position: relative;
width: 100%;
height: 100%;
border: 0px;
outline: none;
border-radius: 25px;
background: rgba(0,0,0,0.2);
padding: 0px 20px 0px 20px;
margin: 20px 0 0 0;
font-size: 120%;
line-height: 120%;
resize: none;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.widget input:hover,
.widget textarea:hover,
{
background: rgba(0,0,0,0.3);
color: rgba(255,255,255,1);
}

.user_sub input:hover,
.user_container_sub button:hover,
.user_sub input:focus,
.user_container_sub button:focus
{
background: rgba(0,0,0,0.3);
color: rgba(0,0,0,1);
}


.widget input:focus,
.widget textarea:focus,
{
outline:none;
color: rgba(255,255,255,1);
} 

.widget_qaa_question_submit,
.widget_qaa_answer_submit,
.widget_feedback_submit,
.widgetChatSubmit,
.widget_popup_submit,
.widget_liveOn_submit,
.widget_liveOff_submit,
.widget_gong_submit
{
position: relative;
top: 4px;
width: 50px;
height: 50px;
border-radius: 50%;
background: rgba(0,0,0,0.2);
color: rgba(255,255,255,0.5);
border: none;
outline:none;
font-size: 180%;
line-height: 180%;
margin: 20px 0 0 10px;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.widget_qaa_question_submit:hover,
.widget_qaa_answer_submit:hover,
.widgetChatSubmit:hover,
.widget_popup_submit:hover,
.widget_liveOn_submit:hover,
.widget_liveOff_submit:hover,
.widget_gong_submit:hover
{
background: rgba(0,0,0,0.3);
color: rgba(255,255,255,1);
}

.widget_qaa_button_delete,
.widget_qaa_button_like,
.widget_qaa_button_reply
{
position: relative;
float: right;
width: 40px;
height: 40px;
border-radius: 50%;
background: rgba(0,0,0,0.2);
border: none;
outline:none;
color: rgba(255,255,255,0.5);
font-size: 120%;
margin: 10px 0 0 10px;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.widget_qaa_button_delete:hover,
.widget_qaa_button_like:hover,
.widget_qaa_button_reply:hover
{
background: rgba(0,0,0,0.3);
color: rgba(255,255,255,1);
}

.widget_qaa_output,
.widget_chat_output 
{
max-height: 60vh;
width: 100%;
padding: 0;
display: flex;
flex-direction: column;
overflow-y: scroll;
}

.widget_qaa_question,
.widget_chat_message 
{
display: block;
border-radius: 5px 20px 20px 20px;
padding: 15px;
margin: 5px 10px 5px 10px;
background: rgba(0,0,0,0.3);
color: #fff;
}

.widget_qaa_answer_input
{
padding-top: 20px;
}

.widget_qaa_answer
{
border-radius: 20px 20px 5px 20px;
padding: 15px;
margin: 5px 10px 5px 40px;
background: rgba(0,0,0,0.3);
color: #fff;
}

.widget_qaa_username,
.widget_chat_username 
{
color: rgba(255,255,255,0.5);
width: 70%;
font-size: 80%;
display: block;
padding: 0 0 5px 0;
float:left;
}

.widget_chat_time
{
color: rgba(255,255,255,0.5);
font-size: 80%;
display: block;
padding: 0 0 5px 0;
text-align: right;
}

.widget_qaa_text,
.widget_chat_text
{
width: 100%;
font-size: 120%;
display: block;
clear: both;
-webkit-hyphens: auto;
-webkit-hyphenate-limit-chars: auto 3;
-webkit-hyphenate-limit-lines: 4;
-ms-hyphens: auto;
-ms-hyphenate-limit-chars: auto 3;
-ms-hyphenate-limit-lines: 4;
word-break: break-word;
}



/*******************/
/***** WIDGETS *****/
/*******************/


.widget_submit_button 
{
border-radius: 15px;
padding: 5px 15px 5px 15px;
border: 0px;
font-size: 20px;
color: rgba(255, 255, 255, 0.8); 
background-color:rgba(0, 0, 0, 0.8);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); 
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
} 

.widget_submit_button:hover 
{
color: rgba(255, 255, 255, 1); 
background-color:rgba(137, 232, 114, 0.8); 
-moz-transform: scale(1.1);
-webkit-transform: scale(1.1);
-o-transform: scale(1.1);
-ms-transform: scale(1.1);
transform: scale(1.1);    
} 

.widget_submit_button:focus 
{
outline:none;
border: none;
} 



.exhibitor_sub_img,
.exhibitor_details_sub_img
{
max-width: 350px;
max-height: 100px;
}



/*************************/
/***** EXHIBITOR GFX *****/
/*************************/


.exhibition_cont
{
position: fixed;
z-index: 900;
width: 100%;
height: 100%;
left: 50%;
top: 50%;
display:none;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}

.exhibitionBackground
{
position: fixed;
z-index: 900;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.7);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
}

.exhibition_cont_appointment
{
position: fixed;
z-index: 901;
width: 40%;
height: 40%;
left: 50%;
top: 50%;
padding: 25px;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
background: rgba(0,0,0,0.7);
backdrop-filter: blur(8px);
-webkit-backdrop-filter: blur(8px);
color: rgba(255,255,255,1);
display: none;
}

.exhibition_cont_object a,
.exhibition_cont_appointment a
{
position: absolute;
bottom: 20px;
left: 50%;
-webkit-transform: translate(-50%);
-ms-transform: translate(-50%);
transform: translate(-50%);
text-align: center;
color: #fff;
}

.exhibition_cont_object form
{
position:absolute;
z-index: 910;
width: 50vw; 
height: auto; 
left: 50%;
top: 50%;
color: rgba(255,255,255,1);
font-size: 150%;
line-height: 200%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}

.exhibition_cont_object iframe
{
position: absolute;
z-index: 910;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); 
width: 80%; 
height: 80%; 
}

.exhibition_cont_iframe:after
{ 
padding-top: 56.25%; 
/* 16:9 ratio */ 
display: block; 
content: ''; 
}

.exhibition_cont_object video
{
position:absolute;
z-index: 910;
width: 50vw; 
height: auto; 
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
} 

.exhibition_cont_object img
{
position:absolute;
z-index: 910;
width: 50vw; 
height: auto; 
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
} 

.exhibition_cont_object span
{
position:absolute;
z-index: 910;
width: 50vw; 
height: auto; 
left: 50%;
top: 50%;
color: rgba(255,255,255,1);
font-size: 150%;
line-height: 200%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
}

.exhibition_cont button,
.exhibition_cont_appointment button
{
position: fixed;
z-index: 910;
top: 100px;
right: 50px;
width: 40px;
height: 40px;
pointer: cursor;
background: transparent;
outline: none;
border: none;
font-size: 30px;
color: #fff;
}

.exhibition_cont button:hover, 
a:hover
.exhibition_cont_appointment button:hover,
{
color: #fff;
outline: none;
} 


/******************************************************************/
/******************** EXHIBITION APPOINTMENTS  ********************/
/******************************************************************/

.widget_appointment
{
position: absolute;
z-index: 99;
width: 40vw;
height: auto;
left: 50%;
margin: 40px 0px 65px 0px;
padding: 15px;
font-size: 0.8em;
overflow: auto; 
display: none;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
color: rgba(255,255,255,1);
}

@media (max-width: 1280px) 
{
.widget_appointment
	{
	position: fixed;
	z-index: 99;
	width: calc(80vw + 30px);
	max-height: 50vh;
	left: 0;
	margin: 15px 0px 65px 0px;
	padding: 15px;
	font-size: 0.8em;
	order:2;
	display: none;	
	}
}

.booked
{
position: relative; 
width: 100px; 
height: 30px; 
background-color: rgba(21,62,114,.1);
color: rgba(255,255,255,.1); 
margin: 5px 5px 5px 5px;
padding: 5px;
float: left;
border-radius: 15px;
cursor: no-drop;
text-align: center;
}

.free
{
position: relative; 
width: 100px; 
height: 30px; 
background-color: rgba(21,62,114,1); 
margin: 5px 5px 5px 5px; 
padding: 5px;
float: left;
border-radius: 15px;
cursor: pointer;
text-align: center;
}

.appointmentWindow
{
display: none;
margin-top: 40px;
font-size: calc(9px + .35vw);
text-align: center;
}

.appointmentWindow input,
.appointmentDeleteWindow input
{
position: relative;
top: 4px;
width: 100px;
height: 30px;
border-radius: 15px;
background: rgba(0,0,0,0.2);
color: rgba(255,255,255,0.5);
border: none;
outline:none;
padding: 5px;
margin: 20px 0 0 10px;
text-align: center;
}

.appointmentWindow input:hover,
.appointmentDeleteWindow input:hover
{
background: rgba(0,0,0,0.3);
color: rgba(255,255,255,1);
}

.appointmentMessage
{
margin-top: 40px;
font-size: calc(9px + .35vw);
text-align: center;
}

.appointmentMessage a
{
color: rgba(195,83,72,1);
}

.appointmentDeleteMessage,
.appointmentDeleteWindow
{
margin-top: 40px;
font-size: calc(10px + .35vw);
text-align: center;
color: rgba(195,83,72,1);
display: none;
}

.appointmentListHead,
.appointmentList
{
position: relative;
width: 100%;
height: 40px;
color: rgba(0,0,0,1);
white-space: nowrap;
border-top: 1px solid #ccc;
clear: both;
top: 0px;
margin: 0;
line-height: 40px;
cursor: pointer;
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.appointmentListHead
{
font-family:"Gilroy W05 Bold";
}

.appointmentList:hover
{
background: rgba(0,0,0,.05);
top: -2px;
box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.05);
}

.appointmentListHead > div,
.appointmentList > div
{
position: relative;
float: left;
text-overflow: ellipsis;
overflow: hidden;
}

@media (max-width: 1280px) 
{
.appointmentListHead > div,
.appointmentList > div
	{
	clear: both;
	min-width: 100%;
	}
}

.appointment_user_img
{
position: relative;
width: 8vh;
height: 8vh;
border-radius: 4vh;
background: rgba(34,34,34,0.2);
overflow: hidden;
float: left;
margin: 0 30px 0 0;
} 

.appointment_user_img
{
background: rgba(255,255,255,0.2);
} 

.appointment_user_img img
{
position: absolute;
width: auto;
height: 100%;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%,-50%);
-ms-transform: translate(-50%,-50%);
transform: translate(-50%,-50%);
} 

.appointment_user_img span
{
width: 8vh;
height: 8vh;
font-size: 4vh;
line-height: 8vh;
border-radius: 4vh;
overflow: hidden;
text-align: center;
vertical-align: middle;
color: rgba(255, 255, 255, 0.3);
text-shadow: 0 15px 20px rgba(0, 0, 0, 0.07); 
} 


/******************************************************************/
/******************** EXHIBITION APPOINTMENTS  ********************/
/******************************************************************/

.feedbackForm
{
position: relative;
background: rgba(0,0,0,.8);
padding: 40px;
margin: 5vh auto 5vh auto;
border-radius: 15px;
color: rgba(255,255,255,1);
-webkit-box-shadow: 0 0 20px 10px rgba(0, 0, 0, 0.1);
}

@media (max-width: 1280px) 
{
.feedbackForm
	{
	position: relative;
	width: 90vw;
	margin: 5vh 5vw 5vh 5vw;
	}
}

.feedbackForm a
{
font-size: calc(8px + 0.35vw);
color: rgba(255,255,255,1);
}


.feedbackLine
{
margin: 0 0 20px 0;
display: -webkit-flex;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
line-height: 120%;
}

.feedbackForm input[type=checkbox],
.feedbackForm input[type=radio],
.feedbackForm select
{
-webkit-appearance: none; /* Webkit */
-moz-appearance: none; /* FF */
-ms-appearance: none; /* Edge */
appearance: none; /* Future */
visibility: hidden;
display: none;
}



.feedbackForm label {
width: calc(22px + .35vw);
height: calc(22px + .35vw);
text-align: center;
vertical-align: middle;
color: lighten(#fff,40%);
display: inline-block;
cursor: pointer;
font-weight: bold;
font-size: calc(9px + .35vw);
border: solid 2px #fff;
border-radius: 50%; 
margin: 0 10px 0 0;
background: rgba(0,0,0,0.2);
}

.feedbackForm input[type=checkbox]:checked + label,
.feedbackForm input[type=radio]:checked + label
{
color: lighten(#fff,60%);
background: rgba(255,255,255,.5);  
}
 
   
.feedbackForm textarea
{
position: relative;
width: 50%;
height: 100%;
outline: none;
background: rgba(0,0,0,0.1);
padding: 10px;
font-size: 100%;
line-height: 100%;
resize: none;
border: solid 2px #fff;
display: inline-block;
border-radius: 10px;
overflow: hidden;
font-family:"Gilroy W05 light";
color: rgba(255,255,255,1);
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
}

.feedbackForm textarea:hover
{
color: lighten(#fff,60%);
background: rgba(255,255,255,.5);  
}

.feedbackForm input[type=submit],
.feedbackForm button
{
position: relative;
width: auto;
height: auto;
outline: none;
background: rgba(0,0,0,0.1);
padding: 10px 15px 10px 15px;
font-size: 100%;
line-height: 100%;
resize: none;
border: solid 2px #fff;
display: inline-block;
border-radius: 1.5vw;
overflow: hidden;
font-family:"Gilroy W05 light";
color: rgba(255,255,255,1);
-webkit-transition: all .3s ease-out;
-moz-transition: all .3s ease-out;
-o-transition: all .3s ease-out;
transition: all .3s ease-out;
top: 0;
left: 0;
}

.feedbackForm input[type=submit],
.feedbackForm button:hover
{
color: lighten(#fff,60%);
background: rgba(255,255,255,.5);  
}  
