/* features nav */
/* float: left;  */
#featuresnav { margin-top: 10px; width: 240px; }
.nav li { padding: 0 0 1px; _padding-top:2px; }
.nav li a { display: block; position: relative; padding: 6px 0 6px 57px; color: #8c8c8c; line-height: 25px; background: url(/v2/sajt/img/fn_arrow_grey.gif) no-repeat 95% 12px; -webkit-transition: color 0.2s ease-in-out; -moz-transition: color 0.3s ease-in-out; }
.nav:hover li a { color: #333; text-decoration: none; -webkit-transition: color 0.2s ease-in-out; -moz-transition: color 0.3s ease-in-out; }
.nav a.alt { padding-left: 23px; }

.nav li a:hover,
.nav:hover li a:hover { background: url(/v2/sajt/img/fn_arrow_blue.gif) no-repeat 95% 12px; color: #08c; }

.nav .icon { position: absolute; top: 6px; left: 18px; _left: -39px; _margin-top:1px; }

.nav #fn_sfeatures a img,
.nav #fn_features a img { margin-top: 7px; margin-left: 17px; opacity: 0.8; }
.nav:hover #fn_sfeatures a img,
.nav:hover #fn_features a img { opacity: 1; -webkit-transition: opacity 0.2s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; }
.nav #fn_sfeatures a,
.nav #fn_features a { padding: 0; }
.nav #fn_sfeatures a span { height: 22px; padding: 7px 0 7px 17px; width: 113px; }
.nav #fn_features a span {height: 22px; padding: 7px 0 7px 17px; width: 113px; }


.badge.new { position: relative; top: 1px; }

#featuresnav #fn_more-features a,
#featuresnav #fn_high-technology a { border:none; }

#features			#featuresnav #fn_features,
#sfeatures 			#featuresnav #fn_sfeatures,
#phone				#featuresnav #fn_phone,
#ipod				#featuresnav #fn_ipod,
#safari				#featuresnav #fn_safari,
#messages			#featuresnav #fn_messages,
#mail				#featuresnav #fn_mail,
#maps-gps			#featuresnav #fn_maps-gps,
#accessibility		#featuresnav #fn_accessibility,
#maps-compass		#featuresnav #fn_maps-compass,
#video-recording	#featuresnav #fn_video-recording,
#photos				#featuresnav #fn_photos,
#voice-memo			#featuresnav #fn_voice-memo,
#keyboard			#featuresnav #fn_keyboard,
#cut-copy-paste		#featuresnav #fn_cut-copy-paste,
#voice-control		#featuresnav #fn_voice-control,
#home-screen		#featuresnav #fn_home-screen,
#search				#featuresnav #fn_search,
#tethering			#featuresnav #fn_tethering,
#app-store			#featuresnav #fn_app-store,
#itunes     		#featuresnav #fn_itunes,
#more-features		#featuresnav #fn_more-features,
#high-technology	#featuresnav #fn_high-technology { background: #f2f2f2; position: relative; background: -webkit-gradient(linear, left top, left bottom, from(#f7f7f7), to(#eaeaea)); }

#features			#featuresnav #fn_features a,
#sfeatures 			#featuresnav #fn_sfeatures a,
#phone				#featuresnav #fn_phone a,
#ipod				#featuresnav #fn_ipod a,
#safari				#featuresnav #fn_safari a,
#messages			#featuresnav #fn_messages a,
#mail				#featuresnav #fn_mail a,
#maps-gps			#featuresnav #fn_maps-gps a,
#accessibility		#featuresnav #fn_accessibility a,
#maps-compass		#featuresnav #fn_maps-compass a,
#video-recording	#featuresnav #fn_video-recording a,
#photos				#featuresnav #fn_photos a,
#voice-memo			#featuresnav #fn_voice-memo a,
#keyboard			#featuresnav #fn_keyboard a,
#cut-copy-paste		#featuresnav #fn_cut-copy-paste a,
#voice-control		#featuresnav #fn_voice-control a,
#home-screen		#featuresnav #fn_home-screen a,
#search				#featuresnav #fn_search a,
#tethering			#featuresnav #fn_tethering a,
#app-store			#featuresnav #fn_app-store a,
#itunes     		#featuresnav #fn_itunes a,
#more-features		#featuresnav #fn_more-features a,
#high-technology	#featuresnav #fn_high-technology a { color: #333; cursor: default; background: url(/v2/sajt/img/fn_arrow_black.gif) no-repeat 95% 12px; }

.nav .icon { position: absolute; top: 6px; _top: 0; left: 18px; _left: -39px; }
.nav-promo { background: #f7f7f7 url(/v2/sajt/img/features-3gpromo-bg-20090608.gif) repeat-x 0 100%; color: #797c80; cursor: pointer; font-size: 14px; float: left; margin: 18px 0 20px 10px; text-align: center; width: 224px; *margin-left: 10px; _margin-left: 5px; }
.nav-promo .more { display: block; width: 5.6em; margin: 0 auto; padding-right: 10px; color: #08c; font-size: 11px; text-shadow: none; background: url(/v2/sajt/img/morearrow_08c.gif) no-repeat 100% 50%; }
.nav-promo .sosumi { font-size: 11px; }
.nav-promo a { background: none; color: #797c80; line-height: 18px; display: block; padding: 10px 0; text-shadow: #fff 0 1px 0; }
.nav-promo a:hover { color: #797c80; text-decoration: none; }
.nav-promo a:hover .more { text-decoration: underline; }

/* content */
#content { clear: both; float: right; padding: 25px 38px 0; width: 659px; border-left: 1px solid #e3e3e3; }
#content .grid2col .column { width: 48%; }

#content .icon_title { padding: 12px 0 10px 55px; line-height: 1.5; background-position: 0 0; background-repeat: no-repeat; *padding-bottom: 14px; *zoom: 1; }
#content h3 { font-weight: normal; }

#content .narrow { width: 570px; }
#content p.sosumi { color:#888; font-size: 11px !important; line-height: 15px; margin-bottom:0; }

#content a.howto { background: url(/v2/sajt/img/icon-howto-20090608.gif) no-repeat 0 2px; color: #959595; display: block; padding-left: 15px; }
#content a.howto:hover { color: #08c; text-decoration: none; background-position: 0 -98px; }

/* images */
#content img.flushright { margin-right:-38px !important; }
#content .flushleft { margin-left:-38px !important; }
#content .across { margin-left: -38px; margin-right: -38px; }
#content img.center { margin: 0 auto; display: block; }
#content img.bottom0 { margin-bottom:0; }
.sfeatures #OverlayPanel .howtooverlay .figure,
.features #OverlayPanel .howtooverlay .figure { display: block !important; }

/* callouts */
#content .callout { background: #fafafa; border:1px solid #ebebeb; font-size: 12px; position: relative; margin-bottom:30px; padding:17px 20px 1px; line-height:1.4; }

/* heroes */
#hero { background: url(/v2/sajt/img/hero-bg-20090608.png) repeat-x 0 100%; border-left: 1px solid #e3e3e3; position: relative; margin: 0 -38px 30px -39px; width: 735px; }
#hero:after { content:'.'; display:block; height:0; clear:both; visibility:hidden; }

.sfeatures #hero .intro,
.features #hero .intro { color: #666; width: 510px; }

#hero #swap { position: relative; top: -25px; height: 312px; }

#hero .image { position: absolute; top: 0; width: 697px; height: 312px; }
#hero .image img { position: absolute; left: 0; top: 0; }
#hero .image .tips { color: #666; position: absolute; left: 38px; top: 0; width: 100%; }
#hero .image .tips strong { display: block; font-size: 12px; }
#hero .image .tips .tip.top { background-image: url(/v2/sajt/img/tips-pointer-vert-20090608.gif) !important; padding-left: 0px;  padding-bottom: 20px; text-align: left; }
#hero .image .tips .tip.left { background-position: 100% 9px !important; padding-right: 25px; text-align: right; }
#hero .image .tips .tip.right { background-position: 0 9px !important; padding-left: 25px; text-align: left; }
#hero .image .tips .tip { background: url(/v2/sajt/img/tips-pointer-20090608.gif) no-repeat 0 7px; font-size: 11px; width: 130px; position: absolute; }

