#iframe-container {
	-webkit-overflow-scrolling: touch;
  	overflow-y: scroll;

	/* important:  dimensions or positioning here! */
}

#iframe-container iframe {
	/* nada! */
}

.graph_container{
  display:block;
  width:100%;
}

body{

	border:0;

	margin:0;

	padding:0;

}

strong{font-weight:700;}

h1{

	font-family: 'Roboto Condensed' , sans-serif;

	color: #fff;

	font-size:45px;

	line-height: auto;

	letter-spacing: -1px;

	font-weight: 300;

	transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

    -o-transition:all 0.3s ease;

}

h2{

	font-family: 'Roboto Condensed' , sans-serif;

	font-weight: 300;

	color: #004fa3;

	font-size:48px;

	line-height: 50px;

	letter-spacing: -1px;

}

h3{

	font-family: 'Roboto Condensed' , sans-serif;

	font-weight: 300;

	font-size:36px;

	line-height: 46px;

	letter-spacing: -1px;

}

.dark-blue{

	color: #004fa3;

	font-weight: 400;

}

.light-blue{

	color: #44c8f5;

	font-weight: 400;

}

	p.strong{

		font-weight: 700;

	}

.cont-wrap{

	padding-top:20px;

}

.cont-wrap h2{

	margin-bottom: 20px;

}

.cont-wrap h5{

	margin-bottom: 50px;

	text-transform: uppercase;

	font-weight: 300;

	letter-spacing: 4px;

}

.cont-wrap p{

	margin-bottom: 15px;

	margin-top: 15px;

	line-height: 23px;

	color: #3b454c;

	font-size: 18px;

	

}p.topic{

	font-family: 'Roboto Condensed' , sans-serif;

	font-size:20px;

}



#header{

	z-index:10;

}



.cont-wrap ul{

	margin-left: 20px;

	color: #3b454c;

	font-size: 16px;

	line-height: 23px;

}



.clearfix:after {

  visibility: hidden;

  display: block;

  font-size: 0;

  content: " ";

  clear: both;

  height: 0;

}

* html .clearfix             { zoom: 1; } /* IE6 */

*:first-child+html .clearfix { zoom: 1; } /* IE7 */



#retail-hero{

	margin-top:-125px;

	background: #3f6dac;

	height:auto;

	transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

    -o-transition:all 0.5s ease;

}



.conclusion{

	background: #2757a0;

	transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

    -o-transition:all 0.5s ease;

	 background-image:

    radial-gradient(

	circle farthest-side,	

      #759fc7,

      #2757a0

    );

}

.conclusion p{

	color: #ffffff;

	font-weight:100;

	font-size:22px;

	line-height: 28px;

	margin-bottom: 0px;

}

.conclusion h2{

	color: #ffffff;

	margin-bottom: 22px;

}

p.text-large{

	font-size: 30px;

	font-family: 'Roboto Condensed' , sans-serif;

	font-weight: 100;

}



.thin{

	font-weight:300;

}

.max{

	background: rgba(34,59,102,1) !important;

	transition: all 0.5s ease;

	-moz-transition: all 0.5s ease;

    -o-transition:all 0.5s ease;

}



.max h1{

	transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

    -o-transition:all 0.3s ease;

	margin-top: -20px;

}

#retail-hero .r-col, #retail-hero h1, #retail-hero p{

	text-align: center;

	

}

#retail-hero p{

	color: #fff;

	font-size: 20px;

	font-weight: 300;

	line-height: 30px;

	margin-top: 10px;

}

.hero-image-wrap{

	max-width: 100%;

	margin:0 auto;

}

.hero-image{

	/*background: url(../img/hero-c.jpg) center top no-repeat;*/

	background-size: 1200px;

	height:auto;

	opacity:1;

		transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

    -o-transition:all 0.3s ease;

	    max-width: 1366px;

    margin: 0 auto;

}

