@font-face {
font-family:"Open San";
src:
url("/css/font/OpenSans-Regular.eot?") format("eot"),
url("/css/font/OpenSans-Regular.woff") format("woff"),
url("/css/font/OpenSans-Regular.ttf") format("truetype"),
url("/css/font/OpenSans-Regular.svg#OpenSans-Regular") format("svg");
font-weight:400;
font-style:normal;
}
@font-face {
  font-family: 'fontsaddict-icons';
  src: url('/css/font/fontsaddict-icons.eot?30004042');
  src: url('/css/font/fontsaddict-icons.eot?30004042#iefix') format('embedded-opentype'),
       url('/css/font/fontsaddict-icons.woff?30004042') format('woff'),
       url('/css/font/fontsaddict-icons.ttf?30004042') format('truetype'),
       url('/css/font/fontsaddict-icons.svg?30004042#fontsaddict-icons') format('svg');
  font-weight: normal;
  font-style: normal;
}
 
 [class^="icon-"]:before, [class*=" icon-"]:before {
  font-family: "fontsaddict-icons";
  font-style: normal;
  font-weight: normal;
  speak: none;
  display: inline-block;
  text-decoration: inherit;
  width: 1em;
  margin-right: .2em;
  text-align: center;
  font-variant: normal;
  text-transform: none;
  margin-left: .2em;
}
.icon-spin:before { content: '\e804'; font-size:16px;} /* 'î „' */
.icon-download:before { content: '\e805'; } /* 'î …' */
.icon-thumbs:before { content: '\e802'; font-size: 1.1em;} /* 'î ‚' */
.icon-search:before { content: '\e800'; } /* 'î €' */
.icon-link:before { color:#999999; font-size: 22px; content: '\e801'; }  /* 'î ' */
.icon-refresh:before { color:#999999; font-size: 22px; content: '\e803'; } /* 'î ƒ' */
.icon-cancel:before { content: '\e006'; } /* '' */
body{
	margin:0;
	font-family: 'Open San', sans-serif;
	font-size:12px;
	color:#555555;
	background:#f4f5f9;
}
#page{
	display:block;
	width:960px;
	margin:0px auto 0px auto;
	padding: 10px 0px;
	text-align:left;
	background:#fff;
}
#header{
	display:block;
	width:960px;
	height:130px;
}
a.homelink:link, a.homelink:visited{text-decoration:none;}
a.homelink:hover, a.homelink:active{text-decoration:none;}

.top-right {
float:right;
position:relative;
top:30px;
}
#menuHeaderContainer {
width:100%; 
background: #5b7b9c;
}
#menu-bar{
	display:block;
	width:960px;
	height:60px;
	background-color:#5b7b9c;
}
ul.main-menu{
	margin:0px 0px 0px 0px;
	padding:0px;
	list-style:none;
	width:auto;
	height:36px;
	float:left;
}
ul.main-menu li{
	margin:-1px;
	padding:0px;
	float:left;
	width:auto;
	height:45px;
}

ul.main-menu li a{
	display:block;
	font-size:14px;
	line-height:60px;
	padding-left:10px;
	padding-right:10px;
	font-family: 'Open San', sans-serif;
}
ul.main-menu li a:link, ul.main-menu li a:visited{
	color:#fff;
	text-decoration:none;
	outline:none;
	font-weight: bold;
}
ul.main-menu li a:active, ul.main-menu li a:hover{
	color:#fff;
	text-decoration:none;
	outline:none;
	height: 61px;
	background:#415B76;
	/*40b59e*/
}
ul.main-menu li.active a{
	background:#415B76;
	color:#fff;
	
}
ul.main-menu li.active a:active, ul.main-menu li.active a:hover{
	color:#fff;
}
.menuItemOn{
	color:#fff;
	text-decoration:none;
	outline:none;
	height: 61px;
	background:#415B76;
}
div.search-box{
	display:block;
	width:auto;
	float:right;
	padding-right:10px;
}

