@charset "utf-8";
/* ---^--- CSS Document by Kalo \m/--(-_-)--\m/ ---^--- 2013 V1.5 ULTIMATE EDITION ---^---  \m/--(-_-)--\m/ */
/* --- FONTS --- */
*{margin:0;padding:0;outline:none;border:0;word-wrap:break-word;/* -webkit-backface-visibility: hidden; */-webkit-overflow-scrolling: none;}
body{position:relative;font-size:normal;}
article,aside,figure,figcaption,footer,header,section,nav{display:block;}/*HTML5 set display to new elements*/
a{text-decoration:none;cursor:pointer}
a:hover{text-decoration:underline}
ul{list-style-type:none}
button::-moz-focus-inner, 
input::-moz-focus-inner{border:0;padding:0}/* Fix for odd Mozilla border & padding issues */
input[type="submit"],
button{cursor:pointer;*overflow:visible;width:auto;padding:1px 5px}/* ie6/7 fix set standart button */
input:invalid {-moz-box-shadow:none;-webkit-box-shadow:none;box-shadow:none}/* disable html5 validation red border (delete this if you dont need it!!!) */
textarea{resize:none;overflow:auto;vertical-align:top}
button, input, select, textarea {*vertical-align:middle}
button, input {line-height:normal}
input {-webkit-appearance:none}
.ieFix  input[type=submit],
.ieFix  input[type=reset],
.ieFix  input[type=button]{filter:chroma(color=#000000)}/* fix border color issue for ie7 */

a img,figure img{display:block}
img.scale,a img,figure img{max-width:100%;height:auto}/*set width of image according to the parent container*/
#cover{position:fixed;top:0;left:0;width:100%;height:100%;background:url(../img/bi.gif) no-repeat 50% 50% #000;z-index:100000;}
/* === === === === === FONTS === === === === === */
@font-face {
	font-family: 'GothamLight';
	src: url('../fonts/gothamLight/gothamrnd-light-webfont.eot');
	src: url('../fonts/gothamLight/gothamrnd-light-webfont.eot?#iefix') format('embedded-opentype'), 
	url('../fonts/gothamLight/gothamrnd-light-webfont.ttf') format('truetype'), 
	url('../fonts/gothamLight/gothamrnd-light-webfont.woff') format('woff'), 
	url('../fonts/gothamLight/gothamrnd-light-webfont.svg') format('svg');
}

.articStyle-1 .text,
.articStyle-1 .text p,
.footMenuTopLevel > li a,
.footMenuTopLevel > li a span,
.head_text p,
.tc_text,
#address p,
#siteMenu > li a span,
.regularButton,
.d-menu *,
.brandBox *{
	font-family:GothamLight,Helvetica;
}

.center_item { margin: 0 auto; }

@font-face {
	font-family: 'GothamMed';
	src: url('../fonts/gotham-Med/gothamrnd-medium-webfont.eot');
	src: url('../fonts/gotham-Med/gothamrnd-medium-webfont.eot?#iefix') format('embedded-opentype'), 
	url('../fonts/gotham-Med/gothamrnd-medium-webfont.ttf') format('truetype'), 
	url('../fonts/gotham-Med/gothamrnd-medium-webfont.woff') format('woff'), 
	url('../fonts/gotham-Med/gothamrnd-medium-webfont.svg') format('svg');
}

.hstyle-1,
.hstyle-2,
.head_text  strong{
	font-family:GothamMed,helvetica;
}


/* === === === === === Clear Tools === === === === === */
.clear{clear:both;height:0px;width:100%;display:block}
.cfix{zoom:1}
.cfix:after, .cfix:before,.container:after{content:" ";display:block;height:0;visibility:hidden;clear:both}
.hidden { display: none!important; }

/* === === === === === TRANSITIONS === === === === === */
.trans,
#siteMenu > li a:after,
.cButton:after{
	transition:all 0.3s linear;
	-webkit-transition:all 0.3s linear;
	-moz-transition:all 0.3s linear;
	-o-transition:all 0.3s linear;
} 

.bxslider .d-menu.trans.animate{
	transition:all 0.5s linear;
	-webkit-transition:all 0.5s linear;
	-moz-transition:all 0.5s linear;
	-o-transition:all 0.5s linear;
} 

.bxslider .animate{
	transition:all 1s ease-out;
	-webkit-transition:all 1s ease-out;
	-moz-transition:all 1s ease-out;
}
/* ANIMATE-2 */
#slide-2 .bxslider .animate{
	transition:all 1s cubic-bezier(0,0,0.2,.6);
	-webkit-transition:all 1s cubic-bezier(0,0,0.2,.6);
	-moz-transition:all 1s cubic-bezier(0,0,0.2,.6);
}

/* ===================================== SETS ============================================ */

/* BOXES AND CONTAINERS */
.viewBox,
.slideBox{ 
	position:relative;
}
.viewBox{overflow:hidden;z-index:5}

/* BUTTONS */
.col-yewoll{
	border:1px solid #f5dd0e;
	color:#f5dd0e!important;
}
.col-cian{
	border:1px solid #99d5ec;
	color:#3bc1ef!important;
}
.col-purple{
	border:1px solid #f8a9eb;
	color:#f46fdd!important;
}
.button-1,
.button-3{
	display:block;
	border:1px solid #ccc4c2;
	border-radius:30px;
	-webkit-border-radius:30px;
	padding:8px 22px;
	color:#ccc4c2;
	line-height:20px;
	margin-top:5px;
}
.button-1:hover{
	color:#fff!important;
	
}


.button-1.vids,
.button-3.vids{
	margin:0 auto;
	float:none;
	padding:6px 6px 6px 26px;
	height:16px;
}
.cButton{
	background:#FFF;
    border-radius: 18px;
    display: block;
    float: left;
    height: 24px;
    margin: -4px 0 0 -23px;
    position: relative;
    width: 24px;
}

.cButton.Big{
	 height: 26px;
    margin: -3px 0 0 -23px;
    position: relative;
    width: 26px;
}

.cButton:after{
	border-bottom: 5px solid transparent;
    border-left: 7px solid #5D4C44;
    border-top: 5px solid transparent;
    content: " ";
    height: 0;
    left: 10px;
    position: absolute;
    top: 7px;
    width: 0;
}

.cButton.Big:after{
	 top: 8px;
}

.button-1:hover .cButton{
	background:#f4f4f4;
}
.button-1:hover .cButton:after{
	 border-left: 7px solid #37BEEE;
}

.brandBox .button-1{
	font-size:12px;
	line-height:16px;
	height:16px;
	max-width:90px;
	text-align:center;
}

.brandBox .button-1:hover{
	text-decoration:none;
}

.regularButton{
	display:block;
	border-radius:20px;
	-webkit-border-radius:20px;
	text-align:center;
	line-height:38px;
	font-size:14px;
}

.button-c{
	background: url("../img/nb.png") no-repeat scroll right -119px rgba(0, 0, 0, 0);
    display: inline-block;
    height: 46px;
    padding-right: 37px;
    max-width:200px;
	min-width:150px;
	margin-left:-15px;
	color:#fff;
	font-size:16px;
	font-weight:700;
	text-shadow: 1px 0 4px #000;
}

.button-c > span{
	background: url("../img/nb.png") no-repeat scroll 0 -13px rgba(0, 0, 0, 0);
    display: block;
    height: 65px;
    line-height: 44px;
    padding-left: 70px;
}
.button-c > span > span{display:block;margin-right:-10px;}


.footMenuTopLevel .regularButton{
	border:1px solid #676767;
	color:#000;
}

.footMenuTopLevel .regularButton:hover{
	border:1px solid #fff;
	text-decoration: none;
}



.button-3{
	border:1px solid #e4e4e4;
	color:#333333;
	display:inline-block;
	min-width:100px;
	text-align:center;
	height:20px;
	font-size:16px;
}
.button-3 .cButton,
.button-3:hover .cButton{
	background:#333;
}

.button-3 .cButton:after{
	border-left: 7px solid #eee; 
}

.button-3:hover .cButton:after{
	 border-left: 7px solid #4cc2ec;
}

.greenB{
	border:1px solid #909269;
	color:#bfc195;
	margin-top:10px;
}
.size-1{
	min-width:160px;
	padding:0 10px;
}
.size-2{
	min-width:120px;
	padding:0 10px;
}
/* HEADING */
.hstyle-1{
	font-size:42px;
	line-height:62px;
	letter-spacing: -2px;
}
.hstyle-2{
	font-size:38px;
	line-height:56px;
	letter-spacing: -2px;
}
.colDark{color: #3E3E3E;}


.brandBox{
	display:table;
	position:relative;
	text-align:center;
	margin:0 auto;
}

.brandBoxInner{
	display:table-cell;
	text-align:center;
	vertical-align:middle;
	
}
.brandBoxInner .brandLogo{
	display:inline-block;
	clear:both;
}
.brandBoxInner .brandLogo img{
	display:block;
	max-width:100%;
	height:auto;
	margin:0 auto;
}

.brandBox.vset{height:320px;}
#homepage .brandBox{opacity:0}
#homepage .brandBox.pf2{opacity:1}

.brandBox > *,
.brandBox > .brandBoxInner > *{margin-bottom:10px;}

.brandBox > .brandBoxInner > .brandLogo{margin-bottom:5px;}
.brandBox > .brandBoxInner > .smallFont2{margin-bottom:15px;}
/* ===================================== END SETS ======================================== */

/* =============================================================================================================== */
/* ============================================================================================================== */


/* ===================================== HEADER ========================================== */
#header{
	/* background:url(../img/headBG.png) repeat; */
	background:url(../img/headg.png) repeat;
	height:32px;
	padding:10px 0;
	position:fixed;
	top:0;
	z-index:200;
	width:100%;
	left:0;
}
.mobileBrowser #header{
	/* position:absolute; */
	transition:all 0.5s linear;
	-webkit-transition:all 0.5s linear;
	-moz-transition:all 0.5s linear;
	-o-transition:all 0.5s linear;
	opacity:1;
}

