/*

Bello Esclusiva Site Revamp v1
Designed & Coded By: Gavin McCleland | The Mad Dotta
Copyright © 2012

/*

/* @group Reset */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	margin: 0;
	outline: 0;
	padding: 0;
}

body {
	line-height: 1;
	font-size: .63em;
}

ol, ul {
	list-style: none;
}

caption, th, td {
	font-weight: normal;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

a {
	text-decoration: none;
	color: #555e67;
}

:focus {
	outline: 0;
}

.clear {
	clear: both;
}

/* @end */

/* @group @font-face */

@font-face {
    font-family: 'OpenSans';
    src: url('fonts/opensans-regular.eot');
    src: url('fonts/opensans-regular.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans-regular.woff') format('woff'),
         url('fonts/opensans-regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Semibold';
    src: url('fonts/opensans-semibold.eot');
    src: url('fonts/opensans-semibold.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans-semibold.woff') format('woff'),
         url('fonts/opensans-semibold.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Italic';
    src: url('fonts/opensans-italic.eot');
    src: url('fonts/opensans-italic.eot?#iefix') format('embedded-opentype'),
         url('fonts/opensans-italic.woff') format('woff'),
         url('fonts/opensans-italic.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

/* @end */

/* @group General */

body {
	margin: 0;
	background: #efefef;
	color: #939598;
	font: 13px 'OpenSans';
	line-height: 18px;
}

.wrapper {
	width: 900px;
	padding: 0 30px;
	margin: 0 auto;
}

.logo {
	width: 152px;
	height: 83px;
	background: url(img/logotm.png);
	float: left;
	margin-top: 17px;
}

h1 {
	color: #555e67;
	font: 23px 'Semibold';
	text-shadow: 1px 1px 1px #fff;
}

h2 {
	color: #565f67;
	font: 18px 'Semibold';
	text-shadow: 1px 1px 1px #fff;
}

h4 {
	font: 16px 'Semibold';
	color: #f5b868;
	text-shadow: 1px 1px 0px #fff;
	margin-bottom: 5px;
}

h5 {
	color: #565f67;
	font: 14px 'OpenSans';
	text-shadow: 1px 1px 1px #fff;
	margin-top: 5px;
}

.introduction {
	width: 500px;
}

.introduction.long {
	width: 630px;
}

/* @end */

/* @group Header */

#header {
	height: 120px;
	border-bottom: 1px solid #aeb7bf;
}

#nav {
	float: right;
	margin-top: 50px;
}

#nav li {
	float: left;
	margin-left: 40px;
	text-shadow: 1px 1px 0px #fff; 
}
#nav li a {
	font: 12px'Semibold';
	color: #555e67;
	-webkit-transition:color 0.1s ease-in;
    -moz-transition:color  0.1s ease-in;
    -o-transition:color  0.1s ease-in;
    transition:color  0.1s ease-in;
}

#nav li a:hover {
	color: #f5b868;
}

/* @end */

/* @group Slider */

#slider {
	margin: 0;
	background: url(img/bg-slider.png) left top repeat-x;
	padding-bottom: 5px;
}

.slides_container {
	height: 281px;
}

#slider-nav {
	width: 73px;
	margin: 10px auto;
	height: 12px;
}

#slider-nav li{
	float: left;
	margin: 0 3px;
	cursor: pointer;
	display: block;
	background: url(img/slider-nav.png) left top no-repeat;
}

#slider-nav li a{
	width: 12px;
	height: 12px;
	display: block;
}

#slider-nav li.current{
	background: url(img/slider-nav.png) right top no-repeat;
}

#slider .panel {
	height: 280px;
	width: 900px;
}

.content {
	width: 330px;
	margin-left: 535px;
}

#slider h1 {
	color: #555e67;
	font: 20px 'OpenSans';
	text-shadow: 1px 1px 0px #fff;
	font-weight: normal;
	padding: 45px 0 10px 0;
}

#slider p {
	color: #939598;
}

.btn-slider a{
	width: 170px;
	height: 43px;
	background: url(img/btn-slider.png) left top no-repeat;
	display: block;
	text-indent: -9999px;
	margin-top: 25px;
}

.btn-slider a:hover{
	background: url(img/btn-sliderhover.png) left top no-repeat;
}

/* @end */

/* @group Promo Bar */

.promobar {
	width: 540px;
	height: 67px;
	background: url(img/bg-promobar.png) center top no-repeat;
	margin: 30px auto;
	clear: both;
	padding: 25px 180px 0 180px;
}

