﻿
/**************************          TREE STYLES          **************************/
/**   by Arc Software   **/                               /**   Created July-2013 **/
/***********************************************************************************/

#cmdSubmit {display:block;width:100px;}

#tree 
{
    /*width: 838px;*/
    padding: 10px;
    border:1px solid #B7C3CA;
}

#treeSelected {
    background: url("../images/icons/clearBasket.jpg") no-repeat scroll center 50px #b7c3ca;
    border-radius: 0 8px 8px 0;
    margin: 0;
    min-height: 100px;
}
#treeSelected h4{
    border-bottom: 1px dotted #808080;
    margin: 0 6px;
    padding: 8px 0 7px 6px;
}
#treeSelected ul {
    list-style: outside none none;
    margin: 0;
    padding: 0 6px 5px;
    min-height: 130px;
}
#treeSelected ul li {
    background-color: #DFEDCA;
    border-radius: 4px;
    display: inline-block;
    font-size: 11px;
    margin: 5px 5px 0 0;
    padding: 5px 7px;
    cursor:default;
}
#treeSelected ul li span   
{cursor:default;}
#treeSelected ul li span.selectedNodeRemove   
{
    background: url("../images/beta/betaimg-map.png") no-repeat scroll -130px -30px #DFEDCA;
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 11px;
    height: 16px;
    margin: 0 0 0 3px;
    text-indent: -900em;
    width: 16px;
}
#treeSelected ul li span.selectedNodeRemove:hover {background-color: #EC008C;background-position:-80px -30px;}

#treeSelected span.key {
    border-top: 1px dotted #808080;
    display: block;
    font-size: 11px;
    margin: 0 6px;
    padding: 6px 0 8px
}

#treeSelected p.boilerTxt {
    display: block;
    font-size: 14px;
    margin: 0 6px;
    padding: 76px 20px 40px;
    text-align: center;
}

/*******************************************************************************
/**************************/
/*       ICON LEVEL       */
/**************************/

 
ul.dynatree-container
{
    background-color: transparent;
    font-family: arial,helvetica,Verdana,Sans-Serif;
    margin: 0px;
    padding: 0 110px;
    padding: 0;
    white-space: nowrap;
}

ul.dynatree-container li
{
    list-style: none;
    /*background-color: white;*/
    display: block;
    margin: 0px 0 10px 0;
    width: 530px;
    min-height: 50px;
    position:relative;
    padding: 0 50px 0 0;
}

