.interactive[tribe] {
   display: none;
   position: absolute;
   left: 228px;
   top: 80px;
}

.interactive[tribe].active {
   display: block;
   transform: scale(1.09796296296);
   z-index: 900;
}

.interactive[tribe] div[section] {
   position: absolute;
   background-position: center center;
   background-repeat: no-repeat;
   background-size: 100% !important;
}

.interactive[tribe] div[section="base"] {
   cursor: default !important;
}

.interactive div[section]:hover {
   cursor: pointer;
}

.interactive div[section="introduction"].hover,
.interactive div[section="introduction"] {
   width: 272px;
   height: 271px;
   border: 1px solid transparent;
   border-radius: 50%;
   background-image: url("../images/interactive/introduction.png");
   background-size: contain !important;
   background-position: 1px center !important;
   z-index: 1;
}

.interactive div[section="introduction"].hover,
.interactive div[section="introduction"]:hover {
   background-image: url("../images/interactive/introduction-hover.png");
}

/*start blackfoot*/
.interactive[tribe="blackfoot"] div[section="base"] {
   top: 12px;
   left: 16px;
   width: 245px;
   height: 247px;
   background-image: url("../images/interactive/blackfoot/base.png");
   background-size: 103% !important;
   z-index: 1;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="blackfoot"] div[section="tipi-circle-model"],
.interactive[tribe="blackfoot"] div[section="tipi-circle-model"].hover,
.interactive[tribe="blackfoot"] div[section="tipi-circle-model"]:hover {
   top: -5px;
   left: 17px;
   width: 242px;
   height: 129px;
   background-image: url("../images/interactive/blackfoot/tipi-circle-model.png");
   z-index: 3;
   clip-path: polygon(50% 0%, 70% 39%, 80% 60%, 100% 100%, 77% 100%, 49% 23%, 19% 100%, 0 105%, 14% 67%, 28% 37%);
}

.interactive[tribe="blackfoot"] div[section="tipi-circle-model"].hover,
.interactive[tribe="blackfoot"] div[section="tipi-circle-model"]:hover {
background-image: url("../images/interactive/blackfoot/tipi-circle-model-hover.png");
}

.interactive[tribe="blackfoot"] div[section="elder"],
.interactive[tribe="blackfoot"] div[section="elder"].hover,
.interactive[tribe="blackfoot"] div[section="elder"]:hover {
   top: 123px;
   left: 216px;
   width: 20px;
   height: 17px;
   background-image: url("../images/interactive/blackfoot/elders.png");
   z-index: 4;
}

.interactive[tribe="blackfoot"] div[section="elder"].hover,
.interactive[tribe="blackfoot"] div[section="elder"]:hover {
   background-image: url("../images/interactive/blackfoot/elders-hover.png");
}

.interactive[tribe="blackfoot"] div[section="ceremonialist"],
.interactive[tribe="blackfoot"] div[section="ceremonialist"].hover,
.interactive[tribe="blackfoot"] div[section="ceremonialist"]:hover {
   top: 125px;
   left: 40px;
   width: 20px;
   height: 17px;
   background-image: url("../images/interactive/blackfoot/ceremonialist.png");
   z-index: 4;
}

.interactive[tribe="blackfoot"] div[section="ceremonialist"].hover,
.interactive[tribe="blackfoot"] div[section="ceremonialist"]:hover {
   background-image: url("../images/interactive/blackfoot/ceremonialist-hover.png");
}

.interactive[tribe="blackfoot"] div[section="bundles"],
.interactive[tribe="blackfoot"] div[section="bundles"].hover,
.interactive[tribe="blackfoot"] div[section="bundles"]:hover  {
   top: 121px;
   left: 61px;
   width: 24px;
   height: 24px;
   background-image: url("../images/interactive/blackfoot/bundles.png");
   z-index: 4;
   clip-path: circle(47% at 50% 50%);
}

.interactive[tribe="blackfoot"] div[section="bundles"].hover,
.interactive[tribe="blackfoot"] div[section="bundles"]:hover {
   background-image: url("../images/interactive/blackfoot/bundles-hover.png");
}