.scDown #header{
	top:-60px;
	opacity:0;
}



#header.bgNEW{
	background-color:#333;
	box-shadow: 0 1px 10px 1px #333333;
}
.headline{
	height:1px;
	background:#fff;
	opacity:.1;
	filter:alpha(opacity=10);
	width:100%;
	position:absolute;
	bottom:-1px;
	display:none;
}

#header.bgNEW .headline{
	height:0;
}
.logo{
	float:left;
}
.logo a{
	display:block;
	padding-top:2px;
	background:url(../img/logo.png) no-repeat 0 2px;
	width:132px;
	height:26px;
}



#topMenu{
	float:right;
	margin-top:-1px;
}
#siteMenu > li{
	float:left;
	height:30px;
}
#siteMenu > li a{
	display:block;
	padding:0 5px;
	margin:0 15px;
	line-height:30px;
	color:#fff;
	position:relative;
	text-decoration:none;
	font-size:80%;
}
#siteMenu > li.selected a{
	font-weight:700;
}
#siteMenu > li.selected a:hover{
	text-shadow:none;
}
#siteMenu > li a:hover{
	text-shadow:0 0 3px #fff;
}
/* ===================================== END HEADER ====================================== */

/* =============================================================================================================== */
/* ============================================================================================================== */

/* === === === === === === VIEW 1 === === === === === === */


