.ValueP { color: #f00; }
.ValueM { color: #00f; }
.ArrowIcon .ValueP { color: #f00; padding-left: 15px; background-image: url('../img/arrow_up.png'); background-repeat: no-repeat; background-size: 8px 14px; background-position: 0px; }
.ArrowIcon .ValueM { color: #00f; padding-left: 15px; background-image: url('../img/arrow_down.png'); background-repeat: no-repeat; background-size: 8px 14px; background-position: 0px; }
.bottomContentAboutUuser{ padding: 20px 0 0 20px;}

/* 販売停止アイコン */
.iconHandling.stopIcon{ background: #ff0000; border: solid 1px #ff0000; color: #FFFFFF !important; }

/* ディスクレーマ */
.notes { margin-bottom: 40px; }
.aboutUserTable th,.aboutUserTable td{ padding: 1px 5px; }

/* ユーザ固有 */
.listTab li { width: 20%; }

/* ニュースアイコン */
.newsBox .newsTitle dt.color1 { color: #2996cc; border: solid 1px #2996cc; }
.newsBox .newsTitle dt.color2 { color: #DC143C; border: solid 1px #DC143C; }
.newsBox .newsTitle dt.color3 { color: #4B0082; border: solid 1px #4B0082; }
.newsBox .newsTitle dt.color4 { color: #FFA500; border: solid 1px #FFA500; }
.newsBox .newsTitle dt.color5 { color: #808000; border: solid 1px #808000; }
.newsBox .newsTitle dt.color6 { color: #008000; border: solid 1px #008000; }
.newsBox .newsTitle dt.color7 { color: #82909a; border: solid 1px #82909a; }
.newsBox .newsTitle dt.color8 { color: #DC143C; border: solid 1px #DC143C; }
.newsBox .newsTitle dt.color9 { color: #808080; border: solid 1px #808080; }

.newsBox .newsTitle:hover dt.color1 { background: #2996cc; color: #fff; }
.newsBox .newsTitle:hover dt.color2 { background: #DC143C; color: #fff; }
.newsBox .newsTitle:hover dt.color3 { background: #4B0082; color: #fff; }
.newsBox .newsTitle:hover dt.color4 { background: #FFA500; color: #fff; }
.newsBox .newsTitle:hover dt.color5 { background: #808000; color: #fff; }
.newsBox .newsTitle:hover dt.color6 { background: #008000; color: #fff; }
.newsBox .newsTitle:hover dt.color7 { background: #82909a; color: #fff; }
.newsBox .newsTitle:hover dt.color8 { background: #DC143C; color: #fff; }
.newsBox .newsTitle:hover dt.color9 { background: #808080; color: #fff; }

/******************************************/
/* Media Query */
/******************************************/
@media screen and (max-width: 759px) {
   .ArrowIcon .ValueP { background-image: url('../img/arrow_s_up.png'); background-size: 6px 12px; }
   .ArrowIcon .ValueM { background-image: url('../img/arrow_s_down.png'); background-size: 6px 12px; }
   #detail .listTab li{
    	/* width: 33.333%; */ /* 20180704 delete */
    	width:20%;
	}
	#detail .contentTitle {
		padding: 20px 20px 94px;
	}
	#content .contWrap .pdfReport span {
		color: #f0f0ed;
	}
}

@media screen and (min-width: 760px) {

	#header {}
	.contentBox{
		margin-top:20px;
	}
	.contentBox.bt {
		padding-top: 20px;
	}
	#contentHead {}
	#title a {
		float: right;
		font-size: 13px;
		color: #555;
		text-decoration: none;
		padding: 10px 12px;
		border: solid 1px #e0e0e0;
		border-radius: 3px;
		-moz-transition: all 300ms ease-in-out;
		-webkit-transition: all 300ms ease-in-out;
		transition: all 300ms ease-in-out;
	}
	#detail .listTab li{
    	/* width: 33.333%; */ /* 20180704 delete */
    	width:20%;
	}
	#tab li a.active:before {
		/* background-color: #ffe200; */ /* 20180702 delete */
		/* 20180702 add */
		background-color:#fcc91a;
	}
	/* GlobalHeader */
	#gnavi li a.active {
		color: #2996cc;
	}
	#gnavi li a.active:before {
		/* background-color: #ffe200; */ /* 20180702 delete */
		/* 20180702 add */
		background-color:#fcc91a;
	}
	#content .detail .valueBlock li a.active {
		background: #FFEF00;
		border-color: #FFEF00;
		color: #333;
	}
	#title a:hover, #header a.notice:hover, #header.head_s a.notice:hover {
		/* background: #FFEF00; *//* 20180702 change */
		background: rgba(252, 201, 26, 0.5);
		border: solid 1px #e0e0e0;
 		color: #2996cc;
	}

	/* Fund */
	.listContentTableTitle{
		margin: 0 0 4px 0;
		padding: 0;
	}
	#dispBox {
		font-size: 13px;
		width: 200px;
	}
	#dispBox li {
		font-size: 11px;
		display: block;
		width: 100%;
	}
	#content .contWrap .pdfReport p {
		color: #555;
	}
	#content .contWrap .pdfReport span {
		color: #fff;
	}
	/* Market Map */
	#content .box:hover:before{
		border-color:#2996cc;
	}
	/* stock */
	#content .map.stock .box1.box_jp     { top: 130px; right: auto; left: 240px; bottom: auto; }
	#content .map.stock .box2.box_jp     { top: 250px; right: auto; left: 240px; bottom: auto; }
	#content .map.stock .box3.box_jp     { top: auto; right: auto; left: 240px; bottom: 20px; }
	#content .map.stock .box4.box_us     { top: 10px; right: 60px; left: auto; bottom: auto; }
	#content .map.stock .box5.box_us     { top: 130px; right: 0px; left: auto; bottom: auto; }
	#content .map.stock .box6.box_cn     { top: 130px; right: auto; left: 0px; bottom: auto; }
	#content .map.stock .box7.box_hk     { top: 250px; right: auto; left: 0px; bottom: auto; }
	#content .map.stock .box8.box_in     { top: auto; right: auto; left: 0px; bottom: 20px; }
	#content .map.stock .box9.box_de     { top: 0px; right: auto; left: 240px; bottom: auto; }
	#content .map.stock .box10.box_gb    { top: 0px; right: auto; left: 0px; bottom: auto; }
	/* exchange */
	#content .map.exchange .box1.box_us  { top: 130px; right: 0px; left: auto; bottom: auto; }
	#content .map.exchange .box2.box_eu  { top: 0px; right: auto; left: 0px; bottom: auto; }
	#content .map.exchange .box3.box_ca  { top: 0px; right: 0px; left: auto; bottom: auto; }
	#content .map.exchange .box4.box_cn  { top: 130px; right: auto; left: 240px; bottom: auto; }
	#content .map.exchange .box5.box_tr  { top: 130px; right: auto; left: 0px; bottom: auto; }
	#content .map.exchange .box6.box_au  { top: auto; right: auto; left: 240px; bottom: 0px; }
	#content .map.exchange .box7.box_nz  { top: auto; right: auto; left: 0px; bottom: 0px; }
	#content .map.exchange .box8.box_br  { top: 270px; right: 0px; left: auto; bottom: auto; }
	#content .map.exchange .box9.box_in  { top: 270px; right: auto; left: 0px; bottom: auto; }
	#content .map.exchange .box10.box_id { top: 270px; right: auto; left: 240px; bottom: auto; }
	/* bond */
	#content .map.bond .box1.box_jp      { top: 180px; right: auto; left: 240px; bottom: auto; }
	#content .map.bond .box2.box_us      { top: 180px; right: 0px; left: auto; bottom: auto; }
	#content .map.bond .box3.box_gb      { top: 0px; right: auto; left: 240px; bottom: auto; }
	#content .map.bond .box4.box_de      { top: 120px; right: auto; left: 0px; bottom: auto; }
	#content .map.bond .box5.box_fr      { top: 0px; right: auto; left: 0px; bottom: auto; }
	#content .map.bond .box6.box_au      { top: auto; right: auto; left: 240px; bottom: 60px; }
	/* policyrate */
	#content .map.policyrate .box1.box_jp  { top: 240px; right: auto; left: 240px; bottom: auto; }
	#content .map.policyrate .box2.box_us  { top: 120px; right: 0px; left: auto; bottom: auto; }
	#content .map.policyrate .box3.box_eu  { top: 0px; right: auto; left: 0px; bottom: auto; }
	#content .map.policyrate .box4.box_au  { top: auto; right: auto; left: 240px; bottom: 0px; }
	#content .map.policyrate .box5.box_nz  { top: auto; right: auto; left: 0px; bottom: 0px; }
	#content .map.policyrate .box6.box_ca  { top: 0px; right: 0px; left: auto; bottom: auto; }
	#content .map.policyrate .box7.box_cn  { top: 120px; right: auto; left: 120px; bottom: auto; }
	#content .map.policyrate .box8.box_in  { top: 240px; right: auto; left: 0px; bottom: auto; }
	#content .map.policyrate .box9.box_br  { top: auto; right: 0px; left: auto; bottom: 0px; }
	#content .map.policyrate .box10.box_mx { top: auto; right: 0px; left: auto; bottom: 150px; }

	/* Market Map（10銘柄以上の場合） */
	#content .box.boxsize_small{
		width:173px; /* org 230px */
		height:105px;
	}
	#content .box.boxsize_small .boxInner{
		padding:15px 5px; /* org 15px */
	}
	#content .box.boxsize_small .flag{
		bottom:3px; /* org 14px */
		right:5px; /* org 15px */
	}
	#content .box.boxsize_small .title{
		font-size:14px; /* org 16px */
		margin-bottom:9px;
	}
	/* exchange 16銘柄 */
	#content .map.exchange .boxsize_small.box1.box_us { top: 130px; right: 0px; left: auto; bottom: auto;}
	#content .map.exchange .boxsize_small.box2.box_eu { top: 0px; right: auto; left: 0px; bottom: auto;}
	#content .map.exchange .boxsize_small.box3.box_eu { top: 270px; right: 0px; left: auto; bottom: auto;}
	#content .map.exchange .boxsize_small.box4.box_gb { top: 130px; right: auto; left: 0px; bottom: auto;}
	#content .map.exchange .boxsize_small.box5.box_ca { top: 0px; right: 0px; left: auto; bottom: auto;}
	#content .map.exchange .boxsize_small.box6.box_ch { top: 130px; right: auto; left: 180px; bottom: auto;}
	#content .map.exchange .boxsize_small.box7.box_au { top: auto; right: auto; left: 180px; bottom: 0px;}
	#content .map.exchange .boxsize_small.box8.box_nz { top: auto; right: auto; left: 360px; bottom: 0px;}
	#content .map.exchange .boxsize_small.box9.box_hk { top: 130px; right: auto; left: 360px; bottom: auto;}
	#content .map.exchange .boxsize_small.box10.box_ru{ top: 0px; right: auto; left: 180px; bottom: auto;}
	#content .map.exchange .boxsize_small.box11.box_br{ top: auto; right: 0px; left: auto; bottom: 0px;}
	#content .map.exchange .boxsize_small.box12.box_cn{ top: 0px; right: auto; left: 360px; bottom: auto;}
	#content .map.exchange .boxsize_small.box13.box_in{ top: 270px; right: auto; left: 180px; bottom: auto;}
	#content .map.exchange .boxsize_small.box14.box_tr{ top: 270px; right: auto; left: 0px; bottom: auto;}
	#content .map.exchange .boxsize_small.box15.box_za{ top: auto; right: auto; left: 0px; bottom: 0px;}
	#content .map.exchange .boxsize_small.box16.box_id{ top: 270px; right: auto; left: 360px; bottom: auto;}

	/* Market List */
	#listContent .listBox li.fundname {
		border-left: none;
	}

	/* マーケット・ニュース */
	.newsBox .newsTitle dl {
		float: none;
	}
	.newsBox .newsTitle dd {
		margin-right: 5px;
	}
	.newsBox .newsTitle dt {
		margin-right: 4px;
		font-size: 12px;
		width: 70px;
	}
	.newsBox .newsTitle .title .titleInner {
		margin-left: 222px;
		margin-right: 40px;
	}
	.newsBox .newsBlock p {
		font-size: 100%;
	}

}

#loading img {
    position: relative;
    top: 10px;
    left: 45%;
}

#listContent .listBox li.value2 span.subValue, #listContent .listBox li.value2 span.subValue span {
    display: inline-block;
    padding: 0;
}


#listContent .listBox li.chartBtn a.myfund-add {
	border-color:#FFEF00;
}

