 div.translation{} div.translation article{ text-align:inherit; color:#000; } div.translation section[data-translation="true"]{ margin-top:20px; border:#eee 1px solid; } div.translation section[data-translation="true"] div[data-type="translation-name"]{ padding:0 20px; margin:10px 0 0 0; border-bottom:#eee 1px solid; padding-bottom:10px; } div.translation section[data-translation="true"] div[data-type="translation-name"] h2{ position:relative; display:inline-block; font-weight:bold;; color:#000; font-size:21px; } div.translation section[data-translation="true"] div[data-type="translation-name"] h2 sup{ font-size:10px; margin-left:10px; background-color:#eee; border:#ddd 1px solid; padding:0 8px; height:21px; line-height:21px; color:#333; font-weight:100; user-select:none; float:right; } div.translation section[data-translation="true"] dl{ position:relative; display:flow-root; background-color:#f5f5f5; padding:20px 20px 28px 20px; } div.translation section[data-translation="true"] dt, div.translation section[data-translation="true"] dd { font-family:Arial, Helvetica, sans-serif; margin-top:8px; } div.translation section[data-translation="true"] dt{ position:absolute; right:10px; bottom:8px; font-size:12px; color:#666; } div.translation section[data-translation="true"] dd{ display:flow-root; font-size:12px; line-height:24px; } div.translation section[data-translation="true"] dd[data-type="translation-of"] span{ font-family:webfont; display:inline-block; float:left; width:auto; height:22px; line-height:22px; padding:0 10px; margin-right:10px; text-align:center; font-size:12px; background-color:#44b242; border:#1fa51d 1px solid; box-shadow:0 0 10px #9ad099; border-radius:4px; user-select:none; color:#fff; } div.translation section[data-translation="true"] dd[data-type="translation-of"] strong{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:21px; color:#000; } div.translation section[data-translation="true"] dd[data-type="phonetic-symbols"] em{ font-family:Arial, Helvetica, sans-serif; font-weight:normal; font-size:14px; } div.translation section[data-translation="true"] dd[data-type="pronunciation"] .play{ display: inline-block; position: relative; top: 2px; height: 16px; line-height: 16px; cursor: pointer; } div.translation section[data-translation="true"] dd[data-type="pronunciation"] .play .icon-play{ border: #404040 8px solid; } div.translation section[data-translation="true"] dd[data-type="pronunciation"] .play .icon-play:before{ left: -2px; top: -4px; border-width: 4px 0 4px 6px; } div.translation section[data-translation="true"] dd[data-type="pronunciation"] .play .icon-play.icon-suspend:before{ left: -4px; top: -3px; width: 2px; height: 6px; border-color: transparent #fff; border-width: 0 3px; } div.translation section[data-phonetic_symbols="true"]{ margin-top:30px; } div.translation section[data-phonetic_symbols="true"] .project-name{ position:relative; padding-left:20px; } div.translation section[data-phonetic_symbols="true"] .project-name:before{ content:""; position: absolute; left:0; top:calc( 50% - 5px); width:10px; height:10px; background-color:rgba(68,178,66,1); box-shadow:3px 3px 0 rgba(68,178,66,0.6); } div.translation section[data-phonetic_symbols="true"] .project-content{ margin:10px 0 0 20px; } div.translation section[data-phonetic_symbols="true"] .project-content ul{ } div.translation section[data-phonetic_symbols="true"] .project-content li{ line-height:28px; } div.translation section[data-phonetic_symbols="true"] .project-content li span{ color:#666; font-size:14px; } div.translation section[data-phonetic_symbols="true"] .project-content li em{ font-family:Arial, Helvetica, sans-serif; } div.translation section[data-words="true"]{ margin-top:30px; } div.translation section[data-words="true"] .project-name{ position:relative; padding-left:20px; } div.translation section[data-words="true"] .project-name:before{ content:""; position: absolute; left:0; top:calc( 50% - 5px); width:10px; height:10px; background-color:rgba(68,178,66,1); box-shadow:3px 3px 0 rgba(68,178,66,0.6); } div.translation section[data-words="true"] .project-content{ margin:10px 0 0 20px; } div.translation section[data-words="true"] .project-content ul{ position:relative; margin-left: 5px; } div.translation section[data-words="true"] .project-content ul:before{ content:""; position:absolute; left:0; top:0; width:1px; height:100%; background-color: #eee; } div.translation section[data-words="true"] .project-content li{ position:relative; margin-left: 20px; margin-top:20px; } div.translation section[data-words="true"] .project-content li .phrase{ position:relative; height: 28px; line-height: 28px; } div.translation section[data-words="true"] .project-content li .phrase:before{ content:""; position:absolute; left: -24px; top: 9px; width:10px; height:10px; background-color:#999; border-radius:50%; } div.translation section[data-words="true"] .project-content li .phrase:after{ content:""; position:absolute; left: -22px; top: 11px; width:6px; height:6px; background-color:#fff; border-radius:50%; } div.translation section[data-words="true"] .project-content li:hover .phrase:before{ background-color:var(--main-main_color); } div.translation section[data-words="true"] .project-content li .english-test-system{ margin-top:10px; } div.translation section[data-words="true"] .project-content li .english-test-system span, div.translation section[data-words="true"] .project-content li .english-test-system string, div.translation section[data-words="true"] .project-content li .english-test-system em{ display: inline-block; background-color: #eee; width: auto; height: 28px; line-height: 28px; padding: 0 10px; margin-right:5px; border-radius: 4px; font-style: inherit; font-weight: unset; font-size: 13px; color: #333; } div.translation section[data-words="true"] .project-content li .definition{ margin-top: 0; display: flow-root; } div.translation section[data-words="true"] .project-content li .definition .item{ border: #eee 1px solid; background-color:#fafafa; padding: 10px; margin: 10px 0 10px 0; overflow: hidden; } @media screen and ( min-width:1025px ) { div.translation section[data-words="true"] .project-content li .definition .item.arrangement-n{ float: left; width: calc( 33.333333% - 35.333333px); height: 108px; min-height: 108px; margin: 10px 10px 10px 10px; } div.translation section[data-words="true"] .project-content li .definition .item.arrangement-n:nth-child(3n){ margin-right:0; } div.translation section[data-words="true"] .project-content li .definition .item.arrangement-n:nth-child(3n+1){ margin-left:0; } } div.translation section[data-words="true"] .project-content li .definition .item .part-of-speech{ color:#666; } div.translation section[data-words="true"] .project-content li .definition .item .word-definition{ line-height:24px; margin-top:10px; } div.translation section[data-words="true"] .project-content li .definition .item .word-definition span, div.translation section[data-words="true"] .project-content li .definition .item .word-definition strong, div.translation section[data-words="true"] .project-content li .definition .item .word-definition em{ display: inline-block; margin: 0 10px 0 0; } div.translation section[data-words="true"] .project-content li .definition .example-sentences{ } div.translation section[data-words="true"] .project-content li .definition .example-sentences ul{ margin-left: 5px; } div.translation section[data-words="true"] .project-content li .definition .example-sentences ul:before{ display:none; } div.translation section[data-words="true"] .project-content li .definition .example-sentences li{ position:relative; margin-top:20px; margin-left:0; padding-left:20px; counter-increment:sidebar1-item; } div.translation section[data-words="true"] .project-content li .definition .example-sentences li:before{ content:counter(sidebar1-item); position:absolute; z-index:1; left:0; top:0; width:20px; height:20px; line-height:20px; color:#999; font-family:Arial, Helvetica, sans-serif; } div.translation section[data-words="true"] .project-content li .definition .example-sentences li div{ line-height: 20px; } div.translation section[data-words="true"] .project-content li .definition .example-sentences li div:nth-child(1){ } div.translation section[data-words="true"] .project-content li .definition .example-sentences li div:nth-child(2){ font-family:Arial, Helvetica, sans-serif; margin-top: 10px; color: #333; } div.translation section[data-words="true"] .project-content li .definition .example-sentences li div a{ color: var(--main-main_color); } div.translation section[data-words="true"] .project-content li .definition .example-sentences li div span{ font-weight:bold; color:#d40000; } div.translation section[data-example_sentence="true"]{ margin-top:30px; } div.translation section[data-example_sentence="true"] .project-name{ position:relative; padding-left:20px; } div.translation section[data-example_sentence="true"] .project-name:before{ content:""; position: absolute; left:0; top:calc( 50% - 5px); width:10px; height:10px; background-color:rgba(68,178,66,1); box-shadow:3px 3px 0 rgba(68,178,66,0.6); } div.translation section[data-example_sentence="true"] .project-content{ margin:10px 0 0 20px; } div.translation section[data-example_sentence="true"] .project-content ul{ } div.translation section[data-example_sentence="true"] .project-content li{ position:relative; margin-top:20px; padding-left:20px; counter-increment:sidebar1-item; } div.translation section[data-example_sentence="true"] .project-content li:before{ content:counter(sidebar1-item); position:absolute; z-index:1; left:0; top:0; width:20px; height:20px; line-height:20px; color:#999; font-family:Arial, Helvetica, sans-serif; } div.translation section[data-example_sentence="true"] .project-content li div{ line-height: 20px; } div.translation section[data-example_sentence="true"] .project-content li div:nth-child(1){ } div.translation section[data-example_sentence="true"] .project-content li div:nth-child(2){ font-family:Arial, Helvetica, sans-serif; margin-top: 10px; color: #333; } div.translation section[data-example_sentence="true"] .project-content li div a{ color: var(--main-main_color); }  