/* general */
body {
    font-family: Gill Sans MT;
    font-size: 14px;
    color: #000;
	border:none;
	outline:none;
	
	
}
.boxqu{
	top:0 !important; left: 15%; display: none;border-radius:12px;
	}
.slides p{
	text-align:center;color:#fff;font-size:20px;font-family:Gill Sans MT;
	}
	
@media (min-width: 200px) and (max-width: 768px) {
.slides p{
	font-size:10px;
	margin:19px 0 -16px 61px;
	}	
	#boxes .window{
		width:100% !important;
		left:0 !important;
		}
	}

    a {cursor:pointer;}

    .scrollbar{

        height:315px;
        margin-bottom:30px;
        overflow-y:scroll;
        float:left;
        }
        
        #ex3::-webkit-scrollbar{
        width:16px;
        background-color:#fff;
        border-radius:8px;
        } 
        #ex3::-webkit-scrollbar-track{
        border:1px gray solid;
        border-radius:10px;
        
        } 
        #ex3::-webkit-scrollbar-thumb{
        background-color:#29b0e5;
        border-radius:10px;
        border:1px solid #fff;
        
        }

        @media only screen and (max-width: 1000px){

            .scrollbar{
            
            height:315px;
            margin-bottom:30px;
            overflow-y:scroll;
            float:left;
        
            }
                
            }

            #templatemo_services{
	
            }

            #templatemo_gallery{
                background:url(../images/sectionbg.jpg) no-repeat center center;
                background-size:cover;
                }

                .slides {
                    height:26%;
                    margin: -85px auto;
                    overflow:hidden;
                    position:absolute;
                    width:55%;
                    left: 440px;
                    bottom:0;
                }
                
                @media only screen and (max-width: 1850px) {
                
                    .slides {
                    height:26%;
                    margin: 480px auto;
                    overflow:hidden;
                    position:absolute;
                    width:88%;
                    left: 80px;
                    bottom:0;
                    top: 290px;
                }
                }
                
                @media only screen and (max-width: 1000px) {
                
                    .slides {
                    height:26%;
                    margin: 720px auto;
                    overflow:hidden;
                    position:absolute;
                    width:88%;
                    left: 50px;
                    bottom:0;
                    top: 130px;
                }
                }
                
                
                .slides p{
                    color: #29b0e5;
                    font-size: 15px;
                    font-weight: bold;
                    
                }
                .slides ul {
                    list-style:none;
                    position:relative;
                    margin-top: -20px;
                    margin-right: 80px;
                }


/* keyframes #anim_slides */
@-webkit-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}
@-moz-keyframes anim_slides {
    0% {
        opacity:0;
    }
    6% {
        opacity:1;
    }
    24% {
        opacity:1;
    }
    30% {
        opacity:0;
    }
    100% {
        opacity:0;
    }
}

                .slides ul li {
                    opacity:0;
                    position:absolute;
                    top:0;
                    width:100%;
                
                    /* css3 animation */
                    -webkit-animation-name: anim_slides;
                    -webkit-animation-duration: 78.0s;
                    -webkit-animation-timing-function: linear;
                    -webkit-animation-iteration-count: infinite;
                    -webkit-animation-direction: normal;
                    -webkit-animation-delay: 0;
                    -webkit-animation-play-state: running;
                    -webkit-animation-fill-mode: forwards;
                
                    -moz-animation-name: anim_slides;
                    -moz-animation-duration: 78.0s;
                    -moz-animation-timing-function: linear;
                    -moz-animation-iteration-count: infinite;
                    -moz-animation-direction: normal;
                    -moz-animation-delay: 0;
                    -moz-animation-play-state: running;
                    -moz-animation-fill-mode: forwards;
                }
                
                /* css3 delays */
                .slides ul  li:nth-child(2), .slides ul  li:nth-child(2) div {
                    -webkit-animation-delay: 6.0s;
                    -moz-animation-delay: 6.0s;
                }
                .slides ul  li:nth-child(3), .slides ul  li:nth-child(3) div {
                    -webkit-animation-delay: 12.0s;
                    -moz-animation-delay: 12.0s;
                }
                .slides ul  li:nth-child(4), .slides ul  li:nth-child(4) div {
                    -webkit-animation-delay: 18.0s;
                    -moz-animation-delay: 18.0s;
                }
                .slides ul  li:nth-child(5), .slides ul  li:nth-child(5) div {
                    -webkit-animation-delay: 24.0s;
                    -moz-animation-delay: 24.0s;
                }
                .slides ul  li:nth-child(6), .slides ul  li:nth-child(6) div {
                    -webkit-animation-delay: 30.0s;
                    -moz-animation-delay: 30.0s;
                }
                .slides ul  li:nth-child(7), .slides ul  li:nth-child(7) div {
                    -webkit-animation-delay: 36.0s;
                    -moz-animation-delay: 36.0s;
                }
                .slides ul  li:nth-child(8), .slides ul  li:nth-child(8) div {
                    -webkit-animation-delay: 42.0s;
                    -moz-animation-delay: 42.0s;
                }
                .slides ul  li:nth-child(9), .slides ul  li:nth-child(9) div {
                    -webkit-animation-delay: 48.0s;
                    -moz-animation-delay: 48.0s;
                }
                .slides ul  li:nth-child(10), .slides ul  li:nth-child(10) div {
                    -webkit-animation-delay: 54.0s;
                    -moz-animation-delay: 54.0s;
                }
                .slides ul  li:nth-child(11), .slides ul  li:nth-child(11) div {
                    -webkit-animation-delay: 60.0s;
                    -moz-animation-delay: 60.0s;
                }
                .slides ul  li:nth-child(12), .slides ul  li:nth-child(12) div {
                    -webkit-animation-delay: 66.0s;
                    -moz-animation-delay: 66.0s;
                }
                .slides ul  li:nth-child(13), .slides ul  li:nth-child(13) div {
                    -webkit-animation-delay: 72.0s;
                    -moz-animation-delay: 72.0s;
                }
                