.promobar a {
	width: 143px;
	height: 35px;
	display: block;
	text-indent: -9999px;
	float: left;
	margin-top: 3px;
	margin-right: 60px;
}

.promobar h2 {
	float: left;
}

.promobar p {
	color: #7a7a7a;
	font: 12px 'OpenSans';
	float: left;
}


#right a {
	float: right;
	margin: 3px 0 0 0;
}

.divider {
	width: 100%;
	height: 2px;
	background: url(img/divider.png) center top no-repeat;
	margin: 40px auto;
	clear: both;
}

#btn-apply { background: url(img/btn-apply.png) left top no-repeat; }
#btn-apply:hover{ background: url(img/btn-apply.png) left bottom no-repeat; }
#btn-contact { background: url(img/btn-getintouch.png) left top no-repeat; }
#btn-contact:hover{ background: url(img/btn-getintouch.png) left bottom no-repeat; }
#btn-findout { background: url(img/btn-findoutmore.png) left top no-repeat; }
#btn-findout:hover{ background: url(img/btn-findoutmore.png) left bottom no-repeat; }

.column a {
	width: 114px;
	height: 29px;
	display: block;
	text-indent: -9999px;
	margin-top: 15px;
}
#btn-readmore { background: url(img/btn-readmore.png) left top no-repeat; }
#btn-readmore:hover{ background: url(img/btn-readmore.png) left bottom no-repeat; }





/* @end */

/* @group Page Header */

#pageheader {
	background: #c9d0d6 url(img/bg-pageheader.jpg) left top repeat;
	height: 210px;
	border-bottom: 1px solid #b9bdc1;
	vertical-align: middle;
	margin-bottom: 40px;
}

#ph-services {
	background: url(img/header-services-alt2.jpg) left top no-repeat;
	height: 210px;
}

#ph-contacts {
	background: url(img/header-contacts.jpg) left top no-repeat;
	height: 210px;
}

#ph-upload {
	background: url(img/header-upload.jpg) left top no-repeat;
	height: 210px;
}

#ph-about {
	background: url(img/header-about.jpg) left top no-repeat;
	height: 210px;
}

#ph-training {
	background: url(img/header-training.jpg) left top no-repeat;
	height: 210px;
}


#pageheader h1 {
	margin-left: 530px;
	padding-top: 55px;
	text-shadow: 1px 1px 0px #fff;
}

#pageheader p {
	margin-left: 530px;
	width: 330px;
	color: #939598;
}


/* @end */

/* @group Contacts Page */

.contacts-left {
	float: left;
	width: 620px;
}

.contacts-right {
	float: right;
	width: 280px;
}

#maps {
	float: left;
	width: 578px;
	border: 1px solid #bdbfc2;
	padding: 4px;
	height: 300px;
	background: #fff;
	margin-top: 30px;
}

#callmeform {
	margin-top: 30px;
	
}

.textfield {
	width: 250px;
	height: 41px;
	background: url(img/bg-textfieldcv.png) left top no-repeat;
	border: none;
	float: none;
	color: #858585;
	font: 11px 'Italic';
	padding: 0 15px;
	margin: 3px 0 15px 0;
}

label.error {
	display: none;
	float: right;
	margin-right: 60px;
}

select.error {
	border: 1px solid #900;
}

.textarea {
	width: 280px;
	height: 150px;
	background: url(img/bg-textarea.png) left top no-repeat;
	border: none;
	float: right;
	margin-bottom: 15px;
	margin-top: 3px;
}

#btn-callme {
	width: 170px;
	height: 43px;
	cursor: pointer;
	background: url(img/btn-callme.png) left top no-repeat;
	border: none;
	text-indent: -9999px;
	float: right;
	clear: both;
	margin-top: 18px;
}

#btn-callme:hover {
	background: url(img/btn-callme.png) left bottom no-repeat;
}

#contactdetails {
	margin-top: 30px;
}

#contactdetails li {
	font: 12px 'SemiBold';
	color: #7d7d7d;
	padding-left: 55px;
	height: 32px;
	vertical-align: middle;
	margin-bottom: 15px;
	padding-top: 9px;
}

#contactdetails li#icn-phone { background: url(img/icn-phone.png) left top no-repeat; margin-top: 50px}
#contactdetails li#icn-phone:hover { background-position: left bottom; }
#contactdetails li#icn-mail { background: url(img/icn-mail.png) left top no-repeat; }
#contactdetails li#icn-mail:hover { background-position: left bottom; }
#contactdetails li#icn-postal { background: url(img/icn-post.png) left top no-repeat; padding-top: 2px; height: 39px; }
#contactdetails li#icn-postal:hover { background-position: left bottom; }
#contactdetails li#icn-address { background: url(img/icn-address.png) left top no-repeat; padding-top: 2px; height: 39px; }
#contactdetails li#icn-address:hover { background-position: left bottom; }
#contactdetails li#icn-gps { background: url(img/icn-gps.png) left top no-repeat; }
#contactdetails li#icn-gps:hover { background-position: left bottom; }

