 @import url(http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,700,400italic,700italic,900,900italic);
 
 @font-face {
	font-family: 'Neutra-Text-TF-Book-Alt';
	src: url('../fonts/Neutra-Text-TF-Book-Alt.eot');
	src: local('?'), url('../fonts/Neutra-Text-TF-Book-Alt.woff') format('woff'), url('../fonts/Neutra-Text-TF-Book-Alt.ttf') format('truetype'), url('../fonts/Neutra-Text-TF-Book-Alt.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

/* CSS reset */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td { margin:0; padding:0; }
body { margin:0; padding:0; display: flex; justify-content: center; background:#e3e3e3; font-family: 'Neutra-Text-TF-Book-Alt';}
table { border-collapse:collapse; border-spacing:0; }
fieldset, img { border:0; }
input { border:1px solid #b0b0b0; padding:3px 5px 4px; color:#979797; width:190px; }
address, caption, cite, code, dfn, th, var { font-style:normal; font-weight:normal; }
ol, ul { list-style:none; }
caption, th { text-align:left; }
h1, h2, h3, h4, h5, h6 { font-size:100%; }
q:before, q:after { content:''; }
abbr, acronym { border:0; }
/* General Demo Style */

body { font-family: 'Neutra-Text-TF-Book-Alt'; }
.ie7 body { overflow:hidden; }
a { color: #333; text-decoration: none; }
.container { position: relative; text-align: center; }
.clr { clear: both; }
.container > header { padding: 30px 30px 10px 20px; margin: 0px 20px 10px 20px; position: relative; display: block; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2); text-align: left; }
.container > header h1 { font-family: 'Neutra-Text-TF-Book-Alt'; font-size: 35px; line-height: 35px; position: relative; font-weight: 400; color: #fff; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3); padding: 0px 0px 5px 0px; }
.container > header h1 span { }
.container > header h2, p.info { font-size: 16px; font-style: italic; color: #f8f8f8; text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6); }
/* Header Style */

.codrops-top { font-family: Arial, sans-serif; line-height: 24px; font-size: 11px; width: 100%; background: #000; opacity: 0.9; text-transform: uppercase; z-index: 9999; position: relative; -moz-box-shadow: 1px 0px 2px #000; -webkit-box-shadow: 1px 0px 2px #000; box-shadow: 1px 0px 2px #000; }
.codrops-top a { padding: 0px 10px; letter-spacing: 1px; color: #ddd; display: block; float: left; }
.codrops-top a:hover { color: #fff; }
.codrops-top span.right { float: right; }
.codrops-top span.right a { float: none; display: inline; }
p.codrops-demos { display: block; padding: 15px 0px; }
p.codrops-demos a,  p.codrops-demos a.current-demo,  p.codrops-demos a.current-demo:hover { display: inline-block; border: 1px solid #6d0019; padding: 4px 10px 3px; font-size: 13px; line-height: 18px; margin: 2px 3px; font-weight: 800; -webkit-box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1); -moz-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.1); box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.1); color:#fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background: #a90329; background: -moz-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a90329), color-stop(44%, #8f0222), color-stop(100%, #6d0019)); background: -webkit-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); background: -o-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); background: -ms-linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); background: linear-gradient(top, #a90329 0%, #8f0222 44%, #6d0019 100%); }
p.codrops-demos a:hover { background: #6d0019; }
p.codrops-demos a:active { background: #6d0019; background: -moz-linear-gradient(top, #6d0019 0%, #8f0222 56%, #a90329 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #6d0019), color-stop(56%, #8f0222), color-stop(100%, #a90329)); background: -webkit-linear-gradient(top, #6d0019 0%, #8f0222 56%, #a90329 100%); background: -o-linear-gradient(top, #6d0019 0%, #8f0222 56%, #a90329 100%); background: -ms-linear-gradient(top, #6d0019 0%, #8f0222 56%, #a90329 100%); background: linear-gradient(top, #6d0019 0%, #8f0222 56%, #a90329 100%); -webkit-box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.9); -moz-box-shadow:0px 1px 1px rgba(255, 255, 255, 0.9); box-shadow: 0px 1px 1px rgba(255, 255, 255, 0.9); }
p.codrops-demos a.current-demo,  p.codrops-demos a.current-demo:hover { color: #A5727D; background: #6d0019; }

/* Media Queries */

@media screen and (max-width: 767px) {
 .container > header {
 text-align: center;
}
 p.codrops-demos {
 position: relative;
 top: auto;
 left: auto;
}
}

.block { width:724px; height:472px; text-align: left; position: fixed; top: 50%; left: 50%; margin-left:-363px; margin-top:-230px; z-index:9999; /*background: rgba(255,255,255,.95);*/ border-radius:30px; padding-top:0; background:rgba(255,255,255,0.9); }
.block .content { float:left; min-height:392px; width:84%; position:relative; text-align:center; color:#fff; padding:35px 8%; text-align:center}
.block .content .logo { width:100%; text-align:center; margin-bottom:20px; margin-top:10px;}
.addressline { text-align:center; margin-bottom:35px;}
.addressline span a, .row2 .col a{ color:#fff;}
.addressline span { display:inline-block; margin-right:11px;}
.addressline span:last-child { margin-right:0;}
.row2 { text-align:center;}
.row2 .col { display:inline-block; margin-right:25px;} .row2 .col:last-child { margin-right:0;}
.row2 .col .icon { float:left; margin-right:9px;}
.block .content .c-lft { float:left; width:488px; }
.block .content p { font-size:24px; color:#a29061; letter-spacing:1px; line-height:34px; margin-bottom:30px;}
.block .content h3 { color:#a29061; font-size:24px; font-weight:400; text-transform:uppercase; letter-spacing:2px;}
.block .content .c-lft h1 { font-size:35.39px; line-height:42px; font-weight:300; margin-bottom:25px; color:#fff; }
.block .content .button { display:inline-block; margin-right:30px; border:2px solid #a29061; font-size:24px; width:160px; padding:15px 0; color:#a29061;}
.block .content .button:last-child { margin-right:0;}
.block .content .button:hover { background:#a29061; color:#fff;}
.block .content .c-rht { float:right; width:199px; }
.block .content .c-rht p { font-size:12px; color:#252525; }
.block .content .c-rht .logo { border-bottom:1px solid #a5a5a5; margin-bottom:22px; }
.block .content .c-rht .logo img { width:100%; }
.block .bluefooter { width:90%; background:#4a1326; color:#fff; float:left;border-radius:10px; border-top-left-radius:0px; border-top-right-radius:0px; padding:27px 5%; position:relative }
.block .bluefooter h1 { text-align:center; font-size:25px; font-weight:300; line-height:1}
.circle { width:170px; height:165px; border-radius:50%; font-size:15.15px; line-height:17px; padding-top:65px; padding-left:35px; padding-right:25px; color:#fff; float:left; }
.c-orenge { background:#fdb813; margin-right:15px; }
.c-blue { background:#3abcea; }
.f-logo { float:left; }
.f-txt { float:left; margin-left:20px; font-size:15.15px; line-height:17px; width:60%; margin-top:10px; }
.mailicon { margin-top:15px; position:absolute; right:32px; top:14px; }
 @-webkit-keyframes fadeIn { from {
opacity:0;
}
to { opacity:1; }
}
 @-moz-keyframes fadeIn { from {
opacity:0;
}
to { opacity:1; }
}
 @keyframes fadeIn { from {
opacity:0;
}
to { opacity:1; }
}
.fade-in { opacity:0;  /* make things invisible upon start */ -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */ -moz-animation:fadeIn ease-in 1; animation:fadeIn ease-in 1; -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/ -moz-animation-fill-mode:forwards; animation-fill-mode:forwards; -webkit-animation-duration:1s; -moz-animation-duration:1s; animation-duration:1s; }
.fade-in.one { -webkit-animation-delay: 2s; -moz-animation-delay: 2s; animation-delay: 2s; }
.minimize { position:absolute; background:#a0905c; color:#fff; z-index:99999999; font-size:30px; font-weight:700; top:-15px; right:-15px; border-radius:50%; width:30px; height:30px; text-align:center; }
.minimize span { line-height: 26px; display: block; }
.minimize a { color:#fff; }
.maximise { display: none; position: fixed; bottom: -1px; left: 0; height: 43px; margin: 0; text-align: center; padding: 0; width: 100%; background-color: #fff; }

/*Mobile css*/

@media screen and (max-width: 480px) {
 body {
display:block;
}
 .block {
width:90%;
margin:auto 5%;
position:relative;
float:left;
left:0;
right:0;
margin-top:20%;
top:20%;
height:auto;
margin-bottom:20%;
}
 .block .content {
width:80%;
padding-left:10%;
padding-right:10%;
height:auto;
padding-bottom:10%;
}
 .block .content .c-lft {
width:100%;
}
 .block .content .c-lft h1 {
font-size:18px;
line-height:24px;
font-weight:400;
}
 .c-orenge {
margin-right:0;
float:none;
margin-bottom:10% !important;
margin:auto;
}
 .c-blue {
margin-bottom:10% !important;
}
 .circle {
float:none;
margin:auto;
text-align:center;
padding-left:25px;
padding-right:25px
}
 .block .content .c-rht {
width:100%;
}
 .block .bluefooter {
height:auto;
padding:10%;
width:80%;
}
 .f-logo {
width:20%;
float:none;
margin:auto;
}
 .f-txt {
width:100%;
margin-left:0;
margin-top:5%;
text-align:center;
margin-bottom:5%;
}
 .mailicon {
float:none;
margin:auto;
width:12%;
}

.addressline span { margin-bottom:10px; margin-right:0;}
.row2 .col { margin-right:0; margin-bottom:10px;}
.mailicon { position:relative; right:inherit;}
}



/*ipad vertical css*/

@media screen and (min-width : 481px) and (max-width: 980px) {
 body {
display:block;
}
 .block {
width:90%;
margin:auto 5%;
position:relative;
float:left;
left:0;
right:0;
margin-top:20%;
top:20%;
height:auto;
margin-bottom:20%;
}
 .block .content .c-lft {
width:60%;
}
 .block .content .c-rht {
width:32%;
}
 .block .content {
padding-left:5%;
padding-right:5%;
padding-bottom:5%;
width:90%;
}
 .block .content .c-lft h1 {
font-size:24px;
line-height:30px;
font-weight:400;
}
 .circle {
width:90%;
padding:5%;
border-radius:0;
height:auto;
}
 .c-orenge {
margin-right:0;
margin-bottom:5%;
}

.addressline span { margin-bottom:10px; margin-right:0;}
.row2 .col { margin-bottom:10px;}

}



/* iPads (landscape) ----------- */

@media only screen  and (min-device-width : 768px)  and (max-device-width : 1024px)  and (orientation : landscape) {
}
