/* cmsms stylesheet: Technico Caffe modified: 25/11/2016 09:42:16 */
body{
	color: #fff;
	background-color: #1c150f;
	font-family: 'Open Sans', sans-serif;
}
.contenu{
	background-image: url("https://technicocaffe.com/uploads/images/fond.jpg");
	background-repeat: no-repeat;
        background-position: top center;
}
/******************************************************************************************************
DIVERS
*******************************************************************************************************/

.clear{
	clear: both;
}
.gras{
	font-weight: bold;
}
.or{
	color: #b1873b;
}
.separation{
	margin-bottom: 15px;
}
.centpourcent{
	width: 100%;
}

/******************************************************************************************************
GABARITS
*******************************************************************************************************/

/***************** HEADER */

header#accueil{
	background-image: url("https://technicocaffe.com/uploads/images/bg_header.jpg");
	background-repeat: no-repeat;
	background-color: #fff;
}
header nav{
}
.logo {
    margin-bottom: 25px;
    margin-top: 55px;
    text-align: center;
}

/***************** MENU*/
#menuprincipal{
	background-color: #12100d;
    border-bottom: 2px solid #ba8e3e;
    position: fixed;
    width: 100%;
    z-index: 4000;
}
.navbar{
	min-height: unset;
}
.navbar ul{
	margin: 0;
}
.navbar-collapse{
}
.navbar-inverse{
	background: none;
	border: none;
	margin: 0;
}
.navbar-inverse .navbar-nav > li  {
	margin-right: 70px;
}
.navbar-inverse .navbar-nav > li:last-child  {
	margin-right: 0px;
}
.navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
	background: none;
}
.navbar-inverse .navbar-nav > li > a {
	padding: 10px;
	color: #fff;
	font-size: 18px;
	transition: all 400ms ease 0s;
	text-transform: uppercase;
	font-weight: 400;
}
.navbar-inverse .navbar-nav > li > a:hover {
	color: #ba8e3e;
}
.navbar-inverse .navbar-nav > li.active > a {
	color: #fd7306;
}
.navbar-collapse.collapse{
	
}

/***************** A PROPOS */

#apropos{
	margin-top: 20px;
}
#apropos  article header{
	background-image: url("https://technicocaffe.com/uploads/images/tasse-cafe.png");
    background-position: left top;
    background-repeat: no-repeat;
    padding-left: 90px;
    padding-top: 20px;
}
#apropos  article header h2{
	font-size: 22px;
	text-transform: uppercase;
}
#apropos  article header p{
	font-size: 14px;
	font-style: italic;
}
#apropos section p{
	padding-left: 30px;
    padding-right: 30px;
    text-align: justify;
}
#apropos a{
    color:#b1873b;
}
div#carousel-apropos{
	margin-top: 35px;
}

/***************** SERVICES */

#services  header{
	background-image: url("https://technicocaffe.com/uploads/images/services-cafe.png");
    background-position: left 5px;
    background-repeat: no-repeat;
    padding-left: 60px;
}
#services  header h2{
	font-size: 22px;
	text-transform: uppercase;
}
#services  header p{
	font-size: 14px;
	font-style: italic;
}

/***************** CONTACT */

#contact  header{
	background-image: url("https://technicocaffe.com/uploads/images/contact-technico-caffe.png");
    background-position: left 5px;
    background-repeat: no-repeat;
    padding-bottom: 10px;
    padding-left: 70px;
}
#contact  header h2{
	font-size: 22px;
	text-transform: uppercase;
}
#contact  header p{
	font-size: 14px;
	font-style: italic;
}
#contact .formulaire_contact p{
	text-align: justify;
	margin-bottom: 20px;
}
#contact .formulaire_contact textarea{
	width: 100%;
	color: #000;
	text-align: left;
	padding: 5px;
margin-top: 25px;
       border-none;
