/*-------------------------------------------------------*/
/* Table of Contents	 */
/*-------------------------------------------------------*/

/*
1.	Base styles 
2.	Wrap / Container
3.	Preloader
4.	Header
5.	Home  start
6.	Features
7.	Portfolio Start
8.	Contact  start
9.	Short codes

/*

/*-------------------------------------------------------*/
/* Base styles	 */
/*-------------------------------------------------------*/
html { overflow-y:scroll; }
body {
    background-color:#e7e7e7;
    background:url(../images/patterns/concrete_wall_2.png);
    background-repeat:repeat;
    background-position:left top;
}
body ::selection { background:#898888; color:white; }
body ::-moz-selection { background:#898888; color:white; }
.clr { clear:both; padding:0px; margin:0px;  }
.float_left{ float:left;}
.float_right{ float:right;}
p{ margin:0px; padding:0px; }
.img-left { float:left; }
p, ul, ol, blockquote { margin-bottom:35px; }

.clr span{
    font-size: 18px;
    padding-top: 5px;
}
/*------------------------------------------------------
        Wrap / Container 
-------------------------------------------------------*/
#container { width:1054px; margin:0px auto; margin-top:10px; clear:both; }
#content {
    background-image:url(../images/index-bg.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:auto;
    clear:both;
    margin-top:108px;
}
.card-pattern {
    background-image:url(../images/patterns/cards/wall4.png);
    background-repeat:repeat;
    background-position:left top;
    height:auto;
    width:1005px;
    margin:0px auto;
    clear:both;
    padding-bottom:40px;
}
/* Card Bottom Shade */
.bottom-shade {
    background-image:url(../images/bottom-shade.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:40px;
    clear:both;
}
.top-bg1{
    background-image:url(../images/patterns/bee-patterns-tile.PNG);	
    background-repeat:repeat-x;
    background-position:left top;
    width:1019px;	
    height:68px;
}	
.pat-bottomleft{
    background-image:url(../images/pattern-bottomleft.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:5px;
    width:7px;
    margin:0px 0px 0px 1px;
    float:left;	
}
.pat-bottomright{
    background-image:url(../images/pattern-bottomright.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:5px;
    width:7px;
    float:right;	
}
.sub_page { width:1020px; margin:0px 0px 0px -7px; clear:both;}
.hline  {
    clear:both;
    background-image:url(../images/hline.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:100%;
    height:2px;
    margin-top:30px;
    margin-bottom:30px;
}
.green_highlite{ padding:3px 6px; text-shadow:none;}
.gray_highlite{ background:#888888; color:#fff; padding:3px 6px; text-shadow:none;}
.blank{ display:none;}
.content{ clear:both; padding-left:36px; padding-right:32px;}	
.content h3{color:#737373; margin:0px auto; }	

/**********************  Preloader CSS   ******************************/
body { overflow:hidden; }
#preloader {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:white;
    z-index:2;
}
#spinner_container { width:193px; margin:250px auto; }
#spinner { display:block; margin:20px auto; }
/* // Preloader CSS */

/**********************  Header  start  ******************************/
#top-head {
    background-color:#fbfbfb;

    width:100%;
    background-repeat:repeat;
    background-position:left top;
    height:100px;
    border-bottom:1px solid #e5e5e5;
    top: 0px; /* Top alignment of menu background */
    position: fixed;
    z-index:999999; 
    /*background: no-repeat;*/
}
#header { position:fixed;
          top:10px; /*Top alignment of logo and menu */
          list-style:none; 
          z-index:999999; 
}
.logo-bg {
    background-repeat:no-repeat;
    background-position:left top;
    height:100px;
    width:1025px;
    clear:both;
}	
.logo-bg .logo { float:left; width:199px; padding:15px 0px 0px 50px;}
.logo-bg .logo:hover { cursor:pointer;}
.header_right { width:680px; float:right; }
/* menu start*/
.menu_nav {padding-top:54px; margin-left:50px;}
ul.arrowunderline { list-style-type:none; margin:0; padding:0; }
ul.arrowunderline li { float:left;  }
ul.arrowunderline li a{
    display:inline;
    margin-left:22px; /* spacing between each menu item */
    font-family:"Open Sans";
    font-size:16px;
    line-height:normal;
    font-weight:normal;
    color:#b6b6b6;
    text-decoration:none;
    text-transform:uppercase;
    position:relative;
    padding-bottom:48px; /*spacing between each menu item and arrow underline beneath it */
}

ul.arrowunderline li a:hover:after, ul.arrowunderline li a.selected:after { /* use CSS generated content to add arrow to the menu */
    content:'';
    width:0;
    height:0;
    position:absolute;
    left:50%;
    margin-left:-8px; /* value should match border-width below */
    bottom:0;
    top: 35px;
    border-width:12px; /* value should match margin-left above */
    border-style:outset;
    border-color:#fbfbfb transparent transparent transparent; /* create up arrow */
}	
#menu-icon { display:none; } /* this CSS for Mobile and Tablet menu
/* menu end  */
/********************** // Header  ******************************/

/**********************  Home  start  ******************************/
#home{ width:1020px; margin:0px 0px 0px -7px; clear:both;}	
.pat {
    background-image:url(../images/patterns/bee-patterns-tile.PNG);
    background-repeat:repeat-x;
    background-position:left top;
    width:1019px;
    height:118px;
}
.pat-topleft {
    background-image:url(../images/pattern-topleft.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:5px;
    width:6px;
    float:left;	
    margin:0px 0px 0px 1px;	
}
.pat-topright {
    background-image:url(../images/pattern-topright.png);
    background-repeat:no-repeat;
    background-position:left top;
    height:5px;
    width:7px;
    float:right;
}	
.top-bg {
    background-image:url(../images/home-top.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:1005px;	
    height:160px;
    margin-left:7px;
}
.middle{
    background-image:url(../images/home-top.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:1005px;	
    height:5px;
    float:left;
}
.top-left { padding:25px 0px 0px 41px; width:929px; }
.tag { font-size:72px; color:#868585; padding:18px 0px 0px 0px; text-shadow:1px 1px 1px #f7f6f6; }
.tag  span {font-size:30px; text-shadow:1px 1px 1px #f7f6f6;}
.sub-tag { 
    font-size:60px; 
    color:#fcfcfc; 
    text-transform:uppercase; 
    margin:40px 0px 0px 0px; 
    text-shadow:1px 1px 1px #b9b8b8; 
}
.pat p{ 
    font-family:'open sans Light', sans-serif; 
    color:#ffffff; 	
    font-size:24px; 
    line-height:30px; 
    text-shadow:none; 
    text-align:justify;
    padding:30px 97px 0px 50px; 
}
.pat p span { color:#0e0e0e; text-shadow:none; }
.box_top{ clear:both; width:90%; height:auto; margin:0 auto; margin-left:80px; margin-bottom:10px;  }
.home_heading { clear:both;}
.home_heading h2{padding-top:35px; padding-bottom:20px; padding-left:15px; text-transform:uppercase; margin-bottom:-20px;}
.special{ padding-left:15px; }



/**********************  Home  End  ******************************/

/**********************  Features  ******************************/
.features_top{ clear:both;}
.features_left { width:50%; height:auto; float:left;}
.features_right { width:50%; height:auto; float:left;}
/**********************  /Features  ******************************/

/**********************  Portfolio Start  ******************************/
#portfolio {
    overflow:hidden;
    width:1020px;
    height:auto;
    margin:0px 0px 0px -7px;
}
/* Filter menu */
#portfolio-filter { overflow:hidden; margin-top:40px; margin-bottom:0px; }
#portfolio-filter li a {
    float:left;
    margin-right:10px;
    color:#fff;
    background-color:#878787;
    padding:3px 10px 3px 10px;
    margin-bottom:4px;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    behavior: url(pie.html);
    position:relative;	
}
/* Images list */
#portfolio-list { width:980px; margin-left:-20px;}
#portfolio-list li {
    text-align:center;
    width:202px;
    height:200px;
    list-style:none;
    color:#898888;
    margin:30px 0px 0px 20px;
    padding:2px 2px 0px 2px;
    background-color:#f5f5f7;		
}
#portfolio-list li:hover {
    text-align:center;
    cursor:pointer;
    width:202px;
    height:200px;
    list-style:none;
    background-color:#f9f9f9;		
    padding:2px 2px 0px 2px;
}
#portfolio-list img { height:131px; width:202px; }
#portfolio-list li h5 { font-size:14px; margin-top:5px; font-weight:700; color:#666666; text-align:center; }
#portfolio-list li .categorie {
    font-size:13px;
    line-height:20px;
    color:#7c7c7c;
    font-style:italic;
    font-weight:normal;
}
/* Isotope filtering start */
.isotope-item { z-index:2;	}
.isotope-hidden.isotope-item { pointer-events: none; z-index: 1; }
.isotope, .isotope .isotope-item {/* change duration value to whatever you like */
    -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;
}
/* Isotope Filtering end */

/* adipoli start*/
.adipoli-wrapper { margin:auto; position:relative; display:inline-block; }
.adipoli-wrapper>img { position:absolute; z-index:1; }
.adipoli-before { position:absolute; z-index:5; }
.adipoli-after { position:absolute; z-index:10; }
.adipoli-slice { display:block; position:absolute; z-index:15; height:100%; }
.adipoli-box { display:block; position:absolute; z-index:15; }	
/* adipoli end*/
/**********************  Portfolio End  ******************************/

/**********************  Contact  start  ******************************/
.content h2 { color:#666666; }
iframe { clear:both; width:99%; height:250px; border:1px solid #ffffff;}
.contact-top { padding-top:20px;  clear:both;}
.contact_left { width:430px; float:left; margin:10px 0px 0px 10px; }
.contact_left h2 { border-bottom:1px solid #cacccc; padding-bottom:14px; }
/* Comment Form */
#contact_form { 
    background:#d8dbdb;
    border:1px solid #d3d3d3;
    -moz-border-radius:3px;
    border-radius:3px;
    margin:0 auto 1.625em;
    padding:1.625em;
    width:220px;
    height:435px;
}
.boxBody {
    width:100%;
    float:left;
    background-color:none;
    -moz-border-radius-topright:3px; 
    -moz-border-radius-bottomleft:3px;
    -moz-border-radius-bottomright:3px;
    -webkit-border-top-right-radius:3px;
    -webkit-border-bottom-left-radius:3px;	
    -webkit-border-bottom-right-radius:3px;		
}
.boxBody .desc { display:block; }
.post_message { font-weight:bold; }
#form { display:block; width:422px; padding:0px 20px 0px 5px; }
#form div{ float:left; width:422px; position:relative; }
#form label { width:100%; float:left; padding-top:5px; margin:0px 0px 0px -5px; }
#form label.error { 
    color:#F00000;
    position:absolute;
    text-align:right;
    font-size:11px;
    top:0;
    left:0;
}
#form input, textarea {
    width:406px;
    padding:8px;
    font-size:13px;
    color:#999999;
    background-color:#FFFFFF;
    float:left;
    border-style:none;
    -moz-border-radius:3px; 
    -webkit-border-radius:3px;
    margin:0px 0px 0px -10px;
}
#form input[type="text"]:focus, #form textarea:focus { background-color:none; color:#333333; outline:0; }
#form textarea{ font-family:Arial, Helvetica, sans-serif; font-size:13px; }
#form .submitBtn {
    /*text-shadow:0 1px 0 #000;*/
    border-style:none;
    font-size:16px;
    display:block;
    width:16%;
    padding:3px 0px 3px 0px;
    margin:10px 0px 0px 0px;
    cursor:pointer;
    /*-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.3);
    -moz-box-shadow:0px 1px 2px rgba(0,0,0,0.3);
    box-shadow:0px 1px 2px rgba(0,0,0,0.3);
    text-shadow:0 -1px 0 rgba(0,0,0,0.3);*/
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    behavior: url(pie.html);
    position:relative;	
    float: right;
    margin-right:60px;
    outline:none;
}
#form .submitBtn:hover{ color:#ffffff; }
#form .font-11{ font-size:11px; display:inline; }
#respond { 
    background:#ebebeb;
    -moz-border-radius:3px;
    border-radius:3px;
    margin:0 auto 1.625em;
    padding:1.625em;
    width:420px;
    height:auto;
}
#respond input[type="text"], #respond textarea {
    background:#fff;
    /*border:4px solid #eee;*/
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    /*-webkit-box-shadow:inset 0 1px 3px rgba(204,204,204,0.95);
    -moz-box-shadow:inset 0 1px 3px rgba(204,204,204,0.95);
    box-shadow:inset 0 1px 3px rgba(204,204,204,0.95);*/
    text-indent:10px;
    padding:2px 0px 0px 10px;
    margin-bottom:15px;
    width:85%;
}
#respond .comment-form-author, #respond .comment-form-email, #respond .comment-form-url, #respond .comment-form-comment { 
    margin-top:-10px;
}
#respond .comment-form-author label, #respond .comment-form-email label, #respond .comment-form-url label, 	#respond .comment-form-comment label {
    background:#eee;
    -webkit-box-shadow:1px 2px 2px rgba(204,204,204,0.8);
    -moz-box-shadow:1px 2px 2px rgba(204,204,204,0.8);
    box-shadow:1px 2px 2px rgba(204,204,204,0.8);
    color:#555;
    display:inline-block;
    font-size:13px;
    left:4px;
    min-width:60px;
    padding:0px 10px;
    top:35px;
    z-index:1;
    position:relative;
}
#respond label { line-height:2.0em; }
#respond input[type=text] { display:block; height:35px; width:85%; position:relative; }
#respond p { font-size:12px; position:relative; }
.form-allowed-tags { display:none; }
#respond label.error {
    position:absolute;
    z-index:1;
    top:-4px;
    font-size:12px;
    color:#e92a0b;
    padding:3px 9px 10px 10px;
    width:260px;
    height:20px;
    margin:30px 0px 0px 400px;
    text-align:left;
    background-color:#d8dbdb;
    border:solid 1px #d0d2d2;
}
/* Contact Form alert end */
.hor-space { clear:both; height:45px; }
.contact_right { width:400px; float:right; margin:0px 20px 0px 0px; }
.contact_right .details ul { margin:0px; padding:10px 0px 0px 0px; }
.contact_right .details li {
    list-style:none;
    float:left;
    width:190px;
    font-size:14px;
    color:#e86874;
    padding:10px 35px 20px 0px;
    font-weight:bold;
}
.contact_right .details li img { padding:0px 7px 20px 0px; float:left; width:38px; }
.contact_right .details li  span { font-weight:normal; clear:both; color:#363636; font-size:13px; }
.contact_right h2 { text-transform:none; text-align:left; margin:0px 0px 10px 0px; }
.contact_right img { margin:23px 0px 0px 0px; }
.pad-top5 { padding-top:6px; }
.contact_right .twitter {
    width:386px;
    height:150px;
    background-image:url(../images/twitter.png);
    background-repeat:no-repeat;
    background-position:left top;
    margin-top:-20px;
}
.contact_right p{ text-align:center; }
.contact_right .twitter h2 { text-align:left; padding:18px 0px 0px 20px; }
.contact_right .twitter ul { font-size:12px; color:#5e5d5d; padding:5px 10px 0px 20px; margin-left:-150px; } 
.contact_right .twitter ul a:hover { color:#666666; } 
.contact_right  span { float:right; width:70%; color:#727272; }
.twitter .tweet_time { font-size:12px; font-weight:normal; }
.twitter .tweet_text { font-size:12px; font-weight:normal; line-height:18px }

.contact_right span a { text-decoration:none; }
.input-box1 {
    float:left;
    width:auto;
    height:25px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    behavior: url(pie.html);
    position:relative;	
    color:#FFFFFF;
    padding:0px 10px 0px 10px;
    margin-bottom:10px;
    padding-top: 5px;
    width: 50px;
    text-align: center
}
/**********************  // Contact  End  ******************************/

/**********************  Short codes  ******************************/

/**********************  About us top box  ******************************/
ul.aboutus-top{clear:both; margin-bottom:38px;  padding:0px; list-style-type:none;}
ul.aboutus-top li { float:left; width:30%; height:auto; margin:0px 3% 30px 0px; }	
.slide-pad { clear:both; padding:10px 0px 5px 0px;}	
.photo_container{
    height:159px;
    width:238px;
    padding:10px;
    background-color:#f3f3f3;
    background-repeat:repeat;
    background-position: left top;	
    border:1px solid #dddddd;
}	
.photos{ height:135px; width:238px; }
.small-bottom {
    background-image:url(../images/slides1-bg.png);
    width:240px;
    height:15px;
    background-repeat:no-repeat;
    background-position:left bottom;
}	
ul.aboutus-top li h2 {margin:0px 0px 3px 0px; padding:0px;}
ul.aboutus-top li h2 span { font-size:12px; font-weight:100;}

/* Social icon section starts */
ul.social { clear:both; margin:0px; padding:0px; list-style-type:none;  }
ul.social li {
    float:left; 
    display:inline; 
    width:32px; 
    height:32px; 
    margin:0px 7px 10px 0px;
    background:#e1e1e1;
    moz-border-radius:50px;
    webkit-border-radius:50px;
    border-radius:50px;
    behavior: url(pie.html);
    position:relative;
    text-align:center;
}
ul.social li i{ color:#9a9a9a; font-size:16px; line-height:32px; text-align:center; 	
                -webkit-transition: all 0.5s ease;
                -moz-transition: all 0.5s ease;
                -ms-transition: all 0.5s ease;
                -o-transition: all 0.5s ease;
                transition: all 0.5s ease; }
ul.social li:hover i{color:#FFFFFF; 
                     line-height:25px;
                     -webkit-transition: all 0.5s ease;
                     -moz-transition: all 0.5s ease;
                     -ms-transition: all 0.5s ease;
                     -o-transition: all 0.5s ease;
                     transition: all 0.5s ease;
}

/* // Social icon */


/********************** // About us top box  ******************************/	

/********************** About us bottom box  ******************************/	
.aboutus-top1 { clear:both; margin-top:50px; margin-bottom:38px;}
.about-box{ float:left; width:26%; height:auto; margin-left:20px; }	
.about-box1 {
    float:left;
    display:inline;
    width:68%;
    height:auto;
    margin:0px auto;
}	
.photo-container{
    background-image: url(../images/slide-bg.png);
    background-repeat: no-repeat;
    background-position: left top;
    height: 365px;
    width: 590px;	
    padding:10px;
}
.photo{
    height:350px;
    width:auto;
    background-repeat: no-repeat;
    background-position: left top;
}	
/********************** // About us bottom box  ******************************/	

/********************** Services  ******************************/	
/* Services 3boxes */
.service-top1 { clear:both; margin-top:33px;}
.service_box, .service_box1 {
    height:auto;
    width:295px;
    float:left; 
    margin:0px 22px 40px  0px;
}
.service_box h3{ text-align:center; clear:both; }	
.service-top1 .box-line {
    background-image:url(../images/hline.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:100%;
    height:2px;
    margin:13px 0px 15px 0px;
}
.service_img { width:160px; height:160px; margin:0 auto;}	
.service-top1 p { margin:0px auto; text-align:justify;}	
.empty { width:5%; float:left;}
.box-line {
    background-image:url(../images/hline.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:100%;
    height:2px;
    margin:35px 0px 35px 0px;
}			
/* // Services 3boxes */

/* Services Top */
.service-top { clear:both; margin-bottom:38px; }
.service_left { float:left; }
.service_right { float:right;  width:68%; }		
.service-line {
    background-image:url(../images/hline.png);
    background-repeat:repeat-x;
    background-position:left top;
    width:100%;
    height:2px;
    position:relative;
    top:15px;
}	
.service-top small {text-transform:lowercase;}		
/* // Services Top */

/********************** // Services  ******************************/	


/**********************  Resume  start  ******************************/
.resume-top {clear:both; }	

/* Resume left content */
.resume_left {float:left; width:585px;  }
.resume_left h2 span { border-bottom:1px solid #dcdbdb; float:right; width:386px; margin-top:-5px;}
.resume_left h5 { padding:5px 0px 5px 0px; }
.resume_left h5 span { font-weight:bold;  float:right; }
.resume_left li span { float:right; margin:-27px 0px 0px 0px; }
.resume-line { border-bottom:1px solid #dcdbdb; float:right; width:459px; }	
/* / Resume left content */

/* Resume chart */
.resume_right { width:300px; height:auto;  float:left; margin:0px 10px 0px 40px; }
.resume_right h2 { padding-left:80px; }

/* Skills diagram jQuery plugin CSS styles */ 
#diagram { float:left; width:300px; height:auto; margin-top:-25px;  }
.get { display:none; }
.skills { float:left; clear:both; width:100%; }
.skills ul, .skills li { display:inline; list-style:none;	float:left; }
.skills li {
    padding:0px 10px;
    height:25px;
    line-height:24px;
    color:#fff;
    text-transform:uppercase;
    width:auto;
    margin:0px 0px 1px 2px;
    font-size:12px;
}
.skills .jq { background:#aeaeae; }
.skills .css { background:#74c675;}
.skills .html { background:#93bf4e; }
.skills .php { background:#de6f96; }
.skills .sql { background:#9bcedd; }

/* / Resume chart */
/**********************  Resume  End  ******************************/


/**********************  About  start  ******************************/

/* About slider */
.about_left { float:left; width:276px; height:auto; margin-top: 20px; }	
#SliderBackground{
    height:300px;
    width:324px;
    padding:10px 10px 10px 10px;
    background-image:url('../images/photo_background.png');
    background-repeat:no-repeat;	
}
#Slider{ height:285px; width:218px; }
#Slider img{ display:none; }
#Slider .default{ display:block; }
#SliderNav{
    width:63px;
    margin-left:35px;
    height:11px;
    display:inline-block;
    padding-left:63.5px;
    padding-right:63.5px;
    float:left;
}
.download {
    float:left;
    width:auto;
    height:auto;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    background-repeat:repeat;
    background-position:left top;
    padding:4px 10px 4px 10px;
    margin:30px 0px 0px 50px;
    cursor:pointer;	
    border-style:none;
    display:block;
}
/* /About slider */

/* About content */
.about_content { width:311px; float:left; margin:0px 5px 0px 10px; }
ul.social-list li{
    min-height:30px;
    margin-bottom:35px;
    clear:both;
    background-repeat:no-repeat;
    background-position:center left;
}	

ul.social-list li a, ul.social-list li span { display:block; font-weight:normal; }
ul.social-list li a:hover { color:#666666; } 
.social-list1 li span{ font-weight:bold; font-size:16px; color:#666666; }
/* /About content */

/* Personal Information */
.about_right { width:280px; height:auto; float:left; margin:0px 0px 0px 35px; }
.about_right p { float:left; }
.about_right  span { float:right; width:62%; line-height:18px;}
.about_right span a { text-decoration:none; }
.input-box {
    float:left;
    width:auto;
    height:25px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    padding:0px 10px 0px 10px;
    margin-bottom:15px;
}
.input-box2 {
    float:left;
    width:auto;
    height:25px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    padding:0px 10px 0px 10px;
}
/* /Personal Information */	
/**********************  About  End  ******************************/



/* Responsive slide starts */
.clientslide_carousel{padding:0px;margin:0px;}
.clientslide_content{ width:960px; height:auto; margin:0px auto; clear:both; margin-left:-5px;}
.clientslide_carousel li{
    background-color:#fcfcfc;
    width:202px;
    height:200px;
    float:left;
    border:1px dotted #d5d5d5;
    margin:0px 18px 0px 20px;
    position:relative;
    list-style:none;
    text-align:center;
}
.clientslide_carousel li img{border:0px;}
.clientslide_carousel li:hover{
    cursor:pointer;
}
.clientslide_carousel li:hover > .portplus, .clientslide_carousel li:hover > .portpost, .portoverlay:hover > .portplus, .portoverlay:hover > .portpost{display:block;}
.portplus{
    height:32px;
    width:32px;
    position:absolute;
    top:0px;
    left:50%;
    background-color:rgba(58,58,58,.5);
    margin:60px 0px 0px -32px;
    display:none;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
.portpost{
    height:32px;
    width:32px;
    position:absolute;
    top:0px;
    left:50%;
    margin:60px 0px 0px 0px;
    background-color:rgba(58,58,58,.5);
    display:none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.portplus img, .portpost img{width:32px !important;height:32px !important;border:0px;}
.clientslide_carousel li img{
    width: 202px;
    float:left;
    padding:0px;
    margin:0px;
    margin-bottom:10px;
    height:auto;
    display:block;
}
.clientslide_carousel li h5 { font-size:14px; margin-top:5px; font-weight:bold; color:#898888;}
.clientslide_carousel li .categorie {
    font-size:11px;
    line-height:20px;
    color:#898888;
    font-style:italic;
    font-weight:normal;
    text-align:center;
}
.portplus:hover, .portpost:hover{background-color:rgba(58,58,58,1);}
.jcarousel-container {margin: 0px -20px 20px 0px;max-width: 100%;padding: 0;}
.jcarousel-clip {overflow: hidden;width: 100%;}
.jcarousel-item {margin: 0;width: 180px;}
.jcarousel-next, .jcarousel-prev {
    cursor: pointer;
    height: 19px;
    position: absolute;
    right: 30px;
    top: -74px;
    width: 19px;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.jcarousel-next{
    background-image:url(../images/small_arrow_right.png);
    background-repeat: no-repeat;
    background-color: #848484;
}
.jcarousel-prev {
    right: 50px;
    background-image: url(../images/small_arrow_left.png);
    background-repeat: no-repeat;
    background-color: #848484;
}
/* // Responsive slide */


/* Service Responsive slide starts */
#service_slide .clientslide_carousel{padding:0px;margin:0px; margin:0px 40px;}
#service_slide .clientslide_content{ width:928px; height:auto; margin:0px auto; clear:both; margin-left:-5px;}
#service_slide .clientslide_carousel li{
    float:left;
    background-color:transparent;
    border:transparent;
    width:202px;
    height:200px;
    margin-right:20px;
    margin:0px 18px 0px 20px;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
    filter: alpha(opacity=50);
    -moz-opacity: 0.7;
    -khtml-opacity: 0.7;
    opacity: 0.7;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
    position:relative;
    list-style:none;
    text-align:center;
    margin-top:-10px;
}
#service_slide .clientslide_carousel li img{border:0px;}
#service_slide .clientslide_carousel li:hover{
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    -khtml-opacity: 1;
    opacity: 1;
    cursor:pointer;
}
#service_slide .clientslide_carousel li:hover > .portplus, #service_slide .clientslide_carousel li:hover > .portpost, .portoverlay:hover > .portplus, .portoverlay:hover > .portpost{display:block;}
#service_slide .portplus{
    height:32px;
    width:32px;
    position:absolute;
    top:0px;
    left:50%;
    background-color:rgba(58,58,58,.5);
    margin:60px 0px 0px -32px;
    display:none;
    -webkit-transition: opacity 0.3s ease-in-out;
    -moz-transition: opacity 0.3s ease-in-out;
    -o-transition: opacity 0.3s ease-in-out;
    transition: opacity 0.3s ease-in-out;
}
#service_slide .portpost{
    height:32px;
    width:32px;
    position:absolute;
    top:0px;
    left:50%;
    margin:60px 0px 0px 0px;
    background-color:rgba(58,58,58,.5);
    display:none;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#service_slide .portplus img, #service_slide .portpost img{width:32px !important;height:32px !important;border:0px;}
#service_slide .clientslide_carousel li img{
    width: 202px;
    float:left;
    padding:0px;
    margin:0px;
    height:auto;
    display:block;
}
/* Responsive slide starts */






/* Toggle */
.togg { overflow:hidden; position:relative; }
.togg .tog {
    background:url(../images/accordion.png) no-repeat 7px 3px;
    text-decoration:none;
    display:block;
    padding:0 0 16px 38px;
    outline:0;
}
.togg .tog.current {background-position:7px -40px;}
.togg .tab_content {padding:0 0 16px 38px;}
.toggle_heading{
    font-size:18px;
    color:#969696;
    font-weight:500;
}
/* // Toggle */

/* Accordion */
.accordion { margin-bottom:18px; overflow:hidden; position:relative; }
.accordion .tog.button_large {
    display:block;
    padding-left:10px;
    margin-bottom:3px;
    padding-bottom:22px;
    padding-top:22px;
    background-color:#e8e8e8;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    behavior: url(pie.html);
    position:relative;	
    outline:0;
}
.accordion .tog.button_large span {
    background:url(../images/accordion.png) no-repeat 0 0;
    padding:0 0 0 30px;
}
.accordion .tog.button_large.current span {background-position:0 -43px;}
.accordion .tab_content {
    padding:15px 0px 0px 0px;
    overflow:hidden;
    position:relative;
}
.accordion_heading{ font-size:18px; color:#969696; font-weight:500; }
/* /Accordion */

/* Tab */
.tabs{ margin-bottom:0; list-style:none; margin-bottom:-2px; overflow:hidden; }
.tabs li {
    font-family: 'open sans', sans-serif;
    color:#323232; 
    float:left; display:block;  font-size:14px;
    margin-right:5px; height:40px;
    -moz-border-radius:5px 5px 0px 0px;
    -webkit-border-radius:5px 5px 0px 0px;
    border-radius:5px 5px 0px 0px;	
    behavior: url(pie.html);
    position:relative;
}
.tabs li a {
    height:45px; line-height:45px; padding:0px 23px; display:block; 
    font-size:18px;
    color:#969696;
    font-weight:500;
    text-decoration:none;
    background:none;
    -moz-border-radius:5px 5px 0px 0px;
    -webkit-border-radius:5px 5px 0px 0px;
    border-radius:5px 5px 0px 0px;
    behavior: url(pie.html);		
}
.tabs li a:hover, .tabs li a.current {
    padding:0px 22px;
    height:45px; line-height:43px; 
    position:relative;
    z-index:1;
    background-color:#e8e8e8;
    border:1px solid #ddd;
    outline:0;
}
.tab { margin-bottom:18px; overflow:hidden; position:relative; }
.tab_content { width:100%; }
.tabs_tab {
    background-color:#e8e8e8;
    border:1px solid #ddd;
    padding:20px;
    padding-bottom:0px;
    overflow:hidden;
    position:relative;
    border-radius:4px;
    -moz-border-radius:4px;
    -webkit-border-radius:4px;
    behavior: url(pie.html);
    position:relative;	
}
/* /Tab */

/**********************  // Short codes  ******************************/	

/******************************************** Features  *********************************/
.frame_left{ clear:both;}
.frame_right{ clear:both;}
.right_pull{ float:right; width:37%; padding-left:27px; padding-top:20px; padding-bottom:20px; }
.left_pull{ float:left; width:37%; padding-right:27px; padding-top:20px; padding-bottom:20px;}
.slide-pad1 { float:left;  padding:0px 25px 5px 0px; }
.slide-pad2 { float:right;  padding:0px 0px 5px 25px; width:27%;}
span.letter_caps {
    float:left;
    font-size:40px;
    font-weight:500;
    line-height:30px;
    margin-top:5px;
    padding:0 13px;
    color:#969696;
    text-transform:uppercase;
}	
span.letter_caps1 {
    color:#FFFFFF;
    font-size:32px;
    line-height:38px;
    font-weight:500;
    text-align:center;
    width:38px;
    float:left;
    margin:0 8px -5px;
    background-color:#afafaf;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    behavior: url(pie.html);
    position:relative;	
}

q, blockquote {
    font-family: 'Cookie', cursive;
    float:left;
    padding:0 0 0 35px;
    margin:0;
    position:relative;
    vertical-align:baseline;
}

q:before, blockquote:before {
    content:'\201C';
    font-size:100px;
    line-height:1em;
    display:block;
    padding:0;
    position:absolute;
    top:-15px;
    left:0;
}

q:after, blockquote:after { clear:both; }
blockquote p{ font-size:18px; color:#444444; line-height:25px; text-shadow: 0px 1px 1px #ffffff; font-weight:bold;}

/******************************************** // Features *********************************/	


/*home content*/
.box_list {
    height:auto;	
    margin:0 auto;
    float:left; 
    text-align:center;
}
.box_list h3{color:#737373; text-shadow:1px 1px 1px #ffffff;}
.home-icon {
    display: inline-block;
    font-size: 0px;
    cursor: pointer;
    margin: 15px 30px;
    width:115px;
    height:115px;
    border-radius: 80px;
    text-align: center;
    position: relative;
    z-index: 1;
}
.home-icon:after {
    pointer-events: none;
    position: absolute;
    width:115px;
    height:115px;
    border-radius: 80px;
    content: '';
    -webkit-box-sizing: content-box; 
    -moz-box-sizing: content-box; 
    box-sizing: content-box;
}
.home-icon i:before {
    font-family: 'FontAwesome';
    speak: none;
    font-size: 48px;
    line-height: 119px;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    display: block;
    -webkit-font-smoothing: antialiased;
}
/* Effect */
.home-icon-effect .home-icon {
    color: #9a9a9a;
    box-shadow: 0 0 0 3px rgba(241,241,241,0.8);	
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}
.home-icon-effect .home-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background-color:rgba(225,225,225,0.8);	
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 2 */
.home-icon-effect2 .home-icon {
    color: #9a9a9a;
    box-shadow: 0 0 0 3px rgba(241,241,241,0.8);	
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}
.home-icon-effect2 .home-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background-color:rgba(225,225,225,0.8);	
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s;
    -moz-transition: -moz-transform 0.2s, opacity 0.2s;
    transition: transform 0.2s, opacity 0.2s;
}

/* Effect 3 */
.home-icon-effect3 .home-icon {
    color: #fff;
    background-color:rgba(116,198,118,1);
    box-shadow: 0 0 0 3px rgba(241,241,241,0.8);	
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;


}
.home-icon-effect3 .home-icon:after {
    top: -2px;
    left: -2px;
    padding: 2px;
    z-index: -1;
    background-color:rgba(116,198,118,1);
    box-shadow: 0 0 0 3px rgba(241,241,241,0.8);	
    -webkit-transition: color 0.3s;
    -moz-transition: color 0.3s;
    transition: color 0.3s;
}

/* Effect 1 */
.no-touch .home-icon-effect1 .home-icon:hover:after {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    transform: scale(0);
    opacity: 0;
    -webkit-transition: -webkit-transform 0.4s, opacity 0.2s;
    -moz-transition: -moz-transform 0.4s, opacity 0.2s;
    transition: transform 0.4s, opacity 0.2s;
}

/*about content*/

.social-list-icon { 
    background-color:#e1e1e1; 
    width:30px; 
    height:30px; 
    border-radius:20px; 
    float:left; 
    margin:5px 12px 0px 0px; 
}
.social-list-icon { font-size:16px; line-height:30px; color:#9a9a9a; text-align:center; }
.social-list-icon:hover i{ color:#FFFFFF; }

/*contact*/

.contact_icon li{ 
    float:left; 
    margin-right:8px; 
    cursor:pointer;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity:0.7;
}
.contact_icon li:hover{  
    cursor:pointer;
    margin-top:-10px;
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all 0.5s ease;
    opacity:1;
}

.tab_content h2{ padding-top:0px; }
.accordion  h2{ padding-bottom:15px; }

.about-box h2{ padding:0px 0px 15px 0px; }
.about-box p{ padding-bottom:0px; text-align:left; margin-bottom:20px; }
.about-box .box-line{ margin:10px 0px 20px 0px; }
.service_right h2{ padding-top:0px; }
.service_box p{ text-align:center; }
.service_box h3{ color:#7c7c7c; }
.marleft55{ margin-left:55px; }
.martopless5{ margin-top:-5px; }

/*--------------------- Flating island-------------*/
.floating{
    float: left;
    -webkit-animation-name: Floatingx;
    -webkit-animation-duration: 6s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: ease-in-out;
    -moz-animation-name: Floating;
    -moz-animation-duration: 6s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;

}

@-webkit-keyframes Floatingx{
    from {-webkit-transform:translate(0, 0px);}
    65% {-webkit-transform:translate(15px, 0px);}
    to {-webkit-transform: translate(0, -0px);    }    
}

@-moz-keyframes Floating{
    from {-moz-transform:translate(0, 0px);}
    65% {-moz-transform:translate(px, 50px);}
    to {-moz-transform: translate(0, -0px);}    
}


#beeisland{
    filter: gray; /* IE5+ */
    -webkit-filter: grayscale(0.4); /* Webkit Nightlies & Chrome Canary */
    -webkit-transition: all .8s ease-in-out;  
}
#beeisland:hover{
    filter: none;
    -webkit-filter: grayscale(0);
    -webkit-transform: scale(1.01);
}

#social-Icon {
   margin: 10px;
}
#social-Icon a{
    font-size: 16px;
    padding: 2px;
    margin-bottom: 5px;
}