.interactive[tribe="blackfoot"] div[section="societies"],
.interactive[tribe="blackfoot"] div[section="societies"].hover,
.interactive[tribe="blackfoot"] div[section="societies"]:hover {
   top: 84px;
   left: 76px;
   width: 127px;
   height: 94px;
   background-image: url("../images/interactive/blackfoot/societies.png");
   z-index: 3;
   clip-path: ellipse(61% 40% at 50% 50%);
}

.interactive[tribe="blackfoot"] div[section="societies"].hover,
.interactive[tribe="blackfoot"] div[section="societies"]:hover {
background-image: url("../images/interactive/blackfoot/societies-hover.png");
}

.interactive[tribe="blackfoot"] div[section="dance"],
.interactive[tribe="blackfoot"] div[section="dance"].hover,
.interactive[tribe="blackfoot"] div[section="dance"]:hover {
   top: 87px;
   left: 18px;
   width: 241px;
   height: 92px;
   background-image: url("../images/interactive/blackfoot/dance.png");
   z-index: 2;
   clip-path: ellipse(50% 50% at 50% 50%);
}

.interactive[tribe="blackfoot"] div[section="dance"].hover,
.interactive[tribe="blackfoot"] div[section="dance"]:hover {
   background-image: url("../images/interactive/blackfoot/dance-hover.png");
}
/*end blackfoot*/

/*start cree*/
.interactive[tribe="cree"] div[section="base"] {
   top: 9px;
   left: 15px;
   width: 244px;
   height: 251px;
   background-image: url("../images/interactive/cree/base.png");
   background-size: 101% !important;
   z-index: 1;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="cree"] div[section="centre"],
.interactive[tribe="cree"] div[section="centre"].hover,
.interactive[tribe="cree"] div[section="centre"]:hover {
   top: 122px;
   left: 118px;
   width: 37px;
   height: 21px;
   background-image: url("../images/interactive/cree/centre.png");
   z-index: 4;
}

.interactive[tribe="cree"] div[section="centre"].hover,
.interactive[tribe="cree"] div[section="centre"]:hover {
   background-image: url("../images/interactive/cree/centre-hover.png");
}

.interactive[tribe="cree"] div[section="tipi-ceremony"],
.interactive[tribe="cree"] div[section="tipi-ceremony"].hover,
.interactive[tribe="cree"] div[section="tipi-ceremony"]:hover {
   top: 143px;
   left: -32px;
   width: 316px;
   height: 110px;
   background-image: url("../images/interactive/cree/ceremony.png");
   background-position: center -17px !important;
   z-index: 3;
   clip-path: circle(46.9% at 53% 0%);
   transform: rotate(1deg) scaleX(1.02);
}

.interactive[tribe="cree"] div[section="tipi-ceremony"].hover,
.interactive[tribe="cree"] div[section="tipi-ceremony"]:hover {
   background-image: url("../images/interactive/cree/ceremony-hover.png");
   background-position: center -17px !important; 
}


.interactive[tribe="cree"] div[section="tipi-structure"],
.interactive[tribe="cree"] div[section="tipi-structure"].hover,
.interactive[tribe="cree"] div[section="tipi-structure"]:hover {
   top: -27px;
   left: 46px;
   width: 178px;
   height: 115px;
   background-image: url("../images/interactive/cree/tipi-structure.png");
   z-index: 4;
   clip-path: polygon(50% 0%, 69% 17%, 100% 0, 84% 43%, 70% 79%, 51% 71%, 32% 77%, 16% 43%, 0 0, 33% 16%);
}

.interactive[tribe="cree"] div[section="tipi-structure"].hover,
.interactive[tribe="cree"] div[section="tipi-structure"]:hover {
   background-image: url("../images/interactive/cree/tipi-structure-hover.png");
}

.interactive[tribe="cree"] div[section="tipi-poles"],
.interactive[tribe="cree"] div[section="tipi-poles"].hover,
.interactive[tribe="cree"] div[section="tipi-poles"]:hover {
   top: 6px;
   left: 14px;
   width: 242px;
   height: 129px;
   background-image: url("../images/interactive/cree/tipi-pole.png");
   z-index: 3;
   clip-path: polygon(50% 0, 83% 40%, 100% 100%, 50% 12%, 0 100%, 15% 39%);
   clip-path: polygon(50% 0, 83% 40%, 100% 96%, 50% 12%, 0 100%, 7% 39%);
}