ul.dynatree-container .dynatree-folder
{
    background-color: #F26522;
    border: 0 none;
    height: auto;
    width: 48px;
    display: inline-block;
    vertical-align: top;
    position:absolute;
    top:0;
    bottom:0;
    cursor:pointer;
}
ul.dynatree-container .dynatree-folder:hover {background-color:#F26522;}

ul.dynatree-container .dynatree-folder .dynatree-children-selected
{display:none;}

ul.dynatree-container .dynatree-folder .dynatree-icon
{display:none;background: url("../images/beta/betaimg-map.png") no-repeat scroll -60px -53px #FFFFFF;}

ul.dynatree-container .dynatree-expander
{display:block;height:50px;width:48px;position:absolute;top:0px; bottom:0px;}

ul.dynatree-container li .dynatree-title-p
{
    background: url("../images/beta/betaimg-map.png") no-repeat scroll 504px -88px #FFFFFF;
    color: #000000;
    display: inline-block;
    font-size: 16px;
    line-height: 1.4;
    margin: 0 0 0 50px;
    min-height: 22px;
    padding: 13px 40px 14px 8px;
    white-space: normal;
    width: 482px;

    background-color:#e5e9ec;
}

ul.dynatree-container li:hover .dynatree-title-p
{
    background-position: 504px -128px;
    background-color:#F26522;
    color:#FFFFFF;
}

ul.dynatree-container .dynatree-expanded .dynatree-title-p
{display: none;}

ul.dynatree-container ul
{
    background-color: white;
    border-left: 2px solid white;
    display: inline-block;
    margin: 0 0 0 48px;
    padding: 0;
    width: 100%;
}

ul.dynatree-container .dynatree-expanded,
ul.dynatree-container .dynatree-expanded:hover {background-color:#F26522;bottom:-2px;}
/*ul.dynatree-container .dynatree-expanded .dynatree-icon,
ul.dynatree-container .dynatree-expanded:hover .dynatree-icon {display:none;}*/

.dynatree-expander {background: url(../images/beta/betaimg-map.png) no-repeat scroll -300px -60px transparent;}

.Book .dynatree-expander {background-position:-300px -60px;}
.Online .dynatree-expander {background-position:-300px -260px;}
.Broadcast .dynatree-expander {background-position:-300px -160px;}
.Advert .dynatree-expander {background-position:-300px -110px;}
.Copy .dynatree-expander {background-position:-300px -210px;}
.Performance .dynatree-expander {background-position:-300px -310px;}

/*JS*/

/*ul.dynatree-container li:hover .Book .dynatree-expander {background-position:-143px -134px;}
ul.dynatree-container li:hover .Online .dynatree-expander {background-position:-243px -134px;}
ul.dynatree-container li:hover .Broadcast .dynatree-expander {background-position:-193px -134px;}
ul.dynatree-container li:hover .Advert .dynatree-expander {background-position:-293px -134px;}
ul.dynatree-container li:hover .Copy .dynatree-expander {background-position:-343px -134px;}
ul.dynatree-container li:hover .Performance .dynatree-expander {background-position:-403px -134px;}

ul.dynatree-container li:hover .Book .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-143px -14px;}
ul.dynatree-container li:hover .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-243px -14px;}
ul.dynatree-container li:hover .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-193px -14px;}
ul.dynatree-container li:hover .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-293px -14px;}
ul.dynatree-container li:hover .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-343px -14px;}
ul.dynatree-container li:hover .dynatree-expanded .dynatree-expander,
ul.dynatree-container li .dynatree-expanded .dynatree-expander {background-position:-403px -14px;}*/



/**************************/
/*        LEVEL 1         */
/**************************/

ul.dynatree-container ul .dynatree-expanded,
.dynatree-lastsib {display: block; margin-bottom:0px;}

ul.dynatree-container ul li
{
    display: block;
    margin: 0;
    padding: 0;
    width: 100%;
    background: none;
    min-height: 28px;
}

ul.dynatree-container ul .dynatree-folder
{
    background: none repeat scroll 0 0 #657078 !important;
    display: block;
    margin-left: 0px;
    height: 28px;
    text-indent: 0;
    visibility: visible;
    width: 100%;
    border:0;
    position:static;
}
ul.dynatree-container ul .dynatree-folder:hover
{
    background-color: #5d666e !important;
}
ul.dynatree-container ul .dynatree-node
{
    background-color:white;
    display: block;
    height: 28px;
    width: 100%;
    position: relative;
    border-top: 2px solid #EFEFEB;
}
ul.dynatree-container ul .dynatree-node:hover
{
    background-color:#DFEDCA;
}
ul.dynatree-container ul .dynatree-node .dynatree-icon
{
    display:block;
    height:20px;
    width:81px;
    background:url("../images/beta/betaimg-map.png") no-repeat scroll -80px -53px rgba(0, 0, 0, 0);
    position:absolute;
    top: 5px;
    right: 5px;
    cursor:pointer;
}
ul.dynatree-container ul .dynatree-node:hover .dynatree-icon {background-position:-80px -78px;}

ul.dynatree-container ul .dynatree-folder .dynatree-icon {background-position: -2px -143px;width:20px;}
ul.dynatree-container ul .dynatree-folder:hover .dynatree-icon {background-position: -2px -183px;}

ul.dynatree-container ul .dynatree-expander
{display:none;}

ul.dynatree-container ul .dynatree-node .dynatree-title
{font-size: 12px;display:block;background:transparent;width:auto;position:static;padding:5px 0 4px 16px;text-decoration:none;color:black;}
ul.dynatree-container ul .dynatree-node .dynatree-title:after {content:"";}

ul.dynatree-container ul .dynatree-node:hover .dynatree-title
{color:#000000;}

ul.dynatree-container ul .dynatree-folder .dynatree-title,
ul.dynatree-container ul .dynatree-folder:hover .dynatree-title {color:#FFFFFF;margin: 2px 0;}
ul.dynatree-container ul .dynatree-folder .dynatree-title:after {content:"...";}

ul.dynatree-container ul .dynatree-folder .dynatree-children-selected
{
    display:none;
    /*height:20px;
    width:20px;
    background: url(/images/tree-icons.png) no-repeat scroll -58px -7px transparent;
    color:#598527;
    position:relative;
    top: -22px;
    right: -400px;*/
}

ul.dynatree-container ul li:first-child .dynatree-node {border-top:2px solid #FFFFFF;}

ul.dynatree-container ul .node {background-color:#657078;}
ul.dynatree-container ul .node .dynatree-icon {display:block;}
ul.dynatree-container ul .node:hover .dynatree-icon {background-position:-80px -78px;}
ul.dynatree-container ul .node .dynatree-title {color:#FFFFFF;}
ul.dynatree-container ul .node:hover .dynatree-title {color:#000000;}
ul.dynatree-container ul .node:hover {background-color:#DFEDCA;}

ul.dynatree-container ul ul
{
    margin: 0px;
    border-left:0;
    background: white;
}



/**************************/
/*        LEVEL 2         */
/**************************/

ul.dynatree-container ul ul li
{}

ul.dynatree-container ul ul .dynatree-folder
{
    height: 28px;
    width: 100%;
    background: #B7C3CA !important;
    display: block;
}

ul.dynatree-container ul ul .dynatree-folder:hover{background-color: #A4B2BE !important;}

ul.dynatree-container ul ul .dynatree-folder .dynatree-icon {background-position: -2px -103px;}
ul.dynatree-container ul ul .dynatree-folder .dynatree-title {color:black;}

ul.dynatree-container ul ul .dynatree-folder:hover .dynatree-title{color: black !important;}

ul.dynatree-container ul ul .dynatree-node,
ul.dynatree-container ul li:first-child ul .dynatree-node {border-top:2px solid #EFEFEF !important;}

ul.dynatree-container ul ul .node {background-color:#B7C3CA;}
ul.dynatree-container ul ul .node .dynatree-icon {}
ul.dynatree-container ul ul .node:hover .dynatree-icon {}
ul.dynatree-container ul ul .node .dynatree-title,
ul.dynatree-container ul ul .node:hover .dynatree-title {color:black;}
ul.dynatree-container ul ul .node:hover {background-color:#DFEDCA;}

ul.dynatree-container ul ul ul
{}

/**************************/
/*        LEVEL 3         */
/**************************/

ul.dynatree-container ul ul ul li
{}

ul.dynatree-container ul ul ul .dynatree-folder
{
    height: 28px;
    width: 100%;
    background: #DCDCDC !important;
    display: block;
}

ul.dynatree-container ul ul ul .dynatree-folder:hover
{
    background-color: #CFCFCF !important;
}

ul.dynatree-container ul ul ul .dynatree-folder .dynatree-children-selected
{background: url(/images/tree-icons.png) no-repeat scroll -58px -58px transparent;}

/*********** Selected Rows *************/

ul.dynatree-container ul .dynatree-selected,
ul.dynatree-container ul ul .dynatree-selected,
ul.dynatree-container ul ul ul .dynatree-selected,
ul.dynatree-container ul ul ul ul .dynatree-selected {background: #dfedca;}
ul.dynatree-container ul .dynatree-selected .dynatree-icon,
ul.dynatree-container ul ul .dynatree-selected .dynatree-icon,
ul.dynatree-container ul ul ul .dynatree-selected .dynatree-icon,
ul.dynatree-container ul ul ul ul.dynatree-selected .dynatree-icon {background:url("../images/beta/betaimg-map.png") no-repeat scroll -80px -103px rgba(0, 0, 0, 0);}
ul.dynatree-container ul .dynatree-selected .dynatree-title,
ul.dynatree-container ul ul .dynatree-selected .dynatree-title,
ul.dynatree-container ul ul ul .dynatree-selected .dynatree-title,
ul.dynatree-container ul ul ul ul .dynatree-selected .dynatree-title {color: #598527;font-style:italic;}

ul.dynatree-container ul .dynatree-selected:hover,
ul.dynatree-container ul ul .dynatree-selected:hover,
ul.dynatree-container ul ul ul .dynatree-selected:hover {background: #cdec9d;}
ul.dynatree-container ul .dynatree-selected:hover .dynatree-icon {background: url(../images/beta/betaimg-map.png) no-repeat scroll -80px -128px transparent;cursor:pointer;}
ul.dynatree-container ul .dynatree-selected:hover .dynatree-title,
ul.dynatree-container ul ul .dynatree-selected:hover .dynatree-title,
ul.dynatree-container ul ul ul .dynatree-selected:hover .dynatree-title {color: #598527;}


/*********************************************************/
/*   #TreeSelected Styles   */
/*********************************************************/

#treeSelected ul.dynatree-container
{
    background-color: transparent;
    font-family: arial,helvetica,Verdana,Sans-Serif;
    margin: 5px 0px;
    padding: 10px;
    white-space: nowrap;
}

#treeSelected ul.dynatree-container li
{
    display: block;
    list-style: none outside none;
    margin: 2px 0 0;
    min-height: 30px;
    position: relative;
    width: auto;
    padding: 0 0px 0 0;
}
#treeSelected ul.dynatree-container li:hover
{
    background-color: transparent;
}

#treeSelected ul.dynatree-container .dynatree-folder
{
    display:none;
}

#treeSelected ul.dynatree-container .dynatree-node
{    
    display: block;
    background-color: #8DC63F;
    height: 30px;
    padding: 0 35px 0 0;
    border-radius: 4px;
}
#treeSelected ul.dynatree-container .dynatree-node:hover
{    
    background-color: #7eb434;
    background-color: #f06ea9;
}
 
#treeSelected ul.dynatree-container .dynatree-icon {display:none;}
#treeSelected ul.dynatree-container .dynatree-node .dynatree-connector{display:none;}
#treeSelected ul.dynatree-container .dynatree-node:hover .dynatree-connector
{   
    display:block; 
    border-radius:0 6px 6px 0;
    height: 30px;
    position: absolute;
    right: 0px;
    top: 0px;
    width: 30px;
    background: url(/images/tree-icons.png) no-repeat scroll -7px -104px #dd5e98;
}

#treeSelected ul.dynatree-container .dynatree-title
{    
    color: black;
    display: block;
    font-size: 12px;
    padding: 8px;
    text-decoration: none;
}
#treeSelected ul.dynatree-container .dynatree-title:after {content:"";}

#treeSelected ul.dynatree-container .dynatree-node:hover .dynatree-title {color:white;}

.buttonBar
{
    position:absolute;
    width:100%;
    bottom:0;
    left:0;
    height:40px;
    border:1px solid red;
}

/*********************************************************************/

.existProjContainer {
    min-height: 120px;
}

.existProjContainer p {
    font-size: 12px;
    line-height: 1.5;
    margin: 8px 0;
}

.existProjContainer .rightColumn a:hover {
    background-color: #f26522;
    color: #fff;
    cursor:pointer;
    background-position:92px -253px;
}
/*.existProjContainer .formBlock { 
    margin:25px 0;
}
.existProjContainer .formLabel { 
    text-align: left;
    width: 90px;
}
.existProjContainer .formObject { 
    display: inline-block;
    max-width: none;
    width: 220px;
}*/
.existProjContainer .formObject select {width: 100%;}

.usageIntroContainer {
    margin: 0 0 30px;
    font-size:0;
 
    background-color: #e5e9ec;
    border-radius: 10px;
    margin: 30px 10px;
    padding: 20px;
}
.usageIntroContainer .column {
    box-sizing: border-box;
    display: inline-block;
    margin-top: 30px;
    padding: 0 30px;
    text-align: center;
    vertical-align: top;
    width: 33.3%;
}
.usageIntroContainer .column.middle {border-right:1px solid silver;border-left:1px solid silver;}
.usageIntroContainer .column p {color: gray;}

h4.icoExistProj {
    background-image:url(../images/beta/Clear_hexagons.png);
    background-repeat: no-repeat;
    margin: 30px 0 10px;
    max-height: 32px;
    padding:16px 0 20px 65px;
}
h4.icoExistProj {margin: 0 0 10px;}

.selectedCategories {
    display: inline-block;
    margin-left: -5px;
    vertical-align: top;
    width: 248px;
}

.categoryContainer {
    display: inline-block;
    width: 600px;
}

.contentReuseQuestion {
    border-top: 1px solid #b7c3ca;
    border-bottom: 1px solid #b7c3ca;
    padding: 0 0 10px;

    background-color: #fff;
    margin: 0 0 15px;
    padding: 10px;
}
.contentReuseQuestion h2 {
    display: inline-block;
    margin: 38px 0;
    color:#F26522;

    color: #000 !important;
}

.contentReuseQuestion.collapsed {border-top:0;}
.contentReuseQuestion.collapsed h2 {
    background: url("../images/beta/clear_Hexagons.png") no-repeat scroll 0 -1478px transparent;
    color: #657078;
    font-size: 18px;
    margin: 8px 0 4px;
    padding: 2px 0 2px 35px;
}

.usageSwitchContainer {
    display: inline;
    margin-left: 20px;
}
.usageSwitch {
    display: inline-block;
    margin-left: 10px;
}

.usageSwitch label {  
    border-radius: 4px;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    margin-right: 10px;
    padding: 10px 10px 10px 36px;
    position: relative;   
}
.usageSwitch label:hover {background-color: #dfedca;}

.usageSwitch input[type=radio] {display: none;} 
/*Above hides the input, below adds a pseudo input before the label...*/ 
.usageSwitch label:before {  
    background-color: #dcdcdc;
    border-radius: 16px;
    bottom: 10px;
    box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.3) inset, 0 1px 0 0 rgba(255, 255, 255, 0.8);
    content: "";
    display: inline-block;
    height: 20px;
    left: 7px;
    margin-right: 10px;
    position: absolute;
    width: 20px;  
}
.usageSwitch input[type=radio]:checked + label:before {  
    color: #222f2f;
    content: "\2022";
    font-size: 42px;
    line-height: 20px;
    text-align: center;  
}
/*.usageSwitch input{
    background-color: #b7c3ca;
    border: 2px solid transparent;
    box-sizing: border-box;
    color: #222f2f;
    display: inline-block;
    float: right;
    font-size: 12px;
    margin: 1px 0 0 5px;
    padding: 8px 20px;
    text-decoration: none;
}*/




.icoNewProj {background-position:0 -1074px;}
.icoExistProj {background-position:0 -1084px;}