#pen_header { float: left; left: 0; margin: 0; padding: 0; position: relative; top: 0; width: 100%; z-index: 50000; } #pen_header .pen_logo .customize-partial-edit-shortcut button { left: 0 !important; } #pen_header .pen_header_inner { background: -ms-linear-gradient(325deg, #ffffff 0%, #dddddd 100%); background: linear-gradient(125deg, #ffffff 0%, #dddddd 100%); float: left; padding: 0; position: relative; width: 100%; z-index: 100; } body.pen_drop_shadow #pen_header .pen_header_inner { box-shadow: 0 0 15px rgba(0,0,0,0.2), 2px 2px 7px rgba(0,0,0,0.3); } body.pen_round_corners.pen_width_boxed #pen_header, body.pen_round_corners.pen_width_boxed #pen_header.pen_navigation_hide .pen_header_inner { border-radius: 0 0 5px 5px; } body.pen_round_corners.pen_width_boxed #pen_header.pen_navigation_hide.pen_search_show_toolbar .pen_header_inner { border-radius: 0; } #pen_header .pen_header_inner .pen_header_main { float: left; min-height: 50px; position: relative; width: 100%; z-index: 200; } body.pen_drop_shadow #pen_header .pen_header_inner .pen_header_main { text-shadow: 1px 1px 1px rgba(255,255,255,0.5); } #pen_header .pen_header_main a { color: #555; } #pen_header h1 { float: left; margin: 0; padding: 0; position: relative; white-space: nowrap; } #pen_header h1 a { margin: 0; padding: 0; text-decoration: none; } #pen_header h1 a:focus, #pen_header h1 a:hover, #pen_header h1 a:active { outline: none; } body.pen_header_logo_size_height #pen_header h1 .custom-logo-link img { max-height: 125px; width: auto; } body.pen_header_logo_size_width #pen_header h1 .custom-logo-link img { height: auto; max-width: 125px; } #pen_header h1 a .site-title, #pen_header h1 a .site-description { line-height: 1; margin: 0; padding: 0; } #pen_header h1 a .site-description:not(:empty) { margin: 0 0 1em; } body.pen_header_alignment_center #pen_header h1 a .site-description { margin-bottom: 0 !important; } #pen_header h1 a .site-title { font-family: "roboto_slabbold", Arial, Helvetica, Sans-serif; font-weight: normal; letter-spacing: -1px; padding: 0.5em 0; } body.pen_header_sticky #pen_header h1 a .site-title, body.pen_header_sticky #pen_header h1 a .site-description, body.pen_header_sticky #pen_header .pen_header_main .pen_phone a { transition: font-size .3s, padding .3s; } body.pen_header_sticky #pen_header.pen_header_sticked h1 a.pen_has_title .site-description { padding: 0.25em 0 0; } #pen_header h1 a .site-description { float: left; font-size: 0.571em; font-weight: normal; margin: 0; padding: 0; width: 100%; } #pen_header h1 .custom-logo-link { margin: 0; } body.pen_header_logo_size_height #pen_header h1 .custom-logo-link img { max-height: 125px; width: auto; } body.pen_header_logo_size_width #pen_header h1 .custom-logo-link img { height: auto; max-width: 125px; } body.pen_header_sticky #pen_header h1 .custom-logo-link img { transition: height .3s, max-height .3s, max-width .3s, width .3s; } body.pen_header_sticky.pen_header_logo_size_height #pen_header.pen_header_sticked h1 .custom-logo-link img { max-height: 64px; width: auto; } body.pen_header_sticky.pen_header_logo_size_width #pen_header.pen_header_sticked h1 .custom-logo-link img { height: auto; max-width: 64px; } #pen_header .pen_phone { font-family: "roboto_slabregular", Arial, Helvetica, Sans-serif; font-size: 1.5em; line-height: 1; } #pen_header .pen_header_main .pen_phone a { color: #777; text-decoration: none; } #pen_header .pen_header_main .pen_phone a:focus, #pen_header .pen_header_main .pen_phone a:hover, #pen_header .pen_header_main .pen_phone a:active { color: #333; text-decoration: none; } body.pen_header_sticky #pen_header.pen_header_sticked h1 a .site-title, body.pen_header_sticky #pen_header.pen_header_sticked .pen_header_main .pen_phone a { font-size: 1em; } #pen_header .pen_social_networks ul, #pen_header .pen_social_networks li { list-style: none; margin: 0; padding: 0; } #pen_header .pen_social_networks a { display: inline-block; font-weight: normal; padding: 0.25em; text-decoration: none; transition: color .3s; } #pen_header .pen_social_networks a:focus, #pen_header .pen_social_networks a:hover, #pen_header .pen_social_networks a:active { border: 0 none; color: #333; outline: 0; text-decoration: none; } #pen_header .pen_social_networks a:before { font-family: "FontAwesome"; font-weight: normal; } #pen_header .pen_social_networks li { display: inline-block; font-size: 1.286em; line-height: 1; margin: 0; } #pen_header .pen_social_networks li.pen_twitter a:before { content: "\f081"; } #pen_header .pen_social_networks li.pen_facebook a:before { content: "\f082"; } #pen_header .pen_social_networks li.pen_instagram a:before { content: "\f16d"; } #pen_header .pen_social_networks li.pen_pinterest a:before { content: "\f0d3"; } #pen_header .pen_social_networks li.pen_linkedin a:before { content: "\f08c"; } #pen_header .pen_social_networks li.pen_bitbucket a:before { content: "\f172"; } #pen_header .pen_social_networks li.pen_flickr a:before { content: "\f16e"; } #pen_header .pen_social_networks li.pen_github a:before { content: "\f1d2"; } #pen_header .pen_social_networks li.pen_slack a:before { content: "\f198"; } #pen_header .pen_social_networks li.pen_skype a:before { content: "\f17e"; } #pen_header .pen_social_networks li.pen_vk a:before { content: "\f189"; } #pen_header .pen_social_networks li.pen_telegram a:before { content: "\f2c6"; } #pen_header .pen_social_networks li.pen_whatsapp a:before { content: "\f232"; } #pen_header .pen_social_networks li.pen_rss a:before { content: "\f143"; } #pen_header .pen_social_networks li.pen_email a:before { content: "\f199"; } #pen_header .pen_header_main .search-form { position: relative; } #pen_header .pen_header_main .search-form .search-field { background: rgba(255,255,255,0.9); border: 0 none; font-size: 0.857em; line-height: 1; margin-left: -1px !important; padding: 0.75em 37% 0.75em 1em; transition: box-shadow .2s; width: 100%; } body.pen_drop_shadow #pen_header .pen_header_main .search-form .search-field { box-shadow: 2px 2px 4px rgba(0,0,0,0.25) inset; } body.pen_round_corners #pen_header .pen_header_main .search-form .search-field { border-radius: 50px; } #pen_header .pen_header_main .search-form .search-field:focus, #pen_header .pen_header_main .search-form .search-field:active { outline: none !important; text-decoration: none; } body.pen_drop_shadow #pen_header .pen_header_main .search-form .search-field:focus, body.pen_drop_shadow #pen_header .pen_header_main .search-form .search-field:active { box-shadow: 2px 2px 2px rgba(0,0,0,0.2) inset, 0 0 7px #0087cc; } #pen_header .pen_header_main .search-form .search-submit { background: #00a9ff; background: -ms-linear-gradient(top, #00a9ff 0%, #093a89 100%); background: linear-gradient(to bottom, #00a9ff 0%, #093a89 100%); border: 0 none; color: #fff; font-weight: bold; height: 100%; margin-right: -1px !important; min-height: 100%; padding: 0.75em 0; position: absolute; right: 0; text-align: center; text-transform: uppercase; top: 0; width: 35%; z-index: 1000; } body.pen_drop_shadow #pen_header .pen_header_main .search-form .search-submit { box-shadow: 1px 1px 1px rgba(255,255,255,0.1) inset, -1px -1px 1px rgba(0,0,0,0.2) inset; text-shadow: 1px 1px 2px rgba(0,0,0,0.4); } body.pen_round_corners #pen_header .pen_header_main .search-form .search-submit { border-radius: 0 50px 50px 0; } #pen_header .pen_header_main .search-form .search-submit:active { background: #093a89; text-decoration: none; } #pen_header .pen_header_main .search-form .search-submit:focus, #pen_header .pen_header_main .search-form .search-submit:active { outline: 0 !important; } body.pen_header_alignment_center #pen_header_primary, body.pen_header_alignment_center #pen_header_secondary { float: left; width: 100%; } @media only screen and (min-width:728px) { #pen_header .pen_header_main .pen_container { min-height: 55px; position: relative; } #pen_header h1 a { float: left; } #pen_header h1 a.custom-logo-link { float: none; } body.pen_header_alignment_left #pen_header.pen_has_logo h1 a#site-title, body.pen_header_alignment_right #pen_header.pen_has_logo h1 a#site-title, body.pen_header_alignment_center #pen_header.pen_has_logo h1 a#site-title { position: absolute; right: 0; top: 50%; transform: translateY(-50%); } body.pen_header_alignment_left #pen_header.pen_has_logo h1 a#site-title, body.pen_header_alignment_center #pen_header.pen_has_logo h1 a#site-title { left: 0; right: auto; } body.pen_header_alignment_center #pen_header .pen_header_main { text-align: center; } body.pen_header_alignment_right #pen_header h1 { float: right; margin-left: 0; margin-right: 0; } body.pen_header_alignment_center #pen_header h1 { display: inline-block; float: none; margin-left: auto; margin-right: auto; } body.pen_header_alignment_right #pen_header h1 a#site-title { left: auto; right: 0; } #pen_header.pen_has_logo h1 a#site-title { padding-left: 145px; } body.pen_header_sticky #pen_header.pen_has_logo h1 a#site-title { transition: padding .3s; } body.pen_header_sticky #pen_header.pen_header_sticked.pen_has_logo h1 a#site-title { padding-left: 84px; } body.pen_header_alignment_right #pen_header.pen_has_logo h1 a#site-title { padding-left: 0; padding-right: 145px; } body.pen_header_sticky #pen_header.pen_header_sticked.pen_has_logo h1 a#site-title { padding-right: 84px; } #pen_header h1 a .site-title, #pen_header h1 a .site-description { clear: both; float: left; } #pen_header h1 .custom-logo-link img { float: left; margin: 0.5em 0; } body.pen_header_alignment_right #pen_header h1 .custom-logo-link img { float: right; } #pen_header .pen_header_wrap { padding: 1em 0; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } body.pen_header_alignment_right #pen_header .pen_header_wrap { left: 0; right: auto; } body.pen_header_alignment_center #pen_header h1 { margin-bottom: 0; } body.pen_header_alignment_center #pen_header .pen_header_wrap { float: left; padding-top: 0; position: static; right: auto; text-align: center; top: auto; transform: none; width: 100%; } #pen_header .pen_phone, #pen_header .pen_social_networks, #pen_header .pen_header_main .search-form { float: left; position: relative; } #pen_header .pen_phone { margin: 7px 1.5em 0 0; } #pen_header .pen_social_networks { margin: 2px 2em 0 0; } #pen_header .pen_header_main .search-form { line-height: 1; width: 300px; } #pen_header_primary, #pen_header_secondary { float: left; margin: 0 1em 0 0; } #pen_header_secondary { margin: 0 0 0 1em; } body.pen_header_alignment_center #pen_header_primary, body.pen_header_alignment_center #pen_header_secondary, body.pen_header_alignment_center #pen_header .pen_phone, body.pen_header_alignment_center #pen_header .pen_header_main .search-form { margin: 1em 0 0; width: 100%; } body.pen_header_alignment_center #pen_header.pen_phone_hide.pen_connect_hide .pen_header_main .search-form { margin: 0; } body.pen_header_alignment_center #pen_header .pen_phone { margin-top: 0; } body.pen_header_alignment_center #pen_header .pen_header_main .search-form { display: inline-block; float: none !important; width: auto !important; } body.pen_header_alignment_center #pen_header .pen_header_main .search-form .search-field { min-width: 350px; } body.pen_header_alignment_center #pen_header .pen_social_networks { margin: 0 0 1em; width: 100%; } } @media only screen and (min-width:728px) and (max-width:1024px) { #pen_header h1 { font-size: 1.5em; } #pen_header .pen_header_wrap { right: 1em; } #pen_header .pen_header_wrap > div { clear: both; } } @media only screen and (max-width:728px) { #pen_header{ display:none; } #pen_header .pen_header_main { padding: 1em; } #pen_header h1 { margin: 0; text-align: center; white-space: normal; width: 100%; } #pen_header h1 a { width: 100%; } #pen_header h1 img { float: none; } #pen_header h1 a#site-title, #pen_header h1 a .site-title, #pen_header h1 a .site-description, #pen_header .pen_phone, #pen_header .pen_social_networks, #pen_header .search-form { float: left; text-align: center; width: 100%; } #pen_header h1 a .site-title { letter-spacing: 0; } #pen_header h1 a .site-description { line-height: 1.5; margin-bottom: 0 !important; } #pen_header .search-form { margin: 1em 0; } #pen_header .pen_phone { font-size: 2em; padding: 0.5em 0; } #pen_header .pen_social_networks a { padding: 0.5em; } #pen_header .pen_social_networks a:before { font-size: 2em; } } @media only print { #pen_header, #pen_header .pen_header_wrap, #pen_header_primary, #pen_header_secondary, #content article { position: static !important; } #pen_header .pen_header_wrap, #content article { float: left; width: 100%; } #pen_header .pen_social_networks, #pen_header .search-form, #pen_navigation { display: none; } #content { min-height: none !important; } }