.interactive[tribe="cree"] div[section="tipi-poles"].hover,
.interactive[tribe="cree"] div[section="tipi-poles"]:hover {
   background-image: url("../images/interactive/cree/tipi-pole-hover.png");
}

.interactive[tribe="cree"] div[section="east"],
.interactive[tribe="cree"] div[section="east"].hover,
.interactive[tribe="cree"] div[section="east"]:hover {
   top: 102px;
   left: 141px;
   width: 112px;
   height: 63px;
   background-image: url("../images/interactive/cree/east.png");
   z-index: 3;
}

.interactive[tribe="cree"] div[section="east"].hover,
.interactive[tribe="cree"] div[section="east"]:hover {
   background-image: url("../images/interactive/cree/east-hover.png");
}

.interactive[tribe="cree"] div[section="south"],
.interactive[tribe="cree"] div[section="south"].hover,
.interactive[tribe="cree"] div[section="south"]:hover {
   top: 105px;
   left: 61px;
   width: 151px;
   height: 97px;
   background-image: url("../images/interactive/cree/south.png");
   z-index: 3;
   clip-path: polygon(45% 25%, 47% 25%, 100% 58%, 80% 92%, 11% 90%, -3% 50%);
}

.interactive[tribe="cree"] div[section="south"].hover,
.interactive[tribe="cree"] div[section="south"]:hover {
   background-image: url("../images/interactive/cree/south-hover.png");
}

.interactive[tribe="cree"] div[section="west"],
.interactive[tribe="cree"] div[section="west"].hover,
.interactive[tribe="cree"] div[section="west"]:hover {
   top: 94px;
   left: 18px;
   width: 112px;
   height: 76px;
   background-image: url("../images/interactive/cree/west.png");
   z-index: 2;
}

.interactive[tribe="cree"] div[section="west"].hover,
.interactive[tribe="cree"] div[section="west"]:hover {
   background-image: url("../images/interactive/cree/west-hover.png");
}

.interactive[tribe="cree"] div[section="north"],
.interactive[tribe="cree"] div[section="north"].hover,
.interactive[tribe="cree"] div[section="north"]:hover {
   top: 68px;
   left: 57px;
   width: 158px;
   height: 89px;
   background-image: url("../images/interactive/cree/north.png");
   z-index: 2;
   clip-path: polygon(20% 11%, 78% 11%, 100% 43%, 50% 87%, 48% 88%, 0 40%);
}

.interactive[tribe="cree"] div[section="north"].hover,
.interactive[tribe="cree"] div[section="north"]:hover {
   background-image: url("../images/interactive/cree/north-hover.png");
}

.interactive[tribe="cree"] div[section="the-drum"],
.interactive[tribe="cree"] div[section="the-drum"].hover,
.interactive[tribe="cree"] div[section="the-drum"]:hover {
   top: 139px;
   left: 13px;
   width: 243px;
   height: 86px;
   background-image: url("../images/interactive/cree/drum.png");
   z-index: 3;
   clip-path: polygon(49% 40%, 72% 35%, 100% 2%, 96% 100%, 70% 100%, 52% 100%, 30% 100%, 4% 100%, 0 0, 25% 32%);
}

.interactive[tribe="cree"] div[section="the-drum"].hover,
.interactive[tribe="cree"] div[section="the-drum"]:hover {
   background-image: url("../images/interactive/cree/drum-hover.png");
}
/*end cree*/

/*start ojibwe*/
.interactive[tribe="ojibwe"] div[section="base"] {
   top: 7px;
   left: 14px;
   width: 247px;
   height: 262px;
   background-image: url("../images/interactive/ojibwe/base.png");
   z-index: 1;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="ojibwe"] div[section="centre"],
.interactive[tribe="ojibwe"] div[section="centre"].hover,
.interactive[tribe="ojibwe"] div[section="centre"]:hover {
   top: 121px;
   left: 123px;
   width: 37px;
   height: 21px;
   background-image: url("../images/interactive/ojibwe/centre.png");
   z-index: 3;
}