/* === === SLIDER STYLES === === */
.slideBox{
	background-color:#000;
	background-repeat:no-repeat;
	background-size:100% auto;
	-webkit-background-size:100% auto;
	background-position:50% 0;
}

.bgSetFix .slideBox{
	/* background-size:cover;
	-webkit-background-size:cover; */
	background-size:auto 100%;
	-webkit-background-size:auto 100%;
}

.slideContent{
	z-index:10;
	height:100%;
	text-align:center;
}

.appLogo{
	background-size:auto 100%!important;
	-webkit-background-size:auto 100%!important;
	color:#ccc4c2;
}
.appLogo small{
	font-size:11px;
}
.iconLogo{
	background-size: auto 42px !important;
	-webkit-background-size: auto 42px !important;
    display: block;
    float: left;
    padding-right: 10px;
    width: 38px;
	height:40px;
	white-space:nowrap
}

.iconLogo img{
	height:100%;
	width:auto;
	display:block;
}

.appLogo:hover{
	color:#fff;
}

.appLogo p{
	float:left;
	line-height: 16px;
    padding: 8px 0 2px;
    text-align: left;
}

.d-menu{
	position:absolute;
	bottom:0;
	opacity:0;
	text-align:center;
	width:100%;
}

.d-menu.pf2{
	bottom:6%;
	opacity:1;
}

.centerDiv{
	position:relative;
	left:-50%;
	width:200%;
}

.d-menu > a{
	display:inline-block;
	text-align:center;
	vertical-align: top;
	zoom: 1; 
	*display: inline;
	white-space: nowrap;
}

.d-menu a:first-child{
	margin-right:10px;
}
.d-menu a:last-child{
	margin-left:10px;
}

.remove-cursor { cursor: default!important; }

.brandLogo{
	z-index:3;
	height: auto;
	clear:both;
}

.smallFont{
	font-size:16px;
	line-height:20px;
	text-align:center;
	font-weight:400;
	color:#abaaa6;
	clear:both;
}

.smallFont2{
	font-size:18px;
	line-height:22px;
	text-align:center;
	font-weight:400;
	
	color: #ffffff;
	clear: both;
	opacity: 0.9;
}
 