input.inputbox{
	float:left;
	color:#373737;
	background-color:#ffffff;
	border:0px;
	-moz-border-radius-topleft: 3px;
    -webkit-border-top-left-radius: 3px;
    -khtml-border-top-left-radius: 3px;
    border-top-left-radius: 3px;
	-moz-border-radius-bottomleft: 3px;
    -webkit-border-bottom-left-radius: 3px;
    -khtml-border-bottom-left-radius: 3px;
    border-bottom-left-radius: 3px;
	font-size:14px;
	line-height:14px;
	padding:7px 10px;
	margin-top:15px;
	width: 150px;
}

#btnDownload {
margin-top:-3px; 
background-color: #415B76; 
color: #FFFFFF; 
border-radius:3px; 
cursor:pointer; 
margin-left:3px; 
display: inline-block; 
vertical-align:middle; 
height:30px; 
line-height:30px; 
padding-left:4px; 
padding-right:4px;
}

/* search toggle */
.togglebox input{ display:none; }
.togglebox{ 
display:inline-block; 
width:44px; 
height:30px; 
position:relative; 
color:#FFF; 
font-weight:bold; 
overflow:hidden;
padding-right:4px;
background:#415b76;
}
.togglebox label{
width:40px; 
height:100%;
line-height:100%; 
border-radius:0.4em; 
position:absolute; 
top:0; 
left:0; 
z-index:1; 
font-size:1.1em; 
cursor:pointer;
-webkit-transition:height 0.12s;
-moz-transition:height 0.12s; 
transition:height 0.12s;  
-moz-transition: all 0.3s ease-in 0s;
-webkit-transition: all 0.3s ease-in 0s;
-o-transition: all 0.3s ease-in 0s; 
transition: all 0.3s ease-in 0s; 
}
.togglebox label::before{ 
content:'Fonts';
width:40px; 
height:30px; 
float:left;
margin-top:00px; 
padding-top:9px;
text-align:center;
background:#415b76;
}

.togglebox label::after{ 
content:'Icons'; 
width:40px; 
float:left;
height:30px; 
padding-left:0px; 
padding-top:20px;
text-align:center; 
background:#415b76; 
margin-top:0px;
}
.togglebox input:checked ~ label{ top:-50px; }

.search-button {
	float:left;
	margin-top:15px;
	cursor:pointer;
	color:#fff;
	background-color:#415b76;
	border:0px;
	-moz-border-radius-topright: 3px;
    -webkit-border-top-right-radius: 3px;
    -khtml-border-top-right-radius: 3px;
    border-top-right-radius: 3px;
	-moz-border-radius-bottomright: 3px;
    -webkit-border-bottom-right-radius: 3px;
    -khtml-border-bottom-right-radius: 3px;
    border-bottom-right-radius: 3px;
	border-left:1px solid #546a80;
	font-size:14px;
	height:30px;
	width:38px;
	font-family: 'Open San', sans-serif;
}
.search-button:hover{
background-color:#34495e;
}