.interactive[tribe="ojibwe"] div[section="centre"].hover,
.interactive[tribe="ojibwe"] div[section="centre"]:hover {
   background-image: url("../images/interactive/ojibwe/centre-hover.png");
}

.interactive[tribe="ojibwe"] div[section="east"],
.interactive[tribe="ojibwe"] div[section="east"].hover,
.interactive[tribe="ojibwe"] div[section="east"]:hover {
   top: 99px;
   left: 150px;
   width: 105px;
   height: 66px;
   background-image: url("../images/interactive/ojibwe/east.png");
   z-index: 2;
}

.interactive[tribe="ojibwe"] div[section="east"].hover,
.interactive[tribe="ojibwe"] div[section="east"]:hover {
   background-image: url("../images/interactive/ojibwe/east-hover.png");
}

.interactive[tribe="ojibwe"] div[section="south"],
.interactive[tribe="ojibwe"] div[section="south"].hover,
.interactive[tribe="ojibwe"] div[section="south"]:hover {
   top: 105px;
   left: 64px;
   width: 153px;
   height: 96px;
   background-image: url("../images/interactive/ojibwe/south.png");
   z-index: 2;
   clip-path: polygon(45% 25%, 47% 25%, 100% 58%, 80% 92%, 11% 90%, -3% 50%);
}

.interactive[tribe="ojibwe"] div[section="south"].hover,
.interactive[tribe="ojibwe"] div[section="south"]:hover {
   background-image: url("../images/interactive/ojibwe/south-hover.png");
}

.interactive[tribe="ojibwe"] div[section="west"],
.interactive[tribe="ojibwe"] div[section="west"].hover,
.interactive[tribe="ojibwe"] div[section="west"]:hover {
   top: 96px;
   left: 24px;
   width: 109px;
   height: 76px;
   background-image: url("../images/interactive/ojibwe/west.png");
   z-index: 2;
}

.interactive[tribe="ojibwe"] div[section="west"].hover,
.interactive[tribe="ojibwe"] div[section="west"]:hover {
   background-image: url("../images/interactive/ojibwe/west-hover.png");
}

.interactive[tribe="ojibwe"] div[section="north"],
.interactive[tribe="ojibwe"] div[section="north"].hover,
.interactive[tribe="ojibwe"] div[section="north"]:hover {
   top: 67px;
   left: 63px;
   width: 153px;
   height: 89px;
   background-image: url("../images/interactive/ojibwe/north.png");
   z-index: 2;
   clip-path: polygon(20% 11%, 100% 11%, 100% 43%, 50% 87%, 48% 88%, -1% 40%)
}

.interactive[tribe="ojibwe"] div[section="north"].hover,
.interactive[tribe="ojibwe"] div[section="north"]:hover {
   background-image: url("../images/interactive/ojibwe/north-hover.png");
}
/*end ojibwe*/

/*start mohawk*/
.interactive[tribe="mohawk"] div[section="base"] {
   top: 9px;
   left: 11px;
   width: 251px;
   height: 251px;
   background-image: url("../images/interactive/mohawk/base.png");
   z-index: 1;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="mohawk"] div[section="creation-of-the-world"],
.interactive[tribe="mohawk"] div[section="creation-of-the-world"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-the-world"]:hover {
   top: 231px;
   left: 117px;
   width: 38px;
   height: 37px;
   background-image: url("../images/interactive/mohawk/creation-of-the-world.png");
   z-index: 3;
}

.interactive[tribe="mohawk"] div[section="creation-of-the-world"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-the-world"]:hover {
   background-image: url("../images/interactive/mohawk/creation-of-the-world-hover.png");
}

.interactive[tribe="mohawk"] div[section="creation-of-the-twins"],
.interactive[tribe="mohawk"] div[section="creation-of-the-twins"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-the-twins"]:hover {
   top: 114px;
   left: 16px;
   width: 243px;
   height: 55px;
   background-image: url("../images/interactive/mohawk/creation-of-the-twins.png");
   z-index: 3;
   clip-path: ellipse(49% 48% at 50% 50%);
}

.interactive[tribe="mohawk"] div[section="creation-of-the-twins"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-the-twins"]:hover {
   background-image: url("../images/interactive/mohawk/creation-of-the-twins-hover.png");
}

