/* 

ORANGE                      #877A41
ORANGE LIGHT                #999966
ORANGE BKG LIGHT            #E0D39A
GRAY                        #2F2F2F
GRAY MIDDLE                 #444
LIGHT GRAY                  #AAAAAA
*/


/** global **/
body
{
    margin: 0px auto;
    padding: 0;
    background: #aaa none repeat scroll 0 0;    
    font-size: 0.9em;
    line-height: 1.6em;
    color: #666;
    font-family: verdana,helvetica,arial,sans-serif; /*font-family: "Source Sans Pro","sans-serif";*/
}

button, 
input, 
optgroup, 
select, 
textarea {
    color: #2F2F2F;
}
* {
	margin:0;
	padding:0;
}

.OnlyDesktopView { display: auto; }

.row { margin-bottom: 3px; }

/** element defaults **/
table {
	width:100%;
	text-align:left;
}
th, td {
	padding:5px 10px;
}
th {
	color:#fff;
	border-top:1px solid #222;
	background-color:#2F2F2F;
}
/*td {
	border-bottom:1px solid #f4f4f4;
}*/
code {
	display: block;
	border-left:5px solid #877A41;
	padding:10px;
	margin-bottom:20px;
    background-color: #E0D39A;
    color: #333;
    font-size: 1.1em;
}

label 
{
    margin-bottom: 0;
}

blockquote 
{
    border: none;
    padding: 0;
}
blockquote p 
{
    border-left:5px solid #877A41;
	font-style:italic;
	font-family: Georgia, "Times New Roman", Times, serif;
	margin:0;
	height: 1%;
	padding: 0 1%;
}
abbr 
{
    text-decoration: none;
}