.fundNote{
	padding: 50px;
	font-size: 16px;
	color: #fff;
}

/******************************************/
/* Amchart */
/******************************************/
/*
.amcharts-legend-div {
    padding: 30px 35px 32px;
    background: #f2f2f2;
    border-radius: 4px;
}
*/

/******************************************/
/* FundList */
/******************************************/
.contentBox .contentBoxLead ul {
    list-style: disc;
    padding: 0 20px;
}

/* Fundlist Icon Custum */
/*
@media screen and (min-width: 760px) {

.listContentTable td.mail, .listContentTable td.myfund{
    padding: 1px 1px;
}
.mail .icon {
   width: 44px;
   height: 51px;
   border: none;
   border-radius: 0px;
}
.mail:hover .icon{
    border-color:transparent;
}
.mail .icon span {
    width: 44px;
    height: 51px;
    background-image: url(../user/images/iframe/fundtable_mail_off.png);
    background-repeat: no-repeat;
    background-size: 44px 51px;
    margin-top: 4px;
    margin-left: 4px;
}
.mail:hover .icon span{
	opacity: .7;
    background-image:url('../user/images/iframe/fundtable_mail_off.png');
}

.myfund .icon {
   width: 44px;
   height: 51px;
   border: none;
   border-radius: 0px;
}

.myfund.active .icon {
    border-color: transparent;
    background-color: transparent;
}
.myfund.active:hover .icon {
    background-color: transparent;
}
.myfund .icon span {
    width: 44px;
    height: 51px;
    background-image: url(../user/images/iframe/fundtable_favorite_off.png);
    background-repeat: no-repeat;
    background-size: 44px 51px;
    margin-top: 4px;
    margin-left: 4px;
}
.myfund:hover .icon span{
	opacity: .7;
    background-image:url('../user/images/iframe/fundtable_favorite_off.png');
}
.myfund.active .icon span {
    background-image: url(../user/images/iframe/fundtable_favorite_on.png);
}
.myfund.active:hover .icon span{
	opacity: .7;
    background-image:url('../user/images/iframe/fundtable_favorite_on.png');
}

}
*/

