﻿/**----------------------------------------------------
    HEADER CONTENTS STYLES
-----------------------------------------------------**/


/** ==== HEADER TYPE 2 === **/
header[data-id="header-2"] { position: relative; width: 100%; height: auto; box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); z-index: 666;}
header[data-id="header-2"] .col, div[data-id="menu-bar"] .col, footer[data-id="footer-2"] .col { margin-bottom: 0;}
header[data-id="header-2"] .top-bar, header[data-id="header-2"] .head-bar { background: #ecf0f1; position: relative; display: table; width: 100%; padding: 0; vertical-align: middle; color: #58595b; z-index: 333;}
header[data-id="header-2"] .head-bar { background: #ffffff; height: auto; padding: .5em 0; z-index: 0;}
header[data-id="header-2"] .head-bar .logo-desc { position: relative; display: inline-block;}
header[data-id="header-2"] .head-bar .logo { position: relative; bottom: -3Px; float: left; margin: 0 20Px 0 0; padding: 0; height: 100%;}
header[data-id="header-2"] .head-bar .logo:first-child { margin-right: 5Px;}
header[data-id="header-2"] .head-bar .logo-txt { font-size: 3em; font-weight: 600; line-height: 1em; margin: 19Px 0 5Px;}
header[data-id="header-2"] .head-bar .logo-slg { font-size: 1.5em; font-weight: 400;}
header[data-id="header-2"] .menu-bar, div[data-id="menu-bar"] { background: #D2DBEA;}
header[data-id="header-2"] .menu-bar .search { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
header[data-id="header-2"] .menu-bar input[type="search"] { background: #ecf0f1; box-shadow: 0 0; border: 0; border-radius: 0; font-family: 'Oswald', sans-serif !important; color: #58595b; width: 100%; height: 27Px; padding: .9em .8em;}
header[data-id="header-2"] .menu-bar input[type="search"]::-webkit-input-placeholder { color: #58595b;}
header[data-id="header-2"] .menu-bar input[type="search"]:focus { outline: 0;}

/** ==== HEADER TYPE 3 === **/
header[data-id="header-3"] { position: relative; width: 100%; height: auto; box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); z-index: 666;}
header[data-id="header-3"] .col, footer[data-id="footer-3"] .col { margin: 0;}
header[data-id="header-3"] .top-bar, header[data-id="header-3"] .head-bar { background: #ecf0f1; position: relative; display: table; width: 100%; padding: 0; vertical-align: middle; color: #58595b; z-index: 333;}
header[data-id="header-3"] .head-bar { background: #ffffff; height: auto; padding: .5em 0; z-index: 0;}
header[data-id="header-3"] .head-bar .logo-desc { position: relative; display: inline-block; float: left;}
header[data-id="header-3"] .head-bar .logo { position: relative; bottom: -3Px; float: left; margin: 0 20Px 0 0; padding: 0; height: 100%;}
header[data-id="header-3"] .head-bar .logo.rgt { float: right; margin-right: 0;}
header[data-id="header-3"] .head-bar .logo-txt { font-size: 1.8em; font-weight: 600; line-height: 1em; margin: 24Px 0 5Px;}
header[data-id="header-3"] .head-bar .logo-slg { font-size: 1.5em; font-weight: 400;}
header[data-id="header-3"] .menu-bar { background: none; float: left; margin: 28Px 0 28Px 15Px;}

/** ==== HEADER TYPE 4 === **/
header[data-id="header-4"] { position: relative; width: 100%; height: auto; box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 0 8Px rgba(0, 0, 0, 0.2); z-index: 666;}
header[data-id="header-4"] .col, div[data-id="menu-bar"] .col, footer[data-id="footer-4"] .col {  margin-bottom: 0;}
header[data-id="header-4"] .top-bar, header[data-id="header-4"] .head-bar { background: #ecf0f1; position: relative; display: table; width: 100%; padding: 0; vertical-align: middle; color: #58595b; z-index: 333;}
header[data-id="header-4"] .head-bar { background: #ffffff; height: auto; padding: .5em 0; z-index: 0;}
header[data-id="header-4"] .head-bar .logo-desc { position: relative; display: inline-block; width: 75%; text-align: center;}
header[data-id="header-4"] .head-bar .logo { position: relative; bottom: -3Px; float: left; width: 10%; padding: 0; height: 100%;}
header[data-id="header-4"] .head-bar .logo.rgt { float: right; margin-right: 0; text-align: right;}
header[data-id="header-4"] .head-bar .logo-txt { font-size: 3em; font-weight: 600; line-height: 1em; margin: 19Px 0 5Px;}
header[data-id="header-4"] .head-bar .logo-slg { font-size: 1.5em; font-weight: 400;}
header[data-id="header-4"] .menu-bar, div[data-id="menu-bar"] { background: #D2DBEA;}
header[data-id="header-4"] .menu-bar .search { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex;}
header[data-id="header-4"] .menu-bar input[type="search"] { background: #ecf0f1; box-shadow: 0 0; border: 0; border-radius: 0; font-family: 'Oswald', sans-serif !important; color: #58595b; width: 100%; height: 27Px; padding: .9em .8em;}
header[data-id="header-4"] .menu-bar input[type="search"]::-webkit-input-placeholder { color: #58595b;}
header[data-id="header-4"] .menu-bar input[type="search"]:focus { outline: 0;}

/**----------------------------------------------------
    FOOTER CONTENTS STYLES
-----------------------------------------------------**/


/** ==== FOOTER TYPE 2 === **/
footer[data-id="footer-2"] .top-foot { background: #ECF0F1; padding: 10Px 0; font-size: 1em; text-align: center; color: #58595b;}
footer[data-id="footer-2"] .content-foot { background: #D2DBEA; text-align: left; color: #58595b;}
footer[data-id="footer-2"] .content-foot .copyright { display: block; padding: 15Px 0 20Px;}
footer[data-id="footer-2"] .content-foot h3 { color: #58595b;}
footer[data-id="footer-2"] .content-foot .logo { background: transparent; display: table; width: 100%; height: 355px;}
footer[data-id="footer-2"] .content-foot .logo-mdl { display: table-cell; vertical-align: middle;}
footer[data-id="footer-2"] .content-foot .logo img { display: block; margin: 0 auto;}

/** ==== FOOTER TYPE 3 === **/


/** ==== FOOTER TYPE 4 === **/
footer[data-id="footer-4"] .top-foot { background: #ECF0F1; padding: 10Px 0; font-size: 1em; text-align: center; color: #58595b;}
footer[data-id="footer-4"] .top-foot .col:first-child { text-align: left;}
footer[data-id="footer-4"] .top-foot .col:last-child { text-align: right;}
footer[data-id="footer-4"] .top-foot img { vertical-align: middle;}
footer[data-id="footer-4"] .content-foot { background: #D2DBEA; text-align: center; color: #58595b;}
footer[data-id="footer-4"] .content-foot .copyright { display: block; padding: 15Px 0 20Px;}
footer[data-id="footer-4"] .content-foot h3 { color: #58595b;}