/* UTIL */
.noselect {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
/* ------------------------------------------------------------------------------------------- */
/* --------------------------------- GENERAL HTML ELEMENTS ----------------------------------- */
/* ------------------------------------------------------------------------------------------- */
body{ margin: 0px; font-weight: 400; }
a { color: blue; }
.LC_Color1 { color: #E7473E }
.LC_Color2 { color: #DA5216 }
.LC_Color3 { color: #EF891E }
.LC_Color4 { color: #F9B911 }
.LC_Color5 { color: #B5BC22 }
.LC_Color6 { color: #74B33E }
.LC_Color7 { color: #10A77B }
.LC_Color8 { color: #06ADA0 }
.LC_Color9 { color: #0699AE }
.LC_BgColor1 { background-color: #E7473E }
.LC_BgColor2 { background-color: #DA5216 }
.LC_BgColor3 { background-color: #EF891E }
.LC_BgColor4 { background-color: #F9B911 }
.LC_BgColor5 { background-color: #B5BC22 }
.LC_BgColor6 { background-color: #74B33E }
.LC_BgColor7 { background-color: #10A77B }
.LC_BgColor8 { background-color: #06ADA0 }
.LC_BgColor9 { background-color: #0699AE }
.LC_BgColor1Over { background-color: #E11220 }
.LC_BgColor2Over { background-color: #CA1D1D }
.LC_BgColor3Over { background-color: #E65014 }
.LC_BgColor4Over { background-color: #EF8E05 }
.LC_BgColor5Over { background-color: #799B24 }
.LC_BgColor6Over { background-color: #EC9B32 }
.LC_BgColor7Over { background-color: #009451 }
.LC_BgColor8Over { background-color: #009971 }
.LC_BgColor9Over { background-color: #007985 }
.LC_BgColorGrey { background-color: rgb(75, 75, 75); }
.LC_BgColorBtn { background-color: rgb(22, 174, 160); }

#LC_Logo { width: 200px; float: left; margin-left: 1%; }
#GT_IndexContainer { background-color: white; text-align: center; margin: 0px; min-width: 960px; min-height: 300px; font-family: "Roboto"; font-size: 14px; }
#GT_MainContainer, #VM_MainContainer { overflow: hidden; background-color: rgb(229, 229, 229); text-align: center; margin: 0px; min-width: 960px; min-height: 300px; font-family: "Roboto"; font-size: 14px; }
input, select, button, textarea { font-family: "Roboto"; }

#LC_MainTitle { font-size: 32px; }

#GT_Tooltip { font-family: "Roboto"; background-color: rgb(75, 75, 75); color: white; font-size: 10px; max-width: 300px; }

.GT_Dialog { display: none; }
.GT_DialogContainer { overflow-y: auto; overflow-x: hidden; max-height: 100%; }
#GT_DialogBasic, .GT_Dialog { color: rgb(84, 84, 84); font-family: "Roboto"; max-width: 400px; background-color: white; border: 1px rgb(75, 75, 75) solid; text-align: center; padding-bottom: 10px; }
.GT_DialogTitle { background-color: rgb(75, 75, 75); color: white; font-size: 16px; padding: 5px; }
.GT_DialogText { margin: 10px; }
.GT_BtnValid { font-family: "Roboto"; float: right; margin-top: 10px; }
.GT_BtnCancel { font-family: "Roboto"; float: left; margin-top: 10px; }

#GT_DialogMask2 { background-color: rgba(0, 0, 0, 0.5); }

#GT_RenameBox { border: 2px rgb(75, 75, 75) dotted; position:absolute; z-index: 91; padding: 5px; font-family: "Roboto"; text-align: center; box-sizing: border-box; }

#GT_Completion { z-index:91; font-family: "Roboto"; background-color: white; border: 1px black solid; min-width: 30px; max-height: 100px; overflow-y: auto; }
#GT_Completion div { padding: 5px; cursor: pointer; text-overflow: ellipsis; overflow: hidden; max-width: 300px; }
#GT_Completion div.GT_CompSelected { background-color: #10A77B; }
#GT_Completion div:hover { background-color: #06ADA0; }
#GT_Completion div.GT_GifLoadingMini { padding: 0px; cursor: default; }

.GT_GifLoading { background-image: url(../img/loader.gif); width: 32px; height: 32px; display: inline-block; background-repeat: no-repeat; background-size: cover; }
.GT_GifLoadingMini { background-image: url(../img/loader.gif); width: 16px; height: 16px; display: inline-block;  background-repeat: no-repeat;background-size: cover; }

/* ------------------------------------------------------------------------------------------- */
/* -------------------------------------    MENU    ------------------------------------------ */
/* ------------------------------------------------------------------------------------------- */
h1 { clear: both; }
#GT_Menu { text-align: center; clear: both; display: inline-block; min-width: 60%;  }
#GT_Menu a { display: inline-block; padding: 5px; margin: 5px; color: blue; text-decoration: none; }
#GT_Menu a:hover { text-decoration: underline; }
#GT_UserId { position: absolute; right: 10px; top: 10px; height: 10px; font-size: 10px; margin-right: 5px;}
#GT_UserId > a {display: none;}
#GT_Menu a.LC_BgColorBtn { color: white; }

/* ------------------------------------------------------------------------------------------- */
/* ---------------------------------    PROJECTS LIST   -------------------------------------- */
/* ------------------------------------------------------------------------------------------- */
#GT_ProjectsContainer { text-align: center; color: black; }
#GT_Projects a, #GT_ProjectInfo a { color: blue; }
#GT_Projects span, #GT_ProjectInfo span { width: 180px; display: inline-block; vertical-align: middle; }
#GT_Projects span.GT_ProjDate,#GT_ProjectInfo span.GT_ProjDate { width: 250px; }

.GT_Project { background-color: white; display: inline-block; min-width: 60%; cursor: pointer; border-left: 1px rgb(75, 75, 75) solid; border-right: 1px rgb(75, 75, 75) solid; }
.GT_Project:hover { background-color: rgb(22, 174, 160); color: white; }
.GT_ProjColTitles { border-left: 1px rgb(75, 75, 75) solid; border-right: 1px rgb(75, 75, 75) solid; font-weight: 500; background-color: rgb(75, 75, 75); color: white; display: inline-block; min-width: 60%; }

.GT_SelectEvalUser  { max-width: 180px; }

.GT_ProjectInfo { display: inline-block; margin: 10px; vertical-align: top; }
#GT_BtnNewProj { margin-top: 20px; margin-bottom: 20px; }
#GT_FormProj, #GT_FormRename, #GT_FormProjCSV { display: none; }
#GT_UploadCSV0, #GT_UploadCSV1, #GT_UploadCSV2 { width: 200px; height: 30px; color: blue; }
.GT_ProjValidBtn { color: blue; text-decoration: underline; cursor: pointer; }
.GT_ProjValidVersion { color: green; }

.GT_ProjTextShow { cursor: pointer; display: inline-block; }
.GT_ProjTextList { display: none; text-align: left; overflow: auto; }
.GT_New {color: #E7473E; font-size: 12px; display: inline-block; padding-right: 10px;}
#GT_Logout { cursor: pointer; }
/* ------------------------------------------------------------------------------------------- */
/* ------------------------------------    GRAPH TOOL      ----------------------------------- */
/* ------------------------------------------------------------------------------------------- */
#VM_ToolLoading
{
    position: fixed;
    z-index: 95;
    width: 100%;
    height: 100%;
    left: 0px; top: 0px;
    background-color: white;
}
#VM_ToolLoading .GT_GifLoading
{
    width: 400px;
    height: 400px;
    background-image: url(../img/loader.gif);
    vertical-align: middle;
}
#VM_ToolLoading:after { content: ''; display: inline-block; vertical-align: middle; height: 100%; }

/* TOOLBAR */
#GT_Toolbar
{
	height: 38px;
	border-bottom: 1px black solid;
	text-align: center;
    overflow: hidden;
    display: none;
}
.GT_Button
{
	width: 36px;
	height: 36px;
	border: 1px solid black;
	float: left;
	background-size: cover;
    cursor: pointer;
}
.GT_Right { float: right; width: 100px; padding-top: 8px; height: 28px }

.GT_Button:focus, .GT_Button.GT_BtnSelected { border-color: lightgreen; }
#GT_BtnAdd { background-image: url(../img/btnAdd.png); }
#GT_BtnLink { background-image: url(../img/btnLink.png); }
#GT_BtnPrev { background-image: url(../img/btnLeft.png); }
#GT_BtnDown { background-image: url(../img/btnDown.png); }
#GT_BtnDelete { background-image: url(../img/btnDelete.png); }
#GT_BtnDrag { background-image: url(../img/btnDrag.png); }

#GT_Instructions { color: white; padding-top: 5px; line-height: 13px; font-size: 12px; position: absolute; right: 50%; }

/* TITLE BAR */
#GT_TitleBar { position: relative; z-index: 51; text-align: left; height: 30px; }
#GT_GraphTitle { color: white; padding: 5px; float: left; }
#GT_GraphTitle a { color: white; cursor: pointer }
#GT_GraphTitle a:hover { text-decoration: underline; }
.GT_TitleButton { font-size: 12px; height: 19px; line-height: 19px; cursor: pointer; float: right;  text-align: center; width: 100px; color: white; border: 1px white solid; margin: 4px 10px; padding-top: 1px; }
.GT_TitleButton:hover, .GT_TitleButton.GT_BtnSelected { border-color: rgb(22, 174, 160); background-color: rgb(22, 174, 160); }
#GT_MenuTree { padding-bottom: 5px; width: 200px; }

/* GRAPH */
#GT_Container { overflow: hidden; min-width: 600px; width: 100%; z-index: 0;position: relative; overflow: auto; }
#GT_Graph { width: 10000px; height: 10000px;  z-index: 0; position: relative; }
#GT_Selection { background-color: rgba(76, 168, 79, 0.50); z-index: 97; }

#GT_ScrollMask { display: none; cursor: move; z-index: 10; min-width: 600px; position: relative; width: 100%; }
#GT_ScrollArrowContainer { pointer-events: none; min-width: 600px; position: relative; width: 100%;  z-index: 0; display: none; }
.GT_ScrollArrow { position: absolute; line-height: 0px; background-color: rgba(0, 0, 0, 0.1); z-index: 50; }
.GT_ScrollArrow.GT_Scrolling  { background-color: rgba(0, 0, 0, 0.4); }
#GT_ScrollArrowTop { width: 100%; height: 50px; left: 0px; top: 0px; }
#GT_ScrollArrowRight { width: 50px; right: 0px; top: 0px; }
#GT_ScrollArrowDown { width: 100%; height: 50px; left: 0px; bottom: 0px; }
#GT_ScrollArrowLeft { width: 50px; left: 0px; top: 0px; }

/* ENTITIES */
.GT_Entity { box-sizing: border-box; width: 100px; height: 100px; background-size: cover; background-position: 50% 50%; padding: 0px; text-align: center; position: absolute; background-color: white; border: 2px rgb(75, 75, 75) solid; display: inline-block; cursor: pointer; z-index: 3; }
.ui-draggable-disabled { cursor: pointer; }
.GT_EntityName { text-align:left; width: 95%; max-height: 100px; padding: 0px 2% 0px 2%; display: inline-block; vertical-align: middle; background-color: rgba(0, 0, 0, 0.4); color: white; position: relative; z-index: 1; overflow: hidden; text-overflow: ellipsis; }
.GT_Entity iframe { margin-top: 30px; }
.GT_Entity.GT_TemplateEntity { border-style: dotted; z-index: 2; }
.GT_TemplateEntity .GT_EntityName { font-size: 9px; font-style: italic; }
.GT_ObjPedago { position: absolute; top: 5px; right: 5px; z-index: 5; color: #F9B911; line-height: 12px; text-shadow: 1px 1px 1px #000000;}
.GT_SkillButton { font-weight: 700; position: absolute; top: 5px; right: 5px; z-index: 5; color: #F9B911; line-height: 12px; font-size: 10px; text-shadow: 1px 1px 1px #000000;}

/* LINKS */
.GT_Link  { z-index: 1; position: absolute; display: inline-block; text-align: center; text-overflow: clip; white-space: nowrap; }
.GT_LinkContainer { line-height: 0px; text-align: left; }
.GT_LinkElem, .GT_LinkElemCurve { position: relative; display: inline-block; vertical-align: top; }
.GT_LinkElem { border-bottom: 4px solid; border-right: 4px solid; display: inline-block; }
.GT_LinkElemCurve { display: inline-block; }
.GT_LinkCurveContainer { display: inline-block; cursor: col-resize; }
.GT_LinkCurveVContainer { display: inline-block; cursor: row-resize; position: relative; }
.GT_LinkElemTopRight { border-bottom: 4px solid; border-right: 4px solid; border-bottom-right-radius: 30px; }
.GT_LinkElemBottomLeft { border-top: 4px solid; border-left: 4px solid; border-top-left-radius: 30px; }
.GT_LinkElemBottomRight { border-top: 4px solid; border-right: 4px solid; border-top-right-radius: 30px; }
.GT_LinkElemTopLeft { border-bottom: 4px solid; border-left: 4px solid; border-bottom-left-radius: 30px; }

.GT_LinkSimple { border-top: 2px solid white; }
.bigGraph .GT_LinkSimple { border: 0px; color:#999; font-size:2.5em }


.GT_LinkType0:after {
    content: "";
    display: inline-block;
    position: absolute;
    top: -6px;
    right: -5px;
    border-bottom: 5px solid transparent;
    border-left: 5px solid #ffffff;
    border-top: 5px solid transparent;
    border-right: 5px solid transparent;
}
.bigGraph .GT_LinkType0:after { content: "\e90c"; font-family: 'Plafont' !important; position: initial; border:0px; margin-left: 2px; }

/* Link colors */
.GT_LinkType0 .GT_LinkElem, .GT_LinkType0 .GT_LinkElemCurve, .GT_LinkType0 {  }
.GT_Link.GT_Selected .GT_LinkType0 .GT_LinkElem, .GT_Link.GT_Selected .GT_LinkType0 .GT_LinkElemCurve, .GT_LinkType0.GT_Selected {  }
.GT_Link:hover .GT_LinkType0 .GT_LinkElem, .GT_Link:hover .GT_LinkType0 .GT_LinkElemCurve {  }
.GT_LinkType1 .GT_LinkElem, .GT_LinkType1 .GT_LinkElemCurve, .GT_LinkType1 { border-top-style: dotted; }
.GT_Link.GT_Selected .GT_LinkType1 .GT_LinkElem, .GT_Link.GT_Selected .GT_LinkType1 .GT_LinkElemCurve {  }
.GT_Link:hover .GT_LinkType1 .GT_LinkElem, .GT_Link:hover .GT_LinkType1 .GT_LinkElemCurve{  }

.bigGraph .GT_LinkType1:after { content: "\e9fe"; font-family: 'Plafont' !important; position: initial; border:0px; }
/*
.GT_LinkType2 .GT_LinkElem, .GT_LinkType2 .GT_LinkElemCurve { border-color: lightcoral; }
.GT_Link.GT_Selected .GT_LinkType2 .GT_LinkElem, .GT_Link.GT_Selected .GT_LinkType2 .GT_LinkElemCurve{ border-color: red; }
.GT_Link:hover .GT_LinkType2 .GT_LinkElem, .GT_Link:hover .GT_LinkType2 .GT_LinkElemCurve { border-color: red; }
*/

.GT_FloatLeft { float: left; }
.GT_FloatRight { float: right; }

/* SELECTION */
.GT_Entity.GT_Selected { box-shadow: 0px 0px 10px 10px #4ca84f; z-index: 4; }

/* Entity buttons */
#GT_EntButtons { display: none; }
.GT_EntButtons { z-index: 5; height: 16px; padding-top: 4px; text-align: center; }
.parcoursGraph .GT_EntButtons { z-index: 5; height: 0px; padding-top: 0px; text-align: center; }
.GT_EntBtn { right: 0px; width: 16px; height: 16px; display: inline-block; cursor: pointer; position: absolute; background-color: black; }

.GT_EntBtn0 { background-image: url(../img/add.png); background-color: transparent; background-size: cover; }
.GT_EntBtn1 { background-color: #74B33E; cursor: pointer; }
.GT_EntBtn2 { background-color: #F9B911; cursor: pointer; }
.GT_EntBtn3 { background-color: #007985; cursor: pointer; }
.GT_EntBtn4 { background-color: #E7473E; cursor: pointer; }
.GT_EntBtn5 { background-color: #B5BC22; cursor: pointer; }
.GT_EntBtn1500000 { width: 16px; height: 16px; display: inline-block; cursor: pointer; position: absolute; background-image: url(../img/add-group.png); background-size: cover; left: 47%; }
.GT_EntBtn1500001  { width: 16px; height: 16px; display: inline-block; cursor: pointer; position: absolute; top: -20px; left: -20px; background-color: black; }

#GT_EntButtonsLinear { display: none; }
.GT_EntButtonsLinear { background-image: url(../img/add.png); background-size: cover; width: 16px; height: 16px; }
.GT_EntBtnLinear0 { position: absolute; top: -27px; left: 46%; }
.GT_EntBtnLinear1 { position: absolute; top: 21px; right: -40px; }
.parcoursGraph:not(.GT_TemplateEntity) .GT_EntBtnLinear1 { position: absolute; top: -45px; right: -42px; border: 1px solid #ffffff; border-radius: 50%; }
.parcoursGraph .GT_TemplateEntity .GT_EntBtnLinear1 { position: absolute; top: -46px; right: -43px; border: 1px solid #ffffff; border-radius: 50%; }
.GT_EntBtnLinear2 { position: absolute; bottom: -27px; left: 46%; }
.GT_EntBtnLinear3 { position: absolute; top: 21px; left: -40px; }
.GT_LinearIndex { position: absolute; bottom: 5px; left: 2px; font-size: 20px; line-height: 13px; color: white; z-index: 5; }

.GT_EntBtnLinearDecal { top: 68px; }

.context_menu{ display: none; background-color: #727272; color:#fff; padding: 5px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.4); }
.context_menu div{ padding-left:3px; padding-right:3px }
.context_menu div:hover { background-color: #9e9e9e; }
.context_menu button { border: none; display: block; outline: none; margin: 0; background: transparent; color: white; }
.context_menu button:disabled { color: grey; }

.GT_ParentButton, .GT_ChildButton
{
    z-index: 5; position: absolute; width: 16px; height: 16px; display: inline-block;
    background-size: contain;
    cursor: pointer;
    top: 46%;
}
.GT_ParentButton { left: -20px; background-image: url(../img/btnUp.png); }
.GT_ChildButton { right: -20px; background-image: url(../img/btnDown.png); }
.GT_ChildExist { }

/* ENTITY TYPES */
.GT_EntType0 .GT_EntityName, .GT_EntType1 .GT_EntityName, .GT_EntType2 .GT_EntityName, .GT_EntType3 .GT_EntityName, .GT_EntType4 .GT_EntityName, .GT_EntType5 .GT_EntityName, .GT_EntType6 .GT_EntityName, .GT_EntType7 .GT_EntityName, .GT_EntType10000 .GT_EntityName
{
    text-align: center;
    background-color: rgba(0, 0, 0, 0);
}
.GT_EntType0:before, .GT_EntType1:before, .GT_EntType2:before, .GT_EntType3:before, .GT_EntType4:before, .GT_EntType5:before, .GT_EntType6:before, .GT_EntType7:before
{
    display: block;
    position: absolute;
    left: -2px;
    top: -14px;
    height: 15px;
    line-height: 15px;
    background-color: white;
    padding: 1px 2px 1px 0px;
    font-size: 12px;
}
.GT_EntType0:before { content:'Savoir'; }
.GT_EntType1:before { content:'Matière'; }
.GT_EntType2:before { content:'Outil'; }
.GT_EntType3:before { content:'Surface'; }
.GT_EntType4:before { content:'Client'; }

.GT_EntType1004 { }
.GT_EntType1004 .GT_EntityName { padding: 2px 10px 2px 30px; vertical-align: bottom; width: 100%; box-sizing: border-box; height: 30px; overflow: hidden; text-overflow: ellipsis; }
.GT_EntType1005 { }
.GT_EntType1005 .GT_EntityName { padding: 2px 10px 2px 30px; vertical-align: bottom; width: 100%; box-sizing: border-box; height: 30px; overflow: hidden; text-overflow: ellipsis; }
.GT_EntType1006 .GT_EntityName { padding: 2px 10px 2px 30px; vertical-align: bottom; width: 100%; box-sizing: border-box; height: 30px; overflow: hidden; text-overflow: ellipsis; }
.GT_EntType1007 .GT_EntityName { padding: 2px 10px 2px 30px; vertical-align: bottom; width: 100%; box-sizing: border-box; height: 30px; overflow: hidden; text-overflow: ellipsis; }
.GT_EntType1008 .GT_EntityName { padding: 2px 10px 2px 30px; vertical-align: bottom; width: 100%; box-sizing: border-box; height: 30px; overflow: hidden; text-overflow: ellipsis; }
.GT_EntType10000 { border-radius: 80px; }
.GT_EntType10000 .GT_EntityName { text-align: center;  }

/* Modules */
.GT_EntType30000 { height: 50px; }
.GT_EntType30000 .GT_EntityName { padding: 2px; vertical-align: bottom; width: 156px; box-sizing: border-box; height: 46px; overflow: hidden; text-overflow: ellipsis; }

/* GRAPHTEXT */
#GT_GraphText { font-size: 12px; display: none; position: absolute; left: 20px; top: 80px; min-width: 100px; background-color: rgb(212, 212, 212); border: 1px solid; z-index: 50; }
#GT_GraphTextContainer { text-align: left; min-height: 100px; padding-bottom: 5px; }
#GT_GraphTextTitle { text-align: center; padding: 5px; font-size: 16px; margin-bottom: 0px; background-color: rgb(188, 188, 188); }
#GT_GraphTextHide { font-size: 9px; cursor: pointer; }
#GT_GraphTextHide:hover { text-decoration: underline; }
#GT_GraphTextElems { max-height: 200px; overflow-y: auto; overflow-x: hidden; padding-right:10px; }
.GT_GraphTextList { padding-left: 5px; margin: 0px; }
.GT_GraphTextList li { list-style-type: none; white-space: nowrap}
.GT_GraphTextList li span { display: inline-block; vertical-align: top; }
.GT_GraphTextName { overflow: hidden; cursor: pointer; max-width: 120px; text-overflow: ellipsis; white-space: nowrap; }
.GT_GraphTextName:hover { text-decoration: underline; }
.GT_GraphTextSelected { background-color: #4ca84f; }
.GT_GraphTextList li ul { border-left: 2px rgb(75, 75, 75) solid; }
.GT_GraphTextChild { cursor: pointer; margin-left: 8px; }
.GT_GraphTextSubTree {  }

/* LEGEND */
#GT_Legend { display: none; text-align: center; position: absolute; left: 20px; bottom: 50px; min-width: 150px; background-color: rgb(212, 212, 212); border: 1px solid; z-index: 50; }
#GT_LegContainer { min-height: 100px; padding-bottom: 5px; }
#GT_LegTitle { padding: 5px; font-size: 16px; margin-bottom: 10px; background-color: rgb(188, 188, 188); }
#GT_AddCategory, #GT_ModifyCategory { cursor: pointer; display: block; }
#GT_AddCategory:hover, #GT_ModifyCategory:hover { text-decoration: underline; }
#GT_ModifyCategory { margin-bottom: 15px; }
#GT_LegendHide { font-size: 9px; cursor: pointer; }
#GT_LegendHide:hover { text-decoration: underline; }

/* CATEGORIES */
#GT_Categories { line-height: 20px; }
.GT_Category { text-align: left; cursor: pointer; }
.GT_Category .GT_SquaredColor, .GT_Category input.GT_ColorPicker {  vertical-align: middle; width: 16px; height: 16px; float:left; margin-left: 5px; border: 0px; outline: 0px; padding: 0px; cursor: pointer; }
.GT_Category span, .GT_Category input.GT_CatName { font-size: 12px; vertical-align: top; margin-left: 5px; margin-right: 5px; padding: 0px; border: 0px; outline: 0px; height: 16px; }
.GT_Category span { position:relative; top: -2px;}

/* Property Box */
.GT_PropTypeData { font-size: 12px; }
#GT_PropName, #GT_PropDes, #GT_PropType { margin-top: 5px; }
#GT_PropButtons { margin-top: 10px; clear: both; }
.GT_PropButtons { clear: both; }
#GT_LoadingVideo { text-align: center; }
#GT_PropVideoDuration, #GT_PropVideoEmbed { display: none; }
#GT_PropBegin, #GT_TransBegin { float: left; margin-top: 20px; clear: both; width: 46%; margin-left: 2%; }
#GT_PropEnd, #GT_TransEnd { float: right; margin-top: 20px; width: 46%; margin-right: 2%; }
#GT_PropBegin input, #GT_PropEnd input, #GT_TransBegin input, #GT_TransEnd input { width: 40px; margin: 10px; }
#GT_PropDialog input[type=text], #GT_PropDialog textarea{ width: 90%; display: block; margin: 2%; resize: none; }
#GT_PropDialog input, #GT_PropDialog textarea, #GT_PropDialog button, #GT_PropDialog select { font-family: "Roboto"; }

#GT_PropVideoPImg { width: 100px; height: 60px; background-size: contain; margin: auto; background-color: grey; }
#GT_PropVideoPChoose { cursor: pointer; }
#GT_PropVideoPChoose:hover { text-decoration: underline; }
#GT_PropVideoPId, #GT_PropVideoPDuration { display: none; }
#GT_PropVideoPList { background-color: rgb(102, 102, 102); overflow: auto; margin-top: 5px; }
#GT_PropName2 { font-size: 15px; }
#GT_PropIFrame { height: 100px; width: 150px; position: relative; margin: auto; }

#GT_PropImageContainer { overflow: auto; clear: both; }
#GT_PropImageUploaded, #GT_PropImgUploaded { width: 60px; height: 60px; margin:auto; background-color: grey; background-size: contain; background-repeat: no-repeat; background-position: 50% 50%; }
#GT_PropUploadBtn { font-size: 11px; }
#UploadContainer {}
#UploadProgress { margin-top: 5px; margin-bottom: 5px; background-color: grey; height: 15px; }
.VM_UploadProgress { background-image: url(../img/orange.jpg); background-repeat: no-repeat repeat; margin-top: 5px; margin-bottom: 5px; height: 20px; }

#GT_ProjPlayer { display: none; width: 50%; position: fixed; top: 25%; left: 25%; z-index: 91; background-color: #000000; }
#GT_ProjPlayerContainer { position: relative ;}

.GT_VideoMini { position: relative; top: -97px; height: 0px; overflow: visible; }
.GT_VideoMiniImg { width: 100%; height: 97px; background-size: cover; background-position: 50% 50%; position:relative; background-repeat: no-repeat; }
.GT_VideoMiniDuration { font-size: 11px; line-height: 12px; padding-left: 3px; padding-right: 3px; color: white; position: absolute; right: 3px; bottom: 3px; background-color: rgb(45, 45, 45); }

#GT_ImporterArrow { display: none; cursor: pointer; background: url(../img/fleche_gauche_LC.png); background-size:cover; width: 40px; height: 40px; position: absolute; right: 30%; transform: rotate(180deg); top: 50px; z-index: 50; }
#GT_ImporterArrow:hover {background: url(../img/fleche_gauche_LC_bleu.png);background-size:cover; }
#GT_Importer { color: white; box-sizing: border-box; min-width: 230px; display: none; z-index: 50; background-color: rgb(102,102,102); position: absolute; right: 0px; top: 0px; width: 20%; text-align: center; border-right: 1px rgb(102, 102, 102) solid; }
.GT_ImporterTitle { background: black; color: white; padding: 2px; }
#GT_ImporterTabBtns { background: black; }
#GT_ImporterTabBtns button { color: white; background: rgb(102,102,102); white-space: nowrap; height: 32px; text-overflow: ellipsis; overflow: hidden; cursor: pointer; line-height: 25px; box-sizing: border-box; width: 32.2%; border-radius: 0px; margin: 2px 0px; box-shadow: none; border: none; outline: none; }
#GT_ImporterTabBtns button.GT_Selected { color: white; background-color: rgb(0, 173, 160); }
.GT_ImporterTab { display: none; /*overflow: auto;*/ }
.GT_ImportVideo, .VM_MediaVideo, .GT_ImportPVideo, .VM_MediaSound, .VM_MediaImg { float: left; background-color: grey; cursor: pointer; border: 1px transparent solid; margin: 1.5% 2% 10.5% 2%; z-index: 5;  }
.GT_ImportVideo:hover, .GT_ImportPVideo:hover { opacity: 1; border-color: lightgreen; }
.GT_ImportImg { float: left; width: 100px; height: 60px; background-size: cover; background-position: 50% 50%; position:relative; background-repeat: no-repeat; }
.GT_ImportPVideo .GT_ImportImg{ width: 85px; height: 50px;}

.GT_ImportDuration { font-size: 10px; line-height: 14px; color: rgb(214, 214, 214); position: absolute; right: 0px; bottom: -19px; }
.GT_ImportTitle { color:white; line-height: 16px; white-space: nowrap; font-size: 12px; text-align: left; position: absolute; bottom: -19px; left: 0px; width: 70px; height: 16px; overflow: hidden; text-overflow: ellipsis; }
.GT_ImportHDuration, .GT_ImportHDescription, .GT_ImportHTags { display: none; }

#GT_ImportTemplate { cursor: pointer; text-decoration: underline; }
.GT_ImportJob { position: relative; }
.GT_ImportJobArrow { cursor: pointer; background: url(../img/btnDown.png); width: 18px; height: 18px; position: absolute; right: 5px; top: 1px; }
.GT_ImportJobArrow.GT_ArrowUp { background: url(../img/btnUp.png); }
.GT_ImportJobContainer { height: 0px; overflow: auto; }
.GT_ImportNewElem { display: inline-block; vertical-align: top; overflow: hidden; margin: 5px; width: 50px; height: 50px; line-height: 46px; background-color: #AAAAAA; background-size: cover; background-position: 50% 50%; cursor: pointer; }
.GT_ImportNewElem .GT_ImportName { display: inline-block; vertical-align: middle; width: 100%; font-size: 10px; line-height: 11px; text-overflow: ellipsis; overflow: hidden; color: white; position: relative; z-index: 1; }
.GT_ImportNewGroup { border-radius: 25px; }

.GT_ImportMyEnts { min-height: 30px; }

/* ------------------------------------------------------------------------------------------- */
/* ------------------------------------    VIDEO MAKER      ---------------------------------- */
/* ------------------------------------------------------------------------------------------- */
#VM_Toolbar { overflow: auto; display: none; }
#VM_Container { width: 100%; overflow: auto; font-family: "Roboto"; overflow: hidden; min-width: 600px; min-height: 300px; }
#VM_MainZone { width: 65%; float: right; text-align: center; }
#VM_PlayerZone {position: relative; display: inline-block; }
#VM_MediaZone { width: 35%; float: left; background-color: white; border-right: 2px rgb(75, 75, 75) solid; box-sizing: border-box; }
#VM_TimeLine { width: 60%; float: left; box-sizing: border-box; background-color: rgb(230, 230, 230); overflow: hidden; text-align: left; }
#VM_TimeLineTools { line-height: 0px; border-top: 2px rgb(75, 75, 75) solid; text-align: center; float: left; width: 44px; background-color: rgb(75, 75, 75); }

#VM_MainVideoContainer, #VM_MiniVideoContainer { position: relative; display: inline-block; background-color: black; width: 80%; overflow: hidden; position: relative }
#LC_EmbedPlayer { position: relative; }

.VM_MediaTab { display: none; overflow: auto; padding-top: 20px; }

#VM_MediaButtons { white-space: nowrap; overflow: hidden; }
#VM_MediaButtons > div { display: inline-block; float: left; cursor: pointer; background-color: rgb(75, 75, 75); color: white; line-height: 25px; box-sizing: border-box; width: 33.33%; border-radius: 0px; margin: 0px; box-shadow: none; border: none; outline: none; }
#VM_MediaButtons > div.VM_BtnSelected { color: white; background-color: rgb(0, 173, 160); }

.VM_MediaElem {}

#VM_MediaDrop { display: block; overflow: auto; }
#VM_MediaLibrary {  }
#VM_MediaImport {}
#VM_ImportLoading { display: none; }
#VM_ImportValid { display: none; }

#VM_MediaUpload {}
#VM_BtnUploadContainer {  }
#VM_MediaUploadContainer { margin: auto; width: 80%; }

.VM_DropVideo, .VM_MediaVideo { float: left; background-color: grey; cursor: pointer; border: 1px transparent solid; margin: 1.5% 2% 7.5% 2%; z-index: 5;  }
.VM_DropVideo:hover, .VM_MediaVideo:hover { opacity: 1; border-color: lightgreen; }
.VM_DropImg { float: left; width: 120px; height: 70px; background-size: cover; background-position: 50% 50%; position:relative; background-repeat: no-repeat; }
.VM_DropDuration { font-size: 10px; font-weight: 500; line-height: 14px; color: rgb(114, 114, 114); position: absolute; right: 0px; bottom: -19px; }
.VM_DropTitle { line-height: 16px; white-space: nowrap; font-size: 12px; font-weight: 500; color: rgb(84, 84, 84); text-align: left; position: absolute; bottom: -19px; left: 0px; width: 90px; height: 16px; overflow: hidden; text-overflow: ellipsis; }

.VM_DeleteResource, .VM_UpdateResource { position: absolute; top: 0px; right: 0px; width: 18px; height: 18px; margin: 5px; cursor: pointer; background-image: url(../img/quitter_LC.png); background-size: cover; z-index: 6; }
.VM_UpdateResource { background-image: url(../img/loader.gif); }
.VM_DeleteResource:hover { background-image: url(../img/quitter_LC_bleu.png); }
.VM_MediaResource .VM_DeleteResource { /*transform: rotate(45deg);*/ background-color: rgb(75, 75, 75); }
.VM_MedDuration { display: none; }

.VM_TLButton { display: inline-block; width: 40px; height: 40px; background-size: cover; border: 1px white solid; margin-right: 2px; margin-bottom: 2px; }
.VM_TLButton.VM_BtnSelected { border-color: green; }
#VM_BtnCut { cursor: pointer; background-image: url(../img/cut_LC.png); background-size: cover; }
#VM_BtnCut.VM_BtnSelected { border-color: white; background-image: url(../img/cut_LC_bleu.png); }
#VM_BtnSnap { cursor: pointer; background-image: url(../img/aimant_LC.png); }
#VM_BtnSnap.VM_BtnSelected { border-color: white; background-image: url(../img/aimant_LC_bleu.png); }

#VM_TimeLineLeft { float: left; width: 100px; border-right: 2px rgb(75, 75, 75) solid; box-sizing: border-box; }
#VM_TimeLineTitlesContainer { overflow: hidden; }
#VM_TimeLineRight { float: right; position: relative; overflow-x: scroll; overflow-y: hidden; }
#VM_TimeLineYContainer { overflow-y: scroll; overflow-x: hidden; }

.VM_TimeLineTrackContainer, .VM_TimeLineTrackTContainer { overflow: hidden; }
.VM_TimeLineTitle { padding-left: 2px; height: 25px; font-size: 12px;border-bottom: 1px rgb(180, 180, 180) solid; text-align: left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 14px; }
.VM_TimeLineTitle.VM_TimeLineSelected { background-color: lightblue; }
.VM_TimeLineTitle a { font-size: 11px; cursor: pointer; position: relative; top: -3px; }

/*#VM_VideoMerge { opacity: 0; border-top: 1px rgb(180, 180, 180) solid; box-sizing: border-box; height: 26px; }*/
.VM_TrackContainer { position: relative; height: 25px; white-space: nowrap; overflow: hidden; border-bottom: 1px rgb(180, 180, 180) solid; text-align: left;  min-width: 200px; }

.VM_TimeLineBandContainer { position: absolute; height: 24px; white-space: nowrap; }
.VM_TimeLineBandLeft { position: relative; background-color: rgb(109, 155, 140); height: 25px; width: 10px; display: inline-block; cursor: col-resize}
.VM_TimeLineBand { line-height: 25px; vertical-align: top; position: relative; background-color: rgb(149, 195, 190); height: 25px; display: inline-block; cursor: move; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.VM_TimeLineBand img { display: inline-block; vertical-align: middle; width: 30px; height: 20px; margin: 0px 2px 2px 2px; }
.VM_TimeLineBand span { display: inline-block; vertical-align: middle; }
.VM_TimeLineBandRight { position: relative; background-color: rgb(109, 155, 140); height: 25px; width: 10px; display: inline-block; cursor: col-resize}
.VM_TimeDragging { z-index: 2; }
.VM_TimeSelected { z-index: 2; }
.VM_TimeSelected .VM_TimeLineBand { color: white; background-color: rgb(0, 174, 162); }
.VM_TimeSelected .VM_TimeLineBandLeft, .VM_TimeSelected .VM_TimeLineBandRight { background-color: rgb(0, 124, 122); }

.VM_TimeLineBandMini .VM_TimeLineBandLeft, .VM_TimeLineBandMini .VM_TimeLineBandRight { width: 0px;}

.VM_Reduce { height: 14px; margin-left: 5px; vertical-align: middle; cursor: pointer; }
.VM_Reduce.VM_Up { transform: rotate(180deg); }
#VM_ZoomContainer { border-top: 2px rgb(75, 75, 75) solid; }

#VM_RenderTypeSelect { margin-bottom: 10px; }
#VM_RenderDefault { font-size: 10px; margin: 0px; cursor: pointer; clear: both; }
.VM_RenderType { display: none; text-align: left; }
.VM_RenderType span { display: inline-block; vertical-align: middle; width: 120px; overflow: hidden;}
#GT_PropDialog .VM_RenderType input[type=range] {  width: 110px; display: inline-block; vertical-align: middle; }
#GT_PropDialog .VM_RenderType input[type=text] { display: inline-block; vertical-align: middle; width: 26px; }
#VM_ShapeDrawer { display: none; cursor: pointer; position: fixed; width: 100%; z-index: 89; height: 100%; left: 0px; top: 0px; }
#VM_RenderShapeLink1, #VM_RenderShapeLink2, #VM_TextShapeLink { color: red; display: inline-block; margin:5px; display: none; cursor: pointer; text-decoration: underline; font-size: 10px; }
#VM_RenderShapeLink1.VM_ShapeOK, #VM_RenderShapeLink2.VM_ShapeOK, #VM_TextShapeLink.VM_ShapeOK { color: green; }
#VM_ShapeDrawerTop { height: 30px; background-color: rgba(0,0,0,0.5); }
#VM_ShapeDrawerZone { float: right; width: 65%; }
#VM_ShapeDrawerLeft { float: left; width: 35%; background-color: rgba(0,0,0,0.5); }
#VM_ShapeDrawerDown { clear: both; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5);}
#VM_ShapeCanvas { display:none; width: 100%; height: 100%; position: absolute; z-index: 89; }

.Hilighted { background-color: lightblue; }
#VM_TimeRulerContainer { white-space: nowrap; height: 18px; }
#VM_TimeRuler { overflow: hidden; height: 18px; margin-bottom: 9px; background-color: rgb(75, 75, 75); position: relative; cursor: text;}
.VM_TimeRulerBar { height: 8px; color: white; font-size: 8px; position: absolute; white-space: nowrap; border-left: 1px white solid; box-sizing: border-box; }
.VM_TimeRulerBar > div { position: relative; left: -11px; top: 8px; width: 21px; text-align: center; }
.VM_TimeRulerMiniBar { position: absolute;border-left: 1px white solid; height: 2px; }
.VM_TimerRulerInterBar { height: 5px; }
#VM_TimeZoom { width: 50%; margin-top: 1px; margin-left: 2px; margin-right: 2px; }
#VM_TimePos { vertical-align: top; width: 30%; margin-top: 1px; }
#VM_TimeCursor { width: 1px; min-height: 29px; background-color: red; position: absolute; top: 0px; left: 0px; z-index: 5; }

#VM_BtnPlay { cursor: pointer; background-color: rgb(75, 75, 75); width: 40px; height: 40px; background-size:40px 40px; border: none; outline: none; position: absolute; padding: 0px; bottom: 5px; left: 5px; background-image: url(../img/play_LC.png); }
#VM_BtnPlay:hover { background-image: url(../img/play_LC_bleu.png); }
#VM_BtnPlay.VM_Pause { background-image: url(../img/pause_LC.png); }
#VM_BtnPlay.VM_Pause:hover { background-image: url(../img/pause_LC_bleu.png); }

#VM_PlayerLoading { /*display: none;*/ position: absolute; z-index: 2; bottom: 10px; width: 100%; overflow: auto; color: white; font-size: 12px; }

.VM_AnnoText { position: absolute; font-size: 18px; color: white; text-shadow: 1px 1px 10px black; }
.VM_Chapter {top: 5%; width: 50%; left: 25%; text-align: center; }
.VM_Chapter:before { content: '['; } .VM_Chapter:after { content: ']'; }
.VM_Tag { top: 5%; right: 5% }
.VM_Tag:before { content: '['; } .VM_Tag:after { content: ']'; }
.VM_Subtitle { top: 85%; width: 50%; left: 25%; text-align: center; }
.VM_Inter { top: 80%; width: 90%; left: 5%;  text-align: left; }
.VM_InterLeft { float: left; }
.VM_InterRight { float: right; }
.VM_Credit {top: 25%; width: 50%; left: 25%}
.VM_FloatingText {text-align:left; top: 0px; width: 100%; height:100%; left: 0px; } /* this is a default value */
.VM_FloatingImg {top: 0px; width: 100%; height:100%; left: 0px;  /* this is a default value */
    background-size: contain; background-position: center center; background-repeat: no-repeat;}

/* Export box */
#VM_FormExport, #VM_FormConfig { font-size: 14px; text-align: center; margin: 10px; }
#VM_ExportCredits { max-height: 230px; overflow: auto; }
#VM_ExportInter { display: none; }
.VM_ExportInter { margin-bottom: 5px; }
a.VM_DeleteCred { cursor: pointer; font-size: 10px; }
#VM_FormExport h3 { margin-bottom: 10px; }
#VM_FormExport h3#VM_TagTitle { margin-bottom: 0px; }

#VM_FormConfig textarea, #VM_FormExport textarea, #VM_FormJob textarea{ resize: none; font-size: 14px; width: 80%; }
#VM_FormConfig textarea { margin-right: 20px; }
#VM_FormJob textarea { margin-bottom: 10px; }

/* Form skills */
#GT_FormSkills { position: absolute; z-index: 40; border: 2px solid; background-color: white; max-width: 500px; }
#GT_FormSkillsNew { display: none; }
#GT_FormSkills h3 { margin: 0px 0px; padding: 5px 0px; background-color: rgb(102, 102, 102); color: white; max-width: 100%; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

#GT_FormSkillsContent { padding: 0px 20px; }
#GT_FormSkills h4 { margin: 5px; float: left; }
#GT_FormSkills .GT_FirstCol { width: 200px; text-overflow: ellipsis; overflow: hidden; display: inline-block; }
#GT_FormSkills .GT_Note { width: 60px; display: inline-block; overflow: hidden; margin: 0px; }
#GT_FormSkillsInputs label { margin-top: 5px; vertical-align: middle; display: inline-block; width: 60px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#GT_FormSkillsInputs input { margin-top: 5px; vertical-align: middle; display: inline-block; }
.GT_Competences { padding-bottom: 5px; clear: both;}
.GT_Competences > div { clear: both; }
#GT_FormSkillsAdd { clear: both; }

/* Config box */
#VM_FormConfig { width: 400px; margin: 10px; padding: 0px; overflow: auto; }
#VM_FormConfig h4 { margin-bottom: 5px; }
#VM_FormConfig input[type=text] { width: 95%; }
#VM_FormConfig h3 { width: 85%; margin: 10px; }
#VM_FormConfig input[name=job_name] { width: 80%; margin-right: 20px; }
#VM_FormConfig .VM_ConfEnt { display: inline-block; vertical-align: top; max-width: 90%; margin: 0px 2px 0px 2px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
#VM_FormConfig .VM_DeleteEnt { cursor: pointer; display: inline-block; font-size: 8px; line-height: 8px; vertical-align: top; margin-right: 5px }
#VM_Required { float: left; width: 45%; margin-right: 10px; margin-bottom: 10px; max-height: 400px; overflow-y: auto; }
#VM_Acquired { float: left; width: 45%; margin-bottom: 10px; max-height: 400px; overflow: auto; }

textarea[name=objectives] { height: 36px; }

/* TEMP */
#ToolListContainer { clear: both; display:block; text-align: left; margin-left: 3%; padding-top:20px; color: black; }
#Docu { }

.GT_FormTree { display: none; margin-top: 10px; }
.GT_FormTree [name=type_name] { display: none }
.GT_FormTree [type=text] { width: 100px; }

#GT_ThemeZoneContainer { background-color: black; }
#GT_ThemeZone {overflow: visible;}
.GT_Theme { position: relative; background-color: #0097AA; overflow: visible; color: #FFFFFF; box-shadow: 10px 0 5px -8px rgba(0, 0, 0, 0.3); height: 300px;}
.GT_ThemeBar { position: absolute; width: 10000px; left: 380px; bottom: 0; height: 8px; background-color: rgb(75, 75, 75); z-index: 81; }
#GT_AddTheme {  }
.GT_ThemeBtn { cursor: pointer; }