/*
Theme Name: Spangle Lite
Theme URI: https://gracethemes.com/themes/free-interior-wordpress-theme/
Author: Grace Themes
Author URI: https://gracethemes.com/
Description: Spangle Lite is a clean, minimal, multipurpose and creative free interior design WordPress theme. This free theme is specially designed for interior design and furniture stores companies. It is also suitable for business, corporate, architecture, construction, design agency, hotel, restaurant, photography, wedding, industrial, personal, blog, news, bakery and cake shop, travel, tourism, adventurs sports, yoga, education and any othe business related website. It has attractive and minimalist design eliminates distractions and focus on your content. It is very easy to use and user friendly, also theme is translation ready. Demo Link: https://www.gracethemes.com/demo/spangle/

Version: 1.0
License: GNU General Public License version 2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: spangle-lite
Tags:blog,two-columns,right-sidebar,full-width-template,custom-colors,custom-menu,custom-header,custom-logo,featured-images,editor-style,custom-background,threaded-comments,theme-options, translation-ready

Spangle Lite WordPress Theme has been created by Grace Themes(gracethemes.com), 2018.
Spangle Lite WordPress Theme is released under the terms of GNU GPL
*/

body{ background-color:#fff; margin:0; padding:0;line-height:24px; font-size:15px; color:#363636; font-family: 'Assistant', sans-serif; -ms-word-wrap:break-word; word-wrap:break-word; }

h1,h2,h3,h4,h5,h6{ color:#484f5e; font-family: 'Roboto', sans-serif; margin:0 0 20px; padding:0; line-height:1.1; font-weight:400; }
h1{ font-size:36px;}
h2{ font-size:32px;}
h3{ font-size:28px;}
h4{ font-size:22px;}
h5{ font-size:17px;}
h6{ font-size:15px;}
.entry-title{ text-transform: uppercase;}

.postmeta{padding:0 0 5px; color:#888; margin-bottom:25px; display:inline-block; }
.postmeta a{color:#999;}
.postmeta a:hover{color:#e74c3c;}
.breadcrumbs{padding:10px 0; margin-bottom:0;}

/* Buttons */
.button{  border:1px solid #404040; color:#404040; padding:8px 20px; display:inline-block; border-radius:25px; -moz-border-radius:25px; -webkit-border-radius:25px; -o-border-radius:25px; -ms-border-radius:25px; }
.button:hover{ border:1px solid #be7b06; color:#be7b06; }

nav.pagination .page-numbers{ background-color:#ccc; padding:10px 15px; font-size:15px; font-weight:600; color:#444;}
nav.pagination .page-numbers.current{background-color:#efc62c;}
ol.comment-list li{ list-style:none; margin-bottom:5px;}

/*main site layout*/
#site-holder{ margin:0 auto; position:relative;}
.header-top{ background-color:#be7b06; color:#fff;}
.header-top .left{ padding-top:5px;}
.header-top i{ margin-right:8px;}
.header-top a{ color:#fff;}
.header-top a:hover{ color:#111 !important;}
.phoneno{ margin-right:10px;}
.headerwidget{ color:#fff; padding:10px 0; text-align:center;}
.header-title{ display:none;}

.container{ width:1170px; margin:0 auto; position:relative;}
.site-header{width:100%; z-index:9999; position: relative; }
.site-header.headerinner{ background-color:#f1f1f1 !important;}
.logo{float:left;  text-align:center; padding:15px 15px 40px; background-color:#be7b06; position:absolute; -webkit-border-bottom-right-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-bottomright: 8px;
-moz-border-radius-bottomleft: 8px;
border-bottom-right-radius: 8px;
border-bottom-left-radius: 8px;
}
.logo h1{ font:600 36px/36px 'Roboto'; margin:0; color:#444; }
.logo h1 a{ color:#fff;}
.logo p{ color:#fff;}
.head-rightpart{ float:right; text-align:right; padding:15px 0; color:#fff; }

/*header menu css*/
.toggle{display: block;}
.toggle a{width:100%; color:#ffffff; background:url(images/mobile-nav.png) no-repeat right center #3e3e3e; padding:8px 10px; margin-top:5px; font-size:16px; display:none; text-align:left;}
.toggle a:hover{color:#ffffff !important;}
/*main menu*/
.header-menu{ padding:0; z-index:9999; }
.header-menu ul {margin:0; padding:0; font-family:'Roboto', sans-serif; font-size:16px; font-weight:500; }
.header-menu ul li{display:inline-block; position:relative; margin:0;}
.header-menu ul li:last-child{border-right:none;}
.header-menu ul li a{padding:18px 20px; display:block; text-align:center;color:#111; }
.header-menu ul li ul li{ display:block; position:relative; float:none; top:1px; border-bottom:1px #ddd solid;}
.header-menu ul li ul li a{ display:block; padding-top:7px; padding-bottom:7px; position:relative; top:1px; text-align:left;}
.header-menu ul li ul{display:none; z-index:9999999; position:relative; background-color:#fff;}
.header-menu ul li:hover > ul{display:block; width:200px; position:absolute; left:0; text-align:left; }
.header-menu ul li:hover ul li ul{display:none; position:relative;}
.header-menu ul li:hover ul li:hover > ul{display:block; position:absolute; left:200px; top:0;}
.header-menu ul li a:hover, 
.header-menu ul li.current-menu-item a,
.header-menu ul li.current-menu-parent a.parent,
.header-menu ul li.current-menu-item ul.sub-menu li a:hover{ color:#be7b06;} 
.header-menu ul li.current-menu-item ul.sub-menu li a{ color: #444;}
section#home_slider{ padding:0; }
h2.sectiontitle{font-weight:600; font-size:40px; margin-bottom:50px; position:relative; text-align:center;}
.last_column{clear:right; margin-right:0 !important; }

/* = social icons css
-------------------------------------------------------------- */
.social-icons a{ width:40px; height:40px; line-height:40px; text-align:center;  vertical-align:middle; display:inline-block; padding:0; transition:0.6s; -moz-transition:0.6s; -webkit-transition:0.6s; -o-transition:0.6s; font-size:15px; color:#fff; border-radius:50%; }
.social-icons a:hover{ background-color:#be7b06;  color:#fff !important; }
.social-icons br{ display:none;}


/* = Page layout css
-------------------------------------------------------------- */
.site-page-content{ width:820px; margin:0; float:left; padding:0;}
.site-page-content ul, .site-page-content ol{ margin:0 0 20px 20px; }
.site-page-content ul li, .site-page-content ol li{ margin:0; }
.site-page-content ul ul, .site-page-content ol ol{ margin:0 0 0 30px; }
.fullwidth{ width:100% !important; float:none  !important;}
.fullwidth p{ margin-bottom:15px;}

.boxlayout{ width:1210px; margin:0 auto; background-color:#fff; position:relative; box-shadow:0 -8px 8px #111;}
.fulllayout{ width:100% !important;}
.site-pagelayout{ padding:35px 0;}
.site-pagelayout p{ margin-bottom:30px;}

.default_articles_list{ border-bottom:1px solid #e8e8e8; padding-bottom:25px; margin-bottom:40px; }
.default_articles_list h3, h3.single-title{ margin-bottom:5px; font-size:20px; text-transform:uppercase; font-weight:600;}
.default_articles_list h3 a{ color:#484f5e;}
.default_articles_list h3 a:hover{ color:#efc62c;}
.default_articles_list p{ margin-bottom:20px;}
.blog-meta{ font-style:italic; margin-bottom:8px;}
.default_articles_list .post-thumb{ margin-bottom:15px;}
.default_articles_list .post-thumb img{ padding:6px; border:1px solid #ddd;}
.post-date, .post-comment, .post-categories, .edit-link{ display:inline; color:#333; font-weight:600; text-transform:uppercase; letter-spacing:2px; font-size:13px; margin:0 10px 0 0;} 
.single_title{ margin-bottom:5px;}

/* = Four column box section
-------------------------------------------------------------- */
#pagecolumnsection{ background-color:#fff; text-align:center; padding:50px 0;}
h2.section_title{font-weight:600; font-size:38px; margin-bottom:50px; position:relative; text-align:center; text-transform:uppercase;}
.spngl_fourcolumn{ background-color:#f2f2f2; padding:0; width:23%; float:left; margin:0 2.5% 0 0; position:relative; text-align:center; }
.spngl_fourcolumn h3{ font-size:17px; font-weight:600; color:#101010; margin:0 0 15px; text-transform:uppercase; }
.spngl_fourcolumn h3 a{color:#101010; }
.spngl_fourcolumn .thumbbx{ background-color:#be7b06; height:190px; overflow:hidden; margin:0 auto; transform: scale(1); transition: all 0.35s ease-in-out 0s; }
.spngl_fourcolumn .thumbbx img{backface-visibility:hidden; height:auto; min-height:200px; transition:opacity 1s ease 0s, transform 1s ease 0s; vertical-align:middle; }
.spngl_fourcolumn:hover .thumbbx img {opacity:0.2; transform: scale3d(1.3, 1.3, 1); }
.four-pagecontent{ padding:20px; position:relative; }
.four-pagecontent p{ margin-bottom:20px;}
.spngl_fourcolumn:hover .readmore{ background-color:#be7b06; border-color:#be7b06; color:#fff;}
.readmore{ border:1px solid #333; color:#333; padding:5px 15px; display:inline-block; border-radius:5px;}
.readmore:hover{ background-color:#be7b06; border-color:#be7b06; color:#fff; }


/* = sidebar
-------------------------------------------------------------- */
#sidebar{ width:300px; float:right; }
aside.widget{margin-bottom:30px; background-color:#f0efef; padding:20px; -webkit-border-bottom-right-radius:10px;
-webkit-border-bottom-left-radius: 10px;
-moz-border-radius-bottomright: 10px;
-moz-border-radius-bottomleft: 10px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;}
aside.widget ul{ list-style:disc; }
h3.widget-title{ background-color:#be7b06; padding:12px 20px; margin:-20px -20px 10px; color:#fff; text-transform:uppercase; font-size:18px; font-weight:600; letter-spacing:2px; }
#sidebar ul li{ list-style: none; padding:6px 0 8px 0; list-style-position:inside; margin:0; border-bottom:1px solid #ddd;}
#sidebar ul li a{ padding:0; color:#3b3b3b;  display:inline-block; }
#sidebar ul li a:hover{ color:#34c6f6;}
#sidebar ul li:last-child{ border:none;}

#sidebar .search-form{ margin-bottom:20px;}
#sidebar .search-form input.search-field{ background-color:#fff; width:80%; padding: 12px 15px 12px 15px; border:1px solid #ddd; }
#sidebar .search-form input.search-submit{ background:url(images/search-icon.png) no-repeat center center #efc62c; padding: 12px 0 12px 0; font-size:0; width:20%; height:43px; float:right; border:0;}

/* = Footer css
-------------------------------------------------------------- */
.site-footer {background-color:#303030; position:relative; padding:20px 0; color:#999;}
.footer-copyright a:hover{ color:#fff;}
.copyright-txt span{color:#efc62c;}
.design-by { text-align:center;}
.design-by a:hover{color:#999;}



/* = Contact Form 7 css
-------------------------------------------------------------- */
.wpcf7{ margin:30px 0 0; padding:0;}
.wpcf7 input[type="text"], .wpcf7 input[type="tel"], .wpcf7 input[type="email"]{ width:40%; border:1px solid #cccccc; box-shadow:inset 1px 1px 2px #ccc; height:35px; padding:0 15px; color:#797979; margin-bottom:0;}
.wpcf7 textarea{width:60%; border:1px solid #cccccc; box-shadow:inset 1px 1px 2px #ccc; height:150px; color:#797979; margin-bottom:25px; font:12px arial; padding:10px; padding-right:0;}
.wpcf7 input[type="submit"]{background-color:#efc62c; width:auto; border:none; cursor:pointer; font:18px 'Roboto',san-serif; color:#ffffff; padding:10px 40px; border-radius:3px;}

/* Text meant only for screen readers. */
h1.screen-reader-text{font:22px/24 'Roboto',san-serif;}
.screen-reader-text {clip: rect(1px, 1px, 1px, 1px);position: absolute !important;	height: 1px;width: 1px;	overflow: hidden;}
.screen-reader-text:focus {	background-color: #f1f1f1;	border-radius: 3px;	box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);	clip: auto !important;	color: #21759b;	display: block;
	font-size: 14px;font-size: 0.875rem;font-weight: bold;	height: auto;left: 5px;	line-height: normal;padding: 15px 23px 14px;text-decoration: none;	top: 5px;	width: auto;
	z-index: 100000; /* Above WP toolbar. */
}