/* keyframes #anim_titles */
@-webkit-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}
@-moz-keyframes anim_titles {
    0% {
        left:100%;
        opacity:0;
    }
    5% {
        left:10%;
        opacity:1;
    }
    20% {
        left:10%;
        opacity:1;
    }
    25% {
        left:100%;
        opacity:0;
    }
    100% {
        left:100%;
        opacity:0;
    }
}



                .slides ul li div {
                    font-family:Gill Sans MT;
                   width:80%;
                    color:#FFFFFF;
                    font-size:17px;
                    left:10%;
                    margin:0 auto;
                    padding:20px;
                    position:absolute;
                    top:50%;
                    text-align:center;    
                
                    /* css3 animation */
                    -webkit-animation-name: anim_titles;
                    -webkit-animation-duration: 36.0s;
                    -webkit-animation-timing-function: linear;
                    -webkit-animation-iteration-count: infinite;
                    -webkit-animation-direction: normal;
                    -webkit-animation-delay: 0;
                    -webkit-animation-play-state: running;
                    -webkit-animation-fill-mode: forwards;
                     
                    -moz-animation-name: anim_titles;
                    -moz-animation-duration: 36.0s;
                    -moz-animation-timing-function: linear;
                    -moz-animation-iteration-count: infinite;
                    -moz-animation-direction: normal;
                    -moz-animation-delay: 0;
                    -moz-animation-play-state: running;
                    -moz-animation-fill-mode: forwards;
                }
                    
                    
                    
                    .footernav{
                        float:left;
                        width:44%;
                        }
                .leftf{
                    width:28%;
                    float:left;
                    }
                .rightf{
                    float:right;
                    width:22%;
                    text-align:right;
                    }
                .footernav ul li{
                    list-style:none;
                    float:left;
                    margin-left:10px;
                    color:#fff;
                    }
                .footernav ul{
                width:387px;
                margin:0 auto;
                    }
                .footernav ul li a{
                    text-decoration:none;
                    font-size:15px;
                    color:#fff;
                    }
                .footernav ul li a:hover{
                    text-decoration:underline;
                    }
                    .foothead{
                        width:100%;
                        background:#7d7f83;
                        padding:30px 0px 10px 0px;
                        margin-top: 70px;	
                        
                        
                        }
                    
                
                
                        
                
                
                
                    
                .social{
                    height:110px;
                    width:26px;
                    position:fixed;
                top:115px;
                    z-index:999;
                    }
                .social img:hover{
                    width:35px;
                    transition: 0.7s all;
                -webkit-transition: 0.7s all;
                -moz-transition: 0.7s all;
                -o-transition: 0.7s all;
                    }
                h1,h2, h3, h4, h5, h6 {
                    font-family: Gill Sans MT;
                    line-height: 1.1em;
                    margin-bottom: 20px;
                    color:#29b0e5;
                }
                h1 {
                    text-align: center;
                    margin-top: 30px;
                    margin-bottom: 30px;
                }
                
                .margin_top { margin-top: 20px; }
                
                /* header */
                header {
                    
                    width: 100%;
                    background: #fff;
                    position: fixed;
                    left: 0;
                    top: 0;
                    z-index: 200;
                    padding-left: 50px;
                   
                }
                header #templatemo_logo {
                    padding-top: 35px;
                    float: left;
                }
                header #templatemo_logo img {
                    width: 100%;
                    position: absolute;
                    top: -70px;
                    left: 1470px;
                }
                
                
                
                header ul {
                    float: left;
                    min-height: 60px;
                    margin-top: 30px;
                }
                header ul li {
                    margin: 0;
                    padding: 0;
                    list-style: none;
                    float: left;
                    height: 45px;
                }
                header ul li a {
                    font: normal normal normal 18px/20px Gill Sans MT;
                    text-align: center;
                    float: left;
                    color: #a7a9ac;
                    
                }
                .header ul li:hover a{
                    color:#29b0e5;
                    }
                header ul li:active a, header ul li:focus a, header ul li a.current{
                    color: #29b0e5;
                    border: 1px solid #29b0e5;
                    text-decoration: none;
                }
                header .nav li a:hover, header .nav li a:focus {
                    background-color: #fff;
                    color: #29b0e5;
                }
                
                
                @media only screen and (max-width: 1850px){
                
                    header {
                        padding-left: 0px;
                        }
                
                    header #templatemo_logo img {
                        width: 200px;
                        position: absolute;
                        top: -50px;
                        left: -10px;
                    }
                
                    
                    header ul {
                        float: left;
                        min-height: 60px;
                        margin-top: 30px;
                        
                      
                    }
                    header ul li {
                        margin: 0;
                        padding: 0;
                        list-style: none;
                        float: left;
                        height: 45px;
                        right: 250px;
                    }
                    header ul li a {
                        font: normal normal normal 18px/20px Gill Sans MT;
                        text-align: center;
                        float: left;
                        color: #a7a9ac;
                        
                        
                    }
                
                }
                
                @media only screen and (max-width: 1000px){
                
                    header #templatemo_logo img {
                        width: 220px;
                        position: absolute;
                        top: -65px;
                        left: -140px;
                    }
                
                    header ul {
                        float: left;
                        min-height: 60px;
                        margin-top: 30px;
                 
                    }
                    header ul li {
                        margin: 0;
                        padding: 0;
                        list-style: none;
                        float: left;
                        height: 45px;
                        right: -25px;
                        
                    }
                    header ul li a {
                        font: normal normal normal 18px/20px Gill Sans MT;
                        text-align: center;
                        float: left;
                        color: #555657;
                        
                    }
                
                }
                
                /* scroll */