.toggle-search-arr {
float:left; 
display:block;
height:30px;
width:17px;
margin-top:15px;
cursor: pointer;
background:#415b76 url(/new/images/searcharrow.png) 3px 0 no-repeat;
}
.toggle-search {
float:left; 
margin-top:15px;
cursor: pointer;
}
/* Category List */
#categories{
	display:block;
	width:930px;
	padding:18px 15px 0 15px;
}
.cat-type-bar {
background:#f1f1f1; font-size:12px; font-weight:bold; line-height:30px; margin-left:15px; margin-right:15px; text-align:center;
}
ul.cats{
	margin:0;
	padding:0px;
	border-bottom: 1px solid #EEEEEE
}
ul.cats li.column1 { margin-left: 0em; }
ul.cats li.column2 { margin-left: 114px; }
ul.cats li.column3 { margin-left: 228px; }
ul.cats li.column4 { margin-left: 342px; }
ul.cats li.column5 { margin-left: 456px; }
ul.cats li.column6 { margin-left: 570px; }
ul.cats li.column7 { margin-left: 684px; }
ul.cats li.column8 { margin-left: 798px; }
ul.cats li{
	line-height: 1.5em;
	list-style:none;
	width:104px;
	display:block;
	margin:0px;
	padding:0px 0px 0px 10px;
	border-right:1px solid #eee;
}
ul.cats li a { display:block; }
ul.cats li.column8 { border-right:0px none; }
ul.cats li.reset{
	margin-top: -19.5em;
}
ul.cats li.icoreset{
	margin-top: -6em;
}
ul.cats li.title{
	padding-left:5px;
	padding-right:5px;
	width:104px;
}
ul.cats li.title span.title-text{
	display:block;
	background-color:#f1f1f1;
	font-weight:bold;
	font-size:12px;
	font-family: 'Open San', sans-serif;
	padding-left:5px;
	
}
span.title-text a:link, span.title-text a:visited{
color:#34495e;
}
ul.cats li.title span.arrow{
	color:#14b5d1;
	letter-spacing:-1px;
}
ul.cats li.space{
	height:1.5em;
}
ul.cats li.oncol{
background-color:#f1f1f1;
}
ul.cats li.onbold span.title-text{
	display:block;
	background-color:#f1f1f1;
	/*color:#fff;*/
	font-weight:bold;
	font-size:14px;
	font-family: 'Open San', sans-serif;
	padding-left:5px;
}

div.alpha_links {background: #ffffff; padding: 0px; margin: 0px; margin-bottom: 18px; font-size:12px; text-align:center;	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;}
div.alpha_links span {background-color:#ffffff; padding: 0px; margin: 0px; font-size:13px; font-weight:bold; color:#43c4da; -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;}
div.alpha_links a {padding: 5px; margin: 0px; background-color: #f1f1f1; color: #858585; border:0px; text-decoration:none; -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;}
div.alpha_links .on {padding: 5px; margin: 0px; background-color: #415B76; color: #ffffff; border:0px; text-decoration:none; -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;}
div.alpha_links a:hover {background-color: #5B7B9C; color:#fff; -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;}

div.social {
float:left;
width:180px;
}
.viewAllItems {
float:left; width:760px; font-size:14px; font-weight:bold; text-align:right; padding-bottom:20px; padding-top:15px;
}
}
#font-options{
	float:left;  
	width: 772px;
	height:50px;
	font-size:12px;
	font-weight:bold;
	font-family: 'Open San', sans-serif;
	padding-top: 10px;
	padding-left: 10px;
	padding-bottom:10px; 
	margin-bottom: 25px;
	background-color:#f1f1f1;
}
.font-options-content {
float:left;
line-height:40px; 
background:#f1f1f1;
padding-top: 10px;
width: 772px;
margin-bottom:25px;
}
#input_custom{
float:left;
text-align:top;
height:50px;
}
label.customlabel{
color:#555555;
float:left;
padding-right:10px;
padding-left:15px;
font-weight:bold;
}
input.custombox{
background-color: #fff;
border: 1px solid #D6D8DA;
border-radius: 2px;
height: 25px;
padding-left: 6px;
padding-right: 6px;
margin-top:4px;
width: 120px;
}
div.load{
float:left;
background:url(../images/load.gif) center center no-repeat;
width:20px;
height:20px;
position: relative;
top: 10px;
padding-left: 10px;
}
div.slider{
float:left;
margin-left:-10px;
}
label.sizelabel{
color:#555555;
float:left;
padding-right:5px;
padding-right:10px;
font-weight:bold;
}

#slider-range-min{
float:left;
position:relative;
top:15px;
margin-right:6px;

}
input#fsizept{
color:#555555;
border:0;
background:#f1f1f1;
font-size:12px;
font-family: 'Open San', sans-serif;
font-weight:bold;
width:40px;
position: relative;
padding-left:4px;
padding-left:4px;
top: 10px;
}
.color-controls{ 
float:left;
width:25px;
height:25px;
position:relative;
margin-top:8px;
margin-right:8px
}
.color-picker-square{
cursor:pointer;
position:absolute;
width:15px;
height:15px;
border:1px solid #aaa
}
.color-picker-square.active{
border:1px solid #000
}
div#colorpicker{
position:absolute;
right:0;
top:32px;
background:#777;
background:rgba(122,122,122,.9);
z-index:4
}
div#fg-color{
top:0;
left:0
}
div#bg-color{
right:0;
bottom:0
}
#permlink-preview{
float:left;
cursor:pointer;
left:-1px;
}
#reset-preview{
float:left;
cursor:pointer;
}