/* @end */

/* @group CV Upload Page */

#upload-section h3 {
	color: #f5b868;
	font: 16px "OpenSans";
	text-shadow: 1px 1px 0px #fff;
	font-weight: normal;
	height: 32px;
	padding-left: 50px;
	padding-top: 8px;
	margin-bottom: 15px;
	clear: both;
}

#details-personal {background: url(img/bg-uploadnumbers.png) left top no-repeat;}
#details-position {background: url(img/bg-uploadnumbers.png) left -50px no-repeat;}
#details-upload {background: url(img/bg-uploadnumbers.png) left -100px no-repeat;}
#details-finished {background: url(img/bg-uploadnumbers.png) left -150px no-repeat;}

.column {
	float: left;
	width: 280px;
	margin-right: 30px;
}

#last {
	margin-right: 0;
}

.column select {
	width: 280px;
	margin-bottom: 15px;
	color: #858585;
	font: 11px 'Italic';
	margin-top: 15px;
	
	/*
	margin-right: 30px;
	-webkit-appearance: none;
	float: none;
	background: url(img/bg-textfieldcv.png) left top no-repeat;
	border: none;
	padding: 0 15px;
	*/
}

input.error {
	background: url(img/bg-textfieldcv.png) left bottom no-repeat;
	color: #900;
}

select.error{
	color: #900;
	outline: thin red;
}


.column .textarea {
	float: left;
	width: 250px;
	height: 101px;
	background: url(img/bg-textareacv.png) left top no-repeat;
	color: #858585;
	font: 11px 'Italic';
	padding: 10px 15px;
	margin-top: 3px;
}

.column textarea.error {
	background: url(img/bg-textareacv.png) left bottom no-repeat;
}

#upload-section .introduction{
	float: left;
}

.introduction p {
	margin-bottom: 15px;
	float: left;
}

.introduction p span {
	padding-top: 15px;
	font-family: "SemiBold";
}

#btn-choosefile {
	background: #fff;
	border: none;
	float: right;
}


#btn-choosefile.error {
	color: #bc0000;
}

#btn-submit{
	width: 145px;
	height: 37px;
	cursor: pointer;
	background: url(img/btn-submit.png) left top no-repeat;
	border: none;
	text-indent: -9999px;
	float: left;
	margin-left: 80px; 
}

#btn-submit:hover {
	background: url(img/btn-submit.png) left bottom no-repeat;
}

label {
	font: 12px "SemiBold";
	color: #565F67;
	padding-left: 5px;
	display: block;
}

#thanks {
	margin-bottom: 170px;
}

#thanks p {
	margin-top: 15px; 
}

/* @end */

/* @group Footer */

#footer {
	height: 75px;
	width: 100%;
	background: url(img/bg-footer.png) left top repeat-x;
	margin-top: 40px;
}

#footer p {
	font: 12px "SemiBold";
	color: #7d7d7d; 
	padding-top: 32px;
	text-shadow: 1px 1px 0px #fff;
}

#footer p span {
	font: 12px "OpenSans";
}

.copyright {
	float: left;
	text-transform: uppercase;
}

.foot-right {
	float: right;
	width: 270px;
}

.callus {
	float: right;
	width: 180px;
}

#social {
	float: left;
	width: 70px;
	margin-top: 25px;
	margin-right: 20px;
}

#social a {
	float: left;
	width: 30px;
	height: 30px;
	display: block;
	text-indent: -9999px;
	opacity: 0.5;
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity=50);
	transition: opacity 0.1s ease-in;
	-webkit-transition: opacity 0.1s ease-in;
	-moz-transition: opacity 0.1s ease-in;
	-o-transition: opacity 0.1s ease-in;
}

#social a:hover {
	opacity: 0.8;
}

a.fb { background: url(img/icn-social.png) left top no-repeat; }
a.tw { background: url(img/icn-social.png) right top no-repeat; margin-left: 10px;}

/* @end */

/* @group Services */

.column p {
	margin-bottom: 15px;
	font-size: 11px; 
}

.column.small {
	width: 210px;
	margin-right: 20px;
}

/* @end */