.hero-image::after{



	background: #b5b5b5;

	content:'';

	position:absolute;

	width:50%;

	left:0;

	top:0;

	height:100vh;

	z-index:1;

	max-height:980px;



}

/*.wow{

	    transform: scale(1.1);

  

	opacity: 0.5;

		transition: all 0.3s ease;

	-moz-transition: all 0.3s ease;

    -o-transition:all 0.3s ease;

}*/



.hero-text-wrap{

	z-index: 6;

	position: absolute;

	width:1366px;

	    top: 0;

}

.white-back{

	background:#ffffff;

}

.col-wrap{

	width:1120px;

	margin:0 auto;

	    padding-top: 150px;

	    padding-bottom: 120px;

}

.white-back .col-wrap{

	padding-bottom: 150px;

	}

.r-right, .r-left{

		padding: 30px;

	}

.col-wrap:after {

  visibility: hidden;

  display: block;

  font-size: 0;

  content: " ";

  clear: both;

  height: 0;

}

.r-left{

	float: left;

	width: 50%;

}

.r-right{

	float: right;

	width: 50%;

}



.btn-default {

    font-size: 16px;

    padding: 13px 26px;

	font-family: 'Roboto Condensed', sans-serif;

	    border-radius: 4px;

	display: inline-block;

	margin-top: 30px;

	-moz-box-shadow: 0px 3px 10px rgba(0,0,0,0.1);

    box-shadow: 0px 3px 10px rgba(0,0,0,0.1);

}

.btn-default, .btn-default:visited, .btn-default:active, .btn-default:focus {

    background: #f1a121;

    border-color: #f1a121;

    color: #fff;

    -webkit-transition: all 0.2s ease;

    -moz-transition: all 0.2s ease;

    transition: all 0.2s ease;

}

.btn-default:hover, .btn-default:active:hover {

    background: #E19400;

    border-color: #E19400;

    color: #fff;

    -moz-box-shadow: 0px 3px 10px rgba(0,0,0,0.2);

    box-shadow: 0px 3px 10px rgba(0,0,0,0.2);

	text-decoration: none;

}

.btn-large{

	font-size: 24px;

    padding: 18px 45px;

}

.white-back{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	transform: skewY(0deg);

}

.white-back.rot{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	transform: skewY(3deg);

}

.white-back.rot .col-wrap{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	transform: skewY(-3deg);

}

.rot-opp{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	transform: skewY(-3deg);

}

.rot-opp .col-wrap{

	transform: skewY(3deg);

		transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;



}

.bloc1, .bloc2, .bloc3{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	opacity:0;

	margin-top:50px;

}



.appear{

	transition: all 0.5s ease-out;

	-moz-transition: all 0.5s ease-out;

    -o-transition:all 0.5s ease-out;

	opacity:1;

	margin-top:0;

}

.delay1{

	-webkit-transition-delay: 0.15s; /* Safari */

    transition-delay: 0.15s;

}

.delay2{

	-webkit-transition-delay: 0.3s; /* Safari */

    transition-delay: 0.3s;

}

.delay3{

	-webkit-transition-delay: 0.45s; /* Safari */

    transition-delay: 0.45s;

}



#beacon-networks{

	margin-top:-50px;

}

.arrow-down-0{

	z-index: 10;

	width: 50px;

    height: 50px;

    position: absolute;

    left: 50%;

    bottom: 31px;

    opacity: 1;

    background: rgba(250,250,250,0);

    border-radius: 100%;

	transition: all 0.3s ease-out;

	-moz-transition: all 0.3s ease-out;

    -o-transition:all 0.3s ease-out;

}

.arrow-down-0:hover{

    background: rgba(250,250,250,0.2);

	transition: all 0.3s ease-out;

	-moz-transition: all 0.3s ease-out;

    -o-transition:all 0.3s ease-out;

	cursor: pointer;

}

.arrow-down{



    margin-left: 8px;

    margin-top: 7px;

	background: url(../img/ico-arrow-down.png);

	width: 34px;

	height:34px;

	-webkit-animation: mymove 0.8s infinite; /* Safari 4.0 - 8.0 */

    animation: mymove 0.8s infinite;

}