p {
	line-height: 1.5em;
	margin-bottom: 20px;
	width: 100%;
	float: left;
}
a {
	color:#877A41;
}
a:hover
{
    color: #FF7E40;
}
a:focus {
	outline: none;
}
.button,
a.button
 { 
    background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c4b470), color-stop(1, #252215));
    background:-moz-linear-gradient(top, #c4b470 5%, #252215 100%);
    background:-webkit-linear-gradient(top, #c4b470 5%, #252215 100%);
    background:-o-linear-gradient(top, #c4b470 5%, #252215 100%);
    background:-ms-linear-gradient(top, #c4b470 5%, #252215 100%);
    background:linear-gradient(to bottom, #c4b470 5%, #252215 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c4b470', endColorstr='#252215',GradientType=0);
    background-color:#c4b470;    
    border: 1px solid #252215;
    
    box-shadow: 0 1px 0 0 #aaa inset;
    border-radius: 5px;
    color: #FFFFFF;
    display: inline-block;
    font-weight: bold;
    padding: 0.4em 1.4em;
    letter-spacing: 0.25px;
    text-decoration: none;
    text-transform: uppercase;	
    text-align: center;
    cursor: pointer;
}
	.button:hover:enabled,
	a.button:hover
	{ 
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #e6d383), color-stop(1, #a3965d));
        background:-moz-linear-gradient(top, #e6d383 5%, #a3965d 100%);
        background:-webkit-linear-gradient(top, #e6d383 5%, #a3965d 100%);
        background:-o-linear-gradient(top, #e6d383 5%, #a3965d 100%);
        background:-ms-linear-gradient(top, #e6d383 5%, #a3965d 100%);
        background:linear-gradient(to bottom, #e6d383 5%, #a3965d 100%);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#e6d383', endColorstr='#a3965d',GradientType=0);
        background-color:#e6d383;
        /*border: 1px solid #a3965d;*/
	}
    .button:disabled,
    .button:disabled:hover,
    a.button:disabled,
    a.button:disabled:hover {
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #b0b0b0), color-stop(1, #999999));
        background:-moz-linear-gradient(top, #b0b0b0 5%, #999999 100%);
        background:-webkit-linear-gradient(top, #b0b0b0 5%, #999999 100%);
        background:-o-linear-gradient(top, #b0b0b0 5%, #999999 100%);
        background:-ms-linear-gradient(top, #b0b0b0 5%, #999999 100%);
        background:linear-gradient(to bottom, #b0b0b0 5%, #999999 100%);
        filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#b0b0b0', endColorstr='#999999',GradientType=0);
        background-color: #b0b0b0;
        border: 1px solid #000;
        color: #606060;
    }
    .button.small {
        padding: 0.3em 0.5em;
        font-weight: normal;
        border: none;
        border-radius: 2px;
    }



.buttonCart,
#pageContent article > a.buttonCart {
	-moz-box-shadow: inset 0px 1px 0px 0px #9acc85;
	-webkit-box-shadow: inset 0px 1px 0px 0px #9acc85;
	box-shadow: inset 0px 1px 0px 0px #9acc85;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #74ad5a), color-stop(1, #999966));
	background: -moz-linear-gradient(top, #74ad5a 5%, #999966 100%);
	background: -webkit-linear-gradient(top, #74ad5a 5%, #999966 100%);
	background: -o-linear-gradient(top, #74ad5a 5%, #999966 100%);
	background: -ms-linear-gradient(top, #74ad5a 5%, #999966 100%);
	background: linear-gradient(to bottom, #74ad5a 5%, #999966 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#74ad5a', endColorstr='#999966',GradientType=0);
	background-color: #74ad5a;
	border: 1px solid #3b6e22;
	display: inline-block;
	cursor: pointer;
	color:#ffffff;
	font-family: Arial;
	font-size: 13px;
	font-weight: bold;
	padding: 6px 12px;
	text-decoration: none;
    text-align: center;
}
.buttonCart:hover {
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.05, #999966), color-stop(1, #74ad5a));
	background: -moz-linear-gradient(top, #999966 5%, #74ad5a 100%);
	background: -webkit-linear-gradient(top, #999966 5%, #74ad5a 100%);
	background: -o-linear-gradient(top, #999966 5%, #74ad5a 100%);
	background: -ms-linear-gradient(top, #999966 5%, #74ad5a 100%);
	background: linear-gradient(to bottom, #999966 5%, #74ad5a 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#999966', endColorstr='#74ad5a',GradientType=0);
	background-color: #999966;
    color: #fff;
    text-decoration: none;
}
.buttonCart:active {
	position:relative;
	top:1px;
    color: #fff;
    text-decoration: none;
}
    .buttonCart:visited,
    .buttonCart:focus {
        color: #fff;
        text-decoration: none;
    }

.reversed ,
a.reversed { 
    /*background-color: #222;*/
    /*background: #101010  linear-gradient(to bottom, #4c4c4c 5%, #202020 100%) repeat scroll 0 0;*/
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #4c4c4c), color-stop(1, #202020));
	background:-moz-linear-gradient(top, #4c4c4c 5%, #202020 100%);
	background:-webkit-linear-gradient(top, #4c4c4c 5%, #202020 100%);
	background:-o-linear-gradient(top, #4c4c4c 5%, #202020 100%);
	background:-ms-linear-gradient(top, #4c4c4c 5%, #202020 100%);
	background:linear-gradient(to bottom, #4c4c4c 5%, #202020 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#4c4c4c', endColorstr='#202020',GradientType=0);
	background-color:#4c4c4c;
    border: 1px solid #202020;
    box-shadow: 0 1px 0 0 #aaa inset;
}

    .reversed:hover:enabled,
	.reversed:hover,
	a.reversed:hover
    {
		/*background-color: #333;*/
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #555), color-stop(1, #333));
	    background:-moz-linear-gradient(top, #555 5%, #333 100%);
	    background:-webkit-linear-gradient(top, #555 5%, #333 100%);
	    background:-o-linear-gradient(top, #555 5%, #333 100%);
	    background:-ms-linear-gradient(top, #555 5%, #333 100%);
	    background:linear-gradient(to bottom, #555 5%, #333 100%);
	    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#555', endColorstr='#333',GradientType=0);
	    background-color:#555;
	}


.red ,
a.red { 
    /*background-color: #222;*/
    /*background: #101010  linear-gradient(to bottom, #d41515 5%, #7a1010 100%) repeat scroll 0 0;*/
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #d41515), color-stop(1, #7a1010));
	background:-moz-linear-gradient(top, #d41515 5%, #7a1010 100%);
	background:-webkit-linear-gradient(top, #d41515 5%, #7a1010 100%);
	background:-o-linear-gradient(top, #d41515 5%, #7a1010 100%);
	background:-ms-linear-gradient(top, #d41515 5%, #7a1010 100%);
	background:linear-gradient(to bottom, #d41515 5%, #7a1010 100%);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#d41515', endColorstr='#7a1010',GradientType=0);
	background-color:#d41515;
    border: 1px solid #7a1010;
    box-shadow: 0 1px 0 0 #aaa inset;
}

    .red:hover:enabled,
	.red:hover,
	a.red:hover
    {
		/*background-color: #a31818;*/
        background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ff0000), color-stop(1, #a31818));
	    background:-moz-linear-gradient(top, #ff0000 5%, #a31818 100%);
	    background:-webkit-linear-gradient(top, #ff0000 5%, #a31818 100%);
	    background:-o-linear-gradient(top, #ff0000 5%, #a31818 100%);
	    background:-ms-linear-gradient(top, #ff0000 5%, #a31818 100%);
	    background:linear-gradient(to bottom, #ff0000 5%, #a31818 100%);
	    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff0000', endColorstr='#a31818',GradientType=0);
	    background-color:#ff0000;
	}

.RoundButton {
    background: #877A41 none repeat scroll 0 0;
    border: medium none;
    border-radius: 15px;
    color: #fff;
    font-size: 1.4em;
    padding: 3px;
}

.Image200 {
    width: 200px;
}
.video 
{
    display: block;
    width: 560px;
    height: 315px;
}


input[type="text"], 
input[type="password"], 
input[type="checkbox"], 
input[type="color"], 
input[type="date"], 
input[type="datetime"], 
input[type="datetime-local"], 
input[type="email"], 
input[type="month"], 
input[type="number"], 
input[type="range"], 
input[type="search"], 
input[type="tel"], 
input[type="time"], 
input[type="url"], 
input[type="week"], 
select, 
textarea 
{
    min-width: 30px;
    width: 30%;    
    height: 20px;
    padding: 0 5px;
    background: #e7e7e7 none repeat scroll 0 0;
    border: 1px solid #000;
}

input[type="checkbox"] {
    min-width: 10px;
    width: auto;
    top: 7px;
    position: relative;
    margin: 0 2px 0 3px;
}

textarea 
{
    height: 60px;
}

input[type="radio"] {
    margin: 0 5px;
    width: auto;
}
	
/* ************ normal form ********* */	
fieldset {
	display: block;
	border: none;
	padding: 10px 0;
    width: 100%;
}
    fieldset legend,
    legend {
        border-width: 0;
        color: #7F7F7F;
        font-size: 1.3em;
        font-weight: bold;
        padding: 0 10px 10px 0;
        text-align: center;
        text-transform: capitalize;
    }
    fieldset form {
    	padding-top:15px;
    }
    fieldset p label,
    fieldset p span:nth-child(1)
    {
    	float:left;
    	width: 20%;	
    }
    fieldset form input, 
    fieldset form select, 
    fieldset form textarea
    {
    	padding:5px;
    	color:#333333;
    	border:1px solid #cdcdcd;
    }

    fieldset.compress legend,
    fieldset.compress p { 
        margin-bottom: 0.5em;
        padding: 0;
    }

/* ************ big Form ************ */
fieldset.bigForm 
{
    
}
    fieldset.bigForm input[type="text"], 
    fieldset.bigForm select,     
    fieldset.bigForm p span
    {
    	width: 100%;
    }
    fieldset.bigForm textarea 
    {
        width: 100%;
        height: 200px;
    }


h1 {
	font-size:1.4em;
}
h2 {
	color: #877A41;
	font-size: 1.3em;	
	padding:0 0 10px;
	margin:0;	
}
h3,
.forceBig3
{
    color: #877A41;
    font-size: 1.2em;
    padding: 0 0 10px;
    font-weight: bold;    
}
h4 {
	padding-bottom: 10px;
	font-size: 1.2em;
	color: #000;
}
h5 {
	padding-bottom: 10px;
	font-size: 1.2em;
	color: #666666;
}

hr {
    border: 1px solid #e2e2e2;
    float: left;
    width: 100%;
}

ul, 
ol {
	margin: 0px 0 25px 35px;
}
li {
	padding-bottom:5px;
    list-style-position: inside;    
}


/** wrapper **/
div#wrapper {
	margin:0px auto;
	padding:0;
}

.width {
	width:auto;
	margin: 0 auto;
}




/** header **/
header {
    padding: 8% 8%;
	margin:0 auto;
}
header h1 { 
	text-align: right;
}

header h1 a,
header h1 a:hover,
header h1 a:visited {
	color: #fff;
	font-size: 1.9em;
	text-decoration: none;
	letter-spacing:-2px;
}

header h2 {
	color:#000000;
	text-align: right;
	font-size: 1.2em;
	font-weight: normal;
	padding-bottom: 0;
	letter-spacing:0;
}


/** body **/
section#body {
	padding: 0;
	background: #877A41;
    /* secret color */
    /*background: -webkit-gradient( linear, left top, left bottom, color-stop(0.05, #3090ff), color-stop(1, #ff4700) );
    background: -moz-linear-gradient(center top , #3090ff 10%, #ff4700 100%) repeat scroll 0 0 #D01B00;
    background: -o-linear-gradient(top, #3090ff 15%, #ff4700 100%, #ff4700 51%, #ff4700 100%); 
    background: -ms-linear-gradient(top, #3090ff 15%,#ff4700 80%, #ff4700 51%, #ff4700 100%); 
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#3090ff', endColorstr='#ff4700');     
    background-color: #877A41;*/

}
/** content+sidebar styles **/
aside#sidebar 
{
    background: #877A41 none repeat scroll 0 0;
	width: 20%;         
	height: 100%;
	position: absolute;  /* make menu scroll: absolute;  - make menu stand: fixed */
}
section#content 
{
	/*margin-left: 250px;*/	
	background-color: #fff;	
    width: 80%;    
    padding: 2%;
    overflow: hidden;           /* important: exclude error of horizontal scrolling in cell mode */
}


/* if image background selected this prevent text to be caotic */
#pageContent article 
{
    background: rgba(255,255,255, 0.9);
    color: #222;
    padding: 0.5em;
}
#pageContent article > h2,
#pageContent article > h3
/*#pageContent article > a */
{
    color: #877A41; /*#877A41; */
}


/* ********************* navigator ***************  */
nav#mainnav ul {
	padding: 0 0 10% 0;
	margin: 0;
	list-style: none;
    width: 100%;
}

    nav#mainnav li {
    	padding:0;
    	border-bottom: 2px solid #9F9F9F;	
    	width: 100%;
    }
    nav#mainnav li.selected-item  {
    	border-bottom:none;
    }
    nav#mainnav li.selected-item a,
    nav#mainnav li.selected-item a:hover {
    	color:#999966;
    	font-weight:bold;
    	background: #fff;
    }
    nav#mainnav li.active a:hover, 
    nav#mainnav li a:hover,
    nav#mainnav li a:active
     {
    	background:#999966;
    	color: #fff;
    	text-decoration:none;
    }
    nav#mainnav li a {
    	color: #f0f0f0;
    	display: block;
    	padding: 0.5em 1em;
    	text-align: right;
    	font-weight:  bold;
    	font-size: 1.2em;
    	text-decoration: none;
    	
    	white-space: pre-wrap;
        word-wrap: break-word;
    }
    nav#mainnav li.active a 
    {
        background:#877A41;
    	color: #fff;
    	text-decoration:none;
    }




article {
    padding: 10px 0px 0px; /*10px 10px 20px;*/
	font-size: 1.2em;
    /*border-bottom: 1px solid #eee;*/
 }

article h2 {
    padding-bottom: 0 0 10px;
	line-height: 1.1em;
	letter-spacing: -2px;    
	font-size: 1.8em;
}
article h3 
{
    padding: 0px;
}

article .article-info {
  color: #a0a0a0;
  font-size: 0.92em;
  padding: 0px 0px 10px;
}

article .article-info a { 
	color: #b5b5b5;
}



/** footer **/
footer {    
    position: relative;
    top: 15px;
    width: 100%;   
    display: inline-block;
    border-top: 1px solid #000;
    background: #dadada none repeat scroll 0 0;
    color: #666;
    font-style: italic;
    margin: 0;
    text-align: center;
    padding: 20px 5px;
    
}
footer a {
	color: #666;
	font-weight: bold;
	text-decoration: none;
	/*border-bottom:1px solid #999;*/
}
footer a:hover { 
	color:#333; 
	border-bottom-color: #333; 
}


/** clear fix **/
.clear:after {
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}

.clear {
	display: block;
}

.table > tbody > tr > td, 
.table > tbody > tr > th, 
.table > tfoot > tr > td, 
.table > tfoot > tr > th, 
.table > thead > tr > td, 
.table > thead > tr > th {
    border-top: none;
}

/* *********** GRID filter ************* */
.filter {
    /*border: 1px solid #877A41;*/
    border-right: 2px solid #2f2f2f; 
    border-left: 2px solid #2f2f2f;
    border-top: 2px solid #2f2f2f;
    background: #dadada none repeat scroll 0 0;
    padding: 3px 2px;
}
.filter input[type="checkbox"] {
    position: relative;
    top: 6px;
    width: auto;
}

/* **************** GRIDVIEW CSS *************** */
.Grid {
    background: #fff none repeat scroll 0 0;
    border: 2px solid #2F2F2F;
}
    .Grid th a {
        color: #877A41;
    }
        .Grid th a:hover {
            color: #999966;
            text-decoration: none;
        }
    
    .Grid tr:nth-of-type(even),
    .GridRow {    
        background: #fff none repeat scroll 0 0;
    }
    .Grid tr:nth-of-type(odd),
    .GridAlternateRow,
    .table-striped > tbody > tr.GridAlternateRow:nth-of-type(2n+1),
    .table-striped > tbody > tr:nth-of-type(2n+1)
    {    
        background: #dedede none repeat scroll 0 0;
    }
    .Grid tr td {
        border: none;
    }
    /* list: Convert single cell table into a horizontal list */
    .Grid.list tr td {
        border: none;
        float: left;
        width: auto;
    }

    .GridFooter     
    {
        
    }
        .GridFooter table
        {
            display: block;
            width: 100%;
        }
        .GridFooter tr,
        .GridFooter tr:nth-of-type(2n+1)
        {
            background: transparent;
        }
        .GridFooter th,
        .GridFooter td {
            padding: 5px;            
        }
        /* altre pagine */
        .GridFooter a {
            background: #877A41 none repeat scroll 0 0;
            border-radius: 10px;
            color: #fff;
            font-size: 1em;
            padding: 3px 7px;
            width: auto;
            display: block;
            text-align: center;
        }
            .GridFooter a:hover
            {
	    	    background: #999966 none repeat scroll 0 0;
                border-radius: 12px;
                text-decoration: none;
    	    }
    	/* pagina selezionata */
        .GridFooter span {
            background: #aaa none repeat scroll 0 0;
            border-radius: 12px;
            color: #fff;        
            padding: 10px 15px;
            width: auto;
        }

/* ************** */
.UserInfo
{
    background: #877A41 none repeat scroll 0 0;
    border-radius: 7px;
    /*color: #eee;*/
    font-weight: bold;
    padding: 6px 10px;
    position: absolute;
    right: 19px;
    top: 1px;
    width: auto;
    z-index: 100;
    float: right;
}
    .UserInfo,
    .UserInfo a 
    {
        color: #eee;
    }
    .UserInfo a:hover {
        color: #fff;
        text-decoration: none;
    }  
.Help,
.customTooltip {
    background: #FFFFCC none repeat scroll 0 0;
    color: #000;
    border: 2px solid #999966;
    line-height: 1.5em;
}
.customTooltip 
{
    color: #444;
    font-size: 1.5em;  
    font-weight: bold;  
    line-height: 1.5em;
}
.MsgSuccess, ins
{
    background: #D5D5A2 none repeat scroll 0 0;
    border-radius: 10px 10px 10px 10px;
    padding: 4px;
    color: #202000;
    font-size: 1.4em;
    line-height: 1.4em;
}
.MsgError, del
{
    /*background: #ffe0e0 none repeat scroll 0 0;*/
    border-radius: 10px 10px 10px 10px;
    padding: 4px;
    color: #800000;
    font-size: 1.4em;
    line-height: 1.4em;
}
.HtmlBox01 
{
    display: block;
    position: relative;
    overflow: auto;
    width: 100%;
    margin: 0px;
    padding: 0px;
    border: 1px solid purple;
}
.ImageMenu {
    margin: 10% 0 0;
    width: 100%;
}
.textMenu 
{
    float: right;
    color: #fff;    
    font-size: 1.4em;
    line-height: 0.6em;
}
/* ************ Box over everything ********** */
.semiTransparent {
    background: rgba(210, 220, 255, 0.9) none repeat scroll 0 0;
    /*border: 1px solid red;*/
    height: 100%;
    left: 0;
    margin: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;
}
.floatBox {
    position: absolute;
    margin: 0;    
    z-index: 100;
    top: 1%;
    left: 1%;
    width: 98%;
}

.ImgCentered 
{
    width: 20%;
    left:  40%;
    position: relative
}
.showCase {
    height: auto;
    max-height: 230px; /*270px 50%;*/
    max-width: 250px; /*100%;*/    
    width: auto;
    border-radius: 10px;
}
.showCaseFont
{
    color: #ff7000;
    font-size: 1.4em;
    padding: 0 0 10px;
    font-weight: bold;    
}
.showCaseDetail {
    height: auto;
    max-height: 450px; /* 550px 50%;*/
    max-width: 100%;    
    width: auto;
    margin: 4px;
}
/* show more.. from box */
.showcaseMore {
    width: 100%;
    display: flex;
    max-height: 230px;
    overflow-x: auto;
    overflow-y: hidden;
}
    .showcaseMore div {
        float: left;
    }

.showCaseImage {
    float: left;
    /*width: 40%;*/
    margin: 10px;    
}

.AsideBox {
    background: #ffffcc none repeat scroll 0 0;
    border: 2px solid #999966;
    color: #000;
    margin: 0;
    padding: 2%;
    display: inline-block;
    width: 30%;
}
    .AsideBox input 
    {
        width: 100%;
    }

/* ********* scroll to top ************ */
.scrollToTop {
    background: #9a9a9a none repeat scroll 0 0;
    color: #000;
    display: block;
    font-size: 4em;
    height: 36px;
    opacity: 0.57;
    padding: 1px;
    position: fixed;
    right: 0;
    bottom: 30%;
    text-align: center;
    vertical-align: top;
    top: auto;
    width: 35px;
    z-index: 100;
    cursor: pointer;
    border-radius: 10px;
}
    .scrollToTop:hover {
        background: #eee none repeat scroll 0 0;
    }
    .scrollToTop.glyphicon {
        top: auto;
        font-size: 3.3em;
    }

/* *************** Object preview ************ */  
.ObjectPreview 
{
	background: #ffcbbf none repeat scroll 0 0;
    border: 5px solid #877A41;
    border-radius: 10px;
    display: table; /*inline-block;*/
    min-height: 100px; /*300px;*/
    max-height: 300px;    
    width: 200px;	
    margin: 1px;
    padding: 10px;    
    vertical-align: top;
    float: left;
    
    -moz-transition: all .2s ease-in;
    -o-transition: all .2s ease-in;
    -webkit-transition: all .2s ease-in;
    transition: all .2s ease-in;
}
    .ObjectPreview:hover
    {
        background: #B7DBFF none repeat scroll 0 0;
    }
    
    .ObjectPreview.Dark {
        background: #280A4C none repeat scroll 0 0;
        border: 5px solid #8052AB;
        border-radius: 10px;
    }
    .ObjectPreview.Dark:hover
    {
        background: #990099 none repeat scroll 0 0;
    }
	.ObjectPreview img:nth-child(1) 
	{	    
	    width: 100%;
		/*max-width: 100%;
		max-height: 190px;*/		
		float: left;
	}
	.ObjectPreview label {	
		color: #505050;
		float: left;
		font-family: arial;
		vertical-align: top;		
        width: 100%;
	}
	.ObjectPreview label.savePercentage
	{
	    color: #ff9020;
        font-size: 1em;
	}
    .ObjectPreview.Dark label {
        color: #aaa;
    }

	.ObjectPreview label 
	.ObjectPreview label:hover,
	.ObjectPreview a,
	.ObjectPreview a:hover {
		font-size: 1.0em;
	}
	.ObjectPreview a div,
	.ObjectPreview > div
	{
	    display: inline-block;
		max-height: 145px; /*175px;*/
		border-radius: 5px;
		overflow: hidden;
	}
	.ObjectPreview label strong {
		color: #ff7000;
		font-size: 1.5em;
	}
    .ObjectPreview.Dark label strong {
        color: #bfbfbf;
    }
    .ObjectPreview hr {
        margin: 1px 0px;
        border-color: #ff7000;
    }
    /* view mode very small */
    .ObjectPreview.verySmall 
    {
        border: 3px solid #ff7000;
        width: 118px; /*100px;	*/
        font-size: 0.8em;
    }
    .ObjectPreview.verySmall label.savePercentage
    {
        line-height: 1em;
        padding: 4px;
    }

.BigSpan span {
    font-size: 3em;
}
.savePercentage {
    background: #333333 none repeat scroll 0 0;
    border-radius: 5px;
    color: #ff9020;
    font-size: 1.2em;
    font-weight: bold;
    margin: 0 3px;
    padding: 5px 10px;
    line-height: 2em;
}
.iconShipping {
    margin: 5px;
    width: 70px;
    float: left;
}
.ui-datepicker-trigger {
    position: relative;
    top: -1px;
    width: 22px;
    left: 1px;
}
.ui-datepicker-year,
.ui-datepicker-month {
    color: #333;
}
.tictac {
    border-radius: 15px 0 15px 0;
}
.showtime {
    border-top: 5px solid #999966;    
    display: block;
    width: 200px;
    margin: 0;
    padding: 0;
}


/* Range Bar with gradient */
.rangeBox {    
    width: auto;
    height: 35px;
    display: inline-block;
    /*border-radius: 10px;*/
    border: 4px solid #ff7000;
    border-radius: 10px;
    /*outline: 5px solid #FFFFFF;*/
    background: #ffffcb; /*#fff;*/
    padding: 5px;
    margin: 5px;
}
.rangeBar {
    /*background: url(../img/gradient.png) left top repeat-y;*/
    background-size: 100%;
    height: 100%;
    display: block;
    border-radius: 10px;
    width: 16px;
    border: 1px solid #000;
    float: left;
    margin: 0 3px;
}

/* ************* efx **************** */
.rotate9time 
{
    animation: animation2Spin 0.2s linear 9;      
}
.rotateSome
{
    animation: animation2Spin 1s ease-out 1;      
}
/* Animation from orange dark to orange light */
@keyframes anination1 {
     0%   {border: 6px solid #DC3201;}
     50%  {border: 6px solid #FF9E4F;}
     100% {border: 6px solid #DC3201;}
}
@keyframes animation2Spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}
@keyframes animation3 {
    0% { transform: rotate(0deg);     opacity: 0.8; }
    50% { transform: rotate(360deg);  opacity: 0.5; }
    100% { transform: rotate(720deg); opacity: 0.8; }
}
@keyframes animation4 {
    0% {    color: #300; opacity: 1.0; }
    50% {   color: #900; opacity: 0.5; }
    100% {  color: #300; opacity: 1.0; }
}


.selected 
{   
    /* start */ 
    border: 6px solid #877A41;
    
    /* animation Safari 4.0 - 8.0 */
    -webkit-animation-name: anination1;
    -webkit-animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    /* animation Standard syntax */
    animation-name: anination1;
    animation-duration: 2s;
    animation-iteration-count: infinite;
}

.glyphicon 
{
    font-size: 1.1em;
}

.fb-like 
{
    width: 250px;
    overflow: hidden;
}

.TopSecretFont2 
{
    font-size: 1.4em;
}

.backgroundPaper 
{
    background: url("../img/paper.jpg");
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-color: #d8cb92;
    border: none;
}

/* ************************** Popup ******************* */
.Popup 
{
    background: rgba(210, 220, 255, 0.7) none repeat scroll 0 0;
    height: 100%;
    left: 0;
    margin: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 100;    
}
    

/* ************************** loading effect ******************* */
/* **** enable with SetLoader class *** */
#DivLoadingEffect
{
    background: rgba(210, 220, 255, 0.7) none repeat scroll 0 0;
    height: 100%;
    left: 0;
    margin: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 100;        
}
    #DivLoadingEffect label, 
    .DivPopupMessage span
    {
        font-size: 2.0em;
        text-shadow: 2px 2px 3px #ffe9e9;
        color: #300;
        background: rgba(255,255,255,0.9);
        padding: 0.5em;
        position: fixed;
        top: 1%;
        left: 1%;
        animation: animation4 2s linear infinite;
        line-height: 1em;
    }    
    .DivPopupMessage input 
    {
        position: fixed;
        bottom: 5%;
        width: 100%;
        height: 4em;
        
    }
    
    #DivLoadingEffect img
    {
        /*opacity: 0.8;*/
        position: fixed;
        width: 20%;
        left: 40%;
        top: 25%;
        z-index: 110;    
        animation: animation3 3s linear infinite;        
    }

.DivPopup
{    
    height: 100%;
    left: 0;
    margin: 0;
    position: relative;
    top: 0;
    width: 100%;
    z-index: 100;            
}

.ui-tabs .ui-tabs-panel 
{
    display: inline-block;
    width: 100%;
    overflow: auto;
}

.ui-widget-header 
{
     background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #ff8010), color-stop(1, #cf6010));
    background:-moz-linear-gradient(top, #ff8010 5%, #cf6010 100%);
    background:-webkit-linear-gradient(top, #ff8010 5%, #cf6010 100%);
    background:-o-linear-gradient(top, #ff8010 5%, #cf6010 100%);
    background:-ms-linear-gradient(top, #ff8010 5%, #cf6010 100%);
    background:linear-gradient(to bottom, #ff8010 5%, #cf6010 100%);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff8010', endColorstr='#cf6010',GradientType=0);
    background-color:#ff8010;
    border: 1px solid #cf6010;
}

/**
 REFLECTION
 *  <h3 id="h3Price" data-textreflection="---" class="reflection">
        <asp:Label ID="labelPRICE" runat="server" CssClass="LabelBox"></asp:Label>
    </h3>

    // ================================================================================================= //
    // FUNCTION - v1.0 - setup reflection text 
    // ================================================================================================= //
    function fnReflection() {
        $(".reflection").each(function (index) {
            //alert(index + ': ' + $(this).text());
            var tempText = $(this).text().trim();
            $(this).attr("data-textreflection", tempText);
        });        
    }

 */
.reflection {
  position: relative;
display: inline-block;
height: 2.1em;
overflow: hidden;
font-size: 2.2em;
margin: 0px;
}

.reflection:after {
    position: absolute;
    content: attr(data-textreflection);
    width: 100%;
    height: 1.6rem;
    top: 1.6rem;
    left: 0px;
    transform: scaleY(-1);
    transform-origin: bottom;
    opacity: 0.3;
}
/* ************** */
.PriceBox 
{
    display: inline-block;
    background: #ffd498;
    padding: 18px 0px 7px 15px;
    width: auto;
    border-radius: 10px;
}   
    .PriceBox del    
    {
        font-size: 1em;
        float: right;
    }
.infoBox 
{
    display: inline-block;
    float: left;
    border: 3px solid #FF8B2D;
    border-radius: 10px;
    margin: 5px 5px 5px 0px;
    padding: 5px;    
}
    .infoBox.grey {
        border: none;
        background: #f4f4f4;
    }
/* ********* text effects ********* */
		

.textOtto {
  color: #ff7000;
  text-shadow: 0 1px 0 #ccc,
               0 2px 0 #c9c9c9,
               0 3px 0 #bbb,
               0 4px 0 #b9b9b9,
               0 5px 0 #aaa,
               0 6px 1px rgba(0,0,0,.1),
               0 0 5px rgba(0,0,0,.1),
               0 1px 3px rgba(0,0,0,.3),
               0 3px 5px rgba(0,0,0,.2),
               0 5px 10px rgba(0,0,0,.25),
               0 10px 10px rgba(0,0,0,.2),
               0 20px 20px rgba(0,0,0,.15);
}				 

/* ** */
.textReflect {
    position: relative;
}
    .textReflect:before, 
    .textReflect:after {
        display: block;
        position: absolute;
        bottom: -.8em; 
        left: 0;
        right: 0;
    }
    .textReflect:before {
        content: attr(data-reflection);
        opacity: .3;

    
        -webkit-transform: scaleY(-1);
        -moz-transform: scaleY(-1);
        -o-transform: scaleY(-1);
        transform: scateY(-1);
    }
    .textReflect:after {
        background: -webkit-gradient(linear, left top, left center, from(rgba(255,255,255,0)), to(rgb(255,255,255)));
        background: -moz-linear-gradient(top, rgba(255,255,255,0), rgb(255,255,255));
        background: linear-gradient(top, rgba(255,255,255,0), rgb(255,255,255));
        content: ' ';
        height: 1em;
    }

/* ************* */
.background2 { background: url("../img/bkg2.jpg") left top repeat; }
.borderDefault {
    /*background: #ffeec9 none repeat scroll 0 0;    #ffcbbf */
    border: 5px solid #ff7000;  /* ffb747 */
    border-radius: 10px;
    display: table; /*inline-block;*/    
    margin: 1px;
    padding: 10px;        
}

.borderBox2
{
    border: 3px inset #FCC88D;
    background: rgba(255, 230, 180, 0.7);/*#FFF9DD;*/
    border-radius: 10px;
    padding: 10px;
}
/* **************** LOADER **************** */
.loader {
    color: #ff7000;
    font-size: 90px;
    text-indent: -9999em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    margin: 180px auto 10px;
    position: relative;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load6 1.7s infinite ease, round 1.7s infinite ease;
    animation: load6 1.7s infinite ease, round 1.7s infinite ease;
}
@-webkit-keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@keyframes load6 {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}
@-webkit-keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes round {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}


.ImageCenteredOverlay
{
    /*opacity: 0.8;*/
    position: fixed;
    width: 20%;
    left: 40%;
    top: 25%;
    z-index: 110;        
}

/* ************************** */
	
.CloseBox
{
    float: right;
    background: #FEF6CE;
    border: 1px solid #fdb902;
    border-radius: 4px 4px 4px 4px;
    color: #fd7e01;
    padding: 2px 4px;
    cursor: pointer;
    /*position: absolute;*/
    right: 39px;
    top: 12px;
}
.CloseBox:hover 
{
    color: #850600;
    background: #fd7e01;
}

.map_canvas {
    overflow: hidden;
    display: inline-block;

}	