div#permlink-box{
float:left;
width: 772px;
text-align:center;
font-weight:bold;
color:#555555;
background-color:#f1f1f1;
height:20px;
line-height:20px;
}

#icon-options {
float:left; 
background-color:#f1f1f1; 
margin-bottom: 25px; 
padding-top: 10px; 
padding-bottom:10px; 
width: 772px;
}
.font-icon-tabs-container { right: -2px;position: relative;height: 30px;}
.icon-options-content {
right:-1px; position:relative; height:40px; line-height:40px; padding-right:15px; padding-left:10px;
}

#customizeWebfont {
margin-top:10px; margin-left:20px; max-height: 608px; overflow-y: scroll; display:none;
}
#customUploads {
display:none; margin-top:10px; margin-left:15px;
}
#customSvgUploads {
display:none; max-height: 580px; overflow-y: scroll;
}
#customizeWFContainer {
float: left; background:#e4e4e4; padding-left:17px; padding-right:17px; margin-right:10px; margin-bottom:10px;
}
.customInputbx{
border:0; background-color:#cfcfcf; border-radius:3px; text-align:center;
}
/* Font Item Listing */
div.font-item{
float:left;
padding-bottom:20px;
}
div.font-item-sml{
float:left;
height: 130px;
padding-bottom:20px;
width:50%;
}

div.font-item-title{
padding-bottom:10px;
}

span.font-item-name{
	color:#333;
	font-size: 15pt;
	font-family: 'Open San', sans-serif;
	height:20px;
	padding-right: 10px;
}
span.font-item-creator{
	color:#333;
	font-size: 9pt;
	font-family: 'Open San', sans-serif;
	height:20px;
	padding-right: 15px;
}
span.font-item-attr{
	color:#fff;
	font-family: 'Open San', sans-serif;
	background-color:#242333;
	padding:2px 5px 2px 5px; 	
}
span.font-item-downloads{
	float:right;
	color:#333;
	font-family: 'Open San', sans-serif;
	padding:10px 5px 2px 5px; 	
}
div.font-item-image {
float:left;
padding-left:5px;
overflow:hidden;
width:638px;
}
div.font-item-image-sml {
float:left;
padding-left:5px;
overflow:hidden;
width:350px;
height:50px;
}
div.icon-item-image {
float:left;
padding-left:5px;
overflow:hidden;
text-align: center;
width:742px;
}