.interactive[tribe="mohawk"] div[section="creation-of-humans"],
.interactive[tribe="mohawk"] div[section="creation-of-humans"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-humans"]:hover {
   top: 122px;
   left: 117px;
   width: 38px;
   height: 37px;
   background-image: url("../images/interactive/mohawk/creation-of-humans.png");
   z-index: 4;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="mohawk"] div[section="creation-of-humans"].hover,
.interactive[tribe="mohawk"] div[section="creation-of-humans"]:hover {
   background-image: url("../images/interactive/mohawk/creation-of-human-hover.png");
}

.interactive[tribe="mohawk"] div[section="four-sky-dwellers"],
.interactive[tribe="mohawk"] div[section="four-sky-dwellers"].hover,
.interactive[tribe="mohawk"] div[section="four-sky-dwellers"]:hover {
   top: 17px;
   left: 14px;
   width: 244px;
   height: 240px;
   background-image: url("../images/interactive/mohawk/four-sky-dwellers.png");
   background-position-y: -2px;
   z-index: 2;
   clip-path: polygon(22% 0, 78% 0%, 100% 34%, 100% 50%, 65% 52%, 41% 52%, 0 50%, 0 35%);
}

.interactive[tribe="mohawk"] div[section="four-sky-dwellers"].hover,
.interactive[tribe="mohawk"] div[section="four-sky-dwellers"]:hover {
   background-image: url("../images/interactive/mohawk/four-sky-dwellers-hover.png");
}

.interactive[tribe="mohawk"] div[section="peace-maker-prophecy"],
.interactive[tribe="mohawk"] div[section="peace-maker-prophecy"].hover,
.interactive[tribe="mohawk"] div[section="peace-maker-prophecy"]:hover {
   top: 40px;
   left: 122px;
   width: 29px;
   height: 84PX;
   background-image: url("../images/interactive/mohawk/peace-maker-prophecy.png");
   z-index: 3;
}

.interactive[tribe="mohawk"] div[section="peace-maker-prophecy"].hover,
.interactive[tribe="mohawk"] div[section="peace-maker-prophecy"]:hover {
   background-image: url("../images/interactive/mohawk/peace-maker-prophecy-hover.png");
}

.interactive[tribe="mohawk"] div[section="counting"],
.interactive[tribe="mohawk"] div[section="counting"].hover,
.interactive[tribe="mohawk"] div[section="counting"]:hover {
   top: 14px;
   left: 126px;
   width: 21px;
   height: 230px;
   background-image: url("../images/interactive/mohawk/counting.png");
   z-index: 2;
}

.interactive[tribe="mohawk"] div[section="counting"].hover,
.interactive[tribe="mohawk"] div[section="counting"]:hover {
   background-image: url("../images/interactive/mohawk/counting-hover.png");
}

.interactive[tribe="mohawk"] div[section="morning-prayer"],
.interactive[tribe="mohawk"] div[section="morning-prayer"].hover,
.interactive[tribe="mohawk"] div[section="morning-prayer"]:hover {
   top: -4px;
   left: 116px;
   width: 38px;
   height: 37px;
   background-image: url("../images/interactive/mohawk/morning-prayer.png");
   z-index: 2;
}

.interactive[tribe="mohawk"] div[section="morning-prayer"].hover,
.interactive[tribe="mohawk"] div[section="morning-prayer"]:hover {
   background-image: url("../images/interactive/mohawk/morning-prayer-hover.png");
}
/*end mohawk*/

/*start mikmaq*/
.interactive[tribe="mikmaq"] div[section="base"] {
   top: 9px;
   left: 11px;
   width: 252px;
   height: 253px;
   background-image: url("../images/interactive/mikmaq/base.png");
   z-index: 1;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="mikmaq"] div[section="1st-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="1st-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="1st-level-of-creation"]:hover {
   top: -37px;
   left: 55px;
   width: 178px;
   height: 115px;
   background-image: url("../images/interactive/mikmaq/1st-level-of-creation.png");
   z-index: 3;
   clip-path: polygon(50% 0%, 69% 17%, 100% 0, 84% 43%, 70% 79%, 51% 71%, 32% 77%, 16% 43%, 0 0, 33% 16%);
}