.main-nav-list{

	margin-top:-16px;

	

}

.gap-1{

	height:100px;

}

.gap-2{

	height:30px;

}

.subtitle{

	font-weight: 300;

}

p.info-num{

	font-size:4rem;

	color:#44c8f5;

	font-weight: 500;

	margin-left:20px;

	float:left;

}

p.info-text{

	color: #6d6e71;

	font-size:1.4rem;

	max-width: 230px;

	margin-top: 0;

	font-weight: 300;

	line-height: 28px;

	margin-left:20px;

	float:left;

}

.nav-pills .nav-link{

	border: 1px solid #bcbec0;

    margin: 5px;
	padding: 6px;
	font-size: 14px;
	line-height: 18px;

	transition: all 0.2s ease-out;

	-moz-transition: all 0.2s ease-out;

    -o-transition:all 0.2s ease-out;

}

.nav-pills .nav-link:hover{

	background-color: #f1a121;

	border: 1px solid #f1a121;

	color: #ffffff;

	transition: all 0.2s ease-out;

	-moz-transition: all 2.5s ease-out;

    -o-transition:all 0.2s ease-out;

}

.nav-pills .nav-link.active{

	 background-color: #f1a121;

	border: 1px solid #f1a121;

}

a.nav-link{

	color:#6d6e71;

}

.nav {

    display: -ms-flexbox;

    display: inline-flex;

    -ms-flex-wrap: wrap;

}

.tab-content>.active {

    min-height: 300px;

}



.demo-block{

	margin:30px;

	margin-bottom:0;

	width:150px;

	display:inline-block;

	vertical-align: top;

}

.demo-block p{

	font-size:16px;

	font-weight:500;

}



/* Safari 4.0 - 8.0 */

@-webkit-keyframes mymove {

    0%   {margin-top: 5px; opacity: 1;}

    100% {margin-top: 7px; opacity: 0;}

}



/* Standard syntax */

@keyframes mymove {

     0%   {margin-top: 5px; opacity: 1;}

    100% {margin-top: 7px; opacity: 0;}

}







/*  slider */



.ba-slider {

    position: relative;

    overflow: hidden;

	 z-index: 2;

	    height: 100vh;

	max-height:980px;

}

 

.ba-slider img {

    width: 100%;

    display:block;

	   

}

 

.resize {

    position: absolute;

    top:0;

    left: 0;

    height: 100%;

    width: 70%;

    overflow: hidden;



}

.resize-load{

	width: 83%;

	transition:all 0.5s ease;

}

.resize-end{

	width: 83%;

}



.handle { /* Thin line seperator */

  position:absolute; 

  left:70%;

  top:0;

  bottom:0;

  width:30px;

  margin-left:-14px;

  cursor: ew-resize;



}

.handle-load{

	left: 83%;

	transition:all 0.5s ease;



}

.handle-end{

	left: 83%;



}

.handle-bar { /* Thin line seperator */

    width: 2px;

    margin-left: 14px;

    background: #ffffff;

    display: block;

    height: 100%;



}

 

.handle:after {  /* Big orange knob  */

	font: normal normal normal 14px/1 FontAwesome;

    position: absolute;

	z-index: 10;

    top: 50%;

    width: 64px;

    height: 64px;

    margin: -32px 0 0 -5px;

 

    content:'\f105';

    color:white;

   

    font-size:36px;

    text-align:center;

    line-height:64px;

    

    transition:all 0.3s ease;

	animation: ani-handle 1s ease infinite;

      

}

.handle:before {  /* Big orange knob  */

	font: normal normal normal 14px/1 FontAwesome;

    position: absolute;

	z-index: 10;

    top: 50%;

    width: 64px;

    height: 64px;

    margin: -32px 0 0 -29px;

 

    content:"\f104";

    color:white;



    font-size:36px;

    text-align:center;

    line-height:64px;

    

    transition:all 0.3s ease;

	animation: ani-handle 1s ease infinite;

      

}

