1/* --- general --- */ 2 3table.diagram 4{ 5 border-collapse: separate; 6 border-spacing: 0px; 7 border: 0px; 8} 9 10/* Fix IE 7 */ 11* + html table.diagram 12{ 13 border-collapse: collapse; 14 border-spacing: 0px; 15 border: 0px; 16} 17 18table.diagram td 19{ 20 padding: 0px; 21 border: 0px; 22} 23 24/* --- spacers --- */ 25 26table.diagram td.d-sh div 27{ 28 width: 1em; 29 height: 0px; 30} 31 32table.diagram td.d-sv div 33{ 34 width: 0px; 35 height: 1em; 36} 37 38/* --- borders (connection lines) --- */ 39 40table.diagram td.d-b 41{ 42 border-width: 2px; 43 border-style: solid; 44 border-color: black; 45 text-align: center; 46 padding: 0.25em; 47} 48 49 50table.diagram td.d-brs 51{ 52 border-right: 1px solid black; 53} 54 55/* Fix IE 7 */ 56* + table.diagram td.d-brs 57{ 58 border-top: 1px solid transparent; 59 border-left: 1px solid transparent; 60} 61 62table.diagram td.d-brd 63{ 64 border-right: 1px dashed black; 65} 66 67table.diagram td.d-bbs 68{ 69 border-bottom: 1px solid black; 70} 71 72 73table.diagram td.d-bbd 74{ 75 border-bottom: 1px dashed black; 76} 77 78/* --- arrows --- */ 79 80/* top direction */ 81 82table.diagram td.d-at 83{ 84 vertical-align: top; 85} 86 87table.diagram td.d-at div 88{ 89 width: 11px; 90 height: 25px; 91 background: url(images/black-curved/arrowhead-up.png) no-repeat center top; 92 position: relative; 93 right: 6px; 94} 95 96table.diagram td.d-at.d-ai 97{ 98 vertical-align: bottom; 99} 100 101table.diagram td.d-at.d-ai div 102{ 103 background: url(images/black-curved/arrowhead-down.png) no-repeat center bottom; 104} 105 106/* right direction */ 107 108table.diagram td.d-ar 109{ 110 vertical-align: top; 111} 112 113table.diagram td.d-ar div 114{ 115 width: 25px; 116 height: 11px; 117 background: url(images/black-curved/arrowhead-right.png) no-repeat right center; 118 position: relative; 119 bottom: 6px; 120 margin-left: auto; 121 margin-right: 0px; 122} 123 124table.diagram td.d-ar.d-ai div 125{ 126 background: url(images/black-curved/arrowhead-left.png) no-repeat left center; 127 margin-left: 0px; 128 margin-right: auto; 129} 130 131/* bottom direction */ 132 133table.diagram td.d-ab 134{ 135 vertical-align: bottom; 136} 137 138table.diagram td.d-ab div 139{ 140 width: 11px; 141 height: 25px; 142 background: url(images/black-curved/arrowhead-down.png) no-repeat center bottom; 143 position: relative; 144 left: 6px; 145 margin-left: auto; 146 margin-right: 0px; 147} 148 149table.diagram td.d-ab.d-ai 150{ 151 vertical-align: top; 152} 153 154table.diagram td.d-ab.d-ai div 155{ 156 background: url(images/black-curved/arrowhead-up.png) no-repeat center top; 157} 158 159/* left direction */ 160 161table.diagram td.d-al 162{ 163 vertical-align: bottom; 164} 165 166table.diagram td.d-al div 167{ 168 width: 25px; 169 height: 11px; 170 background: url(images/black-curved/arrowhead-left.png) no-repeat left center; 171 position: relative; 172 top: 6px; 173 margin-left: 0px; 174 margin-right: auto; 175} 176 177table.diagram td.d-al.d-ai div 178{ 179 background: url(images/black-curved/arrowhead-right.png) no-repeat right center; 180 margin-left: auto; 181 margin-right: 0px; 182} 183