div.font-item-dlbutton {
float:left;
position:relative;
margin-top:25px;
margin-left:8px;
}
div.font-item-ads {
float:left; 
padding-left:150px; 
margin-top:40px; 
margin-bottom:10px;
}
a.download{
float:left;
background: url("../images/account_download.png") no-repeat scroll 16px 50% #415b76;
	height:30px;
	line-height:20px;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	padding: 10px 15px 0 35px;
	color:#fff;
	font-family: 'Open San', sans-serif;
	font-size:13px;
	font-weight: 600;
	text-align:center;
}
a.download:link, a.download:visited{color:#fff;text-decoration:none;}
a.download:hover, a.download:active{color:#fff;text-decoration:none; background: url("../images/account_download.png") no-repeat scroll 16px 50% #34495e;}

a.addToWebfont{
float:left;
background: url("../images/account_addto.png") no-repeat scroll 16px 50% #415b76;
	height:30px;
	line-height:20px;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	padding: 10px 15px 0 35px;
	color:#fff;
	font-family: 'Open San', sans-serif;
	font-size:13px;
	font-weight: 600;
	text-align:center;
}
a.addToWebfont:link, a.addToWebfont:visited{color:#fff;text-decoration:none;}
a.addToWebfont:hover, a.addToWebfont:active{color:#fff;text-decoration:none; background: url("../images/account_addto.png") no-repeat scroll 16px 50% #34495e;}

.iselected { background: url("../images/account_addto_on.png") no-repeat scroll 16px 50% #34495e !important; }

a.button, button.button.orange {
	font-family: 'Open San', sans-serif;
    border-radius: 3px;
    color: #FFFFFF;
    cursor: pointer;
    display: inline-block;
    font-size: 14px;
    padding-left:10px;
	padding-right:10px;
    text-align: center;
	font-weight:bold;
    text-decoration: none;
}
a.button.large {
	font-size: 13px;
}
a.button.activeBlue, button.button.activeBlue {
	height:30px;
	line-height:30px;
	margin-top:8px;
	color: #FFFFFF;
    background-color: #415b76;
   /* box-shadow: 0 2px 0 #3ca993;*/
}
a.button.activeBlue:hover, button.button.activeBlue:hover {
    background-color: #34495e;
    /*box-shadow: 0 2px 0 #3ca993;*/
	text-decoration:none;
}
a.button.disabledbtn {
	height:30px;
	line-height:30px;
	margin-top:8px;
	color: #FFFFFF;
    background-color: #516d8a;
	text-decoration:none;
	cursor:default;
}
div.font-item-bar{
	position:relative;
	top: 10px;
	float:left;
	height:25px;
	width: 770px;
	background-color:#f1f1f1;

}
div.font-item-bar-sml {
	position:relative;
	top: 10px;
	float:left;
	height:25px;
	width: 360px;
	background-color:#f1f1f1;

}
span.font-item-category {
float: left;
padding-top:4px;
padding-left:8px;
color:#858585;
}
span.font-item-filename {
float: right;
padding-top:4px;
padding-right:8px;
color:#858585;
}

div.font-item-related {
float:left;
padding-left:5px;
position:relative;
bottom: 10px;
padding-bottom:20px;
font-family: 'Open San', sans-serif;
font-size:16px;
}
ul.related-fonts {
list-style:none;
list-style-type: none;
padding-left:0;
color:#43c4da;
}
li.font-term {
    float: left;
	color: #34495E;
	padding-left:5px;
	padding-right:15px;
	padding-bottom:10px;
}

ul.related-fonts li a:link, ul.font-term li a:visited{color:#34495E; text-decoration:none;}
ul.related-fonts li a:hover, ul.font-term li a:active{color:#7BD6E4; text-decoration:none;}

div.font-bar{
float:left;
	float:left;
	height:30px;
	width: 760px;
	background-color:#f1f1f1;
	color:#858585;
	padding-left:8px;
	padding-top:5px;
	font-family: 'Open San', sans-serif;
	font-size:16px;

}
div.index-font-bar{
float:left;
	float:left;
	height:30px;
	width: 766px;
	background-color:#f1f1f1;
	color:#555555;
	padding-left:8px;
	margin-bottom:10px;
	padding-top:8px;
	font-family: 'Open San', sans-serif;
	font-size:16px;
	font-weight:bold;

}
div.index-font-bar a:hover{ text-decoration:none; }
div.font-gallery-image{
float:left;
padding:25px;
text-align:center;
}

div.charmap-dropdown{
float:right;
position:relative;
padding-top:3px;
padding-right:8px;

}
div.font-charmap-image{
float:left;
padding-top:20px;
text-align:center;
}




#download_dropdown:before {
    border-color: rgba(0, 0, 0, 0.19) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 0 11px 12px;
    content: "";
    display: block;
    left: 169px;
    position: absolute;
    top: -12px;
    width: 0;
    z-index: 1;
}
#download_dropdown:after {
    border-color: #f1f1f1 rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 0 9px 10px;
    content: "";
    display: block;
    left: 171px;
    position: absolute;
    top: -10px;
    width: 0;
    z-index: 1;
}
#download_dropdown {
    display: none;
}
#download_dropdown {
    background: none repeat scroll 0 0 #eff0f2;
    border-radius: 3px;
    /*box-shadow: 0 0 3px rgba(0, 0, 0, 0.6), 0 0 15px rgba(0, 0, 0, 0.4);*/
    position: absolute;
	margin-left: 453px;
    top: 56px;
    width: 300px;
}

.icon-list {
    -moz-user-select: none;
    background: none repeat scroll 0 0 #EEEEEE;
    float: left;
    height: 38px;
    margin-right: 1px;
    margin-top: 5px;
    padding: 7px;
    position: relative;
    text-align: center;
    width: 38px;
}
.icon-list .delete {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    color: #FFFFFF;
    display: none;
    font-size: 25px;
    left: 0;
    padding: 12px;
    position: absolute;
    top: 0;
}
.icon-list:hover .delete {
    display: block;
}
.icon-list img {
    height: 25px;
    padding: 5px;
    width: 25px;
}
.iconGrid {
    margin: 8px 8px 8px;
    max-height: 210px;
	min-width: 286px;
    overflow-y: scroll;
}
.icon-info {
    color: #FFFFFF;
    display: none;
    height: 25px;
    left: 0;
    position: absolute;
    top: 0;
    width: 25px;
}
.icon-info .glyph-icon {
    color: #86C543;
    display: block;
    font-size: 18px;
    height: 20px;
    padding: 5px 6px;
    position: absolute;
    width: 20px;
}
.icon-info .glyph-icon:hover {
    color: #A8E16C;
}
.glyph:hover .icon-info {
    display: block;
}



.iconListBrowser {
    margin-top: 315px;
}
.packInfo {
    background: none repeat scroll 0 0 #666666;
    border-radius: 0 4px 0 0;
    color: #FFFFFF;
    height: 95px;
    opacity: 0.8;
    padding: 10px 20px 20px;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
    width: 157px;
    z-index: 1;
}
.packInfo span {
    font-size: 30px;
}
.packInfo span strong {
    clear: right;
    display: block;
    font-size: 15px;
}
.packInfo span a {
    color: #FFFFFF !important;
    font-size: 15px;
}

.glyph-container {
    float: left;
}

.glyph {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 2px solid #FFFFFF;
    border-radius: 0;
    border: 2px solid #fff;
    color: #626262;
    cursor: pointer;
    display: inline-block;
    margin: 5px;
    position: relative;
    text-align: center;
    vertical-align: top;
	height:130px;
	width:130px;
}
.glyph:hover {
    background: none repeat scroll 0 0 #FFFFFF;
    border: 2px solid #f1f1f1;
}
#ilinks {
display:none;
float:left; 
background: #F1F1F1;
font-size: 12px;
padding: 2px 5px 2px 5px;
border-radius: 30px;
width: 10px;
}
#ilinks:hover {
transition: all 200ms ease-in-out 0s;
background: #DFDFE1;
text-decoration:none;
}
#ilinks:hover a{
text-decoration:none;
}
.ilinka {
border-radius: 20px; margin-left:-2px;padding-right:7px; padding-left: 5px; font-size: 12px;
}
.ilinka a:hover {
font-family: Georgia;
}
.linkcontainer {
position: relative; left: 105px; bottom:-12px
}
.glyph:hover #ilinks {
	display:block;
}