/******************************************/
/* FundSearch */
/******************************************/
@media screen and (min-width: 760px) {
	#searchNavi .searchBox ul {
	/* 20180723 delete */
	   /* padding: 25px 0 0 25px; */
	}
	#searchNavi .searchBox li {
		width: 175px;
	}
	#searchNavi .searchBox {
		font-size: 100%;
	}
}

@media screen and (max-width: 759px) {
	#searchNavi .searchBox ul {
		padding: 25px 0 0 25px;
	}
	#searchNavi .searchBox {
		font-size: 100%;
	}
}

/******************************************/
/* FundRanking */
/******************************************/
span.rank-1 {
    font-size: 30px;
    padding-left: 36px;
    background: url(/service/www/linkbox/fukui-sk/img/gold03.gif) left center no-repeat;
    -webkit-background-size: 31px auto;
    -moz-background-size: 31px auto;
    -o-background-size: 31px auto;
    background-size: 31px auto;
    zoom: 1;
}
span.rank-2 {
    font-size: 30px;
    padding-left: 36px;
    background: url(/service/www/linkbox/fukui-sk/img/silver03.gif) left center no-repeat;
    -webkit-background-size: 31px auto;
    -moz-background-size: 31px auto;
    -o-background-size: 31px auto;
    background-size: 31px auto;
    zoom: 1;
}
span.rank-3 {
    font-size: 30px;
    padding-left: 36px;
    background: url(/service/www/linkbox/fukui-sk/img/bronze03.gif) left center no-repeat;
    -webkit-background-size: 31px auto;
    -moz-background-size: 31px auto;
    -o-background-size: 31px auto;
    background-size: 31px auto;
    zoom: 1;
}
span.rank-4:before  { content:"4"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-5:before  { content:"5"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-6:before  { content:"6"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-7:before  { content:"7"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-8:before  { content:"8"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-9:before  { content:"9"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }
span.rank-10:before { content:"10"; display: inline-block; padding: 4px 10px; background-color: gray; color: #fff; border: solid 1px #ccc; border-radius: 4px; }

/******************************************/
/* FundSummary ReturnCalc */
/******************************************/

#calc table th, #calc table td {
    text-align: left;
}


#listTabField_01.returnCalc .pulldown {
    display: inline-block;
    position: relative;
}

#listTabField_01.returnCalc .pulldown select {
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute;
    background: #fff;
    height: 25px;
    width: 100%;
    display: block;
    left: 0;
    top: 0;
}

#listTabField_01.returnCalc .pulldown .trigger {
    border: 1px solid #d9d9d9;
    border-radius: 5px;
    height: 25px;
}

#listTabField_01.returnCalc .pulldown .trigger .mark {
    float: right;
    background: #e0e0e0;
    height: 25px;
    padding: 0 3px;
}

#listTabField_01.returnCalc .pulldown .trigger .selected {
    padding: 1px 32px 1px 10px;
}

