/*-------------------------------------------------
WEB ZODYAK
www.webzodyak.com
KLASMAR CSS DOSYASI 05.10.2020 ÇALIŞMA BAŞLADI


=  Table of Css

1.Import google fonts & basic style of template
2.Header
3.Isotope filtering
4.Kenburn slider basic
5.General
6.team section
7.services section
8.portfolio section
9.news section
10.About section
11.Single Post 
12.Single Project
13.Contact
14.Responsive part
-------------------------------------------------*/

/* import google fonts */
@import url("https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i|Roboto:300,300i,400,400i,500,700,900|Dancing+Script:400,700");
.reset-elem, header nav.nav-menu ul.menu-list, header nav.nav-menu ul.sub-menu, header .social-box ul.social-icons, section.carousel-works .works-box .works-post .hover-box .inner-hover ul.project-tags,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover ul.project-tags, ul.filter, .page-title-section ul, .blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons, ul.pagination-list, .sidebar .category-widget ul.category-list, .sidebar .popular-widget ul, .blog-section.border-tp .inner-blog .blog-post ul.social-posts, .blog-section.standart.single-post .comment-section ul.comment-tree, section.single-project-section .single-content .title-post ul.project-tags, section.single-project-section .single-content .share-box ul.social-icons {
margin: 0;
padding: 0; }

.paragraph, p, .sidebar .popular-widget ul li .post-title h2, .blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content span, .blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content a {
font-size: 13px;
color: #aaaaaa;
font-family: "Open Sans", sans-serif;
font-weight: 400;
line-height: 24px;
margin: 0 0 10px; }

.heading1, h1 {
color: #333333;
font-size: 36px;
font-family: "Roboto", sans-serif;
font-weight: 400;
line-height: 44px;
margin: 0 0 20px; }

.heading2, h2, .blog-section.standart.single-post .blog-post h1, .blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content h4, section.single-project-section .single-content .title-post h1, section.single-project-section .single-content .share-box span {
color: #333333;
font-size: 20px;
font-family: "Roboto", sans-serif;
font-weight: 400;
margin: 0 0 10px;
line-height: 28px; }

.heading3, h3 {
color: #333333;
font-size: 15px;
font-family: "Roboto", sans-serif;
font-weight: 400;
margin: 0 0 4px;
line-height: 28px; }

.back-cover, .blog-section .blog-box .blog-post.quote-post {
background-size: cover !important;
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important; }

.anchor, a {
display: inline-block;
text-decoration: none !important;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }

/*------------------------------------------------- */
/* =  Header
*------------------------------------------------- */
header {
width: 330px;
position: fixed;
top: 0;
left: 0;
background-image: url('../images/ana2.jpg');
/*background: #111111;*/
min-height: 100%;
z-index: 99999;
display: flex;
flex-direction: column;
justify-content: space-around;
align-items: center; }
header .logo {
text-align: center; }
header nav.nav-menu {
padding: 30px 45px;
width: 100%; }
header nav.nav-menu ul.menu-list li {
display: block;
border-bottom: 1px solid #242424;
position: relative; }
header nav.nav-menu ul.menu-list li a {
padding: 19px 35px;
color: #fff;
font-size: 14px;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1px; }
/* header nav.nav-menu ul.menu-list li a:after {
content: '\f105';
font-family: 'FontAwesome';
font-size: 13px;
position: absolute;
top: 23px;
right: 35px; } */
header nav.nav-menu ul.menu-list li a.active,
header nav.nav-menu ul.menu-list li a:hover {
color: #717171; }
header nav.nav-menu ul.menu-list li:first-child {
border-top: 1px solid #242424; }
header nav.nav-menu ul.sub-menu {
position: absolute;
top: 10px;
left: 100%;
width: 200px;
background: #fff;
opacity: 0;
border-left: 5px solid #00a0af;
visibility: hidden;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
padding: 10px 0; }
header nav.nav-menu ul.sub-menu li {
border: none !important; }
header nav.nav-menu ul.sub-menu li a {
padding: 8px 20px;
text-transform: initial;
font-size: 14px;
color: #232323; }
header nav.nav-menu ul.sub-menu li a:after {
display: none; }
header nav.nav-menu ul.menu-list li:hover ul.sub-menu {
top: 0;
opacity: 1;
visibility: visible; }
header .social-box {
text-align: center; }
header .social-box p {
color: #fff;
text-transform: uppercase; }
header .social-box ul.social-icons li {
display: inline-block;
margin: 0 6px; }
header .social-box ul.social-icons li a {
color: #717171;
font-size: 18px; }
header .social-box ul.social-icons li a:hover {
color: #aaaaaa; }
header p.copyright-line {
position: absolute;
left: 0;
bottom: 45px;
width: 100%;
padding: 0 35px;
color: #999;
text-align: center; }

a.elemadded {
display: block;
color: #fff;
font-size: 13px;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
font-weight: 400;
padding: 15px 0;
text-align: center;
text-decoration: none;
border-bottom: 1px solid #232323;
border-top: 1px solid #232323;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }

/**
* Allows you to use retina images at various pixel densities.
* Examples:
*
*   @include retina(/images/mypic.jpg, 2);
*   @include retina(/images/mypic.jpg, 3, 100px 100px, left top no-repeat transparent);
*
* @param  {Value}  $path               The path to the file name minus extension.
* @param  {Number} $cap:    2          The highest pixel density level images exist for.
* @param  {Value}  $size:   auto auto  The intended width of the rendered image.
* @param  {Value}  $extras: null       Any other `background` values to be added.
*/
/*-------------------------------------------------- */
/* 1. Isotope filtering */
/*------------------------------------------------- */
.isotope-item {
z-index: 2; }

.isotope-hidden.isotope-item {
pointer-events: none;
z-index: 1; }

.isotope, .isotope .isotope-item {
-webkit-transition-duration: 0.8s;
-moz-transition-duration: 0.8s;
transition-duration: 0.8s; }

.isotope {
-webkit-transition-property: height, width;
-moz-transition-property: height, width;
transition-property: height, width; }

.isotope .isotope-item {
-webkit-transition-property: -webkit-transform, opacity;
-moz-transition-property: -moz-transform, opacity;
transition-property: transform, opacity; }

/*-----------------------------------------------------------------------------
*
*KENBURNER RESPONSIVE BASIC STYLES OF HTML DOCUMENT
*
*Screen Stylesheet
*
*version:    1.0
*date:       07/27/11
*author:     themepunch
*email:      support@themepunch.com
*website:    http://www.themepunch.com */
/*----------------------------------------------------------------------------- */
.boxedcontainer {
max-width: 1170px;
margin: auto;
padding: 0px 30px; }

/*********************************************
*    -   SETTINGS FOR BANNER CONTAINERS  -
********************************************* */
.tp-banner-container {
width: 100%;
position: relative;
padding: 0; }

.tp-banner {
width: 100%;
position: relative; }

.tp-banner-fullscreen-container {
width: 100%;
position: relative;
padding: 0; }

/*------------------------------------------------- */
/* =  General */
/*------------------------------------------------- */
#content {
margin-left: 330px; }

.title-section {
text-align: center;
margin-bottom: 40px;
position: relative; }
.title-section h1 {
margin-bottom: 10px; }
.title-section span {
color: #333333;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 500;
text-transform: uppercase;
display: inline-block;
opacity: 0.5;
margin: 0 0 10px; }
.title-section p {
max-width: 770px;
margin: 0 auto;
color: #bdbdbd;
line-height: 24px; }

.title-section.white-style h1 {
color: #ffffff; }

.title-section.white-style span {
color: #c5cae9; }

.slider-section .tp-caption.NotGeneric-Title {
font-size: 28px;
font-weight: 700 !important;
color: #fff;
font-family: "Open Sans", sans-serif;
text-transform: uppercase;
letter-spacing: inherit; }

.slider-section .tp-caption.NotGeneric-SubTitle {
font-size: 15px;
font-family: "Roboto", sans-serif !important;
font-weight: 400;
line-height: 24px;
letter-spacing: 2px;
text-align: center; }

.slider-section .slotholder:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
/*background: rgba(0, 0, 0, 0.3); */
z-index: 2; }

#content .tp-bullet {
width: 18px;
height: 18px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
border: 1px solid transparent;
background: transparent; }

#content .tp-bullet:after {
content: '';
position: absolute;
width: 5px;
height: 5px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
background: #fff;
top: 5px;
left: 5px; }

#content .tp-bullet.selected {
border: 1px solid #fff; }

.fullscreen-container {
padding-left: 330px !important; }

.slider-section2 .tp-caption.NotGeneric-Title {
font-size: 70px;
font-weight: 700 !important;
color: #fff;
font-family: "Roboto", sans-serif;
letter-spacing: inherit;
border: 5px solid #fff;
padding: 0.11em 0.44em; }

.slider-section2 .tp-caption.NotGeneric-SubTitle {
font-size: 14px;
font-family: "Open Sans", sans-serif !important;
font-weight: 400;
line-height: inherit;
text-align: center;
letter-spacing: 0; }

.slider-section2 .tp-caption.Concept-Title {
font-size: 30px;
font-family: "Open Sans", sans-serif !important;
font-weight: 700;
letter-spacing: 0; }

.slider-section2 .slotholder:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 2; }

.slider-section3 .tp-caption.NotGeneric-Title {
font-size: 130px;
color: #fff;
font-family: "Dancing Script", cursive;
letter-spacing: inherit;
line-height: 120px;
text-align: center;
font-weight: 400 !important; }

.slider-section3 .tp-caption.NotGeneric-SubTitle {
font-size: 30px;
font-family: "Dancing Script", cursive !important;
font-weight: 400;
line-height: inherit;
letter-spacing: 2px;
text-align: center; }

.slider-section3 .tp-caption.Concept-Title {
color: #000;
font-size: 32px;
font-family: "Open Sans", sans-serif !important;
font-weight: 700;
letter-spacing: 0;
text-transform: uppercase;
padding: 0.1em 1.5em;
background: #fff; }

.slider-section3 .tp-caption.Concept-Title.second-style {
color: #fff;
font-size: 60px;
font-family: "Roboto", sans-serif !important;
font-weight: 900;
letter-spacing: 0;
text-transform: initial;
padding: 0;
background: transparent;
letter-spacing: 3px; }
.slider-section3 .tp-caption.Concept-Title.second-style span {
font-size: 80px;
font-family: "Dancing Script", cursive;
font-weight: 400;
letter-spacing: initial;
display: inline-block;
padding: 0 10px; }

.slider-section3 .tp-caption.NotGeneric-SubTitle {
font-size: 15px;
font-family: "Roboto", sans-serif !important;
font-weight: 700;
line-height: 24px;
letter-spacing: 2px;
text-align: center; }
.slider-section3 .tp-caption.NotGeneric-SubTitle a {
border: 2px solid #fff;
padding: 10px 35px;
background: transparent;
color: #fff;
text-transform: uppercase;
font-size: 13px; }
.slider-section3 .tp-caption.NotGeneric-SubTitle a.slide-button1 {
border: 2px solid transparent;
background: #00a0af;
color: #fff;
margin: 0 2px; }
.slider-section3 .tp-caption.NotGeneric-SubTitle a.slide-button2 {
border: 2px solid transparent;
background: #fff;
color: #333333;
margin: 0 2px; }
.slider-section3 .tp-caption.NotGeneric-SubTitle a.slide-button1:hover,
.slider-section3 .tp-caption.NotGeneric-SubTitle a.slide-button2:hover {
opacity: 0.5; }

.slider-section3 .tp-caption.NotGeneric-SubTitle.second-style {
font-family: "Open Sans", sans-serif !important;
font-weight: 400; }

.slider-section3 .slotholder:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
z-index: 2; }

.slider-section4 {
position: relative;
overflow: hidden; }
.slider-section4 .tp-caption.NotGeneric-Title {
font-size: 20px;
color: #fff;
font-family: "Open Sans", sans-serif;
letter-spacing: 1.2px;
font-weight: 400 !important; }
.slider-section4 .tp-caption.Concept-Title {
color: #fff;
font-size: 50px;
font-family: "Open Sans", sans-serif !important;
font-weight: 700;
letter-spacing: 0;
text-transform: uppercase;
letter-spacing: 3px; }
.slider-section4 .tp-thumbs:before {
content: '';
width: 194px;
height: 10000px;
top: -5000px;
right: -20px;
position: absolute;
background: #111111; }
.slider-section4 .tp-thumbs:before .tp-thumb-mask {
z-index: 99 !important; }

.slider-section5 .slotholder:after {
position: absolute;
content: '';
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
z-index: 99; }

a.button-white {
color: #00a0af;
font-size: 11px;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
padding: 9px 50px;
background: #fff;
font-weight: 600;
-webkit-border-radius: 24px;
-moz-border-radius: 24px;
-ms-border-radius: 24px;
border-radius: 24px;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }

a.button-white:hover {
color: #fff;
background: #00a0af; }

a.button-one {
color: #000;
font-size: 12px;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
padding: 12px 45px;
background: #00a0af;
font-weight: 500;
-webkit-border-radius: 24px;
-moz-border-radius: 24px;
-ms-border-radius: 24px;
border-radius: 24px;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
margin: 0; }

a.button-one:hover {
color: #fff;
background: #333333; }

.center-button {
text-align: center; }

a.button-two {
color: #3a539b;
font-size: 13px;
font-family: "Roboto", sans-serif;
font-weight: 500;
padding: 13px 20px 10px;
text-transform: uppercase;
border: 2px solid #3a539b;
-webkit-border-radius: 25px;
-moz-border-radius: 25px;
-ms-border-radius: 25px;
border-radius: 25px; }

a.button-two:hover {
background: #3a539b;
color: #fff; }

button.mfp-close, button.mfp-arrow, a.zoom {
outline: none; }

section.page-banner-section {
padding: 120px 0 70px;
margin-top: 74px;
text-align: center;
/*
* Set a counter and get the length of the image path.
*/
/*
* Loop ver the image path and figure out the
* position of the dot where the extension begins.
*/
/*
* If we were able to figure out where the extension is,
* slice the path into a base and an extension. Use that to
* calculate urls for different density environments. Set
* values for different environments.
*/
/*
* Set a base background for 1x environments.
*/
background: #111 url("../upload/banners/ban2.jpg") center center no-repeat;
background-size: cover;
/*
* Create an @2x-ish media query.
*/
/*
* Create media queries for all environments that the user has
* provided images for.
*/
/*
* If anything went wrong trying to separate the file from its
* extension, set a background value without doing anything to it.
*/ }
@media all and (-webkit-min-device-pixel-ratio: 1.5), all and (-o-min-device-pixel-ratio: 3 / 2), all and (min--moz-device-pixel-ratio: 1.5), all and (min-device-pixel-ratio: 1.5) {
section.page-banner-section {
background: #111 url("../upload/banners/ban2@2x.jpg") center center no-repeat;
background-size: cover; } }
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
section.page-banner-section {
background: #111 url("../upload/banners/ban2@2x.jpg") center center no-repeat;
background-size: cover; } }
section.page-banner-section h1 {
font-size: 48px;
line-height: 60px;
color: #ffffff;
margin-bottom: 4px; }
section.page-banner-section p {
color: #bdbdbd;
font-size: 20px;
font-family: "Roboto", sans-serif;
margin-bottom: 0; }

section.slider-section6 .tp-caption.FoodCarousel-Button {
background: transparent;
color: #fff;
border: none;
font-family: "Roboto", sans-serif;
font-size: 32px; }

section.slider-section6 .tp-thumbs {
background: transparent !important; }

/*------------------------------------------------- */
/* =  Team Sections */
/*------------------------------------------------- */
section.team-section .team-box {
padding: 0 30px; }
section.team-section .team-box .team-post {
position: relative;
text-align: center;
margin-bottom: 30px; }
section.team-section .team-box .team-post .team-gal {
overflow: hidden;
margin-bottom: 45px; }
section.team-section .team-box .team-post .team-gal img {
width: 100%;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
section.team-section .team-box .team-post h2 {
color: #333333;
font-size: 24px;
font-family: "Open Sans", sans-serif;
font-weight: 400;
text-transform: uppercase;
letter-spacing: 1.5px;
margin: 0 0 8px; }
section.team-section .team-box .team-post span {
display: inline-block;
color: #333333;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 0.6px;
margin: 0 0 25px; }

section.team-section .team-box.owl-wrapper .team-post {
padding: 0 15px; }

/*------------------------------------------------- */
/* =  services page */
/*------------------------------------------------- */
section.services-section {
padding: 30px 30px 0;
background: #fff; }
section.services-section .services-box {
padding-bottom: 40px;
min-height: 360px;
border-bottom: 1px solid #e5e5e5; }
section.services-section .services-box .services-post {
padding: 50px 30px;
border: 1px solid #dadada;
background: transparent;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
text-align: center;
min-height: 295px;
margin-bottom: 30px; }
section.services-section .services-box .services-post span, section.services-section .services-box .services-post i {
color: #00a0af;
font-size: 26px;
display: inline-block;
margin-bottom: 25px; }
section.services-section .services-box .services-post h2 {
padding-bottom: 24px;
position: relative;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
section.services-section .services-box .services-post h2:after {
content: '';
position: absolute;
bottom: 0;
left: 50%;
margin-left: -15px;
width: 30px;
height: 3px;
background: #dadada;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
section.services-section .services-box .services-post p {
line-height: 24px;
max-height: 72px;
overflow: hidden;
margin-bottom: 0px;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
section.services-section .services-box .services-post a {
color: #fff;
font-size: 12px;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
display: none; }
section.services-section .services-box .services-post a:hover {
opacity: 0.7; }
section.services-section .services-box .services-post:hover {
border: 1px solid #00a0af;
background: #00a0af; }
section.services-section .services-box .services-post:hover h2, section.services-section .services-box .services-post:hover p {
color: #fff; }
section.services-section .services-box .services-post:hover a {
display: inline-block; }
section.services-section .services-box .services-post:hover span, section.services-section .services-box .services-post:hover i {
color: #fff; }
section.services-section .services-box .services-post:hover h2:after {
background: #fff; }

/*------------------------------------------------- */
/* =  portfolio section */
/*------------------------------------------------- */
section.carousel-works .works-box .works-post,
section.carousel-works .works-box-second .works-post {
overflow: hidden;
position: relative; }
section.carousel-works .works-box .works-post img,
section.carousel-works .works-box-second .works-post img {
width: 100%;
height: auto;
min-height: 100%; }
section.carousel-works .works-box .works-post .hover-box,
section.carousel-works .works-box-second .works-post .hover-box {
position: absolute;
bottom: 50px;
padding: 50px 10px;
left: 35px;
right: 35px;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
border: 2px solid #fff;
display: flex;
text-align: center;
justify-content: center;
align-items: center; }
section.carousel-works .works-box .works-post .hover-box .inner-hover a.likes,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover a.likes {
color: #fff;
font-size: 36px;
font-family: "Roboto", sans-serif;
margin-bottom: 6px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover a.likes i,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover a.likes i {
font-size: 30px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover a.likes:hover,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover a.likes:hover {
opacity: 0.7; }
section.carousel-works .works-box .works-post .hover-box .inner-hover h2,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover h2 {
font-size: 14px;
color: #fff;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1.5px;
margin: 0 0 8px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover h2 a,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover h2 a {
color: #fff; }
section.carousel-works .works-box .works-post .hover-box .inner-hover h2 a:hover,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover h2 a:hover {
opacity: 0.7; }
section.carousel-works .works-box .works-post .hover-box .inner-hover ul.project-tags li,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover ul.project-tags li {
display: inline-block;
margin-right: 2px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover ul.project-tags li a,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover ul.project-tags li a {
color: #00a0af;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 1.4px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover ul.project-tags li a:hover,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover ul.project-tags li a:hover {
opacity: 0.7; }
section.carousel-works .works-box .works-post .hover-box .inner-hover div.hidden-box,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover div.hidden-box {
padding-top: 10px;
visibility: hidden;
opacity: 0;
height: 0;
overflow: hidden;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
section.carousel-works .works-box .works-post .hover-box .inner-hover div.hidden-box p,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover div.hidden-box p {
color: #fff;
font-size: 12px;
margin-bottom: 15px;
padding: 0 10px; }
section.carousel-works .works-box .works-post .hover-box .inner-hover div.hidden-box a,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover div.hidden-box a {
color: #fff;
font-size: 13px;
font-family: "Open Sans", sans-serif;
padding: 7px 20px;
background: #00a0af; }
section.carousel-works .works-box .works-post .hover-box .inner-hover div.hidden-box a:hover,
section.carousel-works .works-box-second .works-post .hover-box .inner-hover div.hidden-box a:hover {
opacity: 0.7; }

section.carousel-works .works-box .works-post:hover .hover-box,
section.carousel-works .works-box-second .works-post:hover .hover-box {
top: 50px;
border: 2px solid transparent;
background: rgba(0, 0, 0, 0.6); }
section.carousel-works .works-box .works-post:hover .hover-box .inner-hover div.hidden-box,
section.carousel-works .works-box-second .works-post:hover .hover-box .inner-hover div.hidden-box {
opacity: 1;
visibility: visible;
height: auto; }

section.carousel-works .owl-theme .owl-controls {
margin: 0;
display: none !important; }

section.carousel-works .works-box-second {
padding: 30px 15px; }
section.carousel-works .works-box-second .works-post {
margin: 0 15px;
position: relative; }
section.carousel-works .works-box-second .works-post .hover-box {
position: absolute;
bottom: 30px;
padding: 0 30px;
left: 0px;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
border: none;
display: block;
text-align: left;
z-index: 2; }
section.carousel-works .works-box-second .works-post .hover-box .inner-hover h2 {
font-size: 18px; }
section.carousel-works .works-box-second .works-post:before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.2); }
section.carousel-works .works-box-second .works-post:hover .hover-box {
top: initial;
border: none;
background: transparent; }
section.carousel-works .works-box-second .owl-theme .owl-controls {
margin: 0;
display: block !important;
position: absolute;
top: 50%;
margin-top: -40px;
left: 0;
width: 100%; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-pagination {
display: none; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons {
display: block;
padding: 0 30px;
overflow: hidden; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons div {
background: transparent; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons div.owl-prev {
float: left; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons div.owl-next {
float: right; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons div.owl-prev:before {
content: '\f137';
color: #fff;
font-size: 40px;
font-family: 'FontAwesome'; }
section.carousel-works .works-box-second .owl-theme .owl-controls .owl-buttons div.owl-next:before {
content: '\f138';
color: #fff;
font-size: 40px;
font-family: 'FontAwesome'; }

section.portfolio-section {
position: relative; }
section.portfolio-section .portfolio-box .project-post {
width: 25%;
margin: 0;
position: relative; }
section.portfolio-section .portfolio-box .project-post img {
width: 100%;
height: auto; }
section.portfolio-section .portfolio-box .project-post a.likes {
position: absolute;
bottom: 15px;
left: 20px;
color: #fff;
font-size: 24px;
font-family: "Roboto", sans-serif;
z-index: 2;
transition: all 0s ease-in-out;
-moz-transition: all 0s ease-in-out;
-webkit-transition: all 0s ease-in-out;
-o-transition: all 0s ease-in-out; }
section.portfolio-section .portfolio-box .project-post a.likes i {
font-size: 24px; }
section.portfolio-section .portfolio-box .project-post .hover-box {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
padding: 50px 10px;
opacity: 0;
visibility: hidden;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
background: rgba(0, 160, 175, 0.9);
display: flex;
text-align: center;
justify-content: center;
align-items: center; }
section.portfolio-section .portfolio-box .project-post .hover-box h2 {
font-size: 14px;
color: #fff;
font-family: "Roboto", sans-serif;
text-transform: uppercase;
font-weight: 400;
letter-spacing: 1.5px;
margin: 0 0 4px;
padding-bottom: 0px;
border-bottom: 1px dashed #343434; }
section.portfolio-section .portfolio-box .project-post .hover-box h2 a {
color: #fff; }
section.portfolio-section .portfolio-box .project-post .hover-box h2 a:hover {
opacity: 0.7; }
section.portfolio-section .portfolio-box .project-post .hover-box span {
font-size: 12px;
font-family: "Open Sans", sans-serif;
color: #343434; }
section.portfolio-section .portfolio-box .project-post .hover-box .inner-hover {
margin-top: -14px; }
section.portfolio-section .portfolio-box .project-post:hover .hover-box {
opacity: 1;
visibility: visible; }
section.portfolio-section .portfolio-box .project-post:hover a.likes {
bottom: inherit;
top: 50%;
margin-top: 25px;
left: 50%;
margin-left: -28px; }

section.portfolio-section .portfolio-box.col-2 .project-post {
width: 50%; }

section.portfolio-section .portfolio-box.col-3 .project-post {
width: 33.333333%; }

a.filter-toggle {
position: absolute;
z-index: 3;
top: 30px;
right: 30px;
width: 30px;
height: 30px;
background: #00a0af;
color: #fff;
font-size: 15px;
text-align: center;
line-height: 30px; }

ul.filter {
width: 160px;
position: absolute;
z-index: 3;
top: 61px;
right: 30px;
display: none;
text-align: right; }
ul.filter li {
display: block; }
ul.filter li a {
display: block;
color: #fff;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 500;
text-transform: uppercase;
background: #111111;
padding: 10px 20px;
border-bottom: 1px solid #232323; }
ul.filter li a:hover,
ul.filter li a.active {
color: #00a0af; }
ul.filter li:last-child {
border-bottom: none; }

.gallery-box.iso-call .gallery-post {
width: 25%;
position: relative; }
.gallery-box.iso-call .gallery-post img {
width: 100%;
height: auto; }
.gallery-box.iso-call .gallery-post .zoom {
position: absolute;
top: 50%;
left: 50%;
margin-top: -50px;
margin-left: -10px;
color: #00a0af;
font-size: 20px;
opacity: 0;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
z-index: 2; }

.gallery-box.iso-call .gallery-post:after {
position: absolute;
content: '';
width: 100%;
height: 100%;
top: 0;
left: 0;
background: transparent;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }

.gallery-box.iso-call .gallery-post:hover:after {
background: rgba(0, 0, 0, 0.8); }

.gallery-box.iso-call .gallery-post:hover .zoom {
margin-top: -10px;
opacity: 1; }

.mfp-wrap {
z-index: 999999; }

/*------------------------------------------------- */
/* =  News section */
/*------------------------------------------------- */
.page-title-section {
padding-top: 50px;
max-width: 870px;
margin: 0 auto; }
.page-title-section ul {
margin-bottom: 15px; }
.page-title-section ul li {
display: inline-block;
margin-right: 5px; }
.page-title-section ul li a {
color: #aaaaaa;
font-family: "Roboto", sans-serif;
font-size: 12px;
text-transform: uppercase; }
.page-title-section ul li a:hover {
color: #333333; }
.page-title-section ul li:before {
content: '/';
color: #aaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
margin-right: 8px; }
.page-title-section ul li:first-child:before {
display: none;
margin-right: 0; }
.page-title-section h1 {
font-family: "Roboto", sans-serif;
font-weight: 700;
text-transform: uppercase;
margin: 0; }

.blog-section {
padding: 50px 30px; }
.blog-section .blog-box.iso-call {
margin-left: -15px;
margin-right: -15px;
margin-top: -15px; }
.blog-section .blog-box.iso-call .blog-post {
width: 33.3333%;
padding: 15px 15px;
margin-bottom: 40px; }
.blog-section .blog-box.iso-call .blog-post.quote-post {
padding: 15px 15px;
background: transparent; }
.blog-section .blog-box.iso-call .blog-post.quote-post .inner-quote {
padding: 70px 30px;
background: url("../upload/blog/back.jpg") center; }
.blog-section .blog-box .blog-post {
margin-bottom: 85px; }
.blog-section .blog-box .blog-post .post-gallery a {
width: 100%; }
.blog-section .blog-box .blog-post .post-gallery a img {
width: 100%; }
.blog-section .blog-box .blog-post .post-gallery a:hover {
opacity: 0.7; }
.blog-section .blog-box .blog-post .post-gallery iframe {
width: 100%;
height: 250px; }
.blog-section .blog-box .blog-post .post-content {
padding-top: 35px;
text-align: center;
overflow: hidden; }
.blog-section .blog-box .blog-post .post-content > span {
display: inline-block;
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 1.4px;
margin: 0 0 10px; }
.blog-section .blog-box .blog-post .post-content > span a {
color: #333333; }
.blog-section .blog-box .blog-post .post-content h2 {
font-size: 24px;
font-family: "Open Sans", sans-serif;
letter-spacing: 1.6px;
font-weight: 400; }
.blog-section .blog-box .blog-post .post-content h2 a {
color: #333333; }
.blog-section .blog-box .blog-post .post-content h2 a:hover {
opacity: 0.7; }
.blog-section .blog-box .blog-post .post-content p {
text-align: left;
margin-top: 40px; }
.blog-section .blog-box .blog-post .post-content p span {
font-weight: 500; }
.blog-section .blog-box .blog-post .post-content a.likes {
float: left;
color: #333333;
font-size: 14px;
font-family: "Roboto", sans-serif; }
.blog-section .blog-box .blog-post .post-content a.likes i {
font-size: 11px; }
.blog-section .blog-box .blog-post.quote-post {
padding: 70px 30px;
background: url("../upload/blog/back.jpg") center;
text-align: center; }
.blog-section .blog-box .blog-post.quote-post span {
display: inline-block;
color: #fff;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 1.4px;
margin: 0; }
.blog-section .blog-box .blog-post.quote-post h2 {
font-size: 24px;
font-family: "Open Sans", sans-serif;
letter-spacing: 1.6px;
font-weight: 400;
color: #fff;
margin: 30px 0;
line-height: 36px; }
.blog-section .blog-box .blog-post.quote-post h4 {
color: #fff;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 1.4px;
margin: 0 0 36px;
padding-bottom: 36px;
position: relative; }
.blog-section .blog-box .blog-post.quote-post h4:after {
content: '';
position: absolute;
bottom: -1px;
left: 50%;
height: 2px;
width: 70px;
margin-left: -35px;
background: #fff; }

.blog-section.standart .blog-box {
max-width: 870px;
margin: 0 auto; }
.blog-section.standart .blog-box .quote-post {
max-width: 570px;
margin: 0 auto 85px; }
.blog-section.standart .blog-box .blog-post .post-gallery iframe {
height: 490px; }
.blog-section.standart .blog-box .blog-post .post-content h2 a {
position: relative; }
.blog-section.standart .blog-box .blog-post .post-content h2 a:after {
content: '';
position: absolute;
top: 50%;
left: 0;
height: 1px;
background: #333333;
width: 0; }
.blog-section.standart .blog-box .blog-post .post-content h2 a:hover {
opacity: 1; }
.blog-section.standart .blog-box .blog-post .post-content h2 a:hover:after {
width: 100%; }
.blog-section.standart .blog-box .blog-post .post-content p {
margin-bottom: 35px;
font-weight: 300;
line-height: 24px; }
.blog-section.standart .blog-box .blog-post .post-content .social-box {
max-width: 570px;
margin: 0 auto 10px; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons {
float: right; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons li {
display: inline-block;
opacity: 0;
margin: 0 3px; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons li a {
color: #333333;
font-size: 11px; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons li a:hover {
opacity: 0.7; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons li:last-child {
opacity: 1; }
.blog-section.standart .blog-box .blog-post .post-content .social-box ul.social-icons:hover li {
opacity: 1; }

.blog-section.standart.withsidebar .blog-box {
max-width: 100%; }

ul.pagination-list {
text-align: center; }
ul.pagination-list li {
display: inline-block; }
ul.pagination-list li a {
font-family: "Roboto", sans-serif;
color: #333333;
font-size: 12px; }
ul.pagination-list li a.prev,
ul.pagination-list li a.next {
color: #aaaaaa;
font-size: 20px; }
ul.pagination-list li a.prev i,
ul.pagination-list li a.next i {
display: inline-block; }
ul.pagination-list li a.prev {
margin-right: 50px; }
ul.pagination-list li a.next {
margin-left: 50px; }
ul.pagination-list li:nth-child(2):after {
content: '/';
font-family: "Roboto", sans-serif;
color: #333333;
font-size: 12px;
margin: 0 4px 0 7px; }

.flex-control-paging li a {
width: 10px !important; }

.flex-direction-nav .flex-prev,
.flex-direction-nav .flex-next {
width: 40px !important; }

.sidebar .widget {
margin-bottom: 80px;
text-align: center; }
.sidebar .widget > h2 {
font-size: 14px;
font-weight: 400;
letter-spacing: 3px;
margin-bottom: 36px; }

.sidebar .about-widget img {
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
margin-bottom: 50px;
max-width: 100%; }

.sidebar .about-widget p {
font-weight: 300;
margin-bottom: 0; }

.sidebar .category-widget ul.category-list li {
list-style: none;
margin-bottom: 8px; }
.sidebar .category-widget ul.category-list li a {
font-family: "Roboto", sans-serif;
font-size: 13px;
color: #666666;
letter-spacing: 2px; }
.sidebar .category-widget ul.category-list li a:hover {
color: #333333;
text-decoration: line-through; }

.sidebar .popular-widget {
text-align: left; }
.sidebar .popular-widget ul li {
list-style: none;
overflow: hidden;
margin-bottom: 20px; }
.sidebar .popular-widget ul li img {
float: left; }
.sidebar .popular-widget ul li .post-title {
margin-left: 100px;
padding-top: 15px; }
.sidebar .popular-widget ul li .post-title h2 {
margin: 0; }
.sidebar .popular-widget ul li .post-title h2 a {
color: #aaaaaa; }
.sidebar .popular-widget ul li .post-title h2 a:hover {
color: #333333;
text-decoration: line-through; }
.sidebar .popular-widget ul li .post-title span {
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 300; }

.sidebar .subscribe-widget p {
color: #aaaaaa;
font-size: 13px;
font-family: "Roboto", sans-serif;
font-weight: 300;
line-height: 24px;
margin-bottom: 15px; }

.sidebar .subscribe-widget form {
max-width: 370px;
margin: 0 auto;
overflow-x: hidden; }
.sidebar .subscribe-widget form h1 {
font-family: "Open Sans", sans-serif;
letter-spacing: 1.6px;
font-weight: 400;
margin-bottom: 53px;
text-align: center; }
.sidebar .subscribe-widget form input[type="text"] {
width: 100%;
display: block;
outline: none;
border: none;
border-bottom: 1px solid #cccccc;
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 300;
padding: 16px 20px;
margin: 0; }
.sidebar .subscribe-widget form button {
outline: none;
border: none;
background: transparent;
float: right;
padding: 0;
font-size: 15px;
color: #ccc;
margin-right: 18px;
margin-top: -32px; }
.sidebar .subscribe-widget form button:hover {
color: #aaaaaa; }

.blog-section.border-tp {
padding-top: 0; }
.blog-section.border-tp .inner-blog {
padding-top: 45px; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts {
float: right;
text-align: right; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts li {
display: inline-block;
margin-left: 5px;
opacity: 0;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts li a {
color: #333333;
font-size: 11px; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts li a:hover {
opacity: 0.7; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts li:last-child {
opacity: 1; }
.blog-section.border-tp .inner-blog .blog-post ul.social-posts:hover li {
opacity: 1; }
.blog-section.border-tp .blog-box.iso-call {
margin-left: -15px;
margin-right: -15px; }

/*------------------------------------------------- */
/* =  About sections */
/*------------------------------------------------- */
section.about-section {
padding: 50px 30px;
position: relative; }
section.about-section .container {
position: relative;
z-index: 2; }
section.about-section .about-box {
padding-bottom: 35px;
border-bottom: 1px solid #e5e5e5; }
section.about-section .about-box .about-post {
margin-bottom: 40px; }
section.about-section .about-box .about-post img {
width: 100%;
height: auto;
margin-bottom: 20px; }
section.about-section .about-box .about-post h2 {
margin-bottom: 10px; }
section.about-section .about-box .about-post p {
color: #757575; }

/*------------------------------------------------- */
/* =  Single Post */
/*------------------------------------------------- */
.blog-section.standart.single-post .blog-box .blog-post .post-content .social-box ul li {
opacity: 1; }

.blog-section.standart.single-post .blog-post .post-gallery img {
width: 100%; }

.blog-section.standart.single-post .blog-post h1 {
font-size: 24px;
font-family: "Open Sans", sans-serif;
letter-spacing: 1.6px;
font-weight: 400; }

.blog-section.standart.single-post .autor-post {
border-top: 1px solid #e1e1e1;
border-bottom: 1px solid #e1e1e1;
padding: 50px 50px 50px 140px; }
.blog-section.standart.single-post .autor-post img {
float: left;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
margin-right: 30px; }
.blog-section.standart.single-post .autor-post .autor-content {
padding-top: 10px; }
.blog-section.standart.single-post .autor-post h2 {
font-size: 14px;
letter-spacing: 2px;
color: #222;
font-weight: 400; }
.blog-section.standart.single-post .autor-post p {
line-height: 24px;
letter-spacing: 1.2px; }

.blog-section.standart.single-post .comment-section {
padding-top: 70px; }
.blog-section.standart.single-post .comment-section h1 {
text-transform: uppercase;
font-size: 24px;
font-weight: 700;
letter-spacing: 2px;
margin-bottom: 40px; }
.blog-section.standart.single-post .comment-section ul.comment-tree {
padding-top: 60px;
max-width: 600px;
margin: 0 auto; }
.blog-section.standart.single-post .comment-section ul.comment-tree li {
list-style: none; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box {
overflow: hidden;
margin-bottom: 80px; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box img {
width: auto;
float: left;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
max-width: 100px; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content {
margin-left: 130px; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content h4 {
font-size: 14px;
letter-spacing: 2px;
color: #222;
font-weight: 400;
margin-bottom: 0; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content span, .blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content a {
font-size: 11px;
display: inline-block;
font-weight: 300;
color: #999;
margin-bottom: 7px;
font-style: italic; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content p {
margin: 0 0 6px; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content a {
margin: 0; }
.blog-section.standart.single-post .comment-section ul.comment-tree li .comment-box .comment-content a:hover {
color: #00a0af; }
.blog-section.standart.single-post .comment-section .comment-form {
padding-top: 60px;
border-top: 1px solid #eeeeee; }
.blog-section.standart.single-post .comment-section .comment-form h2 {
padding-bottom: 0;
border-bottom: none;
margin-bottom: 30px; }
.blog-section.standart.single-post .comment-section .comment-form input[type="text"],
.blog-section.standart.single-post .comment-section .comment-form textarea {
width: 100%;
display: block;
padding: 14px 20px;
background: transparent;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-ms-border-radius: 0;
border-radius: 0;
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 300;
border: 1px solid #cccccc;
outline: none;
margin: 0 0 30px; }
.blog-section.standart.single-post .comment-section .comment-form textarea {
min-height: 100px;
border: 1px solid #cccccc; }
.blog-section.standart.single-post .comment-section .comment-form input[type="submit"] {
outline: none;
border: 2px solid #333333;
color: #333333;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 500;
padding: 7px 20px;
background: transparent;
text-transform: uppercase;
position: relative; }
.blog-section.standart.single-post .comment-section .comment-form input[type="submit"]:hover {
color: #fff;
background: #333333; }
.blog-section.standart.single-post .comment-section .comment-form .submit-area {
text-align: center; }
.blog-section.standart.single-post .comment-section .comment-form .message {
height: 30px;
font-size: 13px;
font-family: "Roboto", sans-serif; }
.blog-section.standart.single-post .comment-section .comment-form .message.error {
color: #e74c3c; }
.blog-section.standart.single-post .comment-section .comment-form .message.success {
color: #00a0af; }

/*------------------------------------------------- */
/* =  Single Project */
/*------------------------------------------------- */
section.single-project-section img {
width: 100%; }

section.single-project-section .single-content {
padding: 70px 30px;
max-width: 930px;
margin: 0 auto; }
section.single-project-section .single-content p {
line-height: 24px; }
section.single-project-section .single-content .title-post {
position: relative;
padding-right: 90px;
margin-bottom: 30px; }
section.single-project-section .single-content .title-post h1 {
font-size: 14px;
font-family: "Roboto", sans-serif;
font-weight: 400; }
section.single-project-section .single-content .title-post ul.project-tags li {
display: inline-block;
margin-right: 2px;
padding-left: 0; }
section.single-project-section .single-content .title-post ul.project-tags li a {
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
letter-spacing: 1.4px; }
section.single-project-section .single-content .title-post ul.project-tags li a:hover {
opacity: 0.7; }
section.single-project-section .single-content .title-post a.likes {
position: absolute;
top: 0;
right: 0;
color: #333333;
font-size: 36px;
font-family: "Roboto", sans-serif;
letter-spacing: 2px;
margin: 0 0 10px; }
section.single-project-section .single-content .title-post a.likes i {
font-size: 30px; }
section.single-project-section .single-content .share-box {
overflow: hidden; }
section.single-project-section .single-content .share-box span {
display: inline-block;
font-size: 14px;
font-family: "Open Sans", sans-serif;
font-weight: 400; }
section.single-project-section .single-content .share-box ul.social-icons {
float: right; }
section.single-project-section .single-content .share-box ul.social-icons li {
display: inline-block;
margin-left: 0px; }
section.single-project-section .single-content .share-box ul.social-icons li a {
width: 30px;
height: 30px;
line-height: 28px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
background: #333333;
color: #fff;
font-size: 16px;
text-align: center;
border: 1px solid transparent; }
section.single-project-section .single-content .share-box ul.social-icons li a:hover {
background: #fff;
color: #333333;
border-color: #333333; }

.pag-page {
overflow: hidden;
margin-bottom: 80px; }
.pag-page a {
color: #aaaaaa;
font-size: 12px;
font-family: "Open Sans", sans-serif;
text-transform: uppercase;
letter-spacing: 1px; }
.pag-page a i {
font-size: 15px;
color: #aaa; }
.pag-page a.prev-project {
float: left; }
.pag-page a.prev-project i {
margin-right: 18px; }
.pag-page a.next-project {
float: right; }
.pag-page a.next-project i {
margin-left: 18px; }
.pag-page a:hover {
opacity: 0.7; }

.grid-images {
padding: 0 30px; }
.grid-images img {
width: 100%;
height: auto;
margin-bottom: 30px; }

/*------------------------------------------------- */
/* =  Contact */
/*------------------------------------------------- */
.contact-section {
padding: 0; }
.contact-section .map-holder {
width: 100%;
float: none;
height: 500px; }
.contact-section .map-holder #map {
position: relative;
width: 100%;
height: 100%; }
.contact-section .contact-form-part {
float: none;
max-width: 100%;
padding: 60px 30px; }
.contact-section .contact-form-part form#contact-form {
padding-right: 30px; }
.contact-section .contact-form-part h1 {
font-family: "Roboto", sans-serif;
text-transform: uppercase;
font-weight: 700;
margin: 0 0 30px; }
.contact-section .contact-form-part p {
font-weight: 300;
margin-bottom: 40px;
font-size: 13px;
letter-spacing: 1.3px; }
.contact-section .contact-form-part .info-data {
margin-bottom: 35px; }
.contact-section .contact-form-part .info-data h3 {
color: #333333;
font-size: 14px;
font-family: "Open Sans", sans-serif;
font-weight: 400;
letter-spacing: 1.8px;
text-transform: uppercase;
line-height: 36px;
margin: 0; }
.contact-section .contact-form-part .info-data p {
font-size: 12px;
color: #aaaaaa; }

form#contact-form {
margin: 0;
padding: 0; }
form#contact-form input[type="text"],
form#contact-form textarea {
width: 100%;
display: block;
outline: none;
border: 1px solid #cccccc;
color: #aaaaaa;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 300;
padding: 14px 20px;
margin: 0 0 25px; }
form#contact-form textarea {
border: 1px solid #cccccc;
height: 127px; }
form#contact-form input[type="submit"] {
float: right;
outline: none;
border: 2px solid #333333;
color: #333333;
font-size: 12px;
font-family: "Roboto", sans-serif;
font-weight: 500;
padding: 7px 20px;
background: transparent;
text-transform: uppercase;
position: relative;
transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-webkit-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out; }
form#contact-form input[type="submit"]:hover {
color: #fff;
background: #333333; }

.flip-box {
background-color: transparent;
width: auto;
height: 290px;
border: 1px solid #fff;
perspective: 1000px;
margin-bottom: 20px;
}

.flip-box-inner {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}

.flip-box:hover .flip-box-inner {
transform: rotateY(180deg);
}

.flip-box-front, .flip-box-back {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

.flip-box-front {
background-color: white;
color: white;
border: 7px solid #F9CC81;
padding: 50px 30px;
}

.flip-box-back {
background-color: white;
color: white;
transform: rotateY(180deg);
padding: 30px 30px;
border: 7px solid #F9CC81;
}

.flip-box i {
color: #717171;
font-size: 60px;
display: inline-block;
padding: 10px 10px;
}

.flip-boxa {
background-color: transparent;
width: 290px;
height: 290px;
border: 1px solid #fff;
perspective: 1000px;
margin-bottom: 20px;
}

.flip-box-innera {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}

.flip-boxa:hover .flip-box-innera {
transform: rotateY(180deg);
}

.flip-box-fronta, .flip-box-backa {
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}

.flip-box-fronta {
background-color: white;
color: white;
border: 7px solid #F9CC81;
padding: 50px 30px;
}

.flip-box-backa {
background-color: white;
color: white;
transform: rotateY(180deg);
padding: 30px 30px;
border: 7px solid #F9CC81;
}

.flip-boxa i {
color: #717171;
font-size: 60px;
display: inline-block;
padding: 10px 10px;
}

#titlebar {
background-color: #f8f8f8;
position: relative;
padding: 20px 0;
}

.contents {
position: absolute;
z-index: 9999;
width: 100%;
padding: 15px;
bottom: 0px;
background-color: rgba(255,255,255,0.6);
color: #444;
font-size: 21px;
line-height: 20px;
}

.grow2{overflow:hidden;}

.grow2 img {
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease;
}

.grow2 img:hover {
-webkit-transform:scale(1.5); /* Safari and Chrome */
-moz-transform:scale(1.5); /* Firefox */
-ms-transform:scale(1.5); /* IE 9 */
-o-transform:scale(1.5); /* Opera */
transform:scale(1.5);
position:relative;
z-index:999;
}


/*  bu kısım test */

.responsive {
width: 100%;
height: auto;
}

.gallery {
width: auto;
margin: 0 auto;
position: relative;
}
.pics {
/*width: 542px;*/
margin-top: 0px;
padding: 10px;
background: white;
border-radius: 2px;
position: absolute;
left: 5%;
margin: -25px 0 0 -25px;
/*box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.05);*/
}
.picsa {
/*width: 542px;*/
margin-top: 0px;
padding: 10px;
background: white;
border-radius: 2px;
position: absolute;
left: 13%;
margin: -25px 0 0 -25px;
/*box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.05);*/
}
.thumbs {
float: right;
width: 122px;
padding-left: 10px;
}
.preview {
width: 112px;
height: 112px;
overflow: hidden;
margin-bottom: 10px;
}
.preview:last-child {
margin-bottom: 0;
}
.full {
width: auto;
font-size: 12px;
float: left;
}
.full, .full img {
/*height: 600px;*/
}
.previews a:hover, .previews a.selected {
}
.full img:hover {
cursor: pointer;
}
.clearfix:after {
content: ".";
visibility: hidden;
display: block;
height: 0;
clear: both;
}

.map-responsive{
overflow:hidden;
padding-bottom:56.25%;
position:relative;
height:0;
}
.map-responsive iframe{
left:0;
top:0;
height:100%;
width:100%;
position:absolute;
}

table {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}

table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

table tr {
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  padding: .35em;
}

table th,
table td {
  padding: .625em;
  text-align: center;
}

table th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}

/* Bu kısım test */




/*-------------------------------------------------*/
/* =  Responsive Part
/*-------------------------------------------------*/
@media (max-width: 1400px) {
section.portfolio-section .portfolio-box .project-post,
.gallery-box.iso-call .gallery-post {
width: 33.33333%; } }

@media (max-width: 1199px) {
header {
width: 260px; }
header nav.nav-menu {
padding: 30px; }
.fullscreen-container {
padding-left: 260px !important; }
#content {
margin-left: 260px; }
.blog-section.standart.single-post .autor-post {
padding: 50px 0; }
.blog-section .blog-box.iso-call .blog-post {
width: 50%; } }

@media (max-width: 991px) {
header {
position: relative;
width: 100%;
height: auto !important;
display: block;
padding-top: 20px; }
header .logo {
padding: 10px 5px;
margin-bottom: 10px; }
header nav.nav-menu {
padding: 0;
max-height: 250px;
overflow-y: scroll;
overflow-x: hidden;
display: block;
text-align: center;
border-bottom: 0px solid #222222; }
header nav.nav-menu > ul.menu-list {
padding: 6px 0; }
header nav.nav-menu > ul.menu-list li {
border: none !important; }
header nav.nav-menu > ul.menu-list li a {
padding: 6px 10px; }
header nav.nav-menu > ul.menu-list li a:after {
display: none; }
header nav.nav-menu ul.sub-menu {
position: relative;
top: initial;
left: initial;
opacity: 1;
visibility: visible;
background: transparent;
width: 100%;
border: none; }
header nav.nav-menu ul.sub-menu li a {
color: #f1f1f1; }
header .social-box {
padding: 10px 0; }
header .social-box p {
display: none; }
header nav ul li.drop div.ver-megadropdown li {
float: none;
display: block;
margin: 0;
width: 100%; }
header nav ul li.drop div.ver-megadropdown li a {
padding: 0; }
a.elemadded {
display: block; }
.fullscreen-container {
padding-left: 0px !important; }
#content {
margin-left: 0; }
.contact-section .map-holder {
height: 400px; }
.contact-section .contact-form-part form#contact-form {
overflow: hidden;
margin-bottom: 30px; } }

@media (max-width: 767px) {
section.portfolio-section .portfolio-box .project-post,
.gallery-box.iso-call .gallery-post,
section.portfolio-section .portfolio-box.col-3 .project-post {
width: 50%; }
.tp-thumbs {
display: none; }
.slider-section6 .tp-thumbs {
display: initial; }
.slider-section3 .tp-caption.Concept-Title {
padding: 0.03em 1em; }
.contact-section .map-holder {
height: 300px; } }

@media (max-width: 600px) {
.blog-section .blog-box.iso-call .blog-post {
width: 100%; } }

@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

  table caption {
    font-size: 1.3em;
  }
  
  table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  table td:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 460px) {
section.portfolio-section .portfolio-box .project-post,
.gallery-box.iso-call .gallery-post,
section.portfolio-section .portfolio-box.col-2 .project-post,
section.portfolio-section .portfolio-box.col-3 .project-post {
width: 100%; }
.contact-section .map-holder {
height: 200px; } 
.thumbs {
float: left;
width: 122px;
padding-left: 110px;
padding-top: 20px;
}
.preview {
width: auto;
height: auto;
overflow: hidden;
margin-bottom: 10px;
padding-top: 20px;
}
.picsa {
/*width: 542px;*/
margin-top: 0px;
padding: 10px;
background: white;
border-radius: 2px;
position: absolute;
left: 7%;
margin: -25px 0 0 -25px;
/*box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.05);*/
}
.pics {
/*width: 542px;*/
margin-top: 0px;
padding: 10px;
background: white;
border-radius: 2px;
position: absolute;
left: 7%;
margin: -25px 0 0 -25px;
/*box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.05);*/
} }