.selected {
    border: 2px solid #71c4d1;
}
.glyph-container .selected {
   /* box-shadow: 0 0 5px #1abc9c !important;*/
   border: 2px solid #5B7B9C;
}
.opt.selected {
    border: 0 none;
}
.glyph-icon {
    cursor: pointer;
    display: block;
    font-family: "fontsaddict-icons";
    font-size: 64px;
	max-height: 60px;
	width: auto;
    line-height: 1;
    margin: auto;
    transition: all 0.5s linear 0s;
}
.glyph-img {
	display: block;
    height: 66px;
    position: relative;
    vertical-align: middle;
	text-align: center;
    width: 100%;
	display: block;
    margin-top: 30px;
}
.glyph-img .opt {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.5);
    display: none;
    height: 56px;
    left: 0;
    line-height: 58px;
    position: absolute;
    width: 130px;
}
.glyph:hover .opt {
    display: block;
}
.glyph-img .opt .glyph-icon {
    color: #EEEEEE;
    display: block;
    font-size: 40px;
    left: 0;
    position: relative;
    top: 10px;
}
.opt:hover .glyph-icon {
    color: #FFFFFF;
}
.opt:hover {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
}
.glyph-img .add {
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
    top: 0;
}
.glyph-img .see {
    bottom: 0;
}
object {
    cursor: pointer;
}
.glyph-icon:before {
    content: attr(data-icon);
	width:38px;
	height:38px;
	padding: 7px;
	margin-right:1px;
}
.class-name {
    font-size: 10px;
    line-height: 11px;
}
.glyph > input {
    cursor: text;
    display: block;
    font-size: 12px;
    margin: 5px auto;
    text-align: center;
    width: 100px;
}
.glyph > input.icon-input {
    font-family: "fontsaddict-icons";
    font-size: 16px;
}
.clearfix:after {
    clear: both;
    content: ".";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}
