/* Styles pertaining to the Tree of Life, the sephira, the paths, and the structure thereof */

/*clickable paths must be linked*/
/*somehow required*/
a {
	position:relative;
} 

/*default table cells*/
th, td {
    padding: 5px;
}

/*
body {
        background-image: url("images/thoth_pattern.gif");
        background-repeat: repeat;
}
*/

.ainsoph0{display:block;width:180px;height:180px;border-radius:120px;border:1px solid #666666;font-size:20px;color:#666;line-height:150px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:0; opacity: 0.35;}
.ainsoph0:hover{border:1px solid white;color:#666;text-decoration:none;background:#EAECEE; z-index:0; opacity: 0.45;}

.ainsoph00{display:block;width:240px;height:240px;border-radius:240px;border:1px solid #666666;font-size:20px;color:#666;line-height:150px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:0; opacity: 0.3;}
.ainsoph00:hover{border:1px solid white;color:#666;text-decoration:none;background:#EAECEE; z-index:0; opacity: 0.40;}

.ainsoph000{display:block;width:300px;height:300px;border-radius:220px;border:1px solid #666666;font-size:20px;color:#666;line-height:150px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:0; opacity: 0.2;}
.ainsoph000:hover{border:1px solid white;color:#666;text-decoration:none;background:#EAECEE; z-index:0; opacity: 0.30;}

.kether{display:block;width:125px;height:125px;border-radius:125px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.kether:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#FFFFFF;transition:all 1.0s ease;}

.chokmah{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.chokmah:hover{border:4px solid #808B96; color:#aaa;text-decoration:none;background:#999999;transition:all 1.0s ease;}

.binah{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.binah:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#000d1a;transition:all 1.0s ease;}

.daath{display:block;width:120px;height:120px;border-radius:66px;border:4px double #737373;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#cccccc; z-index:1; opacity: 0.15;}
.daath:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#EAECEE; opacity: 1.0; z-index:5;transition:all 1.5s ease;}

.chesed{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.chesed:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#0433ff;transition:all 1.0s ease;}

.geburah{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.geburah:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#ff0000;transition:all 1.0s ease;}

.tiphareth{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.tiphareth:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#fcfb00;transition:all 1.0s ease;}

.netzach{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.netzach:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#26ce23;transition:all 1.0s ease;}

.hod{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.hod:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#ff9a00;transition:all 1.0s ease;}

.yesod{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.yesod:hover{border:4px solid #808B96;color:#aaa;text-decoration:none;background:#9a2dcf;transition:all 1.0s ease;}

.malkuth{display:block;width:120px;height:120px;border-radius:66px;border:4px double #666666;font-size:20px;color:#666;line-height:120px;text-align:center;text-decoration:none;text-shadow:0 1px 0 #fff;background:#EAECEE; z-index:5;}
.malkuth:hover{border:4px solid #bbb;color:#aaa;text-decoration:none;background:none;transition:all 1.0s ease;}

#malkuthbg{
	/*apply spin magick*/
        -webkit-animation-name: spin;
        -webkit-animation-duration: 25000ms;
        -webkit-animation-iteration-count: infinite;
        -webkit-animation-timing-function: linear;
        -moz-animation-name: spin;
        -moz-animation-duration: 25000ms;
        -moz-animation-iteration-count: infinite;
        -moz-animation-timing-function: linear;
        -ms-animation-name: spin;
        -ms-animation-duration: 25000ms;
        -ms-animation-iteration-count: infinite;
        -ms-animation-timing-function: linear;
    
        animation-name: spin;
        animation-duration: 25000ms;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
	
	width:126px;height:126px;
}
/*multicolor quarters*/
.quarter{width:63px;height:63px}
.top-left{border-top-left-radius:62px;background:#CA6F1E;float:left}
.top-right{border-top-right-radius:62px;background:#808000;float:right}
.bottom-left{border-bottom-left-radius:62px;background:#7B241C;float:left}
.bottom-right{border-bottom-right-radius:62px;background:#333;float:right;}

/*spinmagic*/
@-ms-keyframes spin {
    from { -ms-transform: rotate(0deg); }
    to { -ms-transform: rotate(360deg); }
}
@-moz-keyframes spin {
    from { -moz-transform: rotate(0deg); }
    to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
    from { -webkit-transform: rotate(0deg); }
    to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}

/* Text stylings upon the paths */

.path11_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path11_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#fffb00;
	transition:all 1.0s ease;
}

.path12_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path12_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#fdfb00;
	transition:all 1.0s ease;
}

.path13_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path13_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#0433ff;
	transition:all 1.0s ease;
}

.path14_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*this div is horizontal so the line-height is greater to center vertically on path*/
	/*line-height:40px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/

}
.path14_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#22d023;
	transition:all 1.0s ease;
}

.path15_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path15_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff2600;
	transition:all 1.0s ease;
}

.path16_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path16_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff6100;
	transition:all 1.0s ease;
}

.path17_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path17_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff9c00;
	transition:all 1.0s ease;
}

.path18_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path18_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ffc200;
	transition:all 1.0s ease;
}

.path19_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:40px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path19_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;
	background:#fffb00;	
	
	transition:all 1.0s ease;
}

.path20_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path20_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#b5ce1c;
	transition:all 1.0s ease;
}

.path21_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path21_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#9a2dcf;
	transition:all 1.0s ease;
}

.path22_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*this div is horizontal so the line-height is greater to center vertically on path*/
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path22_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#22cd21;
	transition:all 1.0s ease;
}



.path23_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path23_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#0433ff;
	transition:all 1.0s ease;
}

.path24_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path24_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#249688;
	transition:all 1.0s ease;
}

.path25_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path25_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#0433ff;
	transition:all 1.0s ease;
}

.path26_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path26_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#6c2fe6;
	transition:all 1.0s ease;
}


.path27_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*this div is horizontal so the line-height is greater to center vertically on path*/
	/*line-height:40px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path27_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff2600;
	transition:all 1.0s ease;
}

.path28_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path28_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#9a2dcf;
	transition:all 1.0s ease;
}

.path29_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path29_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#9b1a66;
	transition:all 1.0s ease;
}

.path30_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path30_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff9a00;
	transition:all 1.0s ease;
}

.path31_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path31_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#ff2600;
	transition:all 1.0s ease;
}

.path32_link{ 

        width: 100%;
        height: 100%; 

	font-size:16px;
	
	/*line-height:16px;*/
	text-align:center;
	text-decoration:none;
	
	/*text color of path*/
	color:#666;
	text-shadow:0 1px 0 #fff;
	
	/*bg of paths*/
	/*background:#f2f2f2;*/
	  
}
.path32_link:hover{
	text-decoration:none;
	color:#000000;
	border:1px #FF0000;	
	background:#6d2ee0;
	transition:all 1.0s ease;
}

/* div styles for clickable paths */

#vertpath_long {
  /*      -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    */
    width: 40px;
    height: 400px; 
    border:1px solid black;

    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;

    display: flex;
    align-items: center;
    justify-content: center;
    
    background: white;
    align: center;
   
    border:4px double #666666;
    z-index:3;
}
#vertpath_long:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#vertpath_short {
        width: 40px;
        height: 180px; 
        
        display: flex;
        align-items: center;
        justify-content: center;

        display: -webkit-box;
        display: -webkit-flex;
        display: -moz-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-flex-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
       
	background: white;
	border:4px double #666666;
	z-index:3;
}
#vertpath_short:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#path_lean_left {
        -webkit-transform: rotate(60deg);
        -moz-transform: rotate(60deg);
        -o-transform: rotate(60deg);
        -ms-transform: rotate(60deg);
        transform: rotate(60deg);
    

    width: 40px;
    height: 150px; 
    border:1px solid black;

    display: flex;
    align-items: center;
    justify-content: center;

    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
 
    background: white;
    border:4px double #666666;
    
    z-index:3;
}
#path_lean_left:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#path_lean_right {
        -webkit-transform: rotate(-60deg);
        -moz-transform: rotate(-60deg);
        -o-transform: rotate(-60deg);
        -ms-transform: rotate(-60deg);
        transform: rotate(-60deg);	
	
    width: 40px;
    height: 150px; 
    border:1px solid black;
    
    display:block;
    align-items: center;
    justify-content: center;
    
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    
    background: white;
    border:4px double #666666;
    
    z-index:4;

}
#path_lean_right:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#bigslant {
        -webkit-transform: rotate(30deg);
        -moz-transform: rotate(30deg);
        -o-transform: rotate(30deg);
        -ms-transform: rotate(30deg);
        transform: rotate(30deg);	
	

    width: 40px;
    height: 350px; 
    border:1px solid black;
    
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;

    background: white;    
    border:4px double #666666;
    z-index:2;

}
#bigslant:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#bigslant2 {
        -webkit-transform: rotate(-30deg);
        -moz-transform: rotate(-30deg);
        -o-transform: rotate(-30deg);
        -ms-transform: rotate(-30deg);
        transform: rotate(-30deg);	
	

    width: 40px;
    height: 350px; 
    border:1px solid black;

    display: flex;
    align-items: center;
    justify-content: center;
    
    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;

    background: white;    
    border:4px double #666666;
    z-index:2;

}
#bigslant2:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}

#horzpath {
  /*      -webkit-transform: rotate(90deg);
        -moz-transform: rotate(90deg);
        -o-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    */
    width: 380px;
    height: 40px; 
    border:1px solid black;

    display: flex;
    align-items: center;
    justify-content: center;

    display: -webkit-box;
    display: -webkit-flex;
    display: -moz-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;

    background: white;
    border:4px double #666666;
    z-index:4;
     
}
#horzpath:hover{
	text-decoration:none;
	color:#000000;
	border:4px double #808B96;	
	background:#EAECEE;
}



/* invisible buffer space around entire tree design.*/
#treebuffer {
	width: 560px; 
	margin-top:10px;	
/*	border:2px solid yellow; */
}
/* outermost tree border  */
#treeborder {
	
	position: relative; 
	float:left; 
	
	top:-15px; 
	
	margin: 30px; 
	padding:10px; 
	
	/*background:#ffffff; */ 
	/*background: linear-gradient(to bottom right, #b3b3b3, #808080); */

}