/***

	KLEN - Creative Portfolio Theme
	Author : Soon Labs
	Copyright © 2019
	
***/

/***

    CSS INFO :
    
    0.0 - IMPORT
    1.0 - PRELOADER 
    2.0 - HEADER
    3.0 - SLIDER
    4.0 - PORTFOLIO 
    5.0 - ABOUT
    6.0 - CONTACT 
    7.0 - WORK DETAIL 
    8.0 - BOTTOM CONTENT 
    9.0 - FOOTER 
    10.0 - RESPONSIVE
    
***/


/** 1.0 GENERAL **/

html, body {  margin:0 !important; margin-top:0px !important; padding:0;  width:100%;  height:100%; font-family: 'Montserrat', sans-serif !important; box-sizing: border-box; background-color:#222222; }
html { overflow-x: hidden; overflow-y: scroll; }

body { height:100%; }

/**[class*="col-"] { padding-left:30px; padding-right:30px; } **/

body.error404 { height:auto; }

.owl-stage-outer { width:100%; height:100%; }
.owl-item { width:100%; height:100%; }
.owl-stage { width:100%; height:100%; }

.no-padding { padding:0px 0px !important; }
.no-padding-top { margin-top:60px; }

.overflow-hidden { overflow: hidden; }
.overflow-scroll { overflow-y: scroll; }

.blog-opacity { opacity:.2; }
.dropIndex { z-index:-1; }

.small-carousel { padding:150px 300px; }

.owl-stage { -webkit-transition: all 500ms cubic-bezier(1.000, 0.005, 0.355, 1.000); -moz-transition: all 500ms cubic-bezier(1.000, 0.005, 0.355, 1.000); -o-transition: all 500ms cubic-bezier(1.000, 0.005, 0.355, 1.000); transition: all 500ms cubic-bezier(1.000, 0.005, 0.355, 1.000); }

main { position:relative; display:block; top:200px; opacity:0;  }
a:hover { text-decoration: none !important; }

.equal-height { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; }

.animeasing { transition: all 0.5s ease; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; }

.white { color:#FFFFFF; }
.black { color:#000000; }

.whiteBack { background-color:#FFFFFF; }
.blackBack { background-color:#000000; }

.shadow { -webkit-box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.7); -moz-box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.7); box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.7); }

.head-sticky { position:fixed !important; top:60px !important; transform: none !important; padding:20px 0px; z-index:990; background-color:#000000; margin:auto; -webkit-box-shadow: 0px 2px 5px 1px rgba(0,0,0,0.04); -moz-box-shadow: 0px 2px 5px 1px rgba(0,0,0,0.04); box-shadow: 0px 2px 5px 1px rgba(0,0,0,0.04); }
.head-sticky h1 { font-size:25px !important; }
.head-sticky p { font-size:12px !important; }

.h404 { font-size:200px; font-weight:700 !important; padding:0px !important; margin:0px !important;  }
.h4042 { font-size:30px; font-weight: 700 !important; padding:0px !important; margin:0px !important; }

@keyframes scroll {
    0% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(60px);
    }
}

svg #wheel {
    animation: scroll ease 2s infinite;
}

/** 1.0 PRELOADER **/

.loading { position:fixed; width:100%; height:100%; background-color:#000000; z-index:10500; }
.loading-wrapper { text-align: center; top:50%; position:relative; transform:translateY(-50%); }
.loading-wrapper object { width:60px; height:60px; }

.sub-loading { position:fixed; width:100%; height:100%; z-index:10400; display:none; opacity:0; background:rgba(0,0,0,.2)}
.sub-loading-wrapper { position:relative; text-align: center; top:50%; position:relative; transform:translateY(-50%); }
.sub-loading-wrapper object { width:60px; height:60px; }

/** 2.0 HEADER **/

.admin-bar header { top:32px; }

header { position:fixed; width:100%; z-index:999; display:table; left:0px; top:0px; left:0px; }

.header-sticky { background-color:#000000;  }

.header-main { position: relative; height:60px; display:table-cell; vertical-align: middle; z-index:900; }
.header-main:after { content: ''; clear: both; display: block; }

.header-logo { padding:0px 60px; float:left; }
.header-logo img { width:50px; height:25px; }

.header-menu { position:relative; float:right; display:table-cell; vertical-align: middle; padding:0px 60px; }

.header-menu-icon { width:24px; height:24px; }
.header-menu-icon:hover { cursor:pointer; }
.header-menu-icon:hover span:nth-child(2) { width:24px; }

.header-menu-view { position:fixed; width:100%; height:100%; background-color:#000000; left:0px; right:0px; bottom:0px; z-index:10006; opacity:0; display:none; }
.header-menu-view > ul { position:absolute; list-style: none; top:50%; left:50%; transform: translate(-50%, -50%); padding:0px; margin:0px; }
.header-menu-view > ul > li { position:relative; text-align: center; font-size:30px; padding:5px 0px; color:#FFFFFF; font-weight: 600; opacity:0; }
.header-menu-view > ul > li:hover { font-size:36px; cursor:pointer; }
.header-menu-view > ul > li > a { color:#FFFFFF; }

.header-menu-view ul li ul { padding:15px 0px; margin:0px; position:relative; display:none; list-style:none; }
.header-menu-view ul li ul li { font-size:16px; padding:4px 0px; font-weight: 400; }
.header-menu-view ul li ul li a { color:#FFFFFF; }
.header-menu-view ul li ul li a:hover { opacity:.7; }

.header-close { color:#FFFFFF; position:fixed; right:60px; top:30px; border:0px; background-color: #000000; width:50px; height:50px; font-size:12px; border-radius: 50%; text-align: center;}
.header-close i { line-height:50px; }
.header-close:hover { cursor:pointer; background-color: #FFFFFF; }
.header-close:hover i { color:#000000; }

#open-icon,
#close-icon { width:20px; height:20px; }

#open-icon path,
#close-icon path { fill:#FFFFFF; }

.visible-menu .header-menu-icon { display:none; }
.visible-menu .header-close { display:none; }
.visible-menu .header-menu-view { position:relative; opacity:1; display:block; top:0px; background-color: unset; }
.visible-menu .header-menu-view > ul { position: relative; top:unset; left:unset; transform:unset; }
.visible-menu .header-menu-view > ul > li { opacity:1; display:inline-block; top:0px; font-size:13px; padding:0px 20px; }

.visible-menu .header-menu-view > ul > li > ul { position:absolute; min-width:150px; background-color:#000000; text-align: left; padding:5px 10px; margin-top:15px; }
.visible-menu .header-menu-view > ul > li > ul > li { font-size:13px; }



/** 3.0 SLIDER **/

.wp-block-klen-carousel { position:fixed; top:0px; left:0px; width:100%; height:100%; }

.slider { position:relative; width:100%; height:calc(100% - 1px); overflow: hidden;  }

.slider-wrapper { width:100%; height:100%; top:0px; transition-delay:550ms; overflow:hidden; }
.slider-wrapper a { position:relative; width:100%; height:100%; }
.slider-item { position:relative; width:100%; height:100%; display:block; box-sizing: border-box; }

.slider-item-wrapper { position:relative; display:block; width:100%; height:100%; background-color:#000000;  }

.slider-item-image { width:100%; height:100%; -webkit-box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.5); -moz-box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.5); box-shadow: 0px 19px 36px -15px rgba(0,0,0,0.5); }
.slider-item-image { background-color:#000000; background-size:cover; background-position: center center; background-repeat: no-repeat; opacity:.7; }

.slider-item-content { position:absolute; top:50%; left:50%; transform: translate(-50%, -50%); padding:0px 50px; width:100%; overflow: hidden; pointer-events: none; text-align: center; }

.slider-item-content-category { position:relative;  overflow: hidden; width:100%; top:1px; }
.slider-item-content-category p { position:relative; font-size:14px; font-weight: 300; margin:0px; top:200px; opacity:.7;  word-break: break-all; }

.slider-item-content-category-opened { top:0px !important; transition-delay: 400ms; }

.slider-item-content-title { position:relative;  overflow: hidden; width:100%; margin-right:-20px; pointer-events: none; }
.slider-item-content-title h1 { position:relative;  margin:0px; font-size:80px; letter-spacing:-1px; font-weight:500;  top:200px;  word-break: break-all; }

.slider-item-content-title-opened { top:0px !important;; transition-delay: 450ms; }

.slider-item-content button { pointer-events: none; font-size:14px; background-color:#000000; color:#FFFFFF; padding:15px 40px; border-radius: 50px; border:0px; margin-top:30px; }

.slide-anime { transform: scale(0.8); }
.slider-item-title-anime { padding: 0px 10px; }
.slider-item-title-spacing { letter-spacing: 0px !important; }

.slider-number { position:fixed; bottom:0px; left:0px; padding-left:60px; color:#FFFFFF; z-index:900; }
.slider-number ul { list-style: none; padding:0px; margin:0px; display: flex; align-items: center; }
.slider-number ul li { display: inline-block; line-height: 70px; }

.slider-number ul li:nth-child(1) { font-size:18px; font-weight: 700; width:40px; }
.slider-number ul li:nth-child(2) span { position:relative; display:block; width:30px; height:1px; background-color: #FFFFFF; border:0px; padding:0px; margin:0px;  }
.slider-number ul li:nth-child(3) { font-size:12px; font-weight: 500; width:50px; text-align: center; } 

.slider-social { position:fixed; display:block; line-height: 70px; bottom:0px; right:0px; padding-right:60px; z-index:900; }
.slider-social ul { list-style: none; padding:0px; margin:0px; }
.slider-social ul li { display: inline-block; font-size:14px; font-weight: 300; padding:0px 10px; line-height: 70px; }

.slider-social ul li a { color:#FFFFFF; }
.slider-social ul li a:hover { color:#FFFFFF; cursor:pointer; }

.owl-dots { position:fixed; bottom:0px; width:100%; text-align: center; z-index:950; line-height: 70px; }
.owl-dots .active span { height:2px; background-color:#FFFFFF; }

.owl-dots button {  width:40px; height:16px; margin:0px 2px; outline: none; }
.owl-dots button span { position:relative; display:block; width:100%; background-color: #555555; height: 1px; }

/** Page Head **/

.page-head { position:relative; }

.page-head-wrapper { padding-bottom:50px; }
.page-head-wrapper { color:#FFFFFF; }

.page-head-wrapper h1 {  padding:0px; margin:0px; margin-bottom:5px; font-weight: 600 !important; }
.page-head-wrapper h4 { font-weight: 300; padding:0px; margin:0px; }

.page-head-social { margin-top:40px; }
.page-head-social ul { padding:0px; margin:0px; }
.page-head-social ul li { font-size:13px; display:inline-block; text-align: center; width:50px; background-color:#000000; line-height: 50px; opacity:.7; }

.page-head-social ul li a { color:#FFFFFF; }
.page-head-social ul li:hover { opacity:1; cursor: pointer; background-color:#FFFFFF; }
.page-head-social ul li:hover a { color:#333333; }

.page-head-wrapper hr { opacity:.2; width:50px; height:1px; border:0px; background-color:#FFFFFF; margin:0px auto; margin-top:60px; margin-bottom:20px; }


/** Page Items **/

.image-container { padding-top:20px; padding-bottom:20px; }
.image-item img { width:100%; }

.page-content { padding-top:20px; padding-bottom:20px; }
.page-content-item h3,
.page-content-item h5,
.page-content-item p { color:#FFFFFF; padding:0px !important; }

.page-content-item h3 { font-size:30px; margin-bottom:15px; }
.page-content-item h5 { margin-bottom:10px; }
.page-content-item p { opacity: .7; font-weight: 200; }

.page-image { padding-top:15px; padding-bottom:15px; }
.page-image-item-wrapper { padding:35px 40px 25px 40px; background-color:#000000; width:100%; }
.page-image-item-wrapper:hover { background-color:#111111; }

.page-image-image { text-align: center; padding-bottom:40px; }

.page-image-content { color:#FFFFFF; text-align: center; }
.page-image-content h4 { font-weight: 600 !important; }
.page-image-content p { opacity:.6; }

.page-separator { padding-top:20px; padding-bottom:20px; }
.page-separator-item h3,
.page-separator-item p { color:#FFFFFF; }

.page-separator-item h3 { font-size:30px; }
.page-separator-item p { opacity: .7; font-weight: 200; }

.reference-item-wrapper { padding:15px 0px; }

.reference-image { background-color:#000000; }
.reference-image:hover { background-color:#111111; }
.reference-image img { width:100%; }


.close-button { color:#FFFFFF; text-align: right;  }
.close-button i { padding:15px 15px; background-color:#FFFFFF; color:#000000;  }

.close-button i:hover { cursor:pointer; }

.entry-content::after { content: ''; clear: both; display: block; }

.entry-header { padding-bottom:30px; }
.entry-head { width:fit-content; background-color:#111111; padding:8px 15px; }
.entry-head h6 { margin:0px !important; padding:0px !important; font-size:14px !important; }

/** Masonry **/

.masonry { position:relative; display:block; width:100% !important; padding:0px 200px !important; max-width:100% !important; }
.masonry-item { padding:45px 45px; z-index:750; position:relative; }

.masonry-item-image img { width:100% }
.masonry-item a { cursor: pointer; }

.masonry-item-wrapper { position:relative; display:block; overflow: hidden;}
.masonry-item-wrapper:hover { -webkit-box-shadow: 0px 0px 50px -9px rgba(0,0,0,0.5); -moz-box-shadow: 0px 0px 50px -9px rgba(0,0,0,0.5); box-shadow: 0px 0px 50px -9px rgba(0,0,0,0.5); }

.masonry-item-content { position:absolute; bottom:-100%; left:0px;  padding:50px 50px; pointer-events: none; }
.masonry-item-content p { padding:0px; margin:0px; font-size:15px; opacity:.8; }
.masonry-item-content h2 { padding:0px; margin:0px; font-size:32px; font-weight: 600; }

.masonry-item.visible .masonry-item-content { bottom:0%;  }
.masonry-item.visible .masonry-item-image { opacity:.6; }

.masonry-item-wrapper:hover .masonry-item-content { bottom:0%;  }
.masonry-item-wrapper:hover .masonry-item-image { opacity:.8; }

.masonry-filter { position:fixed; bottom:60px; left:60px; z-index:10005; }

.masonry-filter-button { color:#FFF; border:0px; background-color: #000000; width:50px; height:50px; font-size:12px; border-radius: 50%; text-align: center; }
.masonry-filter-button i { line-height: 50px; }
.masonry-filter-button:hover { cursor:pointer; background-color: #FFFFFF; }
.masonry-filter-button:hover i { color:#000000; }

.masonry-filter-list { position:fixed; z-index:999; top:100px; display:none; left:0px; width:100%; height:100%; background-color:#000000; opacity:0; }
.masonry-filter ul { position:relative; width:fit-content; padding: 0px; top:50%; transform: translateY(-50%); margin:auto; list-style: none; }
.masonry-filter ul li { color:#fff; font-size:22px; font-weight:600; opacity:.6; margin-bottom:5px; text-align: center; }
.masonry-filter ul li:hover { opacity:1; cursor:pointer; }

.masonry-filter ul li.active { opacity:1; }

.masonry-filter-close { color:#FFFFFF; position:fixed; right:60px; top:30px; border:0px; background-color: #000000; width:50px; height:50px; font-size:12px; border-radius: 50%; text-align: center;}
.masonry-filter-close i { line-height:50px; }
.masonry-filter-close:hover { cursor:pointer; background-color: #FFFFFF; }
.masonry-filter-close:hover i { color:#000000; }

.masonry-filtered { opacity:.1; }


/** BLOG **/

.blog-page-head { text-align: center; }

.blog-container { position:relative; display:block; padding:0px 200px; }

.blog-item-container { padding:45px 45px; }
.blog-item { color:#FFFFFF;  }

.blog-item-wrapper { background-color:#000000; }

.sticky .blog-item-wrapper { background-color:#ffffff; }
.sticky .blog-item-content { color:#000000 !important; }
.sticky .blog-item-content span,
.sticky .blog-item-content p { font-weight: 500; }

.sticky .blog-item-read a { color:#000000; font-weight: 500; }

.sticky .date-author a { color:#000000; }

.sticky .blog-item-content h3 a { color:#000000; }

.blog-item-image { overflow: hidden; }
.blog-item-image img { width:100%; }
.blog-item-wrapper:hover .blog-item-image img { transform: scale(1.1); }

.blog-item-content { padding:30px 30px; }
.blog-item-content span { font-size:12px; opacity:1; font-weight:300; }
.blog-item-content h3 { padding:0px; margin:0px;     word-break: break-word; }
.blog-item-content p { font-size:13px; opacity: .6; font-weight:300; word-break: break-word; }

.blog-item-pre p { opacity: .5; font-size:14px;  }
.blog-item-read { font-size:14px; }
.blog-item-read a { color:#FFFFFF;  opacity:.8; }
.blog-item-read a:hover { opacity:1; }

.post-categories { padding:0px; margin:0px; list-style: none; }
.post-categories li { display: inline-block; }
.post-categories li a { color:#FFFFFF; opacity: .6; }
.post-categories li a:hover { opacity:1; }


#klensidebar { width:400px;  position:relative; }

.blog-sidebar { color:#FFFFFF; }

.blog-sidebar { position:fixed; bottom:60px; right:60px; z-index:990; }

.blog-sidebar-close { padding:0px 40px; }

.blog-sidebar-button { color:#FFF; border:0px; background-color: #000000; width:50px; height:50px; font-size:12px; border-radius: 50%; text-align: center; }
.blog-sidebar-button i { line-height: 50px; }
.blog-sidebar-button:hover { cursor:pointer; background-color: #FFFFFF; }
.blog-sidebar-button:hover i { color:#000000; }

.admin-bar .blog-sidebar-wrapper { top:32px; }

.blog-sidebar-wrapper { position:fixed; top:0px; z-index:10005; right:-600px; height:100%; background-color:#000000; overflow-y: scroll; }
.blog-sidebar-overlay { width:100%; height:100%; position:fixed; background-color:#222222; top:0px; left:0px; z-index:10004; display:none; opacity:0; }

.blog-navigation .nav-links { margin:auto; border-top:solid 1px #333333; border-bottom:solid 1px #333333; padding:30px 0px; }
.blog-navigation .nav-links ul { padding:0px; margin:0px; }
.blog-navigation .nav-links ul li { display: inline-block; color:#FFFFFF; padding:0px 10px; font-size:14px; line-height: 40px; font-weight: 500; }
.blog-navigation .nav-links ul li .current { font-weight: 700; font-size:20px; vertical-align: middle; }
.blog-navigation .nav-links ul li a { color:#FFFFFF; opacity:.5; vertical-align: middle; }
.blog-navigation .nav-links ul li a:hover { opacity:1; }
.blog-navigation .nav-links ul li .prev i { font-size:12px; vertical-align: middle; }
.blog-navigation .nav-links ul li .next i { font-size:12px; vertical-align: middle; }

.blog-navigation-prev,
.blog-navigation-next { color:#FFFFFF; padding:0px 50px; line-height: 40px; }

.blog-navigation-wrapper { position:relative;  }


/** BLOG SINGLE **/
.single-container { position:relative; display:block; padding:0px; padding-top:50px; }

.single-item { color:#FFFFFF; padding:50px 0px 0px 0px; }

.single-item-category { font-size:13px; }
.single-item-category ul { list-style: none; padding:0px; margin:0px; }
.single-item-category ul li { display: inline-block;  }
.single-item-category ul li a { color:#FFFFFF; }

.single-item-category ul li::after { content:','; }
.single-item-category ul li:last-child:after { content: ''; }

.single-item-title { font-size:40px; color:#FFFFFF; font-weight: 600; padding:0px 0px; margin:-3px 0px; }
.single-item-date { font-size:12px; opacity:.5; }

.single-item-image { padding-top:40px;  }
.single-item-image img { width:100%; height:auto !important; }

.single-item-content img { max-width:100%; height:auto !important; }

.entry-content { padding-bottom:30px; }
.entry-featured { padding-bottom:30px; }
.entry-featured img { width:100%; height: auto; }

.single-item-content { color:#FFFFFF; padding:50px 50px; background-color: #111111;  }

.single-item-content h1, 
.single-item-content h2,
.single-item-content h3,
.single-item-content h4,
.single-item-content h5,
.single-item-content h6 { padding-top:15px; padding-bottom:15px; margin:0px; }

.single-item-content h3 { font-weight: 600; padding:15px 0px; }
.single-item-content h5 { font-weight: 400; }
.entry-content > p {  margin-top:15px; margin-bottom:15px; opacity:.9; padding:0px 0px;  font-size: inherit; line-height: inherit; }

.single-item-content blockquote { border-left: solid 4px #ffffff; padding:10px 20px !important; font-size:14px; font-style: italic; font-weight: 400; margin:20px 0px !important; }
.single-item-content blockquote p { opacity: 1; font-size:18px; margin:0px;  }


.single-item-content figcaption { padding:15px 15px; font-size:13px; background-color:#000000; margin:0px; }

.single-item-content::after { content:''; clear:both; display:block; }


/** NEW COMMENTS **/

.comment-wrapper { max-width: 1280px; margin: auto; background-color:#111111; padding:50px 50px; margin-top:20px; }

.comment-contents .comments > section { padding:15px 0px; }

.comments-list { background-color:#111111; }
.comments-list article { padding:15px 0px; }

.comments-section-wrapper { background-color:#222222; }

.comments-head { position:relative; padding:20px 20px 5px 20px; }
.comments-head figure,
.comments-head .comment-author { position:relative; float:left; } 

.comments-list article.pingback .comments-head figure { margin-right:0px; }

.comments-head figure { margin-right:10px; }
.comments-head .comment-author h6 { font-size:16px; font-weight: 500; padding:0px; margin:0px;  }
.comments-head .comment-author time { color:#FFFFFF; font-size:12px; opacity:.6; font-weight: 300; }

.comments-head::after { content: ''; clear: both; display:block; }

.comments-content { padding:0px 20px; color:#FFFFFF; }

.comments-function { position:relative; padding: 0px 20px 20px 20px; }

.comments-function .comment-meta-edit,
.comments-function .comment-meta-reply { position:relative; font-size:12px; opacity:.6; float:left; }
.comments-function .comment-meta-edit { margin-right:10px; }

.comments-function::after { content: ''; clear: both; display:block; }

.child-comments { padding:10px 0px 10px 50px; }
.child-comments article { padding:0px 0px; }

.comments-reply-title,
.comment-reply-title small { float:left; line-height:30px; }

.comment-reply-title::after { content:''; clear: both; display: block; }

.comment-reply-title small a h4 { font-size:12px; background-color:#000000; color:#999999; padding:5px 10px; }

.comment-reply-block .comment-respond { background-color:#000000; padding:20px; margin-top:-25px; }
.comment-reply-block .comment-reply-title small a h4 { background-color:#333333; }
.child-comments .comment-respond { background-color:#000000; padding:20px; margin-top:0px; }

.comment-wrapper h1, 
.comment-wrapper h2, 
.comment-wrapper h3, 
.comment-wrapper h4, 
.comment-wrapper h5, 
.comment-wrapper h6 { padding-top:0px !important; padding-bottom:0px !important; }

/** BLOG COMMENTS **/
.comments { padding:0px 65px; }

.comments-title { color:#FFFFFF;  }

.comment-notes { color:#FFFFFF; opacity:.5; font-size:12px; }
.comment-form-cookies-consent { color:#FFFFFF; font-size:12px; }
.comment-form-cookies-consent label { margin-left:10px; opacity: .5; }

.comments-reply { padding:10px 0px 0px 0px; }
.comments-reply-title { margin-bottom: 0px; }
.comments-reply-title h4 { color:#FFFFFF; font-size:16px; line-height: 26px; margin-right:10px; }

.comments-form-group { margin-bottom:10px; padding:0px 15px; }
.comments-form-group input { font-size:12px; color:#FFFFFF; border:solid 1px #666666; background-color: transparent; width:100%; padding:10px 20px; outline:none; }
.comments-form-group input::placeholder { color:#999999; }
.comments-form-group input:focus { border:solid 1px #FFFFFF; }
.comments-form-group textarea { font-size:12px; color:#FFFFFF; width:100%; border:solid 1px #666666; background-color: transparent; resize:none; padding:10px 20px; outline:none; }
.comments-form-group textarea::placeholder { color:#999999; }
.comments-form-group textarea:focus { border:solid 1px #FFFFFF; }

.form-submit input[type="submit"] { border:solid 1px #FFFFFF; width:150px; border-radius:0px; color:#FFFFFF; font-size:12px; padding:10px 20px; }
.form-submit input[type="submit"]:hover { background-color: #ffffff; color:#000000; cursor:pointer; }

.comments-logged-in { margin-bottom:15px; width:fit-content; border:solid 1px #FFFFFF; background-color:#FFFFFF; color:#FFFFFF; }
.comments-logged-in p { font-size:14px; color:#000000; margin:0px; padding:10px 0px 10px 10px; }
.comments-logged-in p .member_name { font-weight:600; color:#000000; background-color:#FFFFFF; }

.comments-logged-in p .member_logout { color:#000000; background-color:#FFFFFF; padding:10px 10px; }
.comments-logged-in p .member_logout:hover { background-color:#EBEBEB; }

.comments-list ul { padding:0px; margin:0px; }
.comments-list ul li { padding:25px 25px; border:solid 1px #333333; margin-bottom:15px; }

.comments-list footer { margin:0px; }

.comment-meta .comment-author { color:#FFFFFF; font-size:15px;  }
.comment-meta .comment-author img { padding:2px 2px; background-color:#111111; margin-right:15px; }
.comment-meta .comment-author a { color:#FFFFFF; }

.comment-content { color:#FFFFFF; padding:25px 0px; font-size:15px; }
.reply { font-size:15px; }

.comment-metadata { position:absolute; bottom:-8px; padding-left:58px; font-size:13px; opacity: .5;  }
.comment-metadata a { color:#FFFFFF; }

.comment-body .reply { color:#FFFFFF !important; }
.comment-body .reply a { color:#FFFFFF !important; }

/** POST PAGINATION **/

.single-page-pages { background-color:#111111; padding:10px 10px; width:fit-content; margin-top:20px; }

.single-content-pages { background-color:#222222; padding:10px 10px; width:fit-content; margin-top:20px; }
.page-links span.current span { background-color:#FFFFFF; color:#000000; font-size:12px; width:20px; text-align: center; line-height: 20px; padding:5px 10px; }
.page-links a span { font-size:12px; padding:0px 10px; }

/** BLOG TAGS **/

.post-tags { background-color:#222222; padding:10px 10px; margin-top:20px; }
.post-tags ul { list-style: none; padding:0px; margin:0px; }
.post-tags ul li { display: inline-block; padding:5px 5px; font-size:13px; }


.post-tags .tag-wrapper { background-color:#333333; padding:5px 10px; }


/** NOT FOUND POSTS **/


.content-notfound { padding-top:50px; width:100%; position:relative; text-align:center; height:200px; }
.content-notfound-wrapper h3 { color:#FFFFFF; }

.page-transition { width:100%; height:100%; background-color:#222222; position:fixed; top:0px; left:0px; z-index:998; height:0px; opacity:0; }

.no-padding .masonry-item { padding:0px 0px !important; }


/** CONTACT **/

.contact { padding-top:20px; padding-bottom:20px; padding-left:0px; padding-right:0px; }
.contact-head { color:#FFFFFF; padding:60px 60px; }

.contact-item { margin-bottom:30px; }
.contact-item input,
.contact-item textarea { width:100%; border:solid 1px #444444; background: transparent; outline:none; padding:15px 15px; color:#ffffff; resize:none; font-size:14px; }

.contact-item input::placeholder,
.contact-item textarea::placeholder { color:#999999; }
.contact-item input:focus,
.contact-item textarea:focus { border:solid 1px #FFFFFF; }

.contact-item button { position:relative; width:100%;  font-size:30px;font-weight: 700; vertical-align: middle; background:none; outline:none; border:0px; backface-visibility: hidden; }

.contact-map { margin-top:60px; }
.contact-map iframe { width:100%; height:400px; border:none; }

.contact-detail { margin-top:100px; color:#FFFFFF; }
.contact-detail-head { margin-bottom:60px; }

.contact-detail-item-wrapper { width:100%; padding:20px 0px; border:solid 1px #333333; }
.contact-detail-item-icon { text-align: center; padding:30px 0px; }
.contact-detail-item-icon i { font-size:25px; }

.contact-item button { width:fit-content; color:#FFFFFF; border:solid 1px #FFFFFF; font-size:14px; padding:10px 20px; outline: none; font-weight: 500; }
.contact-item button:hover { background-color:#FFFFFF; color:#222222; cursor:pointer;  }

.contact-wrapper .contact-item:last-child { margin-bottom:0px; } 

.wpcf7-submit { display:none; }

.wpcf7-response-output { margin:-25px 0px 30px 0px !important; }
.wpcf7-validation-errors { border:solid 1px #f5c6cb !important; background-color:#f8d7da; color:#721c24; text-align: center; padding:10px 10px !important; }
.wpcf7-mail-sent-ok { border:solid 1px #c3e6cb !important; background-color:#d4edda; color:#155724; text-align: center; padding:10px 10px !important; }
.wpcf7-not-valid-tip { font-size:12px !important;  padding:10px 0px; opacity:.8; }

/** 7.0 WORK DETAIL **/

.top-item { background-color:#000000; }

.top-item,
.top-item-wrapper,
.top-item-image { position:relative; width:100%; height:100%; overflow: hidden; }

.top-item-image { background-size:cover; background-position: center center; background-repeat: no-repeat; background-attachment: fixed;  }

.top-item-overlay { width:100%; height:100%; position:Absolute; background-color:#000000; opacity:.3; z-index:900; }

.top-item-content { position:absolute; width:100%; top:40%; transform: translateY(-50%); text-align: center; pointer-events: none; z-index:920; }
.top-item-category { position:relative; overflow: hidden; width: 100%; margin:auto; top:1px; text-align: center; }
.top-item-category p { position:relative; font-size:18px; font-weight: 300; margin:0px; top:0px; opacity:.7; }

.top-item-title { position:relative;  overflow: hidden; width:100%; margin-right:-20px; }
.top-item-title h1 { position:relative;  margin:0px; font-size:80px; font-weight:600; letter-spacing:-1px; top:0px; }

.top-scroll { position:absolute; bottom:50px; text-align: center; width:100%; pointer-events: none; }
.top-scroll svg { width:40px; height:40px; }

.work-content { position:relative; background-color:#222222; width:100%; text-align: center; color:#FFFFFF; padding:25px 0px 0px 0px; margin-top:-200px; z-index:910; }

.work-image { padding:50px 50px; }
.work-image img { width:100%; }

.work-next { position:relative; margin-top:50px; }
.work-next hr { background-color: #333333; }

.work-next button { position:relative; width:100%; font-size:30px;font-weight: 700; vertical-align: middle; background:none; outline:none; border:0px; backface-visibility: hidden; }

/** 404 **/
.nofound { width:100%; height:100%; color:#FFFFFF; text-align: center; }
.nofound-wrapper { position:absolute; width:100%; top:50%; transform: translateY(-50%); }

.nofound-wrapper h1 { padding: 0px; }

.nofound-wrapper p { margin-top:50px; }
.nofound-wrapper p a { color:#FFFFFF; border:solid 1px #FFFFFF; padding:10px 20px; }
.nofound-wrapper p a:hover { background-color:#FFFFFF; color:#222222; opacity:1; }

/** 9.0 FOOTER **/

footer { position:relative; width:100%; margin:0px 0px 25px 0px; z-index:900; }
.footer-main { position:relative; text-align:center; }

.footer-social-media { position:relative; display:block; line-height: 70px; }
.footer-social-media ul { list-style: none; padding:0px; margin:0px; }
.footer-social-media ul li { display: inline-block; font-size:14px; font-weight: 300; padding:0px 10px;  }

.footer-social-media ul li a { color:#999999; }
.footer-social-media ul li a:hover { color:#FFFFFF; cursor:pointer; }

.footer-copyright { font-size:12px; border-top:solid 1px #444444; width:fit-content; margin:auto; padding:15px 50px;  }
.footer-copyright p { padding:0px; margin:0px; color:#999999; font-size:14px; }


/** GUTENBERG **/



a { color:#FFFFFF; }
a:hover { color:#FFFFFF; opacity:.5; }


.wp-block-pullquote { color:#FFFFFF; }


.wp-block-button a { padding:10px 10px !important; border-radius:0px; font-size:15px; background-color:#222222; }

.single-item-content .wp-block-cover { max-width:100%; }

.single-item-content .wp-block-archives-list { padding:0px 20px !important; margin:0px; font-size:14px !important;   }
.single-item-content .wp-block-archives-dropdown label { color:#FFFFFF; font-size:13px;  }

.single-item-content .wp-block-archives-dropdown select { width:100%; font-size:13px;  padding: 0px 15px; background-color: #222222; color: #FFFFFF; height: 40px; border-radius: 0px; border: solid 2px; -webkit-appearance: none; outline: none; background-image:url('../images/select-down.png'); background-repeat: no-repeat; background-position: right; }

.single-item-content .wp-block-archives-dropdown select:after { content:''; position:absolute; color:#FFFFFF; top:10px; right:15px; }

.single-item-content .wp-block-categories-list { padding:0px 20px !important; margin:0px; font-size:14px !important;   }

.single-item-content .wp-block-latest-comments { padding:0px 0px !important; }
.single-item-content .wp-block-latest-comments a,
.single-item-content .wp-block-latest-comments footer,
.single-item-content .wp-block-latest-comments time,
.single-item-content .wp-block-latest-comments img { padding:0px 0px !important; }

.single-item-content .wp-block-latest-comments footer time { opacity:.6; }

.single-item-content .wp-block-latest-comments img { margin-left:12px !important; margin-right:12px !important; }
.single-item-content .wp-block-latest-comments li { background-color:#333333; padding:20px 20px 0px 20px !important; margin-bottom:10px !important;  }

.single-item-content .wp-block-latest-comments__comment-excerpt { padding:12px 12px !important; }
.single-item-content .wp-block-latest-comments__comment-excerpt p { margin-bottom:0px; }

.single-item-content .wp-block-latest-posts li { margin-bottom:20px;}
.single-item-content .wp-block-latest-posts time { padding:0px 0px !important; opacity:.6; }



.single-item-content form label { font-size:14px; }
.single-item-content form input { background-color:#333333; color:#999999; border:0px; padding:10px 15px; font-size:14px; margin-left:10px; }

.single-item-content form p { font-size:14px; }