.scrollup {
    position: fixed;
    width: 55px;
    height: 55px;
    bottom: 65px;
    right: 18px;
    background: #222;
    background: url("../images/templatemo_arrow.png")no-repeat;
	z-index:9;
}

/*templatemo_about*/
#templatemo_about .row {
    margin-top: 120px;
	margin-bottom:30px;
}

#templatemo_about p {
    font: normal normal normal 15px/30px Gill Sans MT;
    text-align: justify;
    margin-top: -150px;
    padding: 0 0 10px 0;
	color:#77787a;
}

#templatemo_services p {
    font-size: 14px;
    line-height: 20px;
    font-family: Gill Sans MT;
    color: #000;
    text-align: left;
}
#templatemo_services .row {
    padding-bottom: 30px;
}

@media only screen and (max-width: 1000px){

	#templatemo_services .row {
    padding-bottom: 30px;
    margin-left: 80px;
}
}

#templatemo_gallery {
}
.thumbs {
    margin: 0;
    padding: 0;
	float: left;
/*overflow: scroll;
height: 328px;
overflow-x: hidden;
scroll-base-color: #9999cc;
scroll-base-color: orange; 
scroll-arrow-color: green;
scroll-DarkShadow-Color: blue; */
}
.thumbs li {
    list-style: none;
    margin-bottom: 30px;
}
.thumbs li.item-thumbs div {
    width: 100%;
    height: 100%;
    float: left;
    background: #71def3;
    position: relative;
	border-radius:5px;
	padding:4px;
	border:1px solid rgba(255,255,255, 0.5);
}
.thumbs li.item-thumbs .overlay {
   position: absolute;
width: 96%;
height: 95%;

z-index: 5;
/* top: 0; */
/* left: 0; */
opacity: 0.6;
transition: all 450ms ease-out 0s;
text-decoration: none;
/* -webkit-transform: scale(0.5,0.5); */
/* transform: scale(0.5,0.5); */
-webkit-transition: .5s;
transition: .5s;
border-radius: 1px;
}
.thumbs li.item-thumbs:hover .overlay {
   
    background:none;
	opacity:1;
}
.thumbs li.item-thumbs .overlay span {
    top: 50%;
    left: 50%;
    margin: -15px auto auto -15px;
    color: white;
    font-size: 25px;
    position: absolute;
}
.thumbs li.item-thumbs img {
    float: left;
    width: 200px;
	height:250px;
}

