/*
* Ciel V.1
* Copyright 2012, manuelvega
* DATE : 03/01/2013
* URL : http://themeforest.net/user/manuelvega
*/



/* Table of Contents
==================================================
  
  1. GENERAL STYLES
  2. HEADER & NAV
  3. ABOUT
  4. PORTFOLIO
  5. BLOG
  6. CONTACT
  7. ALTERNATIVE NAV BAR
  8. SWITCHER
  9. MEDIA QUERYS


/* 1 - GENERAL STYLES 
================================================== */


body {}
a {color: #fff; text-decoration: none;}
::selection {color:#fff; background-color: #212121;}
.clear {clear: both;}
p {font-family: 'Arial'; font-size:12px; color: #959595;}
h2 {font-size:60px; font-weight: bold; color: #393939;}
h3 {font-size:35px; font-weight: bold;}
h4 {font-size:30px; color: #fff;}
h5 {font-size:20px; font-weight: bold; color: #fff;}


/* 2 - HEADER & NAV 
================================================== */


.main_wrapper {background:url(/img/1936.jpg) no-repeat; padding: 30px 0;}
.main_wrapper2 {background:url(/img/header_bg2.jpg); padding: 30px 0;}
.main_nav {float:right; background-color: #1d1d1d; border-radius:3px; margin: 40px 0;}
.main_nav ul {margin: 10px 20px;}
.main_nav ul li {display: inline;}
.main_nav ul li a {font-weight:bold; font-size:15px; color: #fff; padding-right: 25px;}
.main_nav ul li.active a {color: #d9e37e;}
h3.welcome_h {font-size:50px; font-weight: bold; color: #fff;}
#welcome_text {text-align: center; padding: 180px 0 220px 0;}
/*#welcome_text {text-align: center; padding: 70px 0;}*/
#welcome_text h3 {color: #fff;}
#welcome_text h3 img {margin-top: -15px;}
#welcome_text h4 span {color: #d9e37e;}
.circle_button {border-radius:100px; background-color: #d9e37e; width: 80px; height: 80px; box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1), 0 0 0 6px rgba(255, 255, 255, 0.3),0 1px 2px rgba(0, 0, 0, 0.1); 
cursor: pointer; margin-bottom: 100px; }
.circle_button:hover {box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.1), 0 0 0 10px rgba(255, 255, 255, 0.3),0 1px 2px rgba(0, 0, 0, 0.1); background-color: #e8ff4b;}
.circle_button img {position:relative; top:28px; left:29px;}
.second_text {text-align: center; margin-bottom: 50px;}
.header_social {position:absolute;right:0;top:50%;}
.tooltip{position:absolute;z-index:1030;display:block;visibility:visible;padding:5px;font-size:12px; font-weight:bold;opacity:0;filter:alpha(opacity=0);}.tooltip.in{opacity:0.8;filter:alpha(opacity=80);}
.tooltip.left{margin-left:-20px; margin-top: 10px;}
.tooltip-inner {max-width:200px;padding:3px 8px;color:#000;text-align:center;text-decoration:none;background-color:#f2ff8a;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;
padding: 12px 25px;}
.tooltip-arrow{position:absolute;width:0;height:0;border-color:transparent;border-style:solid;}
.tooltip.top .tooltip-arrow{bottom:0;left:50%;margin-left:-5px;border-width:5px 5px 0;border-top-color:#f2ff8a;}
.tooltip.right .tooltip-arrow{top:50%;left:0;margin-top:-5px;border-width:5px 5px 5px 0;border-right-color:#f2ff8a;}
.tooltip.left .tooltip-arrow{top:50%;right:0;margin-top:-5px;border-width:5px 0 5px 5px;border-left-color:#f2ff8a;}
.tooltip.bottom .tooltip-arrow{top:0;left:50%;margin-left:-5px;border-width:0 5px 5px;border-bottom-color:#f2ff8a;}
.back ul {float:right; margin-top: 45px;}
.back ul li a {color: #7b7b7b;font-weight: bold;}
.back ul li.active a { color:#fff; border-radius: 5px; -moz-border-radius:5px; -webkit-border-radius:5px;background-color:#212121; padding: 10px 20px;}


#welcome_text div.connexionbox {
    background-image: url("/img/fond-connexion.png");
    background-repeat: no-repeat;
    height: 246px;
    margin: 0 auto;
	padding-top: 30px;
    width: 527px;
}
#welcome_text div.connexionbox table {
    color: White;
    font-size: 12px;
    margin-top: 0px;
	margin-left: 140px;
}
#welcome_text div.connexionbox table td {
	text-align: left;
}

#welcome_text div.connexionbox #linkFiledge {
	display: block;
	position: absolute;
	width: 90px;
	height: 20px;
	margin-top: -30px;
}

/* 3 - ABOUT US
================================================== */


.about_services {float:right;}
#about_us {margin:200px 0 50px 0;}
#about_us h2 {text-align: center; letter-spacing: -2px; margin-bottom: 30px;}
#about_us h3, .meet_our_team h3 {text-align: center; margin-bottom: 30px;}
#about_us h3 span, .meet_our_team h3 span , #portfolio h3 span, #blog h3 span {background-color: #d9e37e; color: #fff; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; padding: 3px 10px;}
#about_us > h5 {color: #000; text-align: center; margin: 0 0 8px 0;}
#about_us p {margin-bottom: 30px;}
.service h5 {color: #393939;}
.service .image {background:url(/img/about/icons/service1.png) no-repeat;float:right; height: 100px; width: 50px; margin-top: -15px; cursor: pointer;}
.service .image2 {background:url(/img/about/icons/service2.png) no-repeat;float:right; height: 100px; width: 50px; margin-top: -15px;}
.service .image3 {background:url(/img/about/icons/service3.png) no-repeat;float:right; height: 100px; width: 50px; margin-top: -15px;}
.service .image4 {background:url(/img/about/icons/service4.png) no-repeat;float:right; height: 100px; width: 50px; margin-top: -15px;}
.push_down {margin-top: 50px;}
.meet_our_team {margin-bottom: 200px;}
.meet_our_team h3 {margin-bottom: 50px; font-size: 26px;}
.teammate {text-align: center;}
.teammate h3 {margin:10px 0 14px 0; font-size: 26px;}
.teammate h5 {font-size: 15px; color: #393939; font-weight: normal; margin:0 0 20px 0;}
.teammate p {width: 200px; margin-left: 40px; text-align: left; }
.teammate ul {margin:20px 0 0 10px;}
.teammate ul li {display: inline; margin-left: 0;}
.teammate ul li:hover {opacity:0.5;}


/* 4 - PORTFOLIO
================================================== */


#portfolio h2 {text-align: center; letter-spacing: -2px; margin-bottom: 30px;}
#portfolio h3 {text-align: center;}
.picture {position: relative;}
.picture img {width: 100%; height: auto;}
.image-overlay-link,.image-overlay-zoom {height:100%;width: 100%;left: 0;top:-2px;position: absolute;z-index: 40;display: none;background-color: #222;background: rgba(0, 0, 0, 0.7);background-repeat: no-repeat;background-position: 50%;cursor: pointer;overflow:hidden;}
.image-overlay-link {background-image: url(/img/overlay-icon-01.png);}
.pfolio {margin-left: 0;}
.pfolio_item img {width: 100%}
.option-set { list-style: none;margin:30px 0; text-align: center; border-top:1px solid #e4e4e4; border-bottom:1px solid #e4e4e4; padding: 20px 0;}
.option-set li { display:inline; }
.option-set li a, .option-set li a.selected {font-family:'Arial'; font-weight: bold; color:#212121; margin-right: 20px; padding: 5px 8px;border-radius: 5px; -webkit-border-radius:2px; -moz-border-radius:2px;}
.option-set li a.selected { background-color: #d9e37e;color:#fff; padding: 10px 8px;}
.active .button {}
.pfolio_item {margin-bottom: 15px;}
.pfolio_desc {text-align: center; background-color: #f5f5f5; padding: 10px 0; margin: 0; display: block;
-webkit-box-shadow: 2px 2px 0px rgba(50, 50, 50, 0.10);
-moz-box-shadow:    2px 2px 0px rgba(50, 50, 50, 0.10);
box-shadow:         2px 2px 0px rgba(50, 50, 50, 0.10);
margin-bottom: 30px;
}
.pfolio_desc h4 {color: #393939; font-size:20px; font-weight: bold; margin: 0; padding-top: 10px;}
.pfolio_desc p {line-height: 20px; font-style: italic; font-size:12px; color: #909090;}
#portfolio_container {margin-bottom: 200px;}
.pfolio_buttons {margin-bottom: 200px;}
.pfolio_item .first {margin-left: 510px;}
.isotope-item {z-index: 2;}
.isotope-hidden.isotope-item {pointer-events: none;z-index: 1;}

/**** Isotope CSS3 transitions ****/

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

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

.isotope .isotope-item {
  -webkit-transition-property: -webkit-transform, opacity;
     -moz-transition-property:    -moz-transform, opacity;
      -ms-transition-property:     -ms-transform, opacity;
       -o-transition-property:         top, left, opacity;
          transition-property:         transform, opacity;
}

/**** disabling Isotope CSS3 transitions ****/

.isotope.no-transition,
.isotope.no-transition .isotope-item,
.isotope .isotope-item.no-transition {
  -webkit-transition-duration: 0s;
     -moz-transition-duration: 0s;
      -ms-transition-duration: 0s;
       -o-transition-duration: 0s;
          transition-duration: 0s;
}


/* 5 - BLOG
================================================== */


#blog {margin-bottom: 200px;}
#blog h2 {text-align: center; margin-bottom: 30px;}
#blog h3 {text-align: center; margin-bottom: 50px;}
.blog_single .date {background-color: #262626; width: 200px;}
.blog_single .date p {color: #eaeaea; margin: 0; padding: 5px 10px; font-weight: bold;}
.blog_desc {border:1px solid #dedede;
-webkit-box-shadow: -1px -1px 10px rgba(50, 50, 50, 0.15);
-moz-box-shadow:    -1px -1px 10px rgba(50, 50, 50, 0.15);
box-shadow:         -1px -1px 10px rgba(50, 50, 50, 0.15);}
.blog_desc {text-align:center;}
.blog_desc .icon {text-align: center; margin:-30px 0 20px 0;}
.blog_desc .heading h5 {color: #393939; margin: 0;}
.blog_desc .heading p {color: #979797; margin-bottom: 20px;}
.blog_desc .heading a {color: #212121;}
.blog_desc .text p {padding: 0 15px;}
.blog_desc .text a {color: #2f2f2f; font-size: 13px; font-weight: bold;}
.blog_desc .text div {margin-bottom: 50px;}
.carousel-tabs { clear: both; }
.carousel-active-tab { color: red; }  
.carousel-disabled,
.mr-rotato-disabled { color: #aaa; }
.slidewrap .carousel-tabs {padding: 0;margin: 1em 0;clear: both;}
.slidewrap .carousel-tabs li {display: inline-block; padding: 0 2px;float:left;margin: 10px 0;}
.slidewrap .carousel-tabs a {background: #d9e37e;display: inline-block;height: 15px;text-indent: -9999px;width: 20px;outline: none;}
.ie .slidewrap .carousel-tabs li,
.ie .slidewrap .carousel-tabs a {display: block;float: left;}
.slidewrap .carousel-tabs .carousel-active-tab a {background: #212121;}
.bpost {border-bottom:1px dotted #999; margin-bottom: 50px;}
.bpost_content h5 {margin-top: 20px; margin-bottom: 0; color: #212121;}
.bpost img {border:5px solid #eee;}
.star-icon img {border: none; float: left; margin:20px 20px 0 0;}
.bpost_nav ul {margin-top:50px; margin-left: 0;}
.bpost_nav ul li {display: inline; margin-right: 10px; background-color: #f4f4f4; padding: 5px 10px;-webkit-box-shadow: 1px 1px 1px 1px rgba(00, 000, 000, 0.1);
box-shadow: 1px 1px 1px 1px rgba(00, 000, 000, 0.1); cursor:pointer; font-size:11px;}
.bpost_nav ul li a {color: #666666;}
p.question {margin: 50px 0;}
.bpost_content_meta {margin-top: 5px;}
.bpost_content_meta ul li {display:inline; margin-right: 20px; font-size:11px; color: #666666;}
.bpost_content_meta img {border:none; margin-right: 10px;}
.bpost_text {margin:20px 0;}
.bpost_text a {font-size:12px;}
.leave_comment h4 {margin:-30px 0 30px 0;}
.simple_comment {border-bottom:1px solid #ddd; padding-bottom: 10px; margin-top: 30px;}
.simple_comment img {float:left; margin-right: 15px; margin-bottom: 10px;}
.simple_comment h4 {float:left; margin:0 15px 0 0;}
.comment_meta {margin-bottom: 10px;}
.comment_meta p {float:left; margin-right: 15px;}
.simple_comment.indent {margin-left: 100px;}
.cf_input_container {margin-top: 50px;}
.cf_input_container h5 {margin-bottom: 30px;}
.comment_meta a {font-size:11px; color: #212121;}
.sidebar_categories, .sidebar_text, .sidebar_ppost {margin-left: 20px; margin-bottom: 50px;}
.sidebar_categories h5, .sidebar_text h5, .sidebar_ppost h5 {color: #212121;}
.sidebar_categories ul {margin-left: 0;}
.sidebar_categories ul li {border-bottom:1px dotted #999; padding:5px 0;}
.sidebar_categories ul li a {color: #666666; transition:color 0.1s ease-in-out;-moz-transition:color 0.1s ease-in-out;-webkit-transition:color 0.1s ease-in-out;}
input.ip_text {font-size:11px; color: #9f9f9f; font-style: italic; font-family: 'Arial';}
ul.rpost {margin-left: 0;}
ul.rpost li {float:left; padding-right:10px; margin-bottom: 10px;}
ul.rpost li a:hover {opacity:0.8;}
.bpost_content_meta ul {margin: 10px 0 0 0;}
.blog_post_container h5 {color: #212121;}
.share_icons {margin:20px 0;}
textarea.message {width: 700px;}


/* 6 - CONTACT
================================================== */


#contact {background: url(/img/1936.jpg) no-repeat; padding-top: 50px;}
#contact h2 {text-align: center; color: #fff; margin:50px 0;}
#contact p {color: #dddada; padding: 30px 0;}
.social ul {margin-left: 0; margin-bottom:50px;}
.social ul li {display: inline; margin-right: 10px;}
.main_form input {padding: 18px 150px 18px 10px; font-size:20px; font-weight: bold; color: #242424; margin-bottom: 13px;}
.main_form {float: left;}
.textarea textarea {width: 750px;}
.textarea textarea.message {font-size:20px; font-weight: bold; color: #242424; padding: 20px 0 0 15px;}
input#submit {background-color: #141414; border:none; border-radius:3px; padding: 15px 100px; color: #fff; font-weight: bold; margin-top: 10px; text-transform: uppercase; font-size:20px; margin-bottom: 30px;}
#contact .divider {padding-bottom: 100px;}
.subfooter_container {background-color: #141414;}
.subfooter_container p {font-size:11px; color: #a0a0a0; padding: 20px 0 10px 0;}
.subfooter_container a {color: #e8ff28;}
.sf_top {border-top:6px solid #000000; border-bottom:1px solid #232323;}

.social ul li {
	display: inline-block;
	color: #fff;
	margin-right: 20px;
}
.social ul li a {
	color: #ddd;
	font-weight: bold;
}
.social ul li img {
	vertical-align: bottom;
}


/* 7. ALTERNATIVE NAV
================================================== */


#sn_container {position: relative;height: 40px;margin: 0 auto; background-color: #212121; width: 980px;}
#sn_container img {background-color:#d9e37e; float:left;}
.sticky_nav {z-index: 9999999;position: fixed;top: 0;right: 0;left: 0;}
.novisible {margin-top: -50px;}
.sticky_nav ul {float:right; margin-top: 10px; margin-right: 10px;}
.sticky_nav ul li {display: inline; padding-right:10px; font-size:10px; font-weight: bold; text-transform: uppercase;}
.sticky_nav ul li:first-child {position: absolute; left:0; top:0; border:none;}
.sticky_nav ul li a {color: #fff;}
.sticky_nav ul li a:hover {color: #d9e37e;}


/* 8. SWITCHER
================================================== */

/* desactivé */
/*.switch_out {display: none;}*/


#switch {float:left;display:block;background:#fff;-moz-border-radius:0 10px 10px 0;-webkit-border-radius:0 10px 10px 0;border-radius:0 10px 10px 0;position:absolute;left:0;top:20%;padding:15px 20px 15px 10px;}
#switch h4 {font-size:12px; color:#000; font-family:'Arial'; margin-bottom: 0px;}
#switch ul li {font-size:12px; font-family: 'Arial'; margin-left: -20px; margin-bottom: 0px;}
#switch ul li a {color:#4d4d4d;}
#show {position:absolute;left:0;top:20%;background:#fff;-moz-border-radius:0 10px 10px 0;-webkit-border-radius:0 10px 10px 0;border-radius:0 10px 10px 0;margin-top:10px;behavior:url(PIE.html);
padding:15px 20px 5px 10px; color: #000;}
#show h4, #hide, #loginLeft {cursor:pointer;color: #000; font-size:12px; font-family: Arial; margin: 0;}
#show h4 span,#hide span {font-weight:400;display:block;clear:both;}
#switch p {color: #212121; font-weight: bold; margin-left: -20px; text-transform: uppercase;}

#loginLeft {
	line-height: 14px;
	text-align: center;
}
#show div.inpBox {
	font-size: 11px;
	padding-bottom: 5px;
}
#show div.inpBox input {
	margin: 0;
}
#show h4 {
	font-weight: bold;
}
#show .noteBot {
	text-align: right;
	font-size: 10px;
	font-style: italic;
	color: #666;
	padding: 10px 0 3px 0;
}
#show .noteBot a {
	text-align: right;
	font-size: 10px;
	color: #666;
}


/* 9. MODAL BOX DATA
================================================== */

.serviceModalBox {
	width: 850px;
	margin-left: -425px;
	font-size: 12px;
	line-height: 14px;	
}
.serviceModalBox .close {
	opacity: 0.7;
}
.serviceModalBox .modal-body {
	background-color: #d5d2cd;
	border: 8px solid #fff;
	padding-top: 7px;
}
.serviceModalBox .modal-body h1 {
	font-size: 20px;
	line-height: 20px;
	color: #000;
	font-weight: bold;
	margin: 0 0 12px 0;
	padding: 0;
}
.serviceModalBox .modal-body h2 {
	font-size: 12px;
	line-height: 12px;
	color: #000;
	font-weight: bold;
	margin: 0;
	padding: 0 0 5px 0px;
}
.serviceModalBox .modal-body p {
	color: #000;
}
.serviceModalBox .modal-body ul {
	margin-left: 20px;
	list-style-type: disc;
}
.serviceModalBox .modal-body ol {
	margin-left: 20px;
	list-style-type: decimal;
}
.serviceModalBox .modal-body ol li {
	padding-bottom: 4px;
	line-height: 14px;
}
.serviceModalBox .modal-body ul li {
	padding-bottom: 2px;
	line-height: 14px;
}
.serviceModalBox .modal-body div.col {
	float: left;
	width: 380px;
	padding-top: 12px;
	padding-right: 20px;
}
.serviceModalBox .modal-body div.rosebox {
	background-color: #ce345a;
	color: #fff;
	/*font-style: italic;*/
	padding: 10px;
}
.serviceModalBox .modal-body div.vertbox {
	background-color: #76923c;
	color: #fff;
	/*font-style: italic;*/
	padding: 10px;
}
.serviceModalBox .modal-body div.bleubox {
	background-color: #548dd4;
	color: #fff;
	/*font-style: italic;*/
	padding: 10px;
}



/* #Tablet (Portrait)
================================================== */

    /* Note: Design for a width of 768px */

@media only screen and (min-width: 768px) and (max-width: 959px) {

.sticky_nav ul {margin-right: 200px;}
.blog_desc .text p {padding: 0 20px;}
.blog_desc .heading h5 {padding: 0 20px;}
.textarea textarea {position: relative; left:-20px;}
.about_mockup {display: none;}
.teammate p {margin-left:-20px;}
.bpost_content_meta ul li {margin-right: 10px;}
.sidebar_ppost {display: none;}
.switch_out {display: none;}

}


/*  #Mobile (Portrait)
================================================== */

    /* Note: Design for a width of 320px */

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

#about_us, #portfolio, #blog, #contact {padding:0 20px;}
.sticky_nav ul {margin-right: 320px;}
.header_social {display:none;}
.about_mockup {text-align: center;}
.service .image, .service .image2, .service .image3, .service .image4 {display:none;}
.teammate p {width: 100%; margin-left: 0;}
.teammate ul {margin-bottom: 50px;}
.blog_single .image img {width: 100%;}
.blog_single {margin-bottom: 50px;}
.textarea textarea {width: 500px;}
.sidebar, .sidebar_categories , .sidebar_text , .sidebar_ppost {display: none;}
.contact_info {margin-bottom: 50px;}
.switch_out {display: none;}
a.linkModalService1 { display: none; }
a.linkModalService2 { display: none; }
a.linkModalService3 { display: none; }
}


/* #Mobile (Landscape)
================================================== */

    /* Note: Design for a width of 480px */

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

body {text-align: center;}
nav.main_nav {line-height: 30px;}
.sticky_nav ul {float:left; margin-left: 100px;}
#about_us h3 span, .meet_our_team h3 span, #portfolio h3 span, #blog h3 span { color: #2d2d2d; background-color: #FFF;}
.welcome_h {margin-bottom: 100px;}
h4 {line-height: 30px;}
.circle_button img {left:0}
ul#filters {line-height: 50px;}
.meet_our_team {padding: 0 20px;}
.textarea textarea {width: 250px;}
.main_form input {width: 100px;}
input#submit {width: 250px;padding: 10px 40px;}
.simple_comment.indent {margin-left: 10px;}
.simple_comment.indent p {margin-right: 50px;}
.comment_meta p {}
.simple_comment img {margin-bottom: 150px;}
.simple_comment p {text-align: left; margin-right: 50px;}
.comment_meta h4 {}
.simple_comment .date {position: relative; margin-left: 85px;}
a.linkModalService1 { display: none; }
a.linkModalService2 { display: none; }
a.linkModalService3 { display: none; }
}