* {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

/* All unordered lists are hereof supposed to be navigational elements (ie. tabs)
-----------------------------------------------------------------------------------*/
li { display: inline; }
li a { display: block; float: left; outline: none; text-align: center; text-decoration: none; }
	

/* Icons
----------------------------------------*/
[class*="icon-"] {
    display: inline-block;
    /*padding-left: 26px;*/
    background: url('img/sprite.png') 0 0 no-repeat;
    width: 16px;
    height: 16px;
    line-height: 1;
}
.icon-accept { background-position: -346px -478px; }
.icon-hammer { background-position: -346px -1150px; }
.icon-list { background-position: -30px -1430px; }
.icon-layout-grid { background-position: -30px -1374px; }

[class*="button-library"] [class*="icon-"] {
    position: relative;
    top: 4px;
    margin-right: 5px;
}


/* Global settings (form elements, typography etc etc)
-------------------------------------------------------*/
html, body { height: 100%; overflow: hidden; }

body
{
    /* 12px / 18px */
	font: 75%/1.5 Arial, "Helvetica Neue", Helvetica, sans-serif;
	background: #fff;
}

p 
{ 
    margin-bottom: 1em; 
}

img 
{ 
    border: 0; 
    vertical-align: middle;
    -ms-interpolation-mode: bicubic; 
}

a 
{ 
    color: #0085cf; 
}

.noie button,
.button 
{ 
    padding: 0.6em 1.4em 0.7em;
    border: 0;

    background: #000000;
    color: #ffffff;
    /*color: #fff;
    background: #888;
    background-image: -moz-linear-gradient(bottom, #777 0%, #aaa 100%);
    background-image: -webkit-linear-gradient(bottom, #777 0%, #aaa 100%);
    background-image: -ms-linear-gradient(bottom, #777 0%, #aaa 100%);
    background-image: -o-linear-gradient(bottom, #777 0%, #aaa 100%);
    background-image: linear-gradient(bottom, #777 0%, #aaa 100%);
    box-shadow: inset 0 -1px 1px rgba(0,0,0,0.55);*/
    
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
.noie button:hover,
.button:hover,
.noie button:active,
.button:active,
.noie button.selected,
.button.selected
{
    background: #595959;
}
.noie button:focus,
.button:focus
{
    -webkit-box-shadow: 0 0 3px #5fceea; 
    -moz-box-shadow: 0 0 3px #5fceea; 
    box-shadow: 0 0 3px #5fceea;
}

a.button
{
    display: inline-block;
    padding: 0.3em 1em 0.4em;
    margin: 0 1em 0 0;
    text-decoration: none;
    color: #ffffff;
}


[class*="button-library"] {
    display: block;
    padding: 0.4em 1em 0.5em;
    border-radius: 0.3333em;
    border: 0;

    color: #000000;

    /*color: #404040;
    background: #d3d3d3;
    background-image: -moz-linear-gradient(bottom, #b1b1b1 0%, #e5e5e5 100%);
    background-image: -webkit-linear-gradient(bottom, #b1b1b1 0%, #e5e5e5 100%);
    background-image: -ms-linear-gradient(bottom, #b1b1b1 0%, #e5e5e5 100%);
    background-image: -o-linear-gradient(bottom, #b1b1b1 0%, #e5e5e5 100%);
    background-image: linear-gradient(bottom, #b1b1b1 0%, #e5e5e5 100%);*/
    /*box-shadow: inset 0 -1px 1px rgba(0,0,0,0.55);*/

    text-decoration: none;
    
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
[class*="button-library"]:hover{
    color: #595959 !important;
}
.btn-group {
      position: relative;
      display: inline-block;
      *display: inline;
      *zoom: 1;
      white-space: nowrap;
      *margin-left: .3em;
}
.btn-group:first-child {
    *margin-left: 0;
}
.btn-group > .button {
    position: relative;
    border-radius: 0;
    margin: 0;
}
.btn-group > .button + .button {
    margin-left: -.3em;
    border-left: 1px solid #4D4D4D;
}
.btn-group > .button:first-child {
    margin-left: 0;
    border-radius: 0.3333em 0 0 0.3333em;
}
.btn-group > .button:last-child {
    border-radius: 0 0.3333em 0.3333em 0;
}


.notice {
    padding: 1.5em 1.5em 0.5em;
    border: 1px solid #cccccc;
    color: #000000;
}
.validation-summary-errors
{
    background: #ffbdb1;
    padding: 0.5em 1em;
    margin-bottom: 1em;
    font-size: 14px;
    border-radius: 0.25em;
}
    .validation-summary-errors li {
        display: block;
        margin-bottom: 0.75em;
    }


/* The main frame
--------------------------------------------------------------*/

#outer-wrapper
{
	position: relative;
	height: 100%;
	width: 100%;
}

#header
{
	position: relative;
	background: #ffffff;
	height: 6em;
}
    #system-controls { position: relative; height: 100%; }

#logo
{
	position: absolute;
	top: 16px;
	left: 15px;
	width: 129px;
	height: 100%;
	text-indent: -9999px;
	background: url('img/lp-logo.png') 0 50% no-repeat;
}


/* Layout layering (just in case)
----------------------------------------*/
#loginDiv
{ z-index: 9000; }

.login-controls, .user-controls
{ z-index: 2000; }

.functions-list, #header
{ z-index: 1000;}

#ViewpointArea, #categories, #functions
{ z-index: 100; }

#functions
{ z-index: 75; }

#planner-area, #planner-frame, #library, #library-contents
{ z-index: 50; }


/* System controls
----------------------------------------*/
#system-states
{
	position: absolute;
	bottom: 0.3em;
	right: 2em;
	color: #000000;
}
    
	#system-states a
	{
		height: 3em;
	    line-height: 3;
		margin-left: 0.5em;
		padding: 0 1em;
		text-transform: uppercase;
		color: #000000;

        border-radius: 4px 4px 0 0;
	}

	#system-states li a:hover,
	#system-states li.current a
	{

	}

    #system-states li a:hover span,
	#system-states li.current a span{
        border-bottom: 1px solid #000000;
        padding-bottom: 5px !important;
    }

/* Library category frame and buttons
----------------------------------------*/
#categories
{
    position: relative;
	height: 3em;
	margin: 0;
	padding-left: 1em;
    background: #ffffff;
    border-bottom: 1px solid #cccccc;
}

	.categories
	{
		height: 100%;
		padding-right: 2em;
		float: right;
	}
        
        .categories li {  }
		.categories li a
		{
		    display: block;
			height: 100%;
			line-height: 3;
			padding: 0 1em;
			color: #1e1e1e;
			text-align: left;
		}

		.categories li a:hover{
            background: #cccccc;
		}
		.categories li.current a,
		.categories li a.current
		{
			font-weight: bold;
		}	


/* Planner-area
----------------------------------------*/
#planner-area
{
	position: absolute;
	top: 9em;
	bottom: 7.5em;
	left: 0;
	right: 0;
	border-collapse: collapse;
	clear: both;
}
	
#frame { position: relative; display: block; height: 100%; }

#planner-frame
{
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 24em;
}
	
	#ViewpointArea,
	#FlashArea,
	#scene-image-replacement-area
	{
		top: 0;
		left: 0;
		height: 100%;
		width: 100%;
		background: #fff;
		visibility: visible;
		position: absolute;
	}
	
	#FlashArea
	{
		visibility: hidden;
		position: absolute;
		top: 0;
		left: -9999em;
	}
	
	#scene-image-replacement-area { display: none; }

    #canvas { width: 100%; height: 100%; }


/* Library layer
----------------------------------------*/
#library {
	position: absolute;
	height: 100%;
	top: 0;
	right: 0;
	overflow: hidden; /* never show parent scrollbar */
	width: 24em;
    color: #000000;
    background: #ffffff;
	   -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;

    border-left: 1px solid #cccccc;
}

    .library-content {
        padding: 0 2em;
    }

	.library-category-header {
		display: block;
        clear: both;
		padding: 0 2em;
        margin-bottom: 1.5em;

        color: #000000;
        
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
	}
    .library-category-header a {
        display: block;
        padding: 0.75em 0;
        background-position: 100% 50%;
        background-repeat: no-repeat;

        text-decoration: none;
        color: #000000;
    }
    .library-category-header-open a {
        background-image: url('img/icon-dark-minus.png');
    }
    .LampColour .library-category-header-open a,
    .LampSizesSingleColour .library-category-header-open a {
        background-image: none;
    }
	.library-category-header-closed a {
        background-image:url('img/icon-dark-plus.png') ;
	}
    .library-category-content {
        padding: 0 2em;
    }


    #library-controls
	{
        display: none;
        padding: 1.5em 2em;
        
        background: #ffffff;
	}

	#library-options
	{
        position: relative;
		overflow-x: hidden;
		margin: 0;
		padding: 1.5em 2em;

        background: #ffffff;
	}
	
	#library-options h1, #library-options h2, #library-options h3, #library-options h4 { margin-bottom: 1.5em; }
	
	.small-icons li
    {
        width: 100px;
        height: 20px;
        line-height: 20px;
        margin: 0px 8px 10px 0px;
        display: list-item;
    }
    .small-icons li img { width: 20px; height: 20px; margin-right: 10px; float: left; }
    .small-icons li .icon-image
	{
	    width: 20px;
	    height: 20px;
	    text-indent: -9999em;
	    margin-right: 10px;
	    float: left;
	}
	
	#library-contents
	{
		position: relative;
		height: 100%;
		width: auto;
		
		padding: 1.5em 0 0;
		overflow: auto;
	}


/* Library icons
----------------------------------------*/
ul.lib-icons { width: 100%; margin: 0; padding: 0; }

.lib-icons > li
{
	position: relative;
	width: 8em;
	margin: 0 0 1em 0;
	display: inline-block;
	vertical-align: top;
	height: auto !important;
	min-height: 110px;
	height: 110px;
}
    .lib-icons > li:nth-child(2n+1)
    {
        margin-right: 1.5em;
    }
    .lib-icons > li a,
    .lib-icons > li img
    {
        width: 100%;
    }
    .lib-icons > li img
    {
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .lib-icons > li a { 
        color: #000000;
        overflow: hidden; 
        overflow-wrap: break-word; 
        word-wrap: break-word; 
        word-break: break-all; /* Forced wrapping for otherwise non-wrapping string (using "_" instead of spaces for example */
    }

.lib-icons .wide
{
	position: relative;
	width: 18em;
	float: left;
	margin-right: 0;
	padding: 0;
}

    .lib-icons .wide a,
    .lib-icons .wide img 
    {
        width: 100%;
    }

.lib-item-actions {
    position:absolute; 
    top:0; 
    left:0; 
    width:100%;
}
.lib-item-actions a {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top:0;
    left:0;
}
.lib-item-actions li {
    width: 2em; 
    height: 2em; 
    position: absolute;
    display: block;
    margin: 0;
}
.lib-item-actions__remove {
    right: -1em; 
    top: -1em;
}
    .lib-item-actions__remove a {
        background: url('img/icon-ios-remove.png') 50% 50% no-repeat;
    }
.lib-item-actions__visibility {
    left: 0.25em; 
    top: 0;

}

/* Special library icons & buttons
----------------------------------------*/
#button-newconfiguration {
    text-align: left;
    color: #000000;
}
.lib-icons li.newconfiguration {
    height: auto;
    min-height: initial;
    margin-bottom: 1.5em;
}
.lib-icons .ar-image-placeholder {
    height: 8em !important;
    min-height: initial;
    background: #f3f3f3 url('img/icon-dark-upload.png') 50% 50% no-repeat;
    border-radius: 6px;
}

.disabled .library-category-header a {
    cursor: default;
    color: #808080;
}

.lamp-category .library-category-content {
    padding: 0 2em;
}

.LampParent > .library-category-header {
    padding: 0;
    clear: none;
    width: 100%;
}
.lamp-category.LampParent .library-category-header {
    padding: 0;
    border-bottom: 1px solid #ddd;
    margin-bottom: 0;
}
    .lamp-category.LampParent .library-category-header a {
        padding: 0.5em;
    }
    .LampParent > .library-category-header a {
        padding: 0 0.5em;
        background: none;
        width: 100%;
    }
    .LampParent > .library-category-header img {
        display: inline-block;
    }
    .LampParent > .library-category-header span {
        display: inline-block;
    }

.lamp-category.LampParent .library-category-content {
    padding: 0;
}

    .lamp-category.LampSizes .library-category-content {
        border: 1px solid #1e1e1e;
    }

.LampSizes.size-selected > .library-category-header a {
    background: #000;
    color: #fff;
}
.LampSizes .lib-icons > li {
    width: 100%;
    height: auto;
    min-height: 2.5em;
    display: block;
    margin: 0;
    height: 2.5em;
}
    .LampSizes .lib-icons > li a {
        text-align: left;
        padding: 0.5em;
    }
    
    .LampSizes .lib-icons > li a:hover  {
        background: #000;
        color: #fff;
    }

.view-mode:not(.LampSizes) > .library-category-content > ul li a {
    pointer-events: none;
    cursor: default;
}
.lampsonly .view-mode:not(.LampSizes) > .library-category-content > ul li a {
    pointer-events: all;
    cursor: pointer;
}

/* AR upload / info area
----------------------------------------*/
#ar-upload-form { border-bottom: 1px solid #777; margin-bottom: 10px; }
#ar-upload-form button { width: 100%; }
.ar-info {  }
.ar-info ul li a { color: #000000; text-decoration: none; display: block; line-height: 24px; padding-left:24px; background: url('img/sprite.png') 0 0 no-repeat; }
.ar-info ul li a.ar-help { background-position: -346px -923px; }
.ar-info ul li a.ar-printmarker { background-position: -346px -195px; }


/* Save combination / configuration area
----------------------------------------------*/
.save-combination label { display: block; }
.save-combination input.text { width: 100%; margin: 0; }
.save-combination select { width: 100%; }
.save-combination button { width: 100%; }


/* Meta areas (info + facebook etc)
----------------------------------------*/
#meta
{
    position: absolute;
    bottom: 5em;
    left: 0;
    right: 0;
    height: 2.5em;
    line-height: 2.5;

    color: #000000;
    border-top: 1px solid #cccccc;
    background: #ffffff;

    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

#info
{
	position: relative;
	margin-right: 18.8571em;
	height: 100%;
	font-size: 14px;
    line-height: 2;
	padding-left: 36px;

    background: none;
    padding-left: 1em;

	color: #000000 !important;
}

    #info .icon {
        display: inline-block;
        width: 16px;
        height: 16px;
        position: relative;
        top: 3px;
        margin-right: 1em;
        background: url('img/sprite.png') -346px -366px no-repeat;
    }

#sharing
{
	position: absolute;
	top: 0;
	right: 0;
	width: 24em;
	height: 100%;
}

    #sharing a
    {
        position: relative;
        display: block;
        width: auto;
        height: 100%;

        border-left: 1px solid #555;

        color: #fff;
        line-height: 2.5;
        text-decoration: none;
    }
    
    #sharing span
    {
        position: relative;
        display: block;
        height: 100%;
        margin: 0 0 0 0.75em;
        padding: 0 0 0 2em;
        background: url('img/icon-light-share.png') 0 50% no-repeat;
    }


/* Main function frame and buttons
----------------------------------------*/
#functions
{
	position: absolute;
	width: 100%;
	bottom: 0;
	left: 0;
	height: 5em;
	background: #000000;
}
    #functions .helper { display: none; }
    #functions-left ul { margin-left: 10px; }
	#functions-righ ul { /*float: right;*/ }
	
	.functions-list, .functions-list li 
    { 
        list-style-type: none; 
        margin-bottom: 0; 
	}
	.functions-list li 
    { 
        display: inline; 
	}
	
	.functions-list a
	{
        position: relative; 
        float: left;
        height: 3em;
        width: auto !important; 
        min-width: 100px; 
        width: 100px; 
        padding: 0 1em;
        top: 1em; 
        margin: 0 1em 0 0;
        
        line-height: 3;
        color: #ffffff;
        text-decoration: none;
        text-align: left;
        
        
        -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
	}
	.functions-list .icon 
    { 
        display: block; 
        height: 100%; 
        padding: 0 0 0 26px;
	}
	.functions-list a:hover,
	.functions-list a:active
	{
        color: #cccccc;
	}
	
	#clear-function .icon      { background: url('img/sprite.png') -30px -20px no-repeat; }
	#new-function .icon        { background: url('img/sprite.png') -30px -20px no-repeat; }
    #save-function .icon       { background: url('img/sprite.png') -346px -76px no-repeat; }
    #saveas-function .icon     { background: url('img/sprite.png') -30px -1252px no-repeat; }
    #load-function .icon       { background: url('img/sprite.png') -30px -132px no-repeat; }
    #print-function .icon      { background: url('img/sprite.png') -30px -188px no-repeat; }
    #screenshot-function .icon { background: url('img/sprite.png') -30px -244px no-repeat; }
    #measure-function .icon    { background: url('img/sprite.png') -30px -301px no-repeat; }
    #help-function .icon       { background: url('img/sprite.png') -30px -356px no-repeat; }
    #remove-function .icon     { background: url('img/sprite.png') -30px -412px no-repeat; }
    #back-function .icon       { background: url('img/sprite.png') -346px -468px no-repeat; }
    #hide-function .icon       { background: url('img/sprite.png') -346px -524px no-repeat; }
    #autopanel-function .icon  { background: url('img/sprite.png') -346px -580px no-repeat; }
    #fit-function .icon        { background: url('img/sprite.png') -346px -636px no-repeat; }
    #zoomin-function .icon     { background: url('img/sprite.png') -346px -693px no-repeat; }
    #zoomout-function .icon    { background: url('img/sprite.png') -346px -748px no-repeat; }
    #grid-function .icon       { background: url('img/sprite.png') -346px -804px no-repeat; }
    #floorplan-function .icon  { background: url('img/sprite.png') -346px -860px no-repeat; }
    #feedback-function .icon   { background: url('img/sprite.png') -30px -1196px no-repeat; }
   

/* Drag n Drop related
----------------------------------------*/
/*
*[draggable=true] {
    -moz-user-select:none;
    -khtml-user-drag: element;
    cursor: move;
}
*/


/* File input styling
----------------------------------------*/

.fake-file-input-container
{
	position: relative;
	width: auto;
	height: 2em;
	line-height: 2;
	margin-bottom: 0.5em;
	
	background: #fff;
	background:    -moz-linear-gradient(top, #f4f4f4 0%, #fff 100%);
	background:      -o-linear-gradient(top, #f4f4f4 0%, #fff 100%);
	background:     -ms-linear-gradient(top, #f4f4f4 0%, #fff 100%);
	background: -webkit-linear-gradient(top, #f4f4f4 0%, #fff 100%);
	background:         linear-gradient(top, #f4f4f4 0%, #fff 100%);
	
	color: #454545;
	font-size: 1em;
	
	border: 1px solid #adadad;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	
	box-shadow: inset 0 1px 4px #d9d9d9;
	
	-moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
	.fake-file-input-container:hover 
	{
	    -webkit-box-shadow: 0 0 3px #5fceea, inset 0 1px 4px #d9d9d9; 
	       -moz-box-shadow: 0 0 3px #5fceea, inset 0 1px 4px #d9d9d9; 
	        -ms-box-shadow: 0 0 3px #5fceea, inset 0 1px 4px #d9d9d9; 
	            box-shadow: 0 0 3px #5fceea, inset 0 1px 4px #d9d9d9; 
	}
	.fake-file-input-container.disabled 
	{
	    background: #e0e0e0;
	    box-shadow: inset 1px 1px 3px #bdbdbd; 
	}
	.fake-file-input-container .ffi-file-name { float: left; margin-left: 8px; }
	.fake-file-input-container .ffi-file-name.ffi-no-file { font-style: italic; color: #999; }
	.fake-file-input-container .ffi-trigger 
	{ 
	    color: #454545; 
	    text-decoration: none; 
	    display: block; 
	    position: relative; 
	    top: 2px; 
	    height: 1.5em; 
	    line-height: 1.45; 
	    margin-right: 3px; 
	    padding: 0 6px;
	    
	    background: #f3f3f3;
	    background:    -moz-linear-gradient(top, #fff 0%, #efefef 100%);
	    background:      -o-linear-gradient(top, #fff 0%, #efefef 100%);
	    background:     -ms-linear-gradient(top, #fff 0%, #efefef 100%);
	    background: -webkit-linear-gradient(top, #fff 0%, #efefef 100%);
	    background:         linear-gradient(top, #fff 0%, #efefef 100%);
	    
	    border: 1px solid #bdbdbd;
	    -moz-border-radius: 3px;
	    -webkit-border-radius: 3px;
	    border-radius: 3px;
	    
	    -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
	}
	.fake-file-input-container .ffi-trigger span { display: block; position: relative; height: 100%; }
	.fake-file-input-container.disabled .ffi-trigger { background-position: 0 -18px; cursor: default; }
	.fake-file-input-container.disabled .ffi-trigger span { background-position: 100% -18px; }
	.fake-file-input-container .ffi-reset { height: 14px; width: 14px; display: block; position: relative; top: 4px; right: 4px; text-indent: -9999em; outline: none; overflow: hidden; background: url('img/fakefileinput-reset.png') right top no-repeat; }
	.fake-file-input-container .ffi-reset:hover { background-position: 0 -14px; }
	.fake-file-input-container .ffi-trigger, .fake-file-input-container .ffi-reset { float: right; }


/* Floorplan uploader
----------------------------------------*/
#floorplan-header
{
    background: #f7f7f7 url('img/bg-lib-options.png') left bottom repeat-x;
    padding: 25px 25px 15px;
    position: relative;
}

#floorplan-header h2 { font-size: 18px; margin-bottom: 12px; font-weight: normal; }

#floorplan-header .phase-upload
{
    text-align: center;
}

#floorplan-header .phase-upload .fake-file-input-container
{
    margin-right: 15px;
    display: inline-block;
    width: 20em;
}

#floorplan-header .phase-useimage
{
    padding: 15px 0 25px;
    text-align: center;
}

#floorplan-header .form button,
.floorplan-update a
{
    display: inline-block;
    width: 140px;
    height: 32px;
    padding: 0;
    position: relative;
    margin: 0;
    
    line-height: 30px;
    color: #fff;
    text-decoration: none;
    text-align: center;
    font-size: 13px;
    font-weight: bold;
    
    background: #00a5ff;
    background: -o-linear-gradient(top, #00a5ff 0%, #0085cf 100%);
    background: -moz-linear-gradient(top, #00a5ff 0%, #0085cf 100%);
    background: -webkit-linear-gradient(top, #00a5ff 0%, #0085cf 100%);
    background: linear-gradient(top, #00a5ff 0%, #0085cf 100%);
    border-radius: 6px;
    border: 1px solid #aaa;
    box-shadow: 0 0 2px #bbb;
    -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box; 
    
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}
#floorplan-header .form button
{
    height: auto;
    padding: 5px 0 8px;
    line-height: 1.5;
    top: 5px;
}
#floorplan-header .form button:disabled
{
    background: #d9d9d9;
    opacity: 0.8;
}
.floorplan-update a.changeimage
{
    background: #ededed;
    background: -o-linear-gradient(top, #fff 0%, #ececec 100%);
    background: -moz-linear-gradient(top, #fff 0%, #ececec 100%);
    background: -webkit-linear-gradient(top, #fff 0%, #ececec 100%);
    background: linear-gradient(top, #fff 0%, #ececec 100%);
    color: #555;
    font-weight: normal;
    margin-left: 10px;
}

#floorplan-unity { position: relative; } 
#floorplan-unity p { text-align: center; color: #999; font-size: 14px; padding-top: 4em; }

.floorplan-measurement { padding: 15px 0; }
.floorplan-measurement form
{
    margin: 0 45px;
    padding: 5px 0;
    color: #f4f4f4;
    
    background: #65a9cf;
    background: -o-linear-gradient(top, #85bedc 0%, #468cbc 100%);
    background: -moz-linear-gradient(top, #85bedc 0%, #468cbc 100%);
    background: -webkit-linear-gradient(top, #85bedc 0%, #468cbc 100%);
    background: -ms-linear-gradient(top, #85bedc 0%, #468cbc 100%);
    background: linear-gradient(top, #85bedc 0%, #468cbc 100%);
    
    border-radius: 10px;
    border: 1px solid #7eb3ce;
    box-shadow: 0 1px 3px #ccc;
}

    .floorplan-measurement form .wrap
    {
        margin: 0 15px;
        background: url('img/icon-info-white.png') 0 50% no-repeat;
        padding-left: 31px;
        position: relative;
    }
    /* CONTROL MODE */
    #controlMode {
        height: auto;
        background: #fff;
        border-bottom: 1px solid #ddd;
    }
    #controlMode .wrap {
        overflow: auto;
        padding: 8px 15px;
    }
    #controlMode p {
        float: left;
        margin: 0;
    }
    #controlMode .inputs {
        float: right;
    }
    /* LINE CONTROLLER */
    #measurement form p { font-size: 14px; margin-right: 100px; margin-bottom: 0; }
    #measurement form .input { position: absolute; right: 0; top: 0; }
    #measurement form input
    {
        border: none;
        height: 22px;
        text-align: right;
        margin-top: 5px;
        padding: 0 4px;
        
        background: #fafafa;
        border-radius: 4px;
        box-shadow: inset 0 1px 1px #444;
    }
    /* GRID CONTROLLER */
    #grid p {
        font-size: 12px;
        margin-right: 100px;
        margin-bottom: 0;
    }
    #grid .inputs {
        position: absolute; 
        right: 0; 
        top: 0;
    }
    #gridSizeSelect {
        position: relative;
        top: 7px;
    }
		
/* Forms
----------------------------------------*/
.form-field { 
    position: relative;
    font-size: 117%;
    margin-bottom: 1.5em;
}
.form-field label {
}
.form-field .text, 
.form-field .text-box {
    line-height: normal;
    padding: .4em .5em;
    color: #000000;
    border: 1px solid #cccccc;
    width: 100%;
    
       -moz-box-sizing: border-box;
        -ms-box-sizing: border-box;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
}
.form-field select {
}
.form-buttons {
}
#marketing label {
    float: none;
    display: block;
    width: auto;
}
#marketing input {
    margin-right: 0.75em;
}


/* VividPlatform logo (and link?)
----------------------------------------*/
a.vividplatform
{
	display: none;
	width: 129px;
	height: 100%;
	text-indent: -9999em;
	background: url('img/vividplatform-light.png') 0 50% no-repeat;
	outline: none;
	position: absolute;
	right: 1em;
	bottom: 0;
}

a.customerlink
{
	width: 100px;
	height: 18px;
	position: absolute;
	right: 230px;
	bottom: 10px;
	color: white;
	font-size:12px;
}

div#footer
{
    display: none;
    height: 0;
}


/* Login / facebook toolbars */
div#custom-controls
{
    position: relative;
    text-align: center;
}

#loginDiv
{
    background: #f8faf7;
    width: 28em;
    padding: 1.5em 2em;
}
    #loginDiv h1 {
        font-size: 2em;
        margin-bottom: 0.75em;
    }
    #loginDiv .form-field { position: relative; }
	#UserName-label, #Password-label
    {
        line-height: normal;
        position: absolute;
        top: 0;
        left: 0;
        font-size: 14px;
        padding: 0.5em 0;
        width: 6em;
        margin-left: 0.75em;
        color: #b2b2b2;
    }
	#UserName, #Password
    {
        line-height: normal;
        font-size: 14px;
        padding: .5em 1em .5em 7.5em;
        color: #000000;
        border: 1px solid #cccccc;
        /*margin-bottom: 1em;*/
        width: 100%;

           -moz-box-sizing: border-box;
            -ms-box-sizing: border-box;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
    }
    #RememberMe-label
    {
        margin-left: 1em;
        font-size: 14px;
        padding: 0.5em 1em;
    }
	#login-button
    { 
        padding: 0.5em 1.5em;
	}
    #loginDiv a.button { padding-top: 0.4em; padding-bottom: 0.4em; }

/* Login controls */
#header, #categories { top: -2em; }
.user-controls,
.login-controls
{
    text-align: center;
    position: relative;
    top: -2em;
    height: 2em;
    background: transparent;
    margin-right: 2.8em;
}
    .user-controls .user-control,
    .login-controls .login-control 
    {
        display: inline-block;
        position: relative;
        height: 2em; 
        top: 2em;
        line-height: 1.83333333333333;
        width: auto !important;
	    min-width: 4em;
	    width: 4em;
        padding: 0;
        margin: 0;
        color: #000000;
    }
    .login-controls .login-control a { text-decoration: none; color: #000000; display: block; height: 100%; float: left; outline: none; }
    .login-controls .login-control a.login-button { padding: 4px 8px 0 10px; }/*padding: 0 8px 0 10px;*/ 
    .login-controls .login-control a#fb-login { padding: 0 10px 0 20px; /*border-left: 1px solid #666;*/ }
    .login-controls .login-control a span:hover {
        border-bottom: 1px solid #1e1e1e;
        padding-bottom: 0.37em;
    } 
    .login-controls .login-control a#fb-login img:hover{
        /*border-bottom: 1px solid black;*/
    }

#userinfo-area
{
    padding: 0 1em;
}
    #userinfo-area p { margin-bottom: 0; }
    #userinfo-area .user-info { float: left; margin-right: 1em; font-weight: bold;}
    #userinfo-area a { margin-left: 1em; text-decoration: none; color: #000000; }
    #userinfo-area a:hover { border-bottom: 1px solid #000000;}

    #userinfo-area .project-info {
        font-weight: bold;
        text-align: left;
    }


.breadcrumbs
{
    /*display: inline-block;*/
    width: auto;
    display: none;
}

.breadcrumbs a
{
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    margin-bottom: 1em;
}

/* Installer*/
.installLayer
{
	color: #555;
	font-size: 15px;
	line-height: 21px;
	height: 250px;
	left: 50%;
	margin: -125px 0px 0px -212px;
	padding: 1px;
	position: absolute;
	top: 50%;
	width: 425px;
	text-align: left;
}

.installLayer .wrap { margin: 50px 15px 10px; }

/* extra lib stuff */
.libTable
{
	/*color:#595959;*/
	color:#FFFFFF;
	border:1px;	
	margin:0px;
	padding:0px;
	margin-bottom:5px;
}

.libCategoryHeader
{
	font-size:16px;
	font-weight:bold;
	text-align:center;
	height:25px;
	width:100%;
}

.libWidthHeader
{
	font-size:12px;
	text-align:center;
	border:1px solid;
	border-color:Black;
}

.libHeightCell
{
	width:15px;
	/*border-top:1px solid #989898;*/
	text-align:center;
}


.libCell
{
	vertical-align:top;
	border-top:1px solid #989898;
	border-right:1px solid #989898;
	text-align:center;
	font-size:10px;
	width:75px;
	cursor:default;
}

.tableThumb
{
	cursor:pointer;	
}

.materialLibTable
{
	color:#FFFFFF;
	padding:8px;
	border:0px;
	width:100%;
}

.materialLibImage
{
	/*border:2px solid;*/
	padding:3px;
	cursor:pointer;
}

.materialLibImageDisabled
{
	/*border:2px solid;*/
	padding:3px;
}

.materialLibText
{
	font-size: 10px;
	cursor:default;
}

.materialLibTextDisabled
{
	font-size: 10px;
	color: #606060;
	cursor:default;
}


.combinationsCategory
{
	font-size:11px;
	font-weight:bold;
	text-align:left;
	padding-left:5px;
	padding-top:10px;
	/*width:100%;*/
	color:#989898;
	cursor:pointer;
}

.combinationsThumb
{
	margin-top:5px;
	margin-bottom:5px;
	margin-left:15px;
	border:2px solid white;
	cursor:pointer;
}


/* jQuery UI Slider
 * Modified for measure-property-editor in VividPlatform
 *********************************************************/
.measure-property-editor { margin-bottom: 1em; padding-bottom: 1em; border-bottom: 1px solid #d9d9d9; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.measure-property-editor:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.measure-property-editor .name { width: 5em; display: block; float: left; }
.measure-property-editor .value { width: 4em; display: block; float: left; }
.measure-property-editor .value input { width: 2.5em; }
.measure-property-editor-slider { width: 8.9em; float: left; }

.ui-slider-horizontal { height: 4px; margin: 0.65em 0 0; background: #4d4d4d; border: none; }
.ui-slider-horizontal .ui-slider-handle { height: 13px; width: 13px; background: url('img/slider-tab.png') 0 0 no-repeat; border: none; padding: 0; margin-left: -7px; top: -4px; }
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
.ui-slider-horizontal .ui-slider-range-max { right: 0; }


/* Quickslider sliders: flexcontrols etc
-------------------------------------------------------------------*/
.flexcontrol {
    margin-bottom: 1.5em;
    border-bottom: 1px solid #777;
    padding-bottom: 1em;
}
.flexcontrol-2d {
    position: relative;
}
.flexcontrol-2d .quickslider-vertical {
    height: 132px;
}
.flexcontrol-2d .quickslider-horizontal {
    position: absolute;
    top: 100px;
    left: 40px;
    right: 0;
    z-index: 1;
}
.flexcontrol-2d .quickslider-vertical .flexcontrol-plus
{
    left: 0;
}
.flexcontrol-2d .quickslider-vertical .flexcontrol-minus
{
    display: inline-block;
    left: 0;
    position: absolute;
    top: 100px;
}
#library-options h3.flexcontrol-title {
    margin: 0 0 0.5em;
}
.flexcontrol-panel {
    padding: 0 2em;
    height: 2em;
    position: relative;
}
.flexcontrol-plus,
.flexcontrol-minus {
    width: 2em; 
    height: 2em;
    display: block; 
    position: absolute; 
    top: 0;
    text-decoration: none;
}
.flexcontrol-plus {
    right: 0;
    text-indent: -9999em;
    background: url('img/icon-dark-plus.png') 50% 50% no-repeat;
}
.flexcontrol-minus {
    left: 0;
    text-indent: -9999em;
    background: url('img/icon-dark-minus.png') 50% 50% no-repeat;
}


.quickslider-horizontal .quickslider-slider
{
	height: 0.4em; 
	margin: 0 0.75em; 
	background: #595959;
	border: none;
	position: relative;
	overflow: visible;
    top: 0.9em;
}

.quickslider-vertical .quickslider-slider
{
	height: 10em;
	width: 0.4em;
	margin: 0.5em 0.5em; 
	background: #4d4d4d; 
	border: none;
	position: relative;
	overflow: visible;
}

.quickslider-handle
{
	width: 1em;
	height: 1em;
	position: absolute;
	
	top: -0.35em;
	left: 0;
	margin-left: -0.5em;
	
	border-radius: 0.5em;
	background: #cccccc;
	cursor: pointer;
}

.quickslider-vertical .quickslider-handle
{
	top: auto;
	left: -0.35em;
	bottom: 0;
	margin-bottom: -0.5em;
	margin-left: 0;
}

.quickslider-label
{
	width: 5.5em;
	height: 1.75em;
	position: absolute;
	
	right: -2.85em;
	top: -3em;
	margin-left: -1.5em;
	
	border: 1px solid #cccccc;
	background: #ffffff;
	
	line-height: 1.75;
	text-align: center;
	color: #000000;
}

.quickslider-vertical .quickslider-label
{
	top: auto;
	bottom: 0;
	left: 1em;
	margin-bottom: -0.8em;
	margin-left: 0;
    display: table-cell;
    vertical-align: middle;
}

/* */
.flexcontrol-panel input { 
    /*
	height: 0; width: 0; font-size: 0; border: none; background: transparent; position: absolute; left: 999999em; outline: none; 
	*/
    display: none;
}


.flexcontrol-panel .quickslider-label input {
    border: none;
    display: inline-block;
    height: 1.5em;
    max-width: 100%;
    padding: 0 8px 0 0;
    text-align: right;
}

/* Popover styles
 *********************************************************/
#cboxOverlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000; 
}
#colorbox
{
    box-shadow: 0 0.2em 3em black;
    /*border-radius: 5px;*/
}
    #cboxTopLeft,
    #cboxTopRight,
    #cboxBottomLeft,
    #cboxBottomRight,
    #cboxMiddleLeft,
    #cboxMiddleRight,
    #cboxTopCenter,
    #cboxBottomCenter { display: none; }
    #cboxContent
    {
        background: #fff;
        overflow: visible;
        /*border-radius: 5px;*/
    }
        .cboxIframe{background:transparent;}
        #cboxError{padding:50px; border:1px solid #ccc;}
        #cboxLoadedContent{margin-bottom:0;}
        #cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
        #cboxLoadingOverlay{background:url(img/cbox-loading_background.png) no-repeat center center;}
        #cboxLoadingGraphic{background:url(img/cbox-loading.gif) no-repeat center center;}
        
        #cboxClose 
        {
            position: absolute;
            text-indent: -9999px;
            top: 1em;
            right: 1em;
            
            width: 16px;
            height: 16px;
            background: url(img/sprite.png) -346px -422px no-repeat;
            z-index: 10;
        }
 
#vwmodal-overlay {
	position: fixed;
	z-index:10000;
	top: 0;
	left: 0;
	height:100%;
	width:100%;
	background: #000;
	display: none;
}
#vwmodal-container {
	position: absolute;
	z-index:10100;
	top: 0;
	left: 0;
    overflow: visible;

    background: #fff;
    box-shadow: 0 0.2em 3em black;
    
	display: none;
}
#vwmodal-title {
	position: relative;
    overflow: auto;
    border-radius: 5px 5px 0 0;
    z-index: 10;
}
#vwmodal-content {
	position: relative;
    overflow: auto;
    border-radius: 5px;
}
#vwmodal-close {
    cursor: pointer;
    position: absolute;
    text-indent: -9999px;
    top: 0.5em;
    right: 0.5em;
    
    width: 32px;
    height: 32px;
    background: transparent url(img/sprite.png) -338px -414px no-repeat;
    z-index: 10;
}
#vwmodal-loader {
    width: 320px;
    height: 220px;
    border-radius: 5px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -110px;
    margin-left: -160px;
    background: #f3f3f3 url('img/loader-dark-beam.gif') 50% 50% no-repeat;
    z-index: 10100;
}
.vwmodal-iframe {
	width:100%; 
	height:100%; 
	display:block; 
	border:0;
    border-radius: 5px;
}

.popover
{
   /*border-radius: 5px;*/
}
.popover-titlearea
{
    background: #f7f7f7;
    border-bottom: 1px solid #ccc;
    
    background:    -moz-linear-gradient(top, #f7f7f7 0%, #ddd 100%);
    background:     -ms-linear-gradient(top, #f7f7f7 0%, #ddd 100%);
    background: -webkit-linear-gradient(top, #f7f7f7 0%, #ddd 100%);
    background:      -o-linear-gradient(top, #f7f7f7 0%, #ddd 100%);
    background:         linear-gradient(top, #f7f7f7 0%, #ddd 100%);
    /*border-radius: 5px 5px 0 0;*/

    position: fixed;
    width: 100%;
    height: 3.5em;
    z-index: 10;
    border-radius: 5px 5px 0 0;
}
    #vwmodal-title h1,
    .popover-titlearea h1 {
        margin: 0 0 0 1.3333em;
        font-size: 1.5em;
        line-height: 2.3333;
    }
.popover-contentarea
{
    background: #fff;
    color: #000000;
    position: relative;
    border-radius: 5px;
    overflow: auto;
}
.popover-maincontent,
.popover-highlightarea
{
    padding: 1.5em 2em;
}
.popover-highlightarea 
{
}


/* Confirm & alert dialog
 *********************************************************/
.confirm-dialog {
    color: #fff;
    width: 24em;
    padding: 1.5em 2em 1em;
    text-align: center;
}
    .confirm-dialog .popover-contentarea {
        padding-top: 0;
    }
    .confirm-dialog .buttons { margin-bottom: 0; }
    .alert-modal-confirm {
        width: 6em;
        color: #404040;
        text-decoration: none;
        display: inline-block;
        margin-right: 1em;
    }
    .alert-modal-cancel {
        width: 6em;
        color: #404040;
        text-decoration: none;
        display: inline-block;
    }


/* Session timed out dialog
 *********************************************************/
.session-timedout-dialog
{
    width: 33em;
    /*height: 15em;*/
}


/* Save dialog
 *********************************************************/
.save-dialog
{
    width: 30em;
    /*height: 15em;*/
}

.saveform-newfolder {
    border-top: 1px dotted #ddd;
    padding-top: 1.5em;
}
.saveform-folder-select {
    /*width: 47.5%;
    float: left;*/
    margin-bottom: 1em;
    width: 100%;
}
/*.saveform-addfolder-btn, */
#newFolderName {
    /*width: 47.5%;
    float: left;
    margin-left: 5%;*/
    margin-bottom: 1em;
}
#newFolderName {
    padding-top: 0.25em;
    padding-bottom: 0.25em;
}
.saveform-addfolder-btn,
.saveform-addfolder-cancel {
    color: #404040;
    text-decoration: none;
}
.saveform-addfolder-btn .icon,
.saveform-addfolder-cancel .icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    position: relative;
    top: 3px;
    background: url('img/sprite.png') -346px -1038px no-repeat;
}
.saveform-addfolder-cancel .icon {
    background-position: -346px -422px;
}
.saveform-addfolder-cancel {
    float: right;
    clear:both;
    margin-top: 0.75em;
}
.saveform-buttons {
    border-top: 1px dotted #ddd;
    padding-top: 1.5em;
}

/* Load dialog
 *********************************************************/
.load-dialog
{
    width: 55em;
    /*height: 50em;*/
}

.load-dialog .popover-highlightarea .form-field {
    margin: 0.5em 0;
}
.load-dialog .popover-highlightarea input {
    float: left;
    width: 12em;
    margin-right: 0.5em;
}

.load-dialog-controls {
    margin-bottom: 1.5em;
    padding-bottom: 1em;
    border-bottom: 1px solid #d9d9d9;
    position: relative;
}
    .load-dialog-controls .button {
        padding: 0.5em 1em;
        line-height: 1;
    }
.load-dialog-controls-folder {
    height: 3em;
}
.load-dialog-layout {
    float: left;
}
.load-dialog-sortorder {
    float: left;
    margin-left: 3em;
}
    .load-dialog-sortorder .button {
        line-height: 16px;
    }
        .load-dialog-sortorder .button .icn {
            visibility: hidden;
            display: inline-block;
            background: url('img/desc.png') 50% 80% no-repeat;
            width: 1em;
            height: 1em;
        }
        .load-dialog-sortorder .button.asc .icn {
            background: url('img/asc.png') 50% 80% no-repeat;
        }
        .load-dialog-sortorder .button.selected .icn {
            visibility: visible;
        } 
.load-dialog-search {
    position: absolute;
    
    border-radius: 1.1em;
    width: 16em;
    top: 0;
    right: 0;

    background: #f8f8f8;
    line-height: normal;
    padding: .4em .5em;
    color: #555;
    border: 1px solid #cdcdcd;
    box-shadow: inset 0 1px 3px #ccc;
}
.load-dialog-search input {
    border: none;
    background: #f8f8f8;
    width: 12.5em;
}
#load-dialog-search-cancel { display: block; height: 14px; width: 14px; position: absolute; top: 6px; right: 6px; text-indent: -9999em; outline: none; overflow: hidden; background: url('img/fakefileinput-reset.png') right top no-repeat; }
#load-dialog-search-cancel:hover { background-position: 0 -14px; }
.load-dialog-header {
    margin-bottom: 2em;
}
.load-dialog-header h2 {
    font-size: 2em;
    line-height: 1;
    float: left;
    color: #666;
    width: 19em;
}
.load-dialog-header .button {
    float: right;
    display: none;
}
.load-dialog-header .button.confirm {
    background: #d55;
    color: white;
}

/* list view */
.savedconfigurations-list td, .savedconfigurations-lis th
    {
        padding: 0.5em 1.5em 0.5em 0;
        border-bottom: 1px solid #dfdfdf;
        line-height: 2;
    }
    .combo-row .combo-date { width: 8em; text-align: left; }
    .combo-row .combo-id { width: 4em; text-align: left; }
    .combo-row .combo-name { width: auto; text-align: left; }
    .combo-row .combo-funcs { width: 10em; padding-right: 0; text-align: right; position: relative; }
    .combo-row .delete-confirm 
    {
        display: none;
        position: absolute; 
        width: 100%; 
        height: 100%; 
        background: #fff; 
        top: 0; 
        left: 0;
    }
        .combo-row .delete-confirm .button { margin-top: 0.5em; margin-right: 0; background: #d55; color: white; border: none; line-height: 2; }
        .combo-row .delete-confirm .button:hover { background: #e88; }

    .combo-row .load-combo,
    .combo-row .delete-combo 
    { 
        text-decoration: none; 
        color: #444; 
        margin-left: 4px; 
        display: inline-block; 
        width: 2em; 
        height: 2em;
        vertical-align: middle;
    }
        .combo-row .load-combo {  background: url('../../Content/images/icon-load-small.png') 50% 50% no-repeat; }
        .combo-row .delete-combo { background: url('../../Content/images/icon-delete-small.png') 50% 50% no-repeat; }
        .combo-row .load-combo span, .combo-row .delete-combo span { display: none; }

/* tile view */
.savedconfigurations-tiled {
    vertical-align: top;
}
    .combo-tile {
        /*float: left;*/
        display: inline-block;
        vertical-align: top;
        width: 11em;
        margin-right: 2em;
        margin-bottom: 2em;
        position: relative;
    }
    .combo-tile.n4 {
        margin-right: 0;
    }
    .combo-tile .combo-image {
        width: 132px;
        height: 0;
        padding-bottom: 100%;
    }
    .combo-tile .combo-image img {
        width: 100%;
        vertical-align: middle;
    }

    .combo-tile a {
        color: #555;
        text-decoration: none;
    }
    .combo-tile .combo-date { display: block; color: #888; }
    .combo-tile .combo-id { display: block; color: #888; }
    .combo-tile .combo-name { display: block; font-weight: bold; width: 100%; overflow-wrap: break-word; word-wrap: break-word; word-break: break-all; /*overflow: hidden;*/ }

    .combo-tile .delete-combo 
    { 
        text-decoration: none; 
        color: #444; 
        margin: 0; 
        display: block; 
        width: 3em; 
        height: 3em;
        vertical-align: middle;
        background: url('img/icon-dark-remove.png') 50% 50% no-repeat;

        position: absolute;
        top: -1.3em;
        right: -1.3em;
    }
        .combo-tile .delete-combo span { display: none; }
    .combo-tile .delete-confirm 
    {
        display: none;
        position: absolute;
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
        text-align: center;

        background: #333;
        background: rgba(0,0,0,0.8);
    }
        .combo-tile .delete-confirm .button { margin-top: 2em; margin-right: 0; background: #d55; color: white; border: none; line-height: 2; }
        .combo-tile .delete-confirm .button:hover { background: #e88; }
 


/* Share dialog
 *********************************************************/
.share-dialog
{
    width: 44em;
    /*height: 20em;*/
    min-height: 30em;
}
    .share-dialog .popover-maincontent {
        min-height: 10em;
    }
    .share-block
    {
        border-top: 1px dotted #ccc;
        padding: 15px 0 10px;
    }


/* Feedback dialog
 *********************************************************/
.feedback-dialog
{
    width: 50em;
}


/* Register dialog
 *********************************************************/
.register-dialog
{
    width: 34em;
}
    .register-dialog #marketing label {
        float: none;
        display: block;
        margin: 0;
        width: auto;
    }
    .register-dialog #marketing input {
        margin-right: 0.75em;
    }
    .register-dialog #Password {
        line-height: normal;
        padding: .4em .5em;
        color: #555;
        border: 1px solid #cdcdcd;
        width: 100%;
    }


/* Password reset dialog
 *********************************************************/
.passwordreset-dialog
{
    width: 34em;
}


/* Edit Profile dialog
 *********************************************************/
.editprofile-dialog
{
    width: 34em;
}
    .editprofile-dialog #marketing label {
        float: none;
        display: block;
        margin: 0;
        width: auto;
    }
    .editprofile-dialog #marketing input {
        margin-right: 0.75em;
    }
    .editprofile-dialog #Password {
        line-height: normal;
        padding: .4em .5em;
        color: #555;
        border: 1px solid #cdcdcd;
        width: 100%;
    }


/* Ajaxloaders
 *********************************************************/
.loader, .ajaxloader
{
    position: relative;
    background: url('img/loader-dark-beam.gif') 50% 50% no-repeat;
}
.loader-light, .ajaxloader-light {
    background-image: url('img/loader-light-beam.gif');
    background-color: #222;
    border-radius: 6px
}
.ar-upload-loader {
    height: 8em;
    margin-bottom: 1em;
}
.load-dialog .loader {
    height: 8em;
    margin-bottom: 1em;
}

/* Client not supported info etc
 *********************************************************/
.clientinfo {
    background: #fafafa;
    height: 100%;
    padding: 0 6em;
    box-shadow: inset 0 0 4rem rgba(0,0,0,0.05);
}

    .clientinfo p {
        text-align: center;
        color: #666;
        font-size: 1.3333em;
    }

    .clientinfo table,
    .clientinfo table td {
        vertical-align: middle;
        height: 100%;
        width: 100%;
    }

.appstore-link {
    display: block;
    margin: 2rem auto 0;
}


/* EU Cookie Law implementation
 *********************************************************/
.vweuropolicy {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.8);
    z-index: 10000;
    color: #fff;
    padding: 1.5em 2em;
}

.vweuropolicy-text {
    display: inline-block;
    padding: 0.5em 0;
    margin-right: 18em;
}

.vweuropolicy-accept {
    text-decoration: none;
    color: white;
    background: green;
    padding: 0.5em 1em;
    
    position: absolute;
    top: 50%;
    right: 2em;
    margin-top: -1.25em;

    border-radius: 2px;
}

.vweuropolicy-dialog  {
    width: 44em;
}
.vweuropolicy-dialog .popover-maincontent {
    padding-top: 0;
}
.vweuropolicy-information h2 {
    font-size: 1.4em;
    margin: 0.75em 0 0.5em;
}
.vweuropolicy-information h3 {
    text-transform: uppercase;
}
.vweuropolicy-information ul {
    margin: 1em 0;
}
.vweuropolicy-information li {
    display: list-item;
    list-style: disc;
    margin: 0.5em 0 0.5em 1.5em;
}

.delete-confirm-msg {
    color: white;
    padding: 8px;
}

.part-position-properties {
    margin-bottom: 1.5em;
    border-bottom: 1px solid #777;
    padding-bottom: 1em;
}

.part-position-properties .flexcontrol {
    margin-bottom: 1.5em;
    border-bottom: none;
    padding-bottom: 0;
}

.part-radio-properties input {
    margin-right: 16px;
}


/* Price Display and Currency Switcher
 *********************************************************/
.price-display {
    float: right;
    background: #f0f0f0;
    color: #222;
    position: relative;
    top: .85em;
    right: .85em;
    line-height: 2;
    overflow: visible;
}
    .price-display a {
        color: #222;
        text-decoration: none;
    }

    .price-display > [class^="price-"] {
        font-weight: bold;
        padding: 0.5rem 0.25rem;
        float: left;
        position: relative;
    }

    .price-display .price-label {
        padding-left: 1rem;
        padding-right: 0.75rem;
    }
    .price-display .price-value,
    .price-display .price-currency {
        font-size: 125%;
        line-height: 1.6;
    }
    .price-display .price-currency {
        padding-right: 1.5em;
        margin-right: .5rem;
    }
        .price-display .price-currency .icon {
            position: absolute;
            right: 0;
            top: 50%;
            transform: translate(0, -50%);
            display: none;
        }
        .multiplecurrencies .price-currency .icon {
            display:inline-block;
        }
    .price-display .price-link {
        padding: 0 0.5rem 0 1rem;
        line-height: 1;
    }
        .price-display .price-link .icon {
            line-height: 1.5;
            display: inline;
        }

.currency-selector {
    position: absolute;
    background-color: #d0d0d0;
    left: 0.5rem;
    right: 0.5rem;
    bottom: 100%;
    height: auto;
    opacity: 0;
    transform: translate(0, 100%) scaleY(0);
    transition-duration: 0.15s;
    transition-timing-function: ease-in-out;
    transition-property: opacity,transform;
    z-index: -1;
}
    .currency-selector.visible {
        opacity: 1;
        transform: translate(0, 0) scaleY(1);
    }
    .currency-selector a {
        padding: 0.25rem 1rem;
        display: block;
        background-color: transparent;
    }
    .currency-selector a + a {
        border-top: 1px solid rgba(0,0,0,0.2);
    }
        .currency-selector a.selected {
            background-color: rgba(0,0,0,0.2);
        }