/* === === slide 1 === === */
#slide-1{
	background-image:url(../img/MyGrocery-BG.jpg);
	background-attachment:fixed;
}
.sl-1{
	position:absolute;
	height:100%;
	top:0;
	width:100%;
	left:0;
	z-index:1;
	background:url(../img/weather-bg-icons-particles.png) repeat 0 50%;
	background-size:100% auto;
	-webkit-background-size:100% auto;
	background-attachment:fixed;
}

.mobileBrowser .sl-1{background-attachment:scroll;}

/* === slide 2 === */
#slide-2{
	background-image:url(../img/weather/index_header.jpg);
	background-color:#080808; 
	background-attachment:fixed;
}

.mobileBrowser #slide-2{background-attachment:scroll;}

/* === slide 3 === */

#slide-3{
	background-image:url(../img/newcardio/bg-home.jpg);
	background-attachment:fixed;
}

#slide-4{
	background-image:url(../img/Compass-BG.jpg);
	background-attachment:fixed;
}

#slide-5{
	background-image:url(../img/outwalk/Outwalk_Website_Header.jpg);
	background-attachment:fixed;
}

.mobileBrowser{background-attachment:fixed;}
#slide-3 .brandBox{
	background-size:100% 100%;
	-webkit-background-size:100% 100%;
}

#slide-3 .button-1:hover .cButton:after{
	 border-left: 7px solid #db3a36;
}


/* === === === === === === // END VIEW 1 === === === === === === */
#view-1,
.slideBox,
.brandBox{
	height:660px;
}

/* === === === === === === === === === === === === === === === === === === === === */


/* === === === === === === VIEW 2 === === === === === === */
#view-2{
	padding:60px 0 100px;
}

.projectHeader {
	padding-bottom:65px;
	text-align:center;
}

.projectHeader > figure{
	display:inline-block;
	padding-bottom:20px;

}

.head_text{
	font-size:22px;
	text-align:center;
	line-height:30px;
}

.head_text  strong{
	color:#3e3e3e;
	font-size:24px;
	font-weight:normal;
	letter-spacing: -.5px;
}

.head_text p{
	color:#7a7a7a;
	letter-spacing: -.5px;
}

/* --- --- APP LIST --- --- */
.appList{
	display:block;
	padding-bottom:30px;
	margin:0 auto;
}
.appList,
.appList > li{
	position:relative;
}
.appList > li{
	display:block;
	float:left;
	width:252px;
	height:268px;
	margin:0 15px 30px;
	border-radius:5px;
	-webkit-border-radius:5px;
	overflow:hidden;
}

/* .appList > li:hover{
	box-shadow:0 0 3px #666;
} */

.appList > li a{
	display: block;
	position:absolute;
	width:100%;
	height:100%;
	z-index:5;
}

.footInf{
	position:absolute;
	bottom:0;
	width:100%;
	height:85px;
	z-index:6;
	/* background:pink;
	opacity:0.8 */
}

.footInf figure{
	width:65px;
	height:65px;
	position:absolute;
	top:12px;
	left:14px;
	text-align:center;
	/* background:#000; */
}

.footInf figure figcaption{
	 display: inline-block;
    height: 100%;
    vertical-align: middle;
}

.footInf figure img{
    vertical-align: middle;
	display:inline-block;
}

.footInf .titleArea{
	position:absolute;
	width:162px;
	left:82px;
	top:22px;
}
.footInf .titleArea h5{
	color:#626262;
	font-size:18px;
	line-height:22px;
	font-family: GothamMed,helvetica;
	font-weight:400;
	text-align:left;
}

.footInf .titleArea h5.cardiograph
{
	line-height:20px;
}

.footInf .titleArea h5 span{
	font-family: GothamLight,Helvetica;
	text-align:left;
}

.footInf .titleArea h6{
	color:#626262;
	font-size:12px;
	line-height:14px;
	font-family: GothamLight,Helvetica;
	font-weight:400;
	text-align:left;
}


#view-2 footer{
	text-align:center;
	padding-bottom:15px;
}
#view-2 footer .regularButton{
	display:inline-block;
}
/* === === === === === === // END VIEW 2 === === === === === === */

/* === === === === === === === === === === === === === === === === === === === === */

/* === === === === === === VIEW 3 === === === === === === */

#view-3{
	background:url(../img/p2article.jpg) no-repeat 50% 50% #000;
	max-height:460px;
	min-height:320px;
	padding: 40px 0;
	overflow:hidden;
	position:relative;
} 

#view-3 > .articStyle-1{
	position:relative;
	max-height:460px;
	min-height:320px;
}

