/* --------------------------------------------------------------
	$Base
-------------------------------------------------------------- */

/** {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}*/





/* START SDO */

#top-ad {

    width: 100%;
	padding:5px 0px 4px 0px;  
	margin:0px auto;
	text-align:center;
    line-height: 1.5em;
	/*background: #7a8187;*/
	/*background:#003b58;*/
	background:#eeeeee;
	/*border-bottom-style:solid;
	border-bottom: thick #000000;*/
	border-bottom:1px solid #ccc;
    }
    
    /* Don't show on mobile */
    @media screen and (max-width: 768px) {
    #top-ad {
    display:none;
    }
    }
    
#mid-ad {

    width: 80%;
	padding:5px 0px 20px 0px;  
	margin:0px auto;
	text-align:center;
    line-height: 1.5em;
    }
    
    /* Don't show on mobile */
   /* @media screen and (max-width: 768px) {
    #mid-ad {
    display:none;
    }
    }    */
    
#top-bar {
    width: 100%;
	padding:4px 0px 4px 0px;  
	margin:0px auto;
	text-align:center;
    line-height: 1.5em;
	background: #dddddd;
	border-bottom-style:solid;
	border-bottom: thick #000000;
    }


#top-nav-sdo {
width: 1000px;
padding:5px 0px 4px 0px; 
margin:0px auto;
text-align:center;
}



#topbarsites {
	background: #ffffff;
	margin: 0px;
	margin-top:10px;
	font-family: helvetica, san-serif;
	padding: 6px 60px 3px 20px;
	border-bottom: 0px solid #888888;
	font-size: 12px;
	height: 17px;
	line-height: 10px;
	overflow: hidden;
	}

#topbarsites .mefeatured {
	width: 98%;
	max-width:1200px;
	margin: 0px auto;
	}

#topbarsites .mesites {
	float: right;
	width: 100%;
	overflow: hidden;
	}

#topbarsites .content {
	float: right;
	width: 470px;
	overflow: hidden;
	text-align: right;
	padding: 2px 0;
	}

#topbarsites .mesites ul, #featured .content ul {
	margin: 0px;
	padding: 0px;
	height: 16px;
	overflow: hidden;
	}

#topbarsites .mesites li {
	float: right;
	margin: 0px 10px 0px 0px;
	list-style:none; 
	}

#topbarsites .mesites a {
	padding: 2px 0px 0px 18px;
	display: block;
	height: 16px;
	}

#topbarsites .mesites a.musicengravers {
	background: url(/images/musicengravers_16.gif) top left no-repeat;
	padding: 2px 0px 0px 18px;
}

#topbarsites .mesites a.finale {
	background: url(/images/finale_16.gif) top left no-repeat;
}

#topbarsites .mesites a.sibelius {
	background: url(/images/sibelius_16.gif) top left no-repeat;
}

#topbarsites .mesites a.cakewalk {
	background: url(/images/cakewalk_16.gif) top left no-repeat;
	padding: 2px 0px 0px 20px;
}

#topbarsites .mesites a.sb {
	background: url(/images/smartphoneblast_16.gif) top left no-repeat;
	padding: 2px 0px 0px 20px;
}
#topbarsites .mesites a.exw {
	background: url(/images/exw-16.png) top left no-repeat;
	padding: 2px 0px 0px 20px;
}
#topbarsites .mesites a.cj {
	background: url(/images/cj_16.png) top left no-repeat;
	padding: 2px 0px 0px 18px;
}
#topbarsites .mesites a.vh {
	background: url(/images/vh_16.png) top left no-repeat;
	padding: 2px 0px 0px 20px;
}

/* SDO If in mobile screen with maximum width 479px. The iPhone screen resolution is 320x480 px (except iPhone4, 640x960) */    
@media only screen and (max-width: 479px){
    #topbarsites { width: 90%;padding: 6px 0px 3px 20px; }
}
/* END SDO */



/* Define your base font-size here; most elements will inherit this. _NO__DOTCOMMA__AFTER__*/
html {
	font-size: 1em; /* Assuming 16px... */
	line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) _NO__DOTCOMMA__AFTER__*/
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #333333;
	background-color: #ffffff;
}

input,
button,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

figure { margin: 0 }
img { vertical-align: middle }

hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	border-top: 1px solid #e5e5e5;
}

a {
	color: #428bca;
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	color: #2a6496;
	text-decoration: underline;
}

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre { margin: 0 }
button {
	background: transparent;
	border: 0;
	padding: 0;
}

/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */
button:focus {
	outline: 1px dotted;
	outline: 5px auto -webkit-focus-ring-color;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

iframe { border: 0 }
ol,
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/**
 * Suppress the focus outline on links that cannot be accessed via keyboard.
 * This prevents an unwanted focus outline from appearing around elements that
 * might still respond to pointer events.
 */
[tabindex="-1"]:focus { outline: none !important }

/**
 * Remove double underline from recent version of firefox
 */
abbr[title] {
	text-decoration: none;
}