Souke/frontend/web/sass/screen.scss

/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */

//@import "compass/reset";
@import "compass" ;

$dir-img: '../img/' ;
$dir-fonts: '../fonts/' ;

$jaune: #fdd44b ;
$orange: darken(#FDB64B,20%) ;
$gris1: #e0e0e0 ;
$gris2: #e0e0e0 ;
$courant: #505050 ;
$color2: lighten($jaune,30%) ;
$color2: #fff2c7 ;
$color2: #fff6d5 ;
 
@import "_fonts.scss" ;

body {
	color: #505050 ;
	font-family: 'Arial' ;
	background-attachment: fixed ;
}

strong {
	font-weight: bold ;
}

a {
	color: $courant ;
	text-decoration: underline ;

	&:focus, &:active {
		outline-color: gray ;
		color: black ;		
	}
	
	&:hover {
		color: black ;
	}
	
	&.btn {
		text-decoration: none ;
	}
}

p {
	padding-bottom: 20px ;
	line-height: 21px ;
}

ul {
	padding-left: 20px ;
	list-style-type: disc ;
	margin-bottom: 10px ;
	
	li {
		padding-left: 5px ;
	}
}

.clr {
	clear: both ;
}

.btn {
	background-image: none ;
}

#main .alert {
	background-image: none; 	
        background-color: white ;
        border-bottom-width: 3px ;
}

.alert {
	&.alert-warning {
		a {
			color: #8a6d3b ;
			//text-decoration: none ;
			//font-weight: bold ;
		}
	}
}


#main {
	position: relative ;
	.inner {
		width: 960px ;
		margin: 0px auto ;
	}
}

#header {
	z-index: 100 ;
	//border-top: solid 4px $jaune ;
	border-bottom: solid 1px $gris1 ;	
	background-color: white ;
	height: 75px ;
	@include box-shadow(0px 0px 5px #ededed) ;
	@include box-shadow(0px 0px 5px #dcdcdc) ;
	//@include box-shadow(0px 0px 5px black) ;
	
	//position: fixed ;
	//width: 100% ;

	.container {
		padding-left: 0px ;
		position: relative ;
	}

        #link-home {
            position: relative ;
            top: 15px ;
            img {
                width: 37px ;
                
            }
        }
        
        nav {
            position: relative ;
            bottom: 25px ;
            ul {
                float: right ;
                li {
                    a {
                        text-decoration: none ;
                        
                        &.active {
                            background-color: #eee ;
                        }
                    }
                }
            }
        }
        
        #link-logout {
            .nom {
                font-size: 10px ;
                /*position: relative ;
                left: 20px ;
                top: -3px ;*/
            }
        }
}

#main {
	padding: 0px ;
}

.connected {
    #content {
        //padding-top: 15px ;
    }
}

#content {
        position: relative ;
	padding: 20px 0px ;
	padding-bottom: 0px ;
	padding-top: 15px ;
	min-height: 500px ;
	
	#description {
		img {
			width: 100% ;
		}
	}

	.item {
		position: relative ;
		min-height: 250px ;

		.container {
			padding: 20px ;
			position: relative ;
		}
		
		.separateur {
			width: 600px ;
			border-top: 1px solid #e0e0e0 ;
			margin: 0px auto ;
			padding-top: 20px ;
			margin-top: 20px ;
		}

		h2 {
			color: black ;
			padding-bottom: 50px ;
			font-size: 25px ;
			line-height: 35px ;
			font-family: 'myriadpro-regular' ;	
			text-transform: uppercase ;
			text-align: center ;
			position: relative ;
			margin-top: 30px ;
		}

		h3 {
			color: black ;
			font-family: "comfortaalight" ;
			font-size: 20px ;
			padding-bottom: 12px ;
		}

		.icon {
			position: absolute ;
		}

	}

}


#content #contact {
	
	.icon {
		width: 55px ;
		top: -15px ;
		margin-left: -70px ;
	}
	
	#par-telephone {
	}

	.form-control:focus {
		/*@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px $jaune) ;
		border-color: $jaune ;*/
	}
	
	.form-group {
		text-align: center ;
	}
	
	.img-right {
		float: right ;
		
		img {
			width: 300px ;
		}
	}
	
}

.form-control:focus {
		/*@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 8px $jaune) ;
		border-color: $jaune ;*/
}

#footer {
	
	height: 50px ;
	background-color: white ;
	text-align: center ;
	border-top: 1px solid #e0e0e0 ;
	
	padding-top: 30px ;
	padding-bottom: 60px ;
	
	position: relative ;
	
	a {
		color: #7e7e7e;
		text-transform: uppercase ;
		text-decoration: none ;
		
		&:hover {
			color: black ;
		}
	}
}

#content #mentions {
	padding-top: 20px ;

	div.content {
		width: 60% ;
		font-size: 90% ;
	}

	p {
		padding-bottom: 15px ;
	}

	h2 {
		color: black ;
		padding-bottom: 40px ;
		font-size: 25px ;
		line-height: 35px ;
		font-family: 'myriadpro-regular' ;	
	}
	
	h3 {
		font-family: "comfortaaregular" ;
		font-size: 18px ;
		padding-bottom: 12px ;
		margin-top: 10px ;
		color: black ;
	}
}

.mentions {
	
	#main, body {
		background-color: white ;
	}
}

.vegas-loading {
	display: none ;
}


#profil-user {

    .form-group.field-user-no_mail label  {
        font-weight: normal ;
    }
    
    .form-group label {
        cursor: pointer ;
    }

    #mails-jours-prod {
        .form-group {
            float: left ;
            margin-right: 15px ;
            label {
                font-weight: normal ;
            }
        }
    }
    
    p.strong {
        font-weight: bold ;
    }

}

/* signup */

#form-signup {
    #champs-boulanger {
        display: none ;
    }
}

@import "_systeme_commandes.scss" ;
@import "_responsive.scss" ;