#view-3 .setAbsolute{position:absolute;height:100%;width:100%}
#view-3 .tableStyle{display:table;min-height:320px;height:100%;position:absolute}
#view-3 .tableCell{display:table-cell;vertical-align:middle;}

.articStyle-1{
	text-align:center;
	color:#dbdbdb;
}

.articStyle-1 figure{
	margin-bottom:20px;
	display:inline-block;
}

.articStyle-1 .text{
	line-height:32px;
	font-size:18px;
}



/* 
===================================== END CONTENT =====================================
*/


/* 
===================================== FOOTER ==========================================
*/
#footer{
	min-height:180px;
	background:#fff;
	padding:40px 0 40px;
	overflow:hidden
}

.footMenuTopLevel > li{
	float:right;
	width:200px;
	margin-right:40px;
}

.footMenuTopLevel > li.footLinks{
	width:180px;
}

.footMenuTopLevel > li.buttonHolder{
	width:190px;
	margin-right:80px;
}

.footMenuTopLevel > li.buttonHolder ul{
	margin:0 10px;
}

.footMenuTopLevel > li.contactSpot{
	width:250px;
}

.footMenuTopLevel > li:first-child{
	margin: 0 auto;
	width: 340px;
	float: none;
	text-align: center;
}
.footMenuTopLevel > li a{
	color:#a5a5a5;
	font-size:14px;
}
.footMenuTopLevel > li h3{
	color:#514e4d;
	font-size:24px;
	line-height:38px;
	font-weight:400;
	font-family:GothamMed,helvetica;
}
.footMenuTopLevel > li ul li{
	display:block;
	margin:10px 0;
}

.footMenuTopLevel .buttonLinks li:first-child{
	margin-top:5px;
}
.footMenuTopLevel .buttonLinks li{
	margin:15px 0;
}
#address{
	color:#a5a5a5;
	font-size:14px;
	line-height:20px;
	font-style:normal;
}

#address a{
	color:#3bc1ef;
}

.footMenuTopLevel .socialNet{
	padding:7px 0;
	text-align: center;
}
.footMenuTopLevel .socialNet > li{
	width:42px;
	height:42px;
	margin-right:15px;
	display: inline-block;
}
.footMenuTopLevel .socialNet > li a{
	background:url(../img/social.png) no-repeat;
	display:block;
	height:42px;
	border:1px solid #828282;
	border-radius:100%;
	-webkit-border-radius:100%;
	font-family:GothamLight;
}

.footMenuTopLevel .socialNet > li:last-child
{
	width: auto;
	position: relative;
	top: -27px;
	left: 2px;
}

.footMenuTopLevel .socialNet > li:last-child a
{
	display: block;
	border-radius: 60px;
	-webkit-border-radius: 60px;
	text-align: center;
	line-height: 41px;
	font-size: 14px;
	background: #fff;
	padding: 0 33px;
}

.footMenuTopLevel .socialNet .regularButton {
	border:1px solid #828282;
	color: #828282;
}

.footMenuTopLevel .socialNet .regularButton:hover{
	border:1px solid #fff;
	text-decoration: none;
}

.socialNet > li a.facebook{
	background-position:50% 1px;
}
.socialNet > li a.rsfeed{
	background-position: -1px -53px;
}
.socialNet > li a.twitter{
	background-position:50% -113px;
}
.footMenuTopLevel .socialNet > li a:hover{
	border:1px solid #fff;
}

#tc_zone{
	text-align:center;
	padding-top:40px;
}

#tc_zone > figure{
	display:inline-block;
	padding-top:25px;
}

.tc_text{
	background:#f4f4f4;
	font-size:11px;
	line-height:36px;
	color:#484644;
	margin-bottom:25px;
}

#botLogo{
	
	width:130px;
	height:21px;
	background:url(../img/logoBlack.png) no-repeat 0 0;
	display:inline-block;
	margin:0 auto;
}
/* 
===================================== END FOOTER ======================================
*/

.prev_arrow
{
	display: block; width: 92px; height: 92px; background: red; position: fixed; top: 0; left: 10px; z-index: 9400; top: 50%; margin-top: -46px; background: url(../img/ArrowPrevProj.png) no-repeat;
}

.next_arrow
{
	display: block; width: 92px; height: 92px; background: red; position: fixed; top: 0; z-index: 9400; top: 50%; margin-top: -46px; right: 10px;background: url(../img/ArrowNextProj.png) no-repeat;
}

.cardiographSpan
{
	color: #626262;
    font-size: 12px;
    line-height: 14px;
    font-family: GothamLight,Helvetica;
    font-weight: 400;
    text-align: left;
    margin-left: 5px;
    padding-bottom: 0px;
}