#listTabField_01.returnCalc .icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-image: url('../img/s_white-sa8e3db25d5.png');
    vertical-align: middle;
}

#listTabField_01.returnCalc .icon.white {
    background-image: url('../img/s_white-sa8e3db25d5.png');
}

#listTabField_01.returnCalc .icon.white.caret_under {
    background-position: 0 -395px;
}

#listTabField_01.returnCalc .button {
    display: inline-block;
    font-size: 1.23em;
    line-height: 1.4;
    text-align: center;
    padding: 9px 24px;
    border-radius: 5px;
    border: 1px solid #d9d9d9;
    background: #ffffff;
    margin: 0 2px;
    position: relative;
}

#listTabField_01.returnCalc .button.m {
    font-size: 1.08em;
    padding: 6px 18px;
}


#listTabField_01.returnCalc .button:link, .button:visited {
    color: #2996cc;;
    text-decoration: none;
}

#listTabField_01.returnCalc .button:hover {
	/* background: #FFEF00; */ /* 20180702 change */
	background: rgba(252, 201, 26, 0.5);
	color: #2996cc;
	border: solid 1px #e0e0e0;
}

#listTabField_01.returnCalc #calc .buttons {
    text-align: center;
    margin-top: 20px;
}

#listTabField_01.returnCalc #calcresult .balloon .balloon_text {
    font-size: 1.23em;
    margin-top: 10px;
    padding: 5px 4px;
    text-align: center;
    /* org
    background: #2996cc;
    color: #fff;
    */
    /* 20180702 change */
    /* background: #ffff00; */
    background: rgba(252, 201, 26, 0.5);
    color: #000;
}


