/*
***************************************************************
***************************************************************

Author         : Dogukan Binici
Author Contact     : dogukanbnc@gmail.com



*================================================================== -->
* Medium Screen [992px into 1280px]
*================================================================== -->
*/

@media only screen and (min-width: 992px) and (max-width: 1280px) {
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .main-menu ul.sub-menu li ul.sub-menu {
        left: auto;
        right: 0;
    }
    .about-content h3,
    .why-choose-us-content h3 {
        font-size: 20px;
    }
    .cta-area h2 {
        font-size: 24px;
    }
    .single-project-item h4 {
        letter-spacing: 1px;
    }
    .single-testimonial-item {
        padding-right: 0;
    }
    .single-blog-item .entry-meta span {
        margin-right: 6px;
    }
    .main-menu ul.sub-menu li ul.sub-menu {
        left: auto;
        right: 0;
    }
    .slider-area .owl-controls .owl-dots {
        right: 90px;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE 2 CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    #camera-slide {
        height: 490px !important;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
CONTACT PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .single-contact-info span {
        display: block;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
SINGLE BLOG PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .share-box span {
        margin-left: 0;
    }
}


/*
*================================================================== -->
* Tablet Screen [768px into 991px]
*================================================================== -->
*/

@media only screen and (min-width: 768px) and (max-width: 991px) {
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .mm-toggle {
        display: none;
    }
    .header-top-text {
        font-size: 12px;
    }
    .header-top-text span,
    .header-top-text a {
        margin-right: 7px;
    }
    .header-top-text i {
        margin-right: 4px;
    }
    .main-menu ul.sub-menu li ul.sub-menu {
        left: auto;
        right: 0;
    }
    .main-menu ul.sub-menu li a {
        padding: 30px 14px;
        font-size: 12px;
    }
    .stickymenu .main-menu ul.sub-menu li a {
        padding: 30px 14px;
    }
    .siblings::after {
        right: 3px;
        font-size: 14px;
    }
    .main-menu ul.sub-menu li ul.sub-menu li a {
        font-size: 11px;
        padding: 7px 5px 7px 15px;
    }
    .main-menu ul.sub-menu li ul.sub-menu {
        min-width: 190px;
    }
    .main-menu ul.sub-menu li ul.sub-menu li:hover > a,
    .main-menu ul.sub-menu li ul.sub-menu li ul.sub-menu li:hover > a {
        padding: 7px 5px 7px 25px;
    }
    .slider-area .owl-controls .owl-dots {
        top: auto;
        right: auto;
        margin-top: 0;
        left: 50%;
        margin-left: -10px;
        transform: rotate(90deg);
        bottom: 25px;
        text-align: center;
    }
    .single-box-item .box-height {
        min-height: 112px;
    }
    .single-slide-item,
    .cta-area,
    .single-item-content {
        text-align: center;
    }
    .secton-text p {
        margin-top: 50px;
    }
    .single-box-item h4 {
        font-size: 16px;
    }
    .about-content,
    .why-choose-us-img,
    .single-project-item {
        margin-bottom: 50px;
    }
    .about-content,
    .paddingL,
    .paddingR,
    .section-title-center p,
    .single-testimonial-item {
        padding: 0;
    }
    .cta-area .text-right {
        text-align: inherit;
    }
    .cta-btn {
        margin-top: 30px;
    }

    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE 2 CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .single-item-content h2 {
        font-size: 30px;
    }
    #camera-slide {
        height: 384px !important;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
BLOG PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .single-blog-content {
        padding-right: 0;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
BLOG LEFT SIDEBAR PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .left-content .single-blog-content {
        padding-left: 0;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
CONTACT PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .contact-form-wrap {
        margin: 50px 0;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
SERVICE 2 PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .single-box-item.single-service-details .box-height {
        min-height: 115px;
    }
}


/*
*================================================================== -->
* Mobile Screen [320px into 767px]
*================================================================== -->
*/

@media only screen and (max-width: 767px) {
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .navbar {
        min-height: 0;
    }
    .navbar-toggle {
        border: 1px solid #cb2d3e;
        margin-top: -55px;
        margin-right: 10px;
    }
    .navbar-toggle .icon-bar {
        background-color: #cb2d3e;
    }
    .main-menu {
        display: none;
        padding-right: 0;
    }
    #mobile-menu {
        display: block;
    }
    .header-content-area {
        position: relative;
    }
    .mm-toggle {
        top: 65px;
        position: absolute;
        top: 50%;
        margin-top: 27px;
        right: 15px;
    }
    .section-title-center p {
        padding: 0;
    }
    .single-slide-item {
        height: 450px;
    }
    .header-top-area,
    .single-slide-item,
    .cta-area,
    .cta-area .text-right,
    .copyright-text,
    .copyright-text .text-right {
        text-align: center;
    }
    .header-top-area .text-right {
        text-align: center;
        border-top: 1px solid #656565;
        padding: 2px;
    }
    .main-menu ul.sub-menu li a:before,
    .main-menu ul.sub-menu li a:after,
    .main-menu ul.sub-menu li.active a:before,
    .main-menu ul.sub-menu li.active a:after,
    .siblings:after,
    .siblings:hover:after,
    .main-menu ul.sub-menu,
    .main-menu ul.sub-menu li ul.sub-menu {
        position: inherit;
        content: none;
        visibility: visible;
        opacity: 1;
        top: 0;
    }
    .main-menu ul.sub-menu li {
        display: block;
    }
    .main-menu ul.sub-menu li a {
        padding: 15px 10px;
    }
    .stickymenu .main-menu ul.sub-menu li a {
        padding: 15px 10px;
    }
    .main-menu ul.sub-menu li:hover > ul.sub-menu,
    .main-menu ul.sub-menu li ul.sub-menu li:hover > ul {
        top: 0;
    }
    .main-menu ul.sub-menu li ul.sub-menu li:hover > a,
    .main-menu ul.sub-menu li ul.sub-menu li ul.sub-menu li:hover > a {
        background-color: inherit;
        color: #f2f2f2;
    }
    .main-menu ul.sub-menu li.active a {
        color: #fff;
    }
    .mobile-menu li li {
        background: #171512;
    }
    .mobile-menu ul .expand {
        background: inherit;
    }
    .main-menu ul.sub-menu li ul.sub-menu {
        border-top: 0px solid transparent;
    }
    .main-menu ul.sub-menu li ul.sub-menu li ul {
        top: 0;
        opacity: 1;
        visibility: visible;
        right: 0;
    }
    .mobile-menu li a {
        text-transform: capitalize;
        color: #fff;
        font-weight: 500;
    }
    .search-icon {
        right: 13px;
        margin-top: -47px;
    }
    .search-form {
        width: 100%;
    }
    .slider-area .owl-controls .owl-dots {
        top: auto;
        right: auto;
        margin-top: 0;
        left: 50%;
        margin-left: -10px;
        transform: rotate(90deg);
        bottom: 25px;
        text-align: center;
    }
    .single-item-content h2,
    .cta-area h2 {
        font-size: 18px;
        line-height: 1.5em;
    }
    .single-item-content p {
        font-size: 14px;
        line-height: 21px;
    }
    .ach-btn {
        padding: 8px 25px;
        font-size: 12px;
    }
    .slide-btn {
        margin-right: 5px;
    }
    .section-title h3,
    .section-title h3 span,
    .about-content h3,
    .why-choose-us-content h3 {
        font-size: 16px;
    }
    .secton-text p {
        margin-top: 40px;
        font-size: 12px;
        line-height: 20px;
    }
    .about-content,
    .paddingL,
    .paddingR,
    .section-title-center p,
    .single-testimonial-item {
        padding: 0;
    }
    .video {
        margin-top: 30px;
    }
    .video-img,
    .why-choose-us-img {
        min-height: 180px;
    }
    .video-icon {
        padding: 65px 0;
    }
    .video-icon i {
        width: 55px;
        height: 55px;
        border: 3px solid #fff;
        font-size: 18px;
        line-height: 53px;
        padding-left: 6px;
    }
    .about-content h3 {
        margin-bottom: 15px;
    }
    .why-choose-us-content ul li {
        line-height: 21px;
        padding-left: 22px;
        margin-bottom: 7px;
    }
    .section-padding {
        padding: 50px 0;
    }
    .footer-menu {
        margin-top: 20px;
    }
    .footer-menu li a {
        padding: 5px 5px;
    }
    .single-blog-item .entry-meta span {
        margin-right: 5px;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE 2 CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .camera_commands,
    .camera_next,
    .camera_prev {
        top: auto;
        margin-top: 0;
        bottom: -40px;
    }
    #camera-slide {
        height: 200px !important;
    }
    #camera-slide .single-item-content {
        text-align: center
    }
    #camera-slide .single-item-content h2 {
        font-size: 14px;
        line-height: 1.3em;
    }
    #camera-slide .single-item-content p {
        font-size: 11px;
        line-height: 16px;
        margin: 5px 0;
    }
    #camera-slide .ach-btn {
        padding: 1px 15px;
        font-size: 10px;
    }
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
404 PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .area-404 h2 {
        font-size: 35px;
    }
    .area-404 p {
        font-size: 14px;
        line-height: 21px;
        padding: 0;
    }
    .search-form-404 {
        width: 100%;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
BLOG PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .single-blog-content {
        padding-right: 0;
    }
    .single-blog-content h3 {
        font-size: 16px;
    }
    .margin-30 {
        margin: 20px 0;
    }
    .entry-meta {
        font-size: 10px;
    }
    .entry-meta span {
        margin-right: 5px;
    }
    .entry-meta span i {
        margin-right: 2px;
    }
    .blog-quete-post {
        padding: 30px 0 30px 20px;
    }
    .pagination li a {
        font-size: 18px;
        padding: 8px 13px;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
BLOG LEFT SIDEBAR PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .left-content .single-blog-content {
        padding-left: 0;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
SINGLE BLOG PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .share-box,
    .comment-btn {
        margin-top: 15px;
    }
    .share-box span,
    .single-comment-reply {
        margin-left: 0;
    }
    .single-comment-item {
        padding-left: 0;
    }
    .single-comment-item img,
    .comment-btn {
        position: inherit;
    }
    .single-comment-item img {
        margin-bottom: 15px;
    }
    .single-blog-content p img {
        float: none;
        margin: 20px 0;
        overflow: hidden;
        width: 100%;
        height: auto;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
CONTACT PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .contact-form-wrap,
    .single-contact-info {
        text-align: center;
    }
    .contact-form-wrap {
        padding: 50px 15px;
    }
    .contact-form-wrap {
        margin: 50px 0;
    }
    .single-contact-info span {
        display: block;
    }
    .single-contact-info i {
        margin: 0 auto 10px;
    }
}


/*
*================================================================== -->
* Wide Mobile Screen [480px into 767px]
*================================================================== -->
*/

@media only screen and (min-width: 480px) and (max-width: 767px) {
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .navbar-toggle {
        margin-right: 20px;
    }
    .search-icon {
        right: 20px;
    }
    .entry-meta {
        font-size: 12px;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
INDEX PAGE 2 CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    #camera-slide {
        height: 240px !important;
    }
    
    
/*xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
BLOG PAGE CSS
xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx*/
    .blog-quete-post {
        padding: 30px 15px 30px 25px;
    }
}