@keyframes ani-handle {

  0%   {  opacity:0.3;  }

  50%  {  opacity:0.8;}

  80%  {  opacity:0.3;}

  100% {  opacity:0.3;}



}

.draggable:after {

    width: 48px;

    height: 48px;

    margin: -24px 0 0 -0px;

    line-height:48px;

    font-size:30px;

}

.draggable:before {

    width: 48px;

    height: 48px;

    margin: -24px 0 0 -18px;

    line-height:48px;

    font-size:30px;

}



/*  slider end */



.hero-btn{

	position: absolute;

    top: 30vh;

    left: calc(50% - 123px);

}

#cb-1-link{

	margin-top:-100px;

	margin-bottom: 100px;

}





@media (min-width: 1180px){

#page {

    height: auto;

}

#header .container #header-region{

	width: 943px;

}

#header .container {

    max-width: 1140px;

}	

.tab-lan{

	    display: none;

}	

	

}







@media (min-width: 768px) and (max-width: 1179px) {

 	.col-wrap{

		width: 768px;

    	margin: 0 auto;

	}



	h1{

		font-size: 44px;

    	line-height: 44px;

	}

	#hero-image {

	margin-top: 50px;

}

	#header .container #header-region #block-mp-mypage-save-jobs-block a {

    padding: 15px 0 15px 0;

}

.hero-text{

	    margin-top: 50px;

}

	



}

@media (min-width: 767px) and (max-width: 768px) {

	.hero-image{

	background-size: cover;

}
.hero-text{

	    margin-top: 120px;

}



}



.mob-lan{

	    color: #706F6F;

		display:none;

}

.tab-lan{

	    color: #706F6F;

	    top: 14px;

        right: 270px;

	    position: absolute;

}



@media (max-width: 767px) {


	.mob-lan{

		display:block;

}

		#hero-image {

	margin-top: 50px;

}

	.hero-image{

	background-size: cover;

}

	.col-wrap{

		width: 100%;

    	margin: 0 auto;

	}

	

	.r-right, .r-left{

		display: block;

		width: 100%;

		float: none;

		padding:25px;

		padding-bottom: 0px;

	}



	h1 {

    font-size: 32px;

    line-height: auto;

}

/*#retail-hero{

	height:100vh;

}*/

#hero-image-wrap{

	margin-top: 0;

}

#hero-image {

  height:100vh;

}

#retail-hero .r-col, #retail-hero h1, #retail-hero p {

   

    padding: 0 10px;

}

.col-wrap {

    padding-top: 50px;

    padding-bottom: 50px;

}

	#retail-hero {

    padding-top: 0;

}



	.white-back.rot .col-wrap {

        padding-bottom: 20px;

}

	h2 {



    font-size: 39px;



}

	.hero-text {

    margin-top: 80px;

    padding: 0 15px;

}

	#retail-hero p {



    font-size: 14px;

    line-height: 20px;

}

	.arrow-down, .arrow-down-0{

		left:44%;

	}

}











/* 1366x768 */

@media  (max-width: 1366px) {

  .ba-slider img {

    margin-top: -3vh;

}

.ba-slider, .hero-image::after {

   height:auto;

}

.hero-text-wrap {

    width: 100%;


}

.hero-btn {

    top: 160px;

}



}



/* ipad landscape */

@media  (max-height: 768px) and (max-width: 1024px) {

.ba-slider, .hero-image::after {

   height:auto;

}

.ba-slider img {

    margin-top: 3vh;

}

	#retail-hero {

    margin-top: -100px;

	}

.hero-text {

    margin-top: 24vh;

}

.hero-btn {

    top: 28vh;

}

}



/* ipad portrait */

@media (max-height: 1024px) and (max-width: 768px) {

/*.ba-slider, .hero-image::after {

   height:58vh;

}*/

.ba-slider img {

    margin-top: 0;

}

	#retail-hero {

    margin-top: -100px;

	}