.interactive[tribe="mikmaq"] div[section="1st-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="1st-level-of-creation"]:hover {
   top:-40px;
   transform: scale(.82);
   background-image: url("../images/interactive/mikmaq/1st-level-of-creation-hover.png");
   clip-path: polygon(50% 0%, 69% 17%, 100% 0, 99% 43%, 70% 79%, 51% 71%, 32% 77%, 2% 43%, 0 0, 33% 16%);
}

.interactive[tribe="mikmaq"] div[section="2nd-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="2nd-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="2nd-level-of-creation"]:hover {
   top: 105px;
   left: 117px;
   width: 48px;
   height: 48px;
   background-image: url("../images/interactive/mikmaq/2nd-level-of-creation.png");
   z-index: 5;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="mikmaq"] div[section="2nd-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="2nd-level-of-creation"]:hover {
   transform: scale(1.2);
   background-image: url("../images/interactive/mikmaq/2nd-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="3rd-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="3rd-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="3rd-level-of-creation"]:hover {
   top: 198px;
   left: 102px;
   width: 70px;
   height: 75px;
   background-image: url("../images/interactive/mikmaq/3rd-level-of-creation.png");
   z-index: 3;
   clip-path: circle(50% at 50% 50%);
}

.interactive[tribe="mikmaq"] div[section="3rd-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="3rd-level-of-creation"]:hover {
   background-image: url("../images/interactive/mikmaq/3rd-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="4th-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="4th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="4th-level-of-creation"]:hover {
   top: 99.5px;
   left: 144px;
   width: 111px;
   height: 63px;
   background-image: url(../images/interactive/mikmaq/4th-level-of-creation.png);
   z-index: 3;
}

.interactive[tribe="mikmaq"] div[section="4th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="4th-level-of-creation"]:hover {
   background-image: url("../images/interactive/mikmaq/4th-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="5th-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="5th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="5th-level-of-creation"]:hover {
   top: 98px;
   left: 62px;
   width: 155px;
   height: 104px;
   background-image: url("../images/interactive/mikmaq/5th-level-of-creation.png");
   background-size: 104% !important;
   clip-path: polygon(45% 25%, 47% 31%, 100% 60%, 68% 68%, -11% 67%, -3% 58%);
   z-index: 4;
}

.interactive[tribe="mikmaq"] div[section="5th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="5th-level-of-creation"]:hover {
   background-image: url("../images/interactive/mikmaq/5th-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="6th-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="6th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="6th-level-of-creation"]:hover {
   top: 103px;
   left: 22px;
   width: 109px;
   height: 54px;
   background-image: url("../images/interactive/mikmaq/6th-level-of-creation.png");
   z-index: 3;
}

.interactive[tribe="mikmaq"] div[section="6th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="6th-level-of-creation"]:hover {
   background-image: url("../images/interactive/mikmaq/6th-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="7th-level-of-creation"],
.interactive[tribe="mikmaq"] div[section="7th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="7th-level-of-creation"]:hover {
   top: 65px;
   left: 60px;
   width: 157px;
   height: 90px;
   background-image: url("../images/interactive/mikmaq/7th-level-of-creation.png");
   z-index: 4;
   clip-path: polygon(20% 11%, 78% 11%, 100% 43%, 50% 87%, 48% 88%, 0 40%);
}

.interactive[tribe="mikmaq"] div[section="7th-level-of-creation"].hover,
.interactive[tribe="mikmaq"] div[section="7th-level-of-creation"]:hover {
   background-image: url("../images/interactive/mikmaq/7th-level-of-creation-hover.png");
}

.interactive[tribe="mikmaq"] div[section="mikmaq-nation-and-clans"],
.interactive[tribe="mikmaq"] div[section="mikmaq-nation-and-clans"].hover,
.interactive[tribe="mikmaq"] div[section="mikmaq-nation-and-clans"]:hover {
   top: 140px;
   left: 19px;
   width: 237px;
   height: 119px;
   background-image: url("../images/interactive/mikmaq/mikmaq-nation-and-clans.png");
   z-index: 2;
   clip-path: circle(59.8% at 50% -1%);
   transform: scaleX(1.04);
}

.interactive[tribe="mikmaq"] div[section="mikmaq-nation-and-clans"].hover,
.interactive[tribe="mikmaq"] div[section="mikmaq-nation-and-clans"]:hover {
   background-image: url("../images/interactive/mikmaq/mikmaq-nation-and-clans-hover.png");
}

.interactive[tribe="mikmaq"] div[section="mikmaq-ceremony"],
.interactive[tribe="mikmaq"] div[section="mikmaq-ceremony"].hover,
.interactive[tribe="mikmaq"] div[section="mikmaq-ceremony"]:hover {
   top: 6px;
   left: 16px;
   width: 237px;
   height: 119px;
   background-image: url("../images/interactive/mikmaq/mikmaq-ceremony.png");
   z-index: 2;
   clip-path: circle(64% at 51% 109%);
}

.interactive[tribe="mikmaq"] div[section="mikmaq-ceremony"].hover,
.interactive[tribe="mikmaq"] div[section="mikmaq-ceremony"]:hover {
   background-image: url("../images/interactive/mikmaq/mikmaq-ceremony-hover.png");
}
/*end mikmaq*/


/*start cree tipi-pole values*/
#cree-tipi-pole-values:before {
   position: absolute;
   top: 151px;
   left: 111px;
   content: "Conclusion";
   font-size: 20px;
   font-weight: bolder;
}

#cree-tipi-pole-values {
   display: none;
   position: absolute;
   top: 51px;
   left: 193px;
   width: 340px;
   height: 340px;
   border-radius: 50%;
   border: 5px solid rgba(255, 255, 255, .5);
   z-index: 2000;
}

#cree-tipi-pole-values div[values],
#cree-tipi-pole-values div[values]:hover {
   position: absolute;
   width: 15px;
   height: 15px;
   border-radius: 50%;
   border: 4px solid #999966;
   background-color: #b78e67;
   z-index: 2;
   cursor: pointer;
}

#cree-tipi-pole-values div[values]:before {
   content: "";
   width: 15px;
   height: 15px;
   border-radius: 50%;
   background-color: #b78e67;
   z-index: 1;
   opacity: .5;
}

#cree-tipi-pole-values div[values]:hover {
   border: 4px solid #ffffff !important;
   background-color: #ffffff !important;
   opacity: 1;
}

#cree-tipi-pole-values div[values="obedience"] {
   top: -10px;
   left: 164px;
}

