/* DDM Theme's development environment was Mac/Firefox

/* How to use the CSS browser selector
/* Examples:

    html.gecko div#header { margin: 1em; }
    .opera #header { margin: 1.2em; }
    .ie .mylink { font-weight: bold; }
    .mac.ie .mylink { font-weight: bold; }
    .[os].[browser] .mylink { font-weight: bold; } -> without space between .[os] and .[browser]

Available OS Codes [os]:

    .win - Microsoft Windows (all versions)
    .vista - Microsoft Windows Vista new
    .linux - Linux (x11 and linux)
    .mac - Mac OS
    .freebsd - FreeBSD
    .ipod - iPod Touch
    .iphone - iPhone
    .ipad - iPad new
    .webtv - WebTV
    .j2me - J2ME Devices (ex: Opera mini) changed from mobile to j2me
    .blackberry - BlackBerry new
    .android - Google Android new
    .mobile - All mobile devices new

Available Browser Codes [browser]:

    .ie - Internet Explorer (All versions)
    .ie8 - Internet Explorer 8.x
    .ie7 - Internet Explorer 7.x
    .ie6 - Internet Explorer 6.x
    .ie5 - Internet Explorer 5.x
    .gecko - Mozilla, Firefox (all versions), Camino
    .ff2 - Firefox 2
    .ff3 - Firefox 3
    .ff3_5 - Firefox 3.5
    .ff3_6 - Firefox 3.6 new
    .opera - Opera (All versions)
    .opera8 - Opera 8.x
    .opera9 - Opera 9.x
    .opera10 - Opera 10.x
    .konqueror - Konqueror
    .webkit or .safari - Safari, NetNewsWire, OmniWeb, Shiira, Google Chrome
    .safari3 - Safari 3.x
    .chrome - Google Chrome
    .iron - SRWare Iron

Extra Codes:

    js - Will be available when js is enable, so you can show/hide some stuffs
*/



/*= Mac - Firefox (All Versions)
=======================================================*/
.gecko .slide-out-div { width: 600px; }
.gecko .slide-out-div.logged-in { width: 320px; }
.gecko .tipVisible { margin-top:0; height:auto; }
.gecko .input-wrap .logged-in-menu { line-height:1.3em;}
.gecko .input-wrap, .gecko .input-wrap input { margin:0; }
.linux.gecko .login-error, .mac.gecko .login-error { margin: 8px 0 0 25px; }
.win.gecko .login-error { margin: 8px 0 0 15px; }
.gecko .homepage-content-blocks { padding: 35px 0 55px 1%; }
.gecko .slideOutTip {
	padding-left:45px;
}
.gecko .openLeft .tipTitle {
	padding-left:30px;
}
.gecko .slideOutContent {
	margin-left:90px;
}


/*= iPhone
=======================================================*/
.iphone.webkit .top-nav p { font-size: .9em; line-height: 1em; }

.iphone.webkit #input-wrap { background: none; border: none; margin: 0; padding: 0; }

/*.iphone.webkit #search-form input[type="text"], */
.iphone.webkit #search-form input[type="password"] { width: 90%; background: #fff; border: 1px solid #ebecee; padding: 6px; font-size: 1em; color: #999999; letter-spacing: .05em; }

.iphone.webkit #search-form input[type="button"] { height: 34px; margin-top: 9px; }

.iphone.webkit .header { min-height: 225px; }

.iphone.webkit .slider-wrap { margin-top: 25; margin-bottom: 25px; z-index: 600; }

.iphone.webkit h1 { font-size: 1.75em; }

.iphone.webkit .addthis_toolbox { float: right; width: 100%; }

/*.iphone #menu-header-navigation,.ipod #menu-header-navigation { margin:0 3% }*/

.iphone #menu-header-navigation li,.ipod #menu-header-navigation li { height: 10px;  margin:0px; padding: 0px 2px 1px 2px; }

@media handheld, only screen and (max-width: 767px) {

.iphone.webkit .login-form input[type="text"], .iphone.webkit .login-form input[type="password"] { width: 105px; font-size: 1em; }

}



/*= iPad
=======================================================*/
.ipad.webkit [role='navigation'] ul.sub-menu { display: none; }

.ipad.webkit body { font-size: 1em; }

.ipad [role='navigation'] ul.sub-menu { display: none; }



/*= Android
=======================================================*/
.android [role='navigation'] ul.sub-menu { display: none; margin-left: 0; overflow: hidden; }

.android .top-nav p { font-size: .7em; line-height: .875em; }

.android #input-wrap { background: none; border: none; margin: 0; padding: 0; }

/*.android #search-form input[type="text"],*/
.android #search-form input[type="password"] { width: 90%; background: #fff; border: 1px solid #ebecee; padding: 6px; font-size: 1em; color: #999999; letter-spacing: .05em; }

.android .slider-wrap { margin-top: 25; margin-bottom: 25px; z-index: 600; }

.android h1 { font-size: 1.75em; }