.clearfix {
    display: inline-block;
}


#edit-icon-drop:before {
    border-color: rgba(0, 0, 0, 0.19) rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 0 11px 12px;
    content: "";
    display: block;
    left: 172px;
    position: absolute;
    top: -12px;
    width: 0;
    z-index: 1;
}
#edit-icon-drop:after {
    border-color: #f1f1f1 rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 0 9px 10px;
    content: "";
    display: block;
    left: 174px;
    position: absolute;
    top: -10px;
    width: 0;
    z-index: 1;
}
#edit-icon-drop {
    display: none;
}
#edit-icon-drop {
    background: none repeat scroll 0 0 #eff0f2;
    border-radius: 3px;
    /*box-shadow: 0 0 3px rgba(0, 0, 0, 0.6), 0 0 15px rgba(0, 0, 0, 0.4);*/
    position: absolute;
    right:30%;
    top: 56px;
    width: 310px;
}



/* FILE UPLOAD */
#dragandrophandler
{
    border: 2px dashed #5B7B9C;
    color: #a6b4c5;
    font-size: 200%;
    height: 50px;
    line-height: 50px;
    margin-bottom: 10px;
    text-align: center;
    vertical-align: middle;
    width: 720px;
}
.progressBar {
    width: 200px;
    height: 8px;
    border-radius: 5px;
    overflow: hidden;
    display:inline-block;
    margin:0px 10px 5px 5px;
    vertical-align:top;
}
 
.progressBar div {
    height: 100%;
    color: #fff;
	font-size:8px;
    text-align: right;
    line-height: 8px; /* same as #progressBar height if we want text middle aligned */
	height: 8px;
    width: 0;
    background-color: #5B7B9C;
	border-radius: 3px;
}
.statusbar
{
    border-top:1px solid #d1d1d1;
    width:720px;
    padding-bottom:15px;
	padding-top:10px;
    vertical-align:top;
}
.statusbar:nth-child(odd){
    background:#EBEFF0;
}
.filename
{
display:inline-block;
vertical-align:top;
font-weight:bold;
width:325px;
}
.filesize
{
display:inline-block;
vertical-align:top;
color:#415B76;
width:100px;
margin-left:10px;
margin-right:5px;
}
.abort{
    background-color:#A8352F;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    border-radius:4px;display:inline-block;
    color:#fff;
    font-family:arial;font-size:13px;font-weight:normal;
    padding:4px 15px;
    cursor:pointer;
    vertical-align:top
    }
	