/******************************************/
/* フォント変更JS */
/******************************************/
/* 20180702 change */
/*
.fontS{ font-size:14px/1.2; }
.fontM{ font-size:110%; }
.fontL{ font-size:115%; }
*/
.fontS{ font-size:95%; }
.fontM{ font-size:100%; }
.fontL{ font-size:105%; }
/******************************************/
/* フォント変更JS */
/******************************************/
#sizechange {
	float: right;
    width: 135px;
    height: 25px;
    background: url(../img/ts.png) no-repeat left 8px;
    position: relative;
    top: -10px;
    right: 0px;
}
.alt {
    position: absolute;
    top: -5000px;
    left: -9999px;
}
ul, ol {
    list-style: none;
}
#sizechange .large {
    position: absolute;
    top: 0;
    right: 0px;

    width: 25px;
    height: 25px;
    background: url(../img/ts_large.png) no-repeat left 0px;
}
#sizechange .small {
    position: absolute;
    top: 0;
    right: 30px;

    width: 25px;
    height: 25px;
    background: url(../img/ts_small.png) no-repeat left 0px;
}
#sizechange .large.active {
    background: url(../img/ts_large_o.png) no-repeat left 0px;
}
#sizechange .small.active {
    background: url(../img/ts_small_o.png) no-repeat left 0px;
}


/******************************************/
/* Media Query */
/******************************************/
@media screen and (max-width: 759px) {
	#header {}
	#header .headerBlock .logo img {
		width: auto;
		height: 26px;
	}
	#contentHead {}
    /* 表示領域が759px以下の場合に適用するスタイル */
    #sizechange {
       float: right;
       width: 135px;
       height: 25px;
       background: url(../user/img/ts.png) no-repeat left 8px;
       position: relative;
       top: -10px;
       right: 0px;
    }

   /******************************************/
   /* Fund */
   /******************************************/
   .contentBox .contentBoxLead ul { padding: 5px 20px; }
   #content .contWrap .pdfReport p { color: #555; }
   #content .contWrap .pdfReport a span { background-image: url('../img/icon_pdf.png'); }
}