.android .addthis_toolbox { float: right; width: 100%; }

.android .mobile-login { min-height: 30px; margin: 0 auto; text-align:center; color:white; }
.android .mobile-login a { color:white; }
.android .mobile-login a:hover { color: #ee1a3b; }
.android .mobile-login, .android .mobile-login a { font:normal normal normal 1.2em arial; line-height:1.5em;}
.android .register { font-size:.65em; }

@media handheld, only screen and (max-width: 767px) {

.android .login-form input[type="text"], .android .login-form input[type="password"] { width: 105px; font-size: 1em; }

/* Header */
.android .header { min-height: 200px; }

/* Menu Header */
/*.android #menu-header-navigation { margin: 0 3%; }*/

/* Top Nav */
.android #menu-header-navigation li { height: 10px;  margin: 0px 0px 0px; padding: 0px 0.45em 2px; }

/*Social Media */
/*.android .social-media { width: 42%; margin:0; float:right; }*/

/* Slider */
.android .flexslider { width: 88%; margin: 10px 5%; }

/* Navigation */
.android [role="navigation"] .top-level a, [role="navigation"] ul li a { height: 35px; }

}

/*= PC - Internet Explorer (All Versions)
=======================================================*/
.ie .onecol { width: 4.7%; }
.ie .twocol { width: 13.2%; }
.ie .threecol { width: 22.05%; }
.ie .threecol.last {
	margin-left:3.6%;
}

.ie .fourcol { width: 32.75%; }
.ie .fivecol { width: 39%; }
.ie .sixcol { width: 48%; }
.ie .sevencol { width: 56.75%; }
.ie .eightcol { width: 65.4%; }
.ie .ninecol { width: 74.05%; }
.ie .tencol { width: 82%; }
.ie .elevencol { width: 91.35%; }

.ie .top-nav p { font-size: .75em; line-height: .75em; }

.ie .login-error { margin-top:12px; }
.ie .slide-out-div { width: 600px; }
.ie .slide-out-div.logged-in { width:320px; }

.ie .login-form input[type="text"], .ie .login-form input[type="password"] { width: 95px; }
.ie .input-wrap { margin: 8px 0 0 5px; }
.ie .register { margin:11px 0 0 0; }

.ie .tipTitle { margin:2px 0 0 0; width: 45px; padding-right: 20px;}

@media only screen and (max-width: 1020px) {
.ie .flexslider { width: 96%; margin: 0 20px; padding: 0; }

.ie .container.header { padding: 0 20px; }

.ie .login-form input[type="text"], .ie .login-form input[type="password"] { margin: 2px 0 0 0; }

.ie .tipTitle { margin:2px 0 0 0; width:45px; padding-right:20px;}

.ie .email-signup { background: #6e9cee; }

.ie8 .row .fourcol.top-nav { width: 32%; margin-right:0; padding-right:0;}

.ie8 .search-bar { width: 52%; }
/*.ie8 .social-media { width:45%; }*/

.ie8 #input-wrap { width:90%; }

}

/*= PC - Internet Explorer 9
=======================================================*/
.ie9 .threecol.last.login-signup { width: 21.25%; }
.ie9 .tipVisible { margin-top: 0px; }
.ie9 .tipTitle { width: 60px; margin-top: 0px; }
.ie9 .input-wrap { margin-top: 1px; }
.ie9 .register { margin-top: 7px; }
.ie9 .row .fourcol.logo { width: 28%; }
.ie9 .ie .container.header { width: 98%; padding: 0 20px; }

@media only screen and (max-width: 1020px) {

.ie9 [role="navigation"] li, .ie9 [role="navigation"] ul li { min-width: 90px; }
.ie9 .tipTitle { width: 38px; }
.ie9 .tipVisible { margin-top:3px; }
.ie9 .input-wrap { margin-top:-1px; }
.ie9 .register { margin-top: 3px; }

.gecko .tipTitle {
	width:75px;
}
.gecko .openLeft .tipTitle {
	padding-left:30px;
}
.gecko .row .threecol.last {
	margin-left:3%;
	width:17.5%;
}
}

@media only screen and (max-width: 767px) {

.ie9 body { margin: 0; padding: 0; }

.ie9 .fourcol { width: 98%; }
.ie9 .eightcol { width: 95%; }
.ie9 .row .fourcol.logo { width: 90%; clear: both; }
.ie9 .row .fourcol.top-nav { width: 90%; clear: both; }


.ie9 [role="navigation"] li, .ie9 [role="navigation"] ul li { min-width: 90px; }

}


/*= PC - Internet Explorer 8
=======================================================*/
.ie8 .slide-out-div { width: 510px; }
.ie8 .slide-out-div.logged-in { width:355px; }
.ie8 .register { margin: 10px 0 0 0; }
.ie8 .input-wrap { margin: 8px 0 0 5px; }
.ie8 .tipTitle { width:75px!important; }
.ie8 .row .fourcol.logo { width: 28%; }

@media only screen and (max-width: 1020px) {
	.ie8 .slideOutTip { margin:0; padding-left:40px; }
	.ie8 .tipVisible { margin-left:20px; margin-right:10px; }
	.ie8 .tipTitle { width: 45px !important;  }
	.ie8 .threecol.last.login-signup { width: 21.95%; }
}

@media only screen and (max-width: 767px) {

.ie8 .row .fourcol.logo { width: 90%; clear: both; }
.ie8 .row .fourcol.top-nav { width: 90%; clear: both; }

}


/*= PC - Internet Explorer 7
=======================================================*/
.ie7 .search-bar { width: 59%; }
.ie7 .row .ninecol { width: 70.05%; }
/*.ie7 .social-media { width: 41%; }*/

.ie7 .navigation { margin: 0 0 20px 0px;  }

.ie7 .slider-wrap { position: inherit; }

.ie7 .flexslider { z-index: -1; }

.ie7 .flexslider .slides { z-index: -1; }

.ie7 .ie-login { width: 110px; min-height: 16px; display: block; background: url("/images/layout/bg-login-ie.png") no-repeat; color: #fff; margin-right: 0px; padding: 11px 2px 9px 75px; float: right; }
.ie7 .ie-login p { color: #fff; font-weight: 700; }
.ie7 .ie-login a, .ie7 .ie-login a:visited, .ie7 .ie-login a:active, .ie7 .ie-login a:hover { color: #fff; font-weight: 700; text-decoration: none; }

.ie7 .slideOutTip { display: none; }

.ie7 .addthis_toolbox { width: 15%; height: 75px; float: right; }

.ie7 .email-icon { margin-top: -40px; }

.ie7 .email-signup-form input[type="button"] { margin: -3px 0 0 0; padding: 0 0 5px; }

.ie7 .threecol.last { margin-left: 0; width: 20%; }

.ie7 .threecol.last.login-signup { margin-left: 87px; }

.ie7 .homepage-content-blocks { margin-top: 25px; }

@media handheld, only screen and (max-width: 767px) {

.ie7 .ie-login { display: none; }

}


/*= Mac - Safari (All Versions)
=======================================================*/
.webkit .input-wrap { margin: 2px 0 0 5px; }
.webkit .input-wrap .logged-in-menu { font:normal normal normal 1.1em arial; line-height:1.5em; padding-left:10px;}
.webkit .slideOutTip { position: relative; padding: 4px 0 1px 50px; height: 31px;}
.webkit .slide-out-div { width:665px; }
.webkit .slide-out-div.logged-in { width:360px; }
.webkit .slide-out-div .spinner { padding-left:50px; }
.webkit .input-wrap { margin: 2px 0 0 5px; }
.webkit .input-wrap:first-child { margin-left: 25px; }
.webkit .login-error { display:inline; float:left; background:none; margin: 8px 0 0 55px; font:normal normal normal 1em arial; line-height:1.1em; }
.webkit .tipVisible { margin: 5px 15px 0 8px;}
.webkit .tipIconDiv { margin:6px 4px 0 0; }
.webkit .tipTitle { margin:0 10px 0 0; }
.webkit .register { margin:8px 0 0 0; }
.webkit .gecko .homepage-content-blocks { padding: 35px 0 55px 1%; }

.linux.webkit .input-wrap .logged-in-menu { line-height:1.3em;}
.linux.webkit .input-wrap { margin-top:6px; }
.linux.webkit .slideOutTip { padding: 3px 0 1px 50px; height:32px;}

.win.webkit .input-wrap .logged-in-menu { line-height:1.8em;}
.win.webkit .slide-out-div.logged-in { width:360px; }
.win.webkit .slide-out-div { width:625px; }
.win.webkit .input-wrap { margin-top:0px; cursor:pointer; }
.win.webkit .slideOutTip { height: 32px;}
.win.webkit .login-error { margin: 8px 0 0 30px; }


@media only screen and (max-width: 1020px) {

.webkit .input-wrap { margin: 0px 0 0 5px; }
.webkit .input-wrap:first-child { margin-left: 5px; }
.webkit .tipTitle { margin:3px 10px 0 0; width:50px;}
.webkit .top-nav p { font-size: .875em; line-height: 1.5em; }

/*.webkit #search-form input[type="text"],*/
.webkit #search-form input[type="password"] { font-size: .8em; }

}

@media handheld, only screen and (max-width: 767px) {

.webkit .top-nav p { font-size: 1.25em; line-height: 1.5em; }

.webkit .mobile-login { min-height: 30px; margin: 0 auto; text-align:center; color:white; }
.webkit .mobile-login a { color:white; }
.webkit .mobile-login a:hover { color: #ee1a3b; }
.webkit .mobile-login, .webkit .mobile-login a { font:normal normal normal 1.2em arial; line-height:1.5em;}

}



/*= Mac - Opera (All Versions)
=======================================================*/
.opera #search-form input[type="button"] { margin: 10px 5px 0 -45px; }