/*resets*/
*{ margin:0; padding:0; }
a img{ border:0; }

/*generic*/
html{}
body{ background-color:#fff; color:#5c666d; font-family:arial, sans-serif; font-size:14px; }
body.blue_bg{background-color:#4cadeb !important;}
body:hover{}
p{ margin-top:1em; line-height:18px;}
p.first{margin-top:50px;}
p.intro{ font-size:18px; line-height:24px; color:#4cadeb; margin-top:0; }
a{color:#1269c5; text-decoration:none;}
a:hover{text-decoration:underline;}
h1{ font-family:'Helvetica Neue', helvetica; font-size:36px; color:#ffffff; text-shadow:#0086E3 0 2px 0; -webkit-text-stroke:1px transparent; }
@media only screen and (max-device-width:480px) {h1{-webkit-text-stroke:0 black;}}
h2{ font-size:18px; color:#4cadeb; margin-top:50px; border-bottom:1px solid #a6d6f5;}
h3{ font-size:14px; color:#333333; margin-top:2em; }

.dark_thin { -webkit-text-stroke:1px transparent; }
@media only screen and (max-device-width:480px) {.dark_thin{-webkit-text-stroke:0 black;}}

a.button{ float:right; text-decoration:none; margin-left:10px; display:block; color:#fff; height:50px;  -webkit-transition:background-color,color,background-position .3s ease-in-out; -moz-transition:background-color,color,background-position .3s ease-in-out; background:#dadbdb url(/img/shield_fade.png) repeat-x top left; display:block; color:#5c666d; text-shadow:0 1px 0 #fff; font-size:18px; font-weight:bold; -moz-box-shadow:0 0 5px #0A4E97; -webkit-box-shadow:0 0 5px #0A4E97; box-shadow: 0 0 5px #0A4E97; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
a.button big{ line-height:15px; font-weight:bold; padding:10px 10px 0 10px; display:block; color:#5c666d;  text-transform:uppercase; font-size:14px; text-shadow:#fff 0 1px 0; }
a.button small{line-height:20px; font-weight:bold; color:#8c8c8c; font-size:11px; padding:0 10px 10px 10px; text-shadow:#fff 0 1px 0;}
a.button:hover{text-decoration:none; background-position:-15px left;}
a.buton:active{background-position:-30px left; background-color:#d5d5d5; -webkit-box-shadow:0 0 2px #0A4E97; -moz-box-shadow: 0 0 2px #0A4E97; box-shadow: 0 0 2px #0A4E97}

a.button span{background-image:url(/img/download_circle.png); padding:0 0 10px 40px; display:block; background-repeat:no-repeat; background-position:10px 10px;}

a.bubble{text-align:center; display:block; text-decoration:none; color:#1269c5; background-color:#a6d6f5; font-size:11px; font-weight:bold; padding:5px 10px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;}
a.bubble:hover,
a.bubble.hover{text-decoration:none; background-color:#1269c5; color:#fff;}

.shield{-webkit-transition:background-position .3s ease-in-out; -moz-transition:background-position .3s ease-in-out; background:#dadbdb url(/img/shield_fade.png) repeat-x top left; display:block; color:#5c666d; text-shadow:0 1px 0 #fff; -webkit-text-stroke:1px transparent; font-size:18px; font-weight:bold; -moz-box-shadow:0 0 5px #0A4E97; -webkit-box-shadow:0 0 5px #0A4E97; box-shadow:0 0 5px #0A4E97; -webkit-border-radius:5px; border-radius: 5px; -moz-border-radius:5px;}
@media only screen and (max-device-width:480px) {.shield{-webkit-text-stroke:0 black;}}
a.shield:hover{text-decoration:none; background-position:-15px left;}
a.shield:active{background-position:-30px left; background-color:#d5d5d5; -webkit-box-shadow:0 0 2px #0A4E97; -moz-box-shadow: 0 0 2px #0A4E97; box-shadow: 0 0 2px #0A4E97}

ul.breadcrumbs{list-style-type:none; overflow:hidden;}
ul.breadcrumbs li{}
ul.breadcrumbs li a{font-weight:bold; color:#d7efff; font-size:12px; float:left; display:block; padding-right:10px; margin-right:5px; background:transparent url(/img/breadcrumb_arrow.png) right center no-repeat;}
ul.breadcrumbs li:last-child a{background-image:none;}

#bigscreen{}
#bigscreen h2{color:#333; border:none; font-size:14px; margin:0;}
#bigscreen p{}
#bigscreen img{-webkit-box-shadow:0 0 3px rgba(0,0,0,.8); -moz-box-shadow:0 0 3px rgba(0,0,0,.8); -webkit-border-radius:4px; -moz-border-radius:4px;}
#bigscreen a{margin:10px 0 20px 0; display:block;}


/* clearfix */
* html .clearfix, * html .title, * html .buttons, * html .app, * html .columns{ height: 1%; overflow: visible; }
*+html .clearfix, *+html .title, *+html .buttons, *+html .app, *+html .columns{ min-height: 1%; }
.clearfix:after, .title:after, .buttons:after, .app:after, .columns:after{ clear: both; content: "."; display: block; height: 0; visibility: hidden; font-size: 0; }








/*header*/
#header{background:#4cadeb url(/img/header_bg.png) repeat-x top left; z-index:50; height:150px;}
body.product #header{height:190px;}

#header .inner{width:710px; margin:0 auto; position:relative;}
#header #logo{ width:151px; float:left;}
#header #logo a{ background-color:#8C8C8C; display:block; width:151px; height:58px; -webkit-transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out;}
#header #logo a:hover,
#header #logo.active a{background-color:#4cadeb;}
#header #site_nav{float:right; position:absolute; bottom:2px; right:-10px; -webkit-text-stroke:1px transparent;}
@media only screen and (max-device-width:480px) {#header #site_nav{-webkit-text-stroke:0 black;}}

#header #site_nav ul{list-style-type:none; float:left;}
#header #site_nav li{float:left;}
#header #site_nav li a,
#header #site_nav li span.a{font-weight:bold; display:block; padding:10px 10px 10px 10px; color:#8C8C8C; -webkit-transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; text-shadow:#E9E9E9 0 1px 0; font-size:16px; font-family:'Helvetica Neue', helvetica; text-decoration:none; }
#header #site_nav li span.a{color:#aaa;}
#header #site_nav li a:hover,
#header #site_nav li.active a{color:#4cadeb; text-shadow:#9ed9ff 0 0 5px, #fff 0 1px 0;}
/*#header #site_nav li.facebook a:hover,
#header #site_nav li.facebook.active a{color:#315c99; text-shadow:#9ed9ff 0 0 5px, #fff 0 1px 0;}
*/

#header #site_nav ul.sections_nav{border-left:1px solid #eee; padding-left:10px;}
#header #site_nav ul.sections_nav li a{font-weight:normal;}

#header #site_nav ul.products_nav{ padding-right:10px; border-right:1px solid #bbb;}
#header #site_nav ul.products_nav li{}
#header #site_nav ul.products_nav li a{}
#header #site_nav ul.products_nav li span.for{display:none;}

#canvas{ width:710px; margin:-60px auto 0 auto; padding-bottom:50px; z-index:100;}
body.product #canvas{margin-top:-90px;}
body.home #canvas{margin-top:-50px;}

#canvas .title{}
#canvas .title .text{float:left;}
#canvas .title .text h2{font-weight:normal; border-bottom:none; margin-top:5px; color:#a6d6f5;}
#canvas .title .buttons{float:right; width:328px;}



/*support links on product pages*/
#page_title{overflow:hidden; }
#page_title h1{float:left;}
#page_title .support{float:right; margin-top:20px;}
#page_title .support a{-webkit-transition:all .3s ease-in-out; -moz-transition:all .3s ease-in-out; color:#d7efff; text-shadow:#207ce7 0 -1px 0; text-align:right; font-weight:bold; font-size:18px;}
#page_title .support a:hover{text-decoration:none; color:#fff;}




/*support*/
#support_canvas{overflow:visible; width:710px; margin-top:50px;}
#support_canvas #support_nav{float:left; width:230px; font-size:12px;}
#support_canvas #support_nav ul{}
#support_canvas #support_nav ul li{margin-bottom:10px; list-style: none;}
#support_canvas #support_nav ul li a{}
#support_canvas #support_nav ul li.selected a{color:#333;}
#support_canvas #support_content{float:left; width:470px; margin-left:10px;}
#support_canvas #support_content ul {margin-top:20px; list-style-type:none; margin-left:10px;}
#support_canvas #support_content ul li {margin-bottom:10px; background:transparent url(/img/bullet.png) left center no-repeat; padding-left:10px;}
#support_canvas #support_content ol {margin-top:10px;}
#support_canvas #support_content ol li {margin-bottom:5px; margin-left:20px;}

#support_canvas ul.support_sections_list{list-style-type:none; border-bottom:1px solid #eee; padding-bottom:10px;}
#support_canvas ul.support_sections_list li{}
#support_canvas ul.support_sections_list li a{ font-weight:bold; display:block; border-top:1px solid #eee; padding-top:10px; margin-top:10px;}
#support_canvas ul.support_sections_list li a span{}

blockquote {margin-left: .5em; padding-left: .5em; border-left: 2px solid #ccc; color: #888}

body.knowledge_base #header{height:220px;}
body.knowledge_base #canvas{margin-top:-115px;}
body #kb_header{}
body #kb_header #title_search{overflow:hidden; position:relative; padding-bottom:2px;}
body #kb_header #title_search h1{width:390px; float:left;}
body #kb_header #title_search #kb_search{width:310px; overflow:hidden; position:absolute; bottom:7px; right:0;}
body #kb_header #title_search #kb_search input.gsc-input{display:block; padding:0; color:#333333; font-family:'Helvetica Neue', helvetica, arial, sans-serif; font-size:12px; border:none; margin-top:8px; margin-left:10px; width:200px; background-color:transparent;}
body #kb_header #title_search #kb_search input.gsc-input:focus{outline:0;}
body #kb_header #title_search #kb_search td.gsc-input{float:left; background-image:url(/img/searchfield_fade.png); border:1px solid #2f8bd8; background-repeat:repeat-x; width:230px; height:28px; background-color:#fff; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
body #kb_header #title_search #kb_search input.gsc-search-button{float:right; width:70px; height:30px; border:none; background-color:transparent; background-image:url(/img/kb_search_button.png); text-indent:-9999px; background-position:0 30px;}
body #kb_header #title_search #kb_search input.gsc-search-button:hover{background-position:0 0;}
body #kb_header #title_search #kb_search .gsc-clear-button{display:none;}
body #kb_header #title_search #kb_search table.gsc-search-box{margin-bottom:0 !important;}
body #kb_header #title_search #kb_search form.gsc-search-box{margin-bottom:0 !important;}
/*search results*/
body #searchResults div.gsc-tabsArea{display:none;}
body #searchResults a.gs-title{color:#1269c5;}
body #searchResults div.gs-title b{color:#1269c5;}
body #searchResults div.gs-visibleUrl{color:#ced1d3;}
body #searchResults div.gsc-cursor-page{color:#1269c5;}
body #searchResults div.gsc-cursor-page.gsc-cursor-current-page{color:#5c676d;}
body #searchResults .cse .gsc-webResult.gsc-result,
body #searchResults .gsc-webResult.gsc-result{padding-left:0;}
body #searchResults .cse .gsc-control-cse,
body #searchResults .gsc-control-cse{padding-left:0;}

body.knowledge_base #kb_header #kb_nav{margin-top:20px; -webkit-text-stroke:1px transparent;}
@media only screen and (max-device-width:480px) {body.knowledge_base #kb_header #kb_nav{-webkit-text-stroke:0 black;}}
body.knowledge_base #kb_header #kb_nav ul{list-style-type:none; padding:3px 0 3px 4px; overflow:hidden; }
body.knowledge_base #kb_header #kb_nav ul li{float:left; width:100px; height:33px; text-align:center; position:relative;}
body.knowledge_base #kb_header #kb_nav ul li a{color:#808384; font-weight:normal; position:absolute; width:100%; top:7px; left:0; }
body.knowledge_base #kb_header #kb_nav ul li.selected a{color:#4cadeb; }
body.knowledge_base #kb_header #kb_nav ul li a:hover{text-decoration:none;}
body.knowledge_base #kb_header #kb_nav ul li span.bg{display:none; background:transparent url(/img/kb_nav_bezel.png) top center no-repeat; position:absolute; width:100%; height:33px; top:0px; left:0;}
body.knowledge_base #kb_header #kb_nav ul li.selected span.bg{ display:block; }

body.knowledge_base #support_canvas #support_nav ul li.selected a{ background-color:#d7efff; color:#1269c5; font-weight:bold; padding:3px 6px; margin-left:-6px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; }
body.knowledge_base #support_canvas #support_nav ul li.selected a:hover{ text-decoration:none; }
body.knowledge_base #support_canvas #support_nav ul li strong{ color:#333; }
#support_content img {padding: 5px; margin-left:-5px; border: 1px solid #C8C8C8; -moz-box-shadow: 0 0 3px #bbb; -webkit-box-shadow: 0 0 3px #bbb; box-shadow: 0 0 3px #bbb}
#support_content table {border-collapse:collapse;padding:0px; border: 1px solid #999;}
#support_content td {border-right: 1px solid #999; border-bottom: 1px solid #ccc; padding: 3px 5px;}



/*app pages?*/

body.product #canvas{margin-top:-55px;}
body.product #header{height:150px; }

#intro{margin-top:48px; overflow:hidden; border-bottom:5px solid #a6d6f5; padding-bottom:30px; margin-bottom:30px;}
/*.iphone #intro{border-bottom:none; padding-bottom:0;}*/
#intro #download_buttons{width:230px; float:left; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; background-color:#4cadeb;}
#intro #download_buttons a{width:210px; margin:10px; margin-top:0;}
#intro #download_buttons a:first-child{margin-top:10px;}
#intro #download_buttons a#purchase_echofon_mac span,
#intro #download_buttons a.buy span{background-image:url(/img/purchase_icon.png);}
#intro a#older_version{font-size:11px; display:block; color:#D7EFFF; font-weight:bold; text-shadow:0 -1px #207CE7;}
#intro p{font-size:24px; margin-top:0; line-height:34px; color:#4cadeb; width:430px; float:right;}
#features{}
#features .col{float:left; width:310px;}
#features .col.one{margin-right:90px;}
#features .feature{ margin-bottom:30px; width:310px;}
#features .feature h3{margin-top:0;}






#canvas .title{}
#canvas .title .text{float:left;}
#canvas .title .text h2{font-weight:normal; border-bottom:none; margin-top:5px; color:#a6d6f5;}
#canvas .title .buttons{float:right; width:328px;}
#canvas .support_links{color:#3089DC; position:relative; top:5px;}
#canvas .support_links a{-webkit-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out; color:#fff; font-weight:bold; text-transform:uppercase; font-size:12px; background-color:#3998e6; padding:5px 7px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
#canvas .support_links a:hover{background-color:#2886e1; text-decoration:none;}



#canvas #hero{margin-top:20px; -webkit-box-shadow:#333 0 0 3px; -moz-box-shadow:#333 0 0 3px; box-shadow:#333 0 0 3px;}

#app_overview{ margin-top:40px; }
#app_overview #app_description{ width:350px; float:left; }
#app_overview #comparison_table{ width:310px; float:right; }
#app_overview #comparison_table table{background-color:#e4f3fc; width:310px; font-size:12px; -webkit-border-radius:5px; -moz-border-radius:5px;  border-radius:5px; }
#app_overview #comparison_table table tr td,
#app_overview #comparison_table table tr th{padding:7px 10px; border-right:1px solid #fff;}
#app_overview #comparison_table table tr th{padding:10px; text-align:left; color:#333; text-transform:uppercase; border-bottom:1px solid #fff;}
#app_overview #comparison_table table tr .feature{ border-right:1px solid #fff; }
#app_overview #comparison_table table tr .free{text-align:center; border-right:1px solid #fff; }
#app_overview #comparison_table table tr .pro{text-align:center;}
#app_overview #comparison_table table tr.odd td{background-color:#cde9f9;}

#app_overview #comparison_table.firefox table tr td{}

#feature_tour{ position:relative; background-color:#4cadeb; margin-top:40px; padding-top:30px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
#feature_tour h1{color:#fff; font-size:24px; text-shadow:#1269c5 0 1px 0;}
#feature_tour p{color:#fff; line-height:19px;}
#feature_tour #screenshot_viewer{ width:350px; float:left; margin-left:30px;}
#feature_tour #screenshot_viewer img{-webkit-box-reflect:below 0 -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(.9, transparent), to(rgba(0,0,255,0.2)));}
#feature_tour #screenshot_description{ width:280px; float:right; margin-right:30px; margin-top:50px; }

#feature_tour ul#screenshot_carousel{list-style-type:none; }
#feature_tour ul#screenshot_carousel li{display:block; width:710px; height:550px;}

#feature_tour #screenshot_controls{z-index:10; margin-bottom:20px; width:290px; position:absolute; top:30px; right:20px;}
#feature_tour #screenshot_controls a{display:block; outline:none; border:1px solid #badff7; text-align:center; font-weight:bold; color:#1269c5; background-color:#94cef3; width:135px; text-decoration:none; padding:5px 0; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; -webkit-transition:all .2s ease-in-out; -moz-transition:all .2s ease-in-out;}
#feature_tour #screenshot_controls a.disabled{color:#fff; opacity:.3; cursor:default; filter:alpha(opacity=30);}
#feature_tour #screenshot_controls a.disabled:hover{background-color:#94cef3;}
#feature_tour #screenshot_controls a:hover{background-color:#badff7;}
#feature_tour #screenshot_controls a.previous{float:left;}
#feature_tour #screenshot_controls a.next{float:right;}



/*mac product page*/




/*homepage*/
body.home{}
#home_canvas{}
#home_canvas #home_headline{margin-bottom:30px; margin-top:10px;}





/*support*/

/*these tablet buttons are only used on support now but could be used elewhere*/
/*
ul.tablet_buttons{list-style-type:none;}
ul.tablet_buttons li{margin-top:10px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px; border:1px solid #4cadeb; border-bottom:1px solid #318fe4; background-color:#4cadeb;}
ul.tablet_buttons li a{-webkit-transition:all .3s ease-out; -moz-transition:all .3s ease-out; display:block; font-weight:bold; padding:10px; -webkit-border-radius:4px; -moz-border-radius:4px; border-radius:4px; border-top:1px solid #acd9f5; text-shadow:0 -1px 0 #4cadeb; background-color:#4cadeb; color:#ffffff; font-size:18px; background-image:url(/img/support_button_fade.png); background-repeat:repeat-x;}
ul.tablet_buttons li a:hover{background-position:0 -25px; border-top:1px solid #89c9f1; text-decoration:none; }
ul.tablet_buttons li a:active{ background-position:0 -50px; }
*/


/*push sync guide*/

body.push_sync_guide .pro_alert{margin-top:75px;}

body.push_sync_guide #header{height:820px;}
body.push_sync_guide #canvas{margin-top:-720px;}

#push_sync_diagrams{margin-top:50px; margin-bottom:50px;}
#push_sync_diagrams #push_diagram.push_sync_diagram{margin-bottom:25px; border-bottom:1px solid #77c1f0; padding-bottom:25px;}

#push_sync_diagrams #push_diagram{height:250px; background:transparent url(../img/notification_received.png) no-repeat top center;}
#push_sync_diagrams #push_diagram .description{width:230px;}
#push_sync_diagrams #push_diagram .description.free{float:left;}
#push_sync_diagrams #push_diagram .description.pro{float:right;}
#push_sync_diagrams #push_diagram .description em{color:#d7efff;}

#push_sync_diagrams .push_sync_diagram img{float:right; width:470px; display:block;}
#push_sync_diagrams .push_sync_diagram .description{width:190px; float:left;}
#push_sync_diagrams .push_sync_diagram .description h2{color:#fff; border:none; margin-top:0; text-shadow:0 1px 0 #0086E3;}
#push_sync_diagrams .push_sync_diagram .description p{color:#fff;}


/*register blue box style */
#purchase{background-color:#d7efff; margin-top:50px;}
#purchase .inner{padding:20px; overflow:auto;}
#purchase #overview{width:220px; float:left;}
#purchase #overview p.intro{}
#purchase #overview p{}

#purchase #cheque{float:right; width:392px; height:153px; background-image:url(/img/cheque_bg.png); background-repeat:no-repeat;}
#purchase #cheque #line_items{}
#purchase #cheque #line_items .line_item{overflow:auto; font-weight:bold; padding-bottom:35px; border-bottom:1px solid #cbced0; margin-bottom:12px;}
#purchase #cheque #line_items .line_item .item{float:left; width:260px;}
#purchase #cheque #line_items .line_item .price{float:right; width:50px; text-align:right;}

#purchase #cheque #checkout{overflow:auto}
#purchase #cheque #payment_button{margin:auto;text-align:center;}
#purchase #cheque #payment_button a.google{float:right;}
#purchase #cheque #payment_button a.paypal{float:left;}
#purchase #cheque #progress_bar {margin:auto;margin-top:20px;text-align:center;}

#purchase input.submit{display:block; margin-top:20px;}


.eula_box{}
.eula_box .description{float:left; width:350px;}
.eula_box .description p{margin:0; font-size:16px; line-height:1.3em;}
.eula_box .download_button{position:relative;padding:15px; -webkit-border-radius:5px; -moz-border-radius:5px; background-color:#4cadeb; float:right;}
.eula_box .download_button .agreement{ color:#fff; margin-bottom:15px;}
.eula_box .download_button .agreement input{}
.eula_box .download_button .agreement label{margin-left:8px;}
.eula_box .download_button .agreement label a{color:#fff; text-decoration:underline;}
.eula_box .download_button a.button{width:250px; float:left; margin-left:0;}






/*footer*/

#footer{margin-top:50px; font-size:11px; padding:10px; -webkit-border-radius:5px; -moz-border-radius:5px; border-radius:5px;}
body #footer{-webkit-box-shadow:#888 0 0 5px; -moz-box-shadow:#888 0 0 5px; box-shadow:#888 0 0 5px;}
body.blue_bg #footer{-webkit-box-shadow:#0A4E97 0 0 5px; -moz-box-shadow:#0A4E97 0 0 5px; box-shadow:#0A4E97 0 0 5px;}

#footer .copyright{float:left;}
#footer .footer_nav{float:right;}
#footer .footer_nav a{padding-right:5px;}
#footer .footer_nav .product{font-weight:bold; border-right:1px solid #aaa; margin-right:5px;}
#footer .footer_nav .site{}