/******************************************/
/* ユーザ特殊対応 */
/******************************************/
/* リスク・タグ */
.listContentTableTitleTag li{
	text-align: center;
    font-size: 12px;
    line-height: 1.4;
    padding: 2px 5px;
    border-radius: 8px;
    color: #82909a;
    border: solid 1px;
    margin-right: 5px;
    margin-bottom:5px;
}
.listContentTableTitleTag li.color0 { color: #FFF; background-color: #FF0000; }
.listContentTableTitleTag li.color1 { color: #FFF; background-color: #FF8C00; }
.listContentTableTitleTag li.color2 { color: #FFF; background-color: #808000; }
.listContentTableTitleTag li.color3 { color: #FFF; background-color: #008000; }
.listContentTableTitleTag li.color4 { color: #FFF; background-color: #800080; }
.listContentTableTitleTag li.color5 { color: #FFF; background-color: #0000FF; }
.listContentTableTitleTag li.color6 { color: #FFF; background-color: #800080; }
.listContentTableTitleTag li.color7 { color: #FFF; background-color: #4169e1; }
.listContentTableTitleTag li.color8 { color: #FFF; background-color: #DC143C; }
.listContentTableTitleTag li.color9 { color: #FFF; background-color: #808080; }

/* 購入ボタン */
.buyBtn {
    /* 201807012 change */
    /*
    display: block;
    color: #555;
    text-decoration: none;
    padding: 10px 12px;
    background: #CC0000;
    border: solid 1px #CC0000;
    color: #fafafa;
    border-radius: 3px;
    margin: 0 0;
    -moz-transition: all 300ms ease-in-out;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    */
	display: block;
    color: #555;
    text-decoration: none;
    padding: 10px 12px;
    background: #2996cc;
    border: solid 1px #2996cc;
    color: #fafafa;
    border-radius: 3px;
    margin: 0 0;
    -moz-transition: all 300ms ease-in-out;
    -webkit-transition: all 300ms ease-in-out;
    transition: all 300ms ease-in-out;
    outline: 0;
}
.buyBtn:hover {
	/* 20180712 change */
	/*
    background: #FFEF00;
    border: solid 1px #e0e0e0;
    color: #2996cc;
    */
    background: #54abd6;
    border: solid 1px #54abd6;
    color: #fafafa;
}
.buyBtn.serviceOFF, .buyBtn.serviceOFF:hover {
	background: #808080;
    border: solid 1px #808080;
    color: #fafafa;
    text-decoration: none;
    cursor: pointer;
    display: none;
}
.listContentTable td a.buyBtn {
    color: #fafafa;
    /* 20180712 add */
    text-decoration:none;
}
.listContentTable td a.buyBtn:hover {
    /* color: #2996cc; */ /* 20180712 delete */
}
.contentTitle a.buyBtn {
    font-size: 15px;
    padding: 10px 18px;
}

/* ディスクレーマ（ソートボタン説明） */
.notesText span.sortBtn {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0 4px 0 0;
    background: #fff;
    border: solid 1px #ccc;
    border-radius: 3px;
    cursor: pointer;
    position: relative;
    top: 5px;
}

.notesText span.sortBtn:before {
    content: "";
    display: block;
    position: absolute;
    top: 6px;
    left: 5px;
    width: 0;
    height: 0;
    border-top: solid 6px #555;
    border-bottom: solid 6px transparent;
    border-right: solid 4px transparent;
    border-left: solid 4px transparent;
}

.notesText span.sortBtn.up {
    background-color: #555;
    border-color: #555;
}

.notesText span.sortBtn.down {
    background-color: #555;
    border-color: #555;
}

.notesText span.sortBtn.down:before {
    border-top: solid 6px #fff;
    border-bottom: solid 6px transparent;
    border-right: solid 4px transparent;
    border-left: solid 4px transparent;
}

.notesText span.sortBtn.up:before {
    border-top: solid 6px transparent;
    border-bottom: solid 6px #fff;
    border-right: solid 4px transparent;
    border-left: solid 4px transparent;
    top: -1px;
}