/*
Yellow:	#FEE832
Black:	#333
White:	#fafafa
*/

body,html{
	margin:0;
	font-family: SofiaPro,Helvetica,'Helvetica Lt Std',Arial;
}
body{opacity:0;}
html{min-width:880px;background:#fafafa url('img/bg.png') 0 0 repeat-x;}

#symb_link{position:fixed;top:10px;left:10px;width:80px;height:80px;z-index:50}
#symb_link img{max-height:100%;width:auto}

.top {position: fixed;top:0;width:100%;background:#fafafa;left:0;z-index:5;padding:14px 0 10px}
aside {width:600px;text-align:center;margin: 0 auto}
aside .logo{}
aside h1{
font-size:12px;
font-weight: normal;
font-weight: bold;
white-space:nowrap;
}
aside .line{border-top:1px solid #fee832;padding-bottom:12px;margin:0 auto;width:30%}
aside a{font-weight:normal;font-size:12px;cursor:pointer}

.icons a {
width: 20px;
height: 17.6px;
background-position: 0 0;
background-size: cover;
display: inline-block;
background-repeat: no-repeat;
margin: 0 6px 6px 0;
}
.icons a:hover{background-position:0 100%}
.icons #typo{background-position: 0 106%}
.icons a.see{background-position:0 100%}

content{display:block;margin:0 auto;width:880px;}

#kids{width:600px;margin:120px auto 0;}
#kids tr{display:table-cell;vertical-align:middle;text-align:left}

#kids td{
cursor: pointer;
display: inline-table;
background-size: 100%;
background-repeat: no-repeat;
text-align: center;
background-position:0 0;
background-color:transparent;
margin:1%;width:31%;
opacity:0.75;
transition:opacity 400ms;-moz-transition:opacity 400ms;-webkit-transition:opacity 400ms;
background-position: 0 0%;
}
#kids td:hover{opacity:1;background-position:0 100%}
#kids td.hovs{opacity:0.3}
#kids td.dir_hov{opacity:1;background-position:0 100%}
/* If some major difference ought to be done regarding the directory
td.static_box{background-color:transparent;border:5px solid #fee832;box-sizing:border-box;-moz-box-sizing:border-box}*/

/* Student boxes */
#kids td small {display:table-cell;vertical-align:middle;color:white;opacity:0}
#kids small i{font-style:normal;font-size:11px;padding:2px 8px}
#kids td:hover>small{opacity:0}
td.student img{width: 100%;}
/* Static boxes */
td.static_box small{opacity:1}
td.static_box{color: white;font-weight: bold;font-size: 12px;letter-spacing: 1px;text-transform: uppercase}
td.static_box.dir{color: rgb(204, 181, 0);background: white}
td.static_box:hover{color: rgb(254, 231, 50)}
/*	.directory-title{width:auto;background:turquoise;cursor:pointer} */

#kids, #data{-moz-user-select:none;user-select:none;-webkit-user-select:none;}

#directory {float:left;position: fixed;top: 120px;z-index:10}
#directory span {
font-size: 10px;
cursor: pointer;
float:right;
clear:both;
text-align:right;
padding: 0px 3px;
white-space:nowrap;
margin: -1px 0;
}
#directory span.hovered{background:#fee832}
#directory span:hover{background:#fee832}

/*
#directory table {width:90%;margin:5%;}
#directory font { position: absolute; top: 2%; right: 3%; cursor:pointer}
.DropCap {
	font-family:header;
	font-size:150%;
	line-height:50%;
}
ul.NameList {
	list-style-type: none;
	font-family:copy;
	font-size:80%;
	line-height:130%;
	padding:0;
}

#directory ul .name{cursor:pointer}
#directory ul .name:hover{text-decoration:underline}
*/

/*
 * Web Fonts from fontspring.com
 *
 * All OpenType features and all extended glyphs have been removed.
 * Fully installable fonts can be purchased at http://www.fontspring.com
 *
 * The fonts included in this stylesheet are subject to the End User License you purchased
 * from Fontspring. The fonts are protected under domestic and international trademark and 
 * copyright law. You are prohibited from modifying, reverse engineering, duplicating, or
 * distributing this font software.
 *
 * (c) 2010-2012 Fontspring
 *
 *
 *
 *
 * The fonts included are copyrighted by the vendor listed below.
 *
 * Vendor:      Mostardesign
 * License URL: http://www.fontspring.com/fflicense/mostardesign
 *
 *
 */

@font-face {
    font-family: 'SofiaPro';
    src: url('http://symbiosis.gdnm.org/fnt/SofiaProLight-webfont.eot');
    src: url('http://symbiosis.gdnm.org/fnt/SofiaProLight-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://symbiosis.gdnm.org/fnt/SofiaProLight-webfont.woff') format('woff'),
         url('http://symbiosis.gdnm.org/fnt/SofiaProLight-webfont.ttf') format('truetype'),
         url('http://symbiosis.gdnm.org/fnt/SofiaProLight-webfont.svg#sofia_pro_lightregular') format('svg');
}