.hero-text {

	width: 80%;

    margin: 0 auto;

    margin-top: 50px;

}

.hero-btn {

    top: 150px;

}

}



.cont-wrap img{

	max-width:100%;

}



@media (max-width: 767px) and (min-width: 501px) {

	

	#retail-hero, #page, .container{

	/*min-width: 767px !important;*/

}

}









@media (max-width: 500px) {

.hero-text-wrap {

    width: 100%;

	margin-top: 20px;

}
	#retail-hero, .container{

		min-width:300px;

	}

	.hide-mob{

		display: none !important;

	}

	.hero-image{

		overflow: hidden;

	}

	.ba-slider{

		width: 100%;

		height: auto;

	}	

	.ba-slider img {

    margin-top: 0;

}

.resize {

    width: 90%;

}





.handle { /* Thin line seperator */

  left:90%;

}

.hero-text {

    width: 88%;

    margin-top: 15px;

	    height: auto;

	}

#retail-hero .hero-text p{

   margin-top:10px;

	font-size:16px;

	}	

h1 {

    font-size: 36px;

    line-height: 36px;

}

.hero-btn {

    top: 250px;

	left: calc(50% - 96px);

}

.btn-large {

    font-size: 20px;

    padding: 14px 30px;

}

p.info-num, p.info-text{

	float:none;	

	text-align: center;

	margin: 20px auto;

	}	

.cont-wrap {

    padding-top: 40px;

}

	.gap-1 {

    height: 40px;

}

}



@media (max-width: 325px) {

	.hero-text {



    margin-top: 0;

	

	}

}







@media (min-width: 501px) {

		

	.hide-pc{

		display: none !important;

	}

}

@media (max-height: 501px) {

	#retail-hero, .container{

		min-width:320px;

	}	

.ba-slider, .hero-image::after {

    height: 89vh;

}

.hero-text {

    width: 90%;

    margin-top: 5vh;

}

	h1 {

    font-size: 26px;

    line-height: 34px;

}

.ba-slider img {

    margin-top: 0vh;

}

.hero-btn {

    top: 35vh;

	left: calc(50% - 96px);

	font-size: 20px;

    padding: 14px 30px;

}

#retail-hero p {

    font-size: 13px;

}	

}









@media print {

    #footer, #retail-hero, #page{

        display: none;

    }

    .container {

        margin: 0px;

        padding: 0px;

    }

    * {

        color: #000;    

        background-color: #fff;

        @include box-shadow(none);

        @include text-shadow(none);

    }

	.col-sm-5{

		width:50%;

		float:left;

	}

	.pre { 

    page-break-before : always;
  }

  

}





/*hamberger hide*/

#header .container .mobile-menu{

	display: none !important;

}

#header .container .logo {

	top:0 !important;

}

/* ---   */



/* Loading */

#loading {

    display: block;

    position: absolute;

    top: 0;

    left: 0;

    z-index: 100;

    width: 100%;

    height: 100vh;

    background-color: #ffffff;

   /* background-image: url("http://i.stack.imgur.com/MnyxU.gif");*/

    background-repeat: no-repeat;

    background-position: center;

}





.loading-bro {

  margin: 0 auto;

	margin-top: calc(50vh - 50px);

  width: 50px;

}



#load {

		width: 50px;

    animation: loading 2s linear infinite;

   

	}

 #loading-inner {

		  

        stroke-dashoffset: 0;

        stroke-dasharray: 300;

        stroke-width: 10;

        stroke-miterlimit: 10;

        stroke-linecap: round;

      

      animation: loading-circle 2s linear infinite;

      stroke: #bbb;

      fill: transparent;

    }



@keyframes loading {

		0% { 

      transform: rotate(0); 

    }

		100% { 

      transform: rotate(360deg);

    }

}

@keyframes loading-circle {

		0% { 

      stroke-dashoffset: 0

    }

		100% { 

      stroke-dashoffset: -600;

    }

}



/* ---   */