.toggleOptions { color:#555555; float:right; width:60px; height:29px;  background-color:#f9f9f9; line-height:29px; text-align:center; cursor:pointer;  border-top: 1px solid #C4C4C4; border-bottom: 1px solid #C4C4C4;}
.optionOn { 
	color:color:#333333 !important; 
	background-color:#f1f1f1 !important;
	border-bottom: 1px solid #f1f1f1;
}	
.toggleOptions:hover {text-decoration:underline;}

.customBtn { color:#555555; float:right; width:125px; height:29px;  background-color:#f9f9f9; line-height:29px; text-align:center; cursor:pointer;  border-top: 1px solid #C4C4C4; border-bottom: 1px solid #C4C4C4; }
.customBtn:hover {text-decoration:underline;}
.customBtnOn { olor:color:#333333 !important; 
	background-color:#f1f1f1 !important;
	border-bottom: 1px solid #f1f1f1;  } 

.clear-uploads { position:relative; text-align:right; padding:0 25px 10px 0; }
.clear-uploads:hover { text-decoration:underline; }
#uploadStatusBar {
color:#E74C3C; text-align:center; font-size:14px; font-weight:bold; 
}

.headerDetach {
	box-shadow: 0 2px 2px rgba(0, 0, 0, 0.08);
    padding: 0;
    width: 100%;
    position: fixed;
    top: 0;
    z-index: 9999;
}
#selectInfo {
	font-size: 14px;
    font-weight: bold;
    height: 30px;
    line-height: 30px;
    text-align: center;
    width: 290px;
}



/* Page numbers */
.pages {
	float:right;
	text-align:right;
	color: #000;
	font-family: sans-serif;
	margin: 10px 0px 30px 0;
	padding: 5px;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	}
.pages a {
	padding: 5px 9px 5px 9px;
	background: #f1f1f1;
	color: #000;
	font-size: 12px;
	margin: 0 3px 0 0;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	}
.pages a:hover {
	padding: 5px 9px 5px 9px;
	text-decoration: none;
	font-size: 12px;
	margin: 0 3px 0 0;
	background: #415B76;
	color: #FFFFFF;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	}
.pages .on {
	padding: 5px 9px 5px 9px;
	font-weight: bold;
    background: #415B76;
	color: #FFFFFF;
	font-size: 12px;
	margin: 0 3px 0 0;
	-moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
	}
	
a:link, a:visited{font-family: 'Open San', Arial, sans-serif;color:#555;text-decoration:none;}
a:hover, a:active{font-family: 'Open San', Arial, sans-serif;color:#555;text-decoration:underline;}

#content{
	display:block;
	width:960px;
	background:#fff;
}
#content-bottom{
	display:block;
	width:960px;
	height:5px;
	background:url(../images/content-bottom.jpg) no-repeat left bottom;
}
#left{
	background:#fff;
	display:block;
	float:left;
	width:772px;
	padding-right:20px;
}
#right{
	background:#fff;
	display:block;
	float:left;
	width:150px;
	padding-left:18px;
}
#module{
	display:block;
}
h1{
	font-size:30px;
	letter-spacing:-1px;
	color:#43c4da;
	font-family: 'Open San', sans-serif;
}
h3{
	font-size:18px;
	color:#253d4d;
	font-family: 'Open San', sans-serif;
}
#footer{
	text-align:center;
	font-size:11px;
	color:#999;
	padding:18px 0px 18px 0px;
}
#footer a:link, #footer a:visited{
	color:#666;
	text-decoration:none;
	outline:none;
}
#footer a:active, #footer a:hover{
	color:#373737;
	text-decoration:underline;
	outline:none;
}
.copyright{
	font-size:10px;
	color:#999;
}
#clr{
	display:block;
	clear:both;
}