.scrollbar ul li{
    filter: grayscale(100%);
    transition: all .3s ease-in-out; 
}

.scrollbar ul :hover{
    filter: grayscale(0%);
}
  

/*responsive setting*/
@media (min-width: 1025px) {
    header ul li {
        margin: 10px 10px 0 10px;
    }
    header ul li a {
        margin: 0;
        padding: 0 5% 0 5%;
    }
    #templatemo_services p {
        line-height: 30px;
        padding: 17px 0;
    }
}

    @media (min-width: 768px) and (max-width: 992px) {
        header ul li {
            margin: 10px 0 0 0;
            padding: 0;
        }
        header ul li a {
            margin: 0;
            padding: 0 12px 0 12px !important;
        }
        #templatemo_slideshow #main-slider .flex-caption p {
            font-size: 10px !important;
            line-height: 18px;
        }
        #templatemo_about p {
            font: normal normal normal 14px/22px Gill Sans MT;
            text-align: justify;
        }
    
        #templatemo_about h1{
            padding-top: 100px;
            
        } 
    
        #templatemo_services p {
            font-size: 14px;
            line-height: 18px;
            padding: 3px 0;
        }
    }
        .socialfooter{
            display:none;
            }

            #gallery1 a{
                opacity:0.60;
                
                }

                @media (min-width: 994px) and (max-width: 1060px) {
                    .col-sm-18{
                        width:67% !important;
                        }	
                        }
                        @media (min-width: 768px) and (max-width: 994px) {
                    .col-sm-18{
                        width:69% !important;
                        
                        }
                        .artli{top:40px;}	
                        }
                        
                        @media (max-width: 1024px) {
                            
                        .thumbs li
                        {
                            padding-left:0 !important;
                            padding-right:1px !important;
                        }
                        }
                        @media (min-width: 1025px) and (max-width: 1199px) {
                            .thumbs li{
                            padding-right:3px !important;
                            }}
                        
            @media (min-width: 200px) and (max-width: 1060px) {
                .footernav{
                    display:none;
                    }
                .leftf{
                    width:50%;
                    }
                    .rightf{
                        width:50%;
                        }
                
                .social{
                    display:none;
                    }
                    .socialfooter{
                        display:block;
                        width:120px;
                        margin:0 auto;
                        padding-bottom:7px;
                        }
                    .socialfooter a{
                        opacity:0.5;
                        }
                        .socialfooter a:hover{
                            opacity:1;
                            }
                    }
                
                    #gallery1 a{
                        opacity:0.60;
                        
                        }

                        @media only screen and (max-width: 1000px){

	
                            #templatemo-nav-bar ul{
                                position: relative;  
                                display: flex;
                                margin-right: -250px;
                            
                            }
                        
                        }
        
        
        
        @media (min-width: 768px) and (max-width: 1024px) {
                    
                    header ul li a{
                        font-size:22px !important;
                       
                        }
                    }
                    .thumbs p{
                        width: 166px;
        line-height: 20px !important;
        margin: 0 !important;
        padding: 0 4px !important;
        color:#77787a !important;
        font-size:15px !important;
        text-align:center !important;
        }