box-shadow: 2px 2px 5px #000;
}
#contact .formulaire_contact input{
	border: medium none;
    border-radius: 0;
    box-shadow: 2px 2px 5px #000;
    color: #000;
    margin-top: 25px;
    padding: 8px;
    text-align: left;
    width: 100%;
}
#contact .formulaire_contact input.cms_submit{
	width: 100%;
	border-radius: 0px;
	text-transform: uppercase;
	color: #fff;
	background-color: #b1873b;
	border: none;
	transition: all 400ms ease 0s;
	padding: 10px;
        text-align:center;
        font-weight: bold;
}
#contact .formulaire_contact input.cms_submit:hover{
	background-color: #503d1b;
	color: #fff;
}
aside.coordonnees{
	text-align: center;
}
aside.coordonnees div.info_contact{
	background-color: #fff;
    border-radius: 10px;
    margin: 5px auto 20px;
    padding: 5px;
    width: 50%;
}
aside.coordonnees div.info_contact a{
	color: #19130e;
}
aside.coordonnees div.info_contact p.numtel{
	font-weight: bold;
	font-size: 18px;
	margin-bottom: 0px;
}
aside.coordonnees div.info_contact p.numtel a:hover{
	text-decoration: none;
}
aside.coordonnees div.info_contact p.email{
	font-style: italic;
	font-weight: bold;
}

/***************** FOOTER */

footer{
	height: 8px;
	background-color: #b1873b;
	margin-top: 30px;
}
footer a{
}
footer p.designby{
}


/******************************************************************************************************
MODULES / EFFETS / SCRIPTS
*******************************************************************************************************/

/***************** EFFET FADE */

.fade
{
	opacity: 1;
	transition: opacity .25s ease-in-out;
	-moz-transition: opacity .25s ease-in-out;
	-webkit-transition: opacity .25s ease-in-out;
}
.fade:hover
{
	opacity: 0.5;
}

/***************** FADE SUR CAROUSEL BOOSTRAP */

.carousel-fade .carousel-inner .item {
  opacity: 0;
  -webkit-transition-property: opacity;
  -moz-transition-property: opacity;
  -o-transition-property: opacity;
  transition-property: opacity;
}
.carousel-fade .carousel-inner .active {
  opacity: 1;
}
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
  left: 0;
  opacity: 0;
  z-index: 1;
}
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
  opacity: 1;
}
.carousel-fade .carousel-control {
  z-index: 2;
}

/***************** GOOGLE & VIDEO RESPONSIVE */

.Flexible-container {
    height: 0;
    overflow: hidden;
    padding-bottom: 71px;
    padding-top: 159px;
    position: relative;
}

.Flexible-container iframe,   
.Flexible-container object,  
.Flexible-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/******************************************************************************************************
TABLETS / SMARTPHONES
*******************************************************************************************************/

@media (max-width: 1200px){
section#services .col-md-3 img{
    width: 100%;
}
.separation img{
    width: 100%;
}
aside.coordonnees div.info_contact p.numtel{
 font-size: 15px;
}
}
@media (max-width: 990px){
aside.coordonnees{
    margin-top: 30px;
}
.logo img{
     width: 100%;
}
}
@media (max-width: 767px) {
.navbar-inverse .navbar-nav > li{
    border-bottom: 1px dotted #fff;
    text-align: center;
    margin: 0px;
    padding: 10px;
}
.navbar-inverse .navbar-nav > li:last-child{
    border-bottom: none;
}
.navbar-inverse .navbar-nav > li:hover{
    background-color: #b1873b;
}
.navbar-inverse .navbar-nav > li:hover a{
    color: #fff;
}
}
@media (max-width: 660px){
aside.coordonnees img{
    width: 100%;
}
aside.coordonnees .designby img{
    width: initial;
}
aside.coordonnees div.info_contact{
    width: 100%;
}
#apropos section p{
  padding: 5px;
}
}
@media (max-width: 510px) {
}
@media (max-width: 500px) {
}