#cree-tipi-pole-values div[values="respect"] {
   top: 12px;
   left: 241px;
}

#cree-tipi-pole-values div[values="humility"] {
   top: 54px;
   left: 289px;
}

#cree-tipi-pole-values div[values="happiness"] {
   top: 110px;
   left: 318px;
}

#cree-tipi-pole-values div[values="love"] {
   top: 171px;
   left: 325px;
}

#cree-tipi-pole-values div[values="faith"] {
   top: 227px;
   left: 310px;
}

#cree-tipi-pole-values div[values="kinship"] {
   top: 280px;
   left: 272px;
}

#cree-tipi-pole-values div[values="cleanliness"] {
   top: 318px;
   left: 207px;
}

#cree-tipi-pole-values div[values="thankfulness"] {
   top: 318px;
   left: 112px;
}

#cree-tipi-pole-values div[values="sharing"] {
   top: 276px;
   left: 38px;
}

#cree-tipi-pole-values div[values="strength"] {
   top: 225px;
   left: 3px;
}

#cree-tipi-pole-values div[values="good-child-rearing"] {
   top: 171px;
   left: -10px;
}

#cree-tipi-pole-values div[values="hope"] {
   top: 107px;
   left: -3px;
}

#cree-tipi-pole-values div[values="ultimate-protection"] {
   top: 56px;
   left: 24px;
}

#cree-tipi-pole-values div[values="control-flaps"] {
   top: 8px;
   left: 82px;
}

#cree-tipi-pole-values div[values] button {
   position: absolute;
   width: 15px;
   height: 15px;
   border-radius: 50%;
   padding: 0;
   margin: -4px 0 0 -4px;
}
/*end cree tipi-pole values*/