@charset "utf-8";
/* CSS Document */

/*COMMON ELEMENTS*/



html, body { background-color: #f3f2ed; font-family:'robotolight'; color: #333333; font-size: 15px;  }

p {font-family: 'robotolight'; color:#333;}
.t-small { font-size: 13px;}
@media (max-width: 768px) {
html, body { font-size: 17px; font-family:'robotolight'; }
}

h1, h2, h3, h4, h5, h9 { font-family: 'robotolight';}


h1 a, h2 a, h3 a, h4 a, h5 a, h6 a { color: #0A6D8C; }
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover { text-decoration:underline;}

h1 {font-size: 100px;}
h2 {font-size: 90px;}
h3 {font-size: 55px;}
h4 {font-size: 40px;}
h5 { font-size: 28px; line-height:40px;}
h6 { font-family: 'quicksandbold'; font-size: 18px; line-height:23px;}
h7 { font-size: 18px; line-height:1.1; font-weight:normal;}
h8 { font-family: 'quicksandbold'; font-size: 54px; line-height:1.25;}
h9 { font-size: 25px; line-height: 1.25; font-family:'robotomedium';}



@media (max-width: 768px) {
h1 {font-size: 50px;}
h2 {font-size: 40px;}
h3 {font-size: 30px	}
h4 {font-size: 30px; line-height: 1.25;}
h5 { font-size: 18px; line-height:22px; font-weight: bold;}
h6 { font-family: 'quicksandbold'; font-size: 15px; line-height:18px;}
h7 { font-size: 16px; line-height:1.1;}
h8 { font-size: 30px;}
}

hr.g-line-hr {border: solid 1px #434343; }

.vertical-align {position: relative; top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%);}

.label-custom1 { background-color:#e72e35;}
.label-custom1:hover { background-color:#b32329;}

.btn-sp1 {
	padding: 5px 18px;
margin-bottom: 0;
font-weight: normal;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-top-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
border-radius: 60px;
}

.btn-sp2 {
	padding: 5px 20px;
margin-bottom: 0;
font-weight: normal;
line-height: 1.42857143;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-top-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
border-radius: 60px;
}


.btn-sp1-white {color:#434343;}
.btn-sp1-white:hover { background-color: #434343; color:#fff;}

.btn-sp2-white {color:#fff;}
.btn-sp2-white:hover { background-color: #BDAEAF; color:#434343;}

.btn-grey-v4  { font-family: 'robotomedium'; letter-spacing: 1px; border: 2px solid #333; border-radius: 50px;  background-color: none; color: #333; padding: 10px 18px; text-transform:uppercase; font-size: 11px; margin-top: 4%; display: inline-block;}
.btn-grey-v4:hover  { background-color: #5C5C5C; color: #fff;  text-decoration: none; font-weight: 500;}

@media (max-width: 768px) {
.btn-sp1 {
padding: 5px 10px;
margin-bottom: 0;
font-weight: normal;
line-height: 0.8;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-top-color: transparent;
border-right-color: transparent;
border-bottom-color: transparent;
border-left-color: transparent;
border-radius: 25px;
}
.btn-sp1-white {color:#fff;}
.btn-sp1-white:hover { background-color: #BDAEAF; color:#434343;}

.btn-sp2-white {color:#fff;}
.btn-sp2-white:hover { background-color: #BDAEAF; color:#434343;}
}
.label { font-weight: normal;}
.label-info { background-color:#4693ab;} 
.label-info[href]:hover, .label-info[href]:focus {
    background-color: #316777;
} 

.active-v1 {
  background-color: #fff;
  color: #434343;
}
.active-v1b {
    background-color: #ffffff;
    color: #434343;
  }
.line-v1 {
  position: relative;
  width: 100%;
  background: #999999;
  height: 2px;
  margin: 100px 0;
}
.line-v1 .circle-l {
  position: absolute;
  top: -5px;
  width: 15px;
  height: 12px;
  background: url(../images/icons/icon-line-circle-v1.png) no-repeat #F3F2ED;
}
.line-v1 .circle-r {
  position: absolute;
  top: -5px;
  right: 0px;
  width: 15px;
  height: 12px;
  background: url(../images/icons/icon-line-circle-v2.png) no-repeat #F3F2ED;
}


@media (max-width: 768px) {
  .line-v1 {
    margin: 50px 0;
  }
  .active-v1 {
    background-color: transparent;
    color: #b5b5b5;
  }
  .active-v1b {
    background-color: transparent;
    color: #ffffff;
  }
}

.title-lk-v1 { color: #0A6D8C; font-family: 'robotolight'; font-size:22px; margin-bottom: 30px; }
.text-white { color:#fff;}

.title-v1 { font-family:'robotolight'; color: #0A6D8C; font-size: 18px; margin-bottom:10px;}

.bg-red { background: rgba(255,0,0,0.6)}
.pad-t-10 { padding-top:10px;}
.pad-t-20 { padding-top:20px;}
.pad-t-50 { padding-top:50px;}
.pad-t-80 { padding-top:80px;}
.pad-t-150 { padding-top:150px;}

.pad-b-10 { padding-bottom:10px;}
.pad-b-20 { padding-bottom:20px;}
.pad-b-50 { padding-bottom:50px;}
.pad-b-80 { padding-bottom:80px;}


.box-drop-shawdow {-moz-box-shadow: 0px 3px 5px rgba(0,0,0,0.6);
-webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0.6);
box-shadow: 0px 3px 5px rgba(0,0,0,0.6);}

.text-shadow-v1 {-moz-text-shadow: 2px 3px 5px rgba(0,0,0,0.6);
-webkit-text-shadow: 2px 3px 5px rgba(0,0,0,0.6);
text-shadow: 2px 3px 5px rgba(0,0,0,0.6);}

.glyphicon-wireframe:before { content:url(../images/icons/glyphicons_099_vector_path_all.png);}
.glyphicon-userinterface:before { content:url(../images/icons/glyphicons_150_edit.png);}
.glyphicon-htmlcss:before { content:url(../images/icons/glyphicons_086_display.png);}
.glyphicon-flash:before { content:url(../images/icons/glyphicons_flash.png);}
.glyphicon {margin-right:5px;}


ul.yBullets
 {
 list-style-type: none;
 padding: 0px;
 margin: 0;

 }
 ul.yBullets li
 {
 background-image: url(../images/icons/bullet-arrow.svg);
 background-repeat: no-repeat;
 background-position: 0px 6px; 
 padding-left: 12px;
 margin-bottom:5px; 
 }
ul.yBullets li ul
 {
 padding:0 40px 0 0;
 margin-left: 17px;

 }

 ul.yBullets li ul li
 {
font-size: 0.9em;
 background-image:none;
 padding-left: 0px;
 margin-bottom:5px; 
 }


@media (max-width: 768px) {
ul.yBullets li {background-position: 0px 8px; 
 }	
}
 ul.yBlank
 {
 list-style-type: none;
 padding: 0px;
 margin: 0;
 }
 ul.yBlank li
 {
 background-image: url(../images/icons/bullet-blank.png);
 background-repeat: no-repeat;
 background-position: 0px 4px; 
 padding-left: 12px; margin-bottom:5px;
 
 }

ul.bBullets
 {
 list-style-type: none;
 padding: 0px;
 margin: 0;
 }
 ul.bBullets li
 {
 background-image: url(../images/icons/bullet-arrow-v2.svg);
 background-repeat: no-repeat;
 background-position: 0px 7px; 
 padding-left: 12px;
 margin-bottom:5px; 
	 line-height: 1.3em;
 }
 ul.bBlank
 {
 list-style-type: none;
 padding: 0px;
 margin: 0;
 }
 ul.bBlank li
 {
 background-image: url(../images/icons/bullet-blank.png);
 background-repeat: no-repeat;
 background-position: 0px 4px; 
 padding-left: 12px; margin-bottom:5px;
 
 }

ul.courses {font-size: 11px}
ul.bBullets2
 {
 font-size: 12px;
 list-style-type: none;
 padding: 0px;
 margin: 0;
 }
 ul.bBullets2 li
 {
 background-image: url(../images/icons/bullet-arrow-v2.svg);
 background-repeat: no-repeat;
 background-position: 0px 3px; 
 padding-left: 12px;
 margin-bottom:5px; 
	 line-height: 1.3em;
 }

ul.bBullets2 ul
 {
 font-size: 12px;
 padding: 5px 0 0 0px;
 margin: 0 0 0 10px;
 }
 ul.bBullets2 li ul li
 {
 background-image: none;
 background-repeat: no-repeat;
 background-position: 0px 3px; 
 padding-left: 0px;
 margin-bottom:3px; 
	 line-height: 1.3em;
 }

a.yellowText { color: #0A6D8C; text-decoration:none; }


/*HORIZONTGAL RULE*/
.line-v1-parent { width: 100% }
.line-v1-parent td.g-line {width: 50%}
.line-v1-parent td hr {width:100%; border: 1px solid #333;}



.breadcrumb {
    background-color: #434343;
    border-radius: 0px;
    list-style: outside none none;
    margin-bottom: 0px;
    padding: 8px 30px;
	color:#333;
}
.breadcrumb > li a { color: #fff;}
.breadcrumb > .active { color: #b5b5b5;}
.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #fff;
  content: "/\00a0";
}
.pad-col-space {padding-bottom:15px;}

#toTop { height:35px; width:35px; color: #fff; position: fixed; bottom: 120px; right: 20px; display: none; opacity:0.8;  cursor:pointer;	}
#toTop:hover { opacity:1;}


#master-bg { width:100%;  background-image: url('../images/background/bg-01.jpg');background-size: cover; /*padding-bottom: 30px;*/}
#master-bg-v2 { width:100%;  background: url(../images/background/bg-01.jpg); background-size: cover;}

.btn-lg-v1 { font-family: 'robotolight'; letter-spacing: 5px; border-radius: 50px; border: solid 2px #fff; background-color: transparent; color: #fff; padding: 20px 25px; text-transform:uppercase; font-size: 19px; margin-top: 7%; display: inline-block;}
.btn-lg-v1:hover { text-decoration:none; background-color: #fff; color: #333; cursor: pointer;}
.btn-lg-v1-grey { font-family: 'robotolight'; letter-spacing: 5px; border-radius: 50px; border: solid 2px #434343; background-color: transparent; color: #434343; padding: 20px 25px; text-transform:uppercase; font-size: 19px; margin-top: 20px; display: inline-block;}
.btn-lg-v1-grey:hover { text-decoration:none; background-color: #434343; color: #fff; cursor: pointer;}


.btn-lg-v2 { font-family: 'robotolight'; letter-spacing: 5px; border-radius: 50px; border: solid 0px #fff; background-color: #0D556E; color: #fff; padding: 20px 25px; text-transform:uppercase; font-size: 19px;line-height: 26px; margin-bottom: 0; margin-top: 7%; display: inline-block; }
.btn-lg-v2:hover { text-decoration:none; background-color: #666; color: #fff; cursor: pointer;}

.btn-md-v1 { font-family: 'robotolight'; letter-spacing: 2px; border-radius: 50px; border: solid 2px #fff; background-color: transparent; color: #fff; padding: 10px 12px; text-transform:uppercase; font-size: 10px; margin-top: 7%; display: inline-block;}
.btn-md-v1:hover { text-decoration:none; background-color: #fff; color: #333; cursor: pointer;}

.btn-md-v2 { font-family: 'robotolight'; letter-spacing: 2px; border-radius: 50px; border: solid 2px #fff; background-color:  #0D556E; color: #fff; padding: 10px 12px; text-transform:uppercase; font-size: 10px; margin-top: 7%; display: inline-block;}
.btn-md-v2:hover { text-decoration:none; background-color: #fff; color: #333; cursor: pointer;}


.btn-md-v3 { font-family: 'robotolight'; letter-spacing: 1px; border-radius: 8px; border: solid 2px #fff; background-color:  #0D556E; color: #fff; padding: 10px 12px; text-transform:uppercase; font-size: 14px; margin-top: 7%; display: inline-block;}
.btn-md-v2:hover { text-decoration:none; background-color: #fff; color: #333; cursor: pointer;}


.btn-md-v4 { font-family: 'robotolight'; letter-spacing: 1px; border-radius: 8px; border: solid 2px #fff; background-color: #104A59; color: #fff; padding: 10px 12px; text-transform:uppercase; font-size: 14px; margin-top: 7%; display: inline-block;}
.btn-md-v2:hover { text-decoration:none; background-color: #fff; color: #333; cursor: pointer;}


/*NAVIGATION BAR*/
#top .navbar {
  padding: 42px 30px;
  margin-bottom: 0;
  border-radius: 0px;
  background: none;
/*background: linear-gradient(180deg, rgba(0,0,0,0.4599089635854342) 49%, rgba(0,0,0,0) 100%);*/
  color: #fff;
	border: 0;
}
#top .header-logo { width: 255px; height: 23px;  margin-top:10px; background: url(../images/logo/logo-jc-black.svg) no-repeat; background-size: 255px 23px; cursor: pointer;}
#top .header-logo-v2 { margin-top:-5px; width: 255px; height: 23px;  cursor: pointer;}
#top .navbar-default .navbar-nav { font-family: 'quicksandbold'; color: #fff; font-size: 17px; }
#top .navbar .nav > li > a {
    position: relative;
    display: block;
    padding: 10px 5px;
}
/*#top .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #4ACCE7; background-color: transparent;}
#top .navbar-default .navbar-nav > li > a { color: #fff; background-color: transparent;}
#top .navbar-default .navbar-nav > li > a:hover { color:#FBB03B; background-color: transparent;}*/
#top .navbar-default .navbar-brand:hover { color: #4ACCE7;}


#top .navbar-default .dropdown-menu { font-family: 'robotolight'; background-color: #434343;}
#top .navbar-default .dropdown-menu a { color:#fff;}
#top .navbar-default .dropdown-menu a:hover { background-color:#fff; color:#434343;}
#top .navbar-default { border-color: transparent;}

@media (max-width: 768px) {
	#top .header-logo-v2 { margin-top:-5px; width: 130px; padding-top: 6px;  }
}
 

/*HIDDEN NAV BAR*/
#top-v2 { display: none;}
#top-v2 .navbar { padding: 0px 30px; border-radius: 0px; background-color: #032129; color: #fff;}
#top-v2 .header-logo { margin-top:10px; width: 130px; height: 30px; background: url(../images/logo/logo-p-21.svg) no-repeat; background-size: 130px 30px}
#top-v2 .header-logo-v2 { margin-top:10px; width: 204px; height: 56px; }

#top-v2 .navbar-default .navbar-nav { font-family: 'quicksandbook'; color: #fff; font-size: 24px; }
#top-v2 .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #4ACCE7; background-color: transparent;}
#top-v2 .navbar-default .navbar-nav > li > a { color: #fff; background-color: transparent;}
#top-v2 .navbar-default .navbar-nav > li > a:hover { color: #4ACCE7; background-color: transparent;}
#top-v2 .navbar-default .navbar-brand:hover { color: #4ACCE7;}
#mobile-nav .navbar .navbar-brand-v2 { padding-top:8px;}

#top-v2 .navbar-default .dropdown-menu { font-family: 'robotolight'; background-color: #032129; height: 100px;}
#top-v2 .navbar-default .dropdown-menu a { color:#fff;}
#top-v2 .navbar-default .dropdown-menu a:hover { background-color:#0A6E8C;}

#top-v2 .navbar-default { border-color: transparent;}



/*MOBILE NAVBAR*/
#mobile-nav { position: relative; display: none; z-index: 500;}
#mobile-nav .navbar-default { background-color: #032129; border-color: #e7e7e7; border:0;}
#mobile-nav a { color:#fff;}
#mobile-nav .active a { color:#032129;}

#mobile-nav .navbar-default .navbar-collapse, .navbar-default .navbar-form { border-color:#032129; border-width: 0px;}

#mobile-nav .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #032129;
    background-color: transparent;
}
#mobile-nav .navbar { padding: 10px 10px 5px 15px; border-radius: 0px; background-color:#434343; color: #fff;}
#mobile-nav .header-logo { margin-top:15px; width: 199px; height: 18px; background: url(../images/logo/logo-jc.svg) no-repeat; background-size: 199px 18px;cursor: pointer;}


#mobile-nav .navbar-default .navbar-nav { font-family: 'quicksandbold'; color: #fff; font-size: 15px; }
#mobile-nav .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #4ACCE7; background-color: transparent;}
#mobile-nav .navbar-default .navbar-nav > li > a { color: #FFFFFF; background-color: transparent;}
#mobile-nav .navbar-default .navbar-nav > li > a:hover { color: #C1272D; background-color: transparent;}
#mobile-nav .navbar-default .navbar-brand:hover { color: #4ACCE7;}

#mobile-nav .navbar-default .dropdown-menu { font-family: 'robotolight'; background-color: #434343; box-shadow: none; border:none; }

#mobile-nav .navbar-default .dropdown-menu a { color:#fff;}
#mobile-nav .navbar-default .dropdown-menu a:hover { background-color:#fff; color:#434343;}

#mobile-navs .navbar-default { border-color: transparent;}
#mobile-nav .navbar-default .navbar-toggle {
	position: relative;
float: right;
padding: 11px 14px;
margin-top: 8px;
margin-right: 5px;
margin-bottom: 8px;
background-color: transparent;
background-image: url("../images/icons/hamburger-menu-v1.svg");
background-size: 35px 25px;
background-repeat: no-repeat;
background-position: right;
border: 0px solid transparent;
border-radius: 0px;
}
#mobile-nav .navbar-default .navbar-toggle:hover {
	border-color:#C1272D; border-width: 0px; background-color: transparent;}
#mobile-nav .navbar-default .navbar-toggle .icon-bar {
    background-color: transparent;}
#mobile-nav .navbar .nav > li > a {
    position: relative;
    display: block;
    padding: 15px 5px;
}
#mobile-nav .navbar-right {
	margin-right: 0;
}


@media (max-width: 768px) {
	
#mobile-nav .navbar-default .dropdown-menu { font-family: 'quicksandbold'; background-color:transparent; margin-left: 10px;}
	
#mobile-nav .navbar-default .dropdown-menu a { color:#ffffff;}
#mobile-nav .navbar-default .dropdown-menu a:hover { background-color:#ffffff; color:#434343;}
	
#mobile-nav .navbar-default .navbar-nav { font-family: 'quicksandbold'; color: #fff; font-size: 16px; }
#top .navbar-default { background-color: #032129; border-color: #e7e7e7; border:0;}
#top a { color:#fff;}
#top .active a { color:#032129;}

#top .navbar-default .navbar-collapse, .navbar-default .navbar-form { 
	border-color:#032129; border-width: 0px;
	
	}

#top .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
    color: #032129;
    background-color:#434343;
	font-family: 'quicksandbold';
}
#top .navbar {  border-radius: 0px; background-color: transparent; color: #fff; padding: 10px 10px 5px 10px;
	}
#top .header-logo {
  margin-top: 15px;
  width: 218px;
  height: 20px;
  background: url(../images/logo/logo-jc-black.svg) no-repeat;
  background-size: 218px 20px;
  cursor: pointer;
}

#top .navbar-default .navbar-nav { font-family: 'quicksandbold'; color: #fff; font-size: 16px;  }
#top .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus { color: #4ACCE7; background-color: transparent;}
#top .navbar-default .navbar-nav > li > a { color: #fff; background-color:#434343;}
#top .navbar-default .navbar-nav > li > a:hover { color: #C1272D; background-color: #434343;}
#top .navbar-default .navbar-brand:hover { color: #4ACCE7;}

#top .navbar-default .dropdown-menu { font-family: 'quicksandbook'; background-color: #434343; border-radius: 0;}
#top .navbar-default .dropdown-menu a { color:#fff;}
#top .navbar-default .dropdown-menu a:hover { background-color:#fff; color:#434343;}

#top .navbar-default { border-color: transparent;}
}
#top .navbar-default .navbar-toggle {
    border-color: #C1272D;
	 position: relative;
    float: right;
    padding: 11px 14px;
    margin-top: 8px;
    margin-right: 5px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: url("../images/icons/hamburger-menu-v1-black.svg");
    background-size: 35px 25px;
    background-repeat: no-repeat;
    background-position: right;
    border: 0px solid transparent;
    border-radius: 0px;
}
#top .navbar-default .navbar-toggle:hover {
    border-color: #C1272D; background-color: transparent;
}
#top .navbar-default .navbar-toggle .icon-bar {
    background-color: transparent;
}





/*INDEX SECTION 1*/

#index-section-1 { margin-top: 20px;}

#index-section-1 .mobile-bucket-v1 {
font-family: quicksandbold; 
font-size: 28px;
	color: #fff;
	background: rgba(67, 67, 67, 0.65);
	padding: 20px;
	
}

#index-section-1 .background-1 {
  background: url(../images/elements/mobile-frame-v1.svg);
	filter: drop-shadow(0px 5px 8px rgba(0, 0, 0, 0.7));
}


#index-section-1 .background-2 {
  background: url(../images/elements/mobile-frame-v2.svg);
	filter: drop-shadow(0px 5px 8px rgba(0, 0, 0, 0.7));
}
#index-section-1 .background-3 {
  background: url(../images/elements/mobile-frame-v3.svg);
	filter: drop-shadow(0px 5px 8px rgba(0, 0, 0, 0.7));
}
#index-section-1 .background-1:hover, #index-section-1 .background-2:hover, #index-section-1 .background-3:hover {
	filter: drop-shadow(0px 0px 12px rgba(255, 255, 255, 0.8));
	
}
.cont-link {
	position: relative;
    width: 100%;
    height: 100%;
	
	top:-133px;
}

#index-section-1 .mobile-bucket-v2 {
  top: 0px;
  width: 200px;
  height: 400px;
  background-size: contain;
  background-repeat: no-repeat;
  position: relative;
	margin: auto;
	
}

#index-section-1 .mobile-bucket-v2 .container-1 {
  top: 50px;
  text-align: center;
  position: relative;
  top: 35%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: 'king';
  color: #333334;
  font-size: 30px;

}



#index-section-1 .mobile-bucket-v2 .container-2 {
	position: relative;
  top: 50px;
  text-align: center;
  position: relative;
  top: 35%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: 'king';
  color: #333334;
  font-size: 28px;
line-height: 1.25;
}
#index-section-1 .mobile-bucket-v2 .container-3 {
	position: relative;
  top: 50px;
  text-align: center;
  position: relative;
  top: 35%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  font-family: 'king';
  color: #333334;
  font-size: 30px;
}
#index-section-1 .mobile-bucket-v2 .container-1 img {
	height: 80px;
	margin-bottom: 10px;
}
#index-section-1 .mobile-bucket-v2 .container-1 a{
	 color:#333;
	text-decoration: none;
}
#index-section-1 .mobile-bucket-v2 .container-2 img {
	height: 80px;
	margin-bottom: 10px;
}
#index-section-1 .mobile-bucket-v2 .container-2 a{
	 color:#333;
	text-decoration: none;
}
#index-section-1 .mobile-bucket-v2 .container-3 img {
	height: 80px;
	margin-bottom: 10px;
}
#index-section-1 .mobile-bucket-v2 .container-3 a{
	 color:#333;
	text-decoration: none;
}

#index-section-1 .mobile-bucket-v2 {
	opacity: 100%; cursor: pointer;
}
#index-section-1 .mobile-bucket-v2 .container-1:hover,#index-section-1 .mobile-bucket-v2 .container-2:hover,#index-section-1 .mobile-bucket-v2 .container-3:hover {
	opacity: 100%; cursor: pointer;
	transition: opacity .2s ease-in;
  -moz-transition: opacity .2s ease-in;
  -webkit-transition: opacity .2s ease-in;
  -o-transition: opacity .2s ease-in;
	text-decoration: none!important;
	
}
#index-section-1 .mobile-bucket-v2 .container-content {
	cursor: pointer;
}


#index-section-1 .mobile-bucket-v2 .container-content {
	position: absolute; top:290px; width: 100%; padding: 0 15px 5px 15px; text-align: left;	
}
#index-section-1 .mobile-bucket-v2 .title {
	font-family: quicksandbold; font-size: 15px; border-bottom: 1px solid #000;
}
#index-section-1 .mobile-bucket-v2 .b-text  {
	font-family: quicksandbold; font-size: 10px; text-align: left; margin-top: 10px;
}
#index-section-1 .mobile-bucket-v2 .b-text ul  {
	padding-left: 10px;	
}
#index-section-1 .mobile-bucket-v2 .b-text ul>li {
	font-family: quicksandbold; font-size: 10px; 
}

#index-section-1 h1 { font-size: 40px; font-family: 'robotolight'; text-transform:uppercase; letter-spacing: 4px;  text-align:center; font-size: 26px; }
#index-section-1 h2 { font-size: 40px; font-family: 'robotothin'; text-transform:uppercase; letter-spacing: 0px;  text-align:center; font-size: 180px; }
#index-section-1 .main-pic { position:relative; opacity: 0.7;  width:100%; height:878px; background:url(../images/jasonc-selfie-v1.png) no-repeat; background-position: 0px bottom; background-size: contain; }


#testimonials .description {position: relative; height: 220px; background-color: #0A6D8C; top:-50px; padding: 20px; font-size: 15px;}
 #testimonials p {
	font-family: 'robotolight'; font-size: 15px; color: #fff;
	line-height: 1.25;
}
#testimonials .container-1 {background-color: none; width: 100%; height: 400px; position: relative; filter: drop-shadow(5px 5px 10px #b6b6b2); margin-bottom: 100px;}
#testimonials .container-2 {background-color: #E6F8F8; width: 100%; height: 180px; position: relative; top: 50px; }
#testimonials .proile-image-container {position: relative; top:-70px; text-align: center;}

#testimonials .proile-image-container-3 { position: relative; padding: 0px 20px 20px 20px; text-align: center; top:-60px}

#testimonials .proile-image-container img
{ width:95px;}

#testimonials .author { font-family: 'quicksandbold'; font-size: 18px; color:#0A6D8C; line-height: 1.25}
#testimonials .position { height: 30px; font-family: 'quicksandbold'; font-size: 13px; color:#434343; line-height: 1.25;}





@media (max-width: 768px) {
	#index-section-1 h2  { font-size: 90px;}
	#index-section-1 .main-pic { height:350px;  margin-bottom: 30px;}


	}

@media (max-width: 991px) {
  #index-section-1 .mobile-bucket-v1 {
    font-family: quicksandbold;
    font-size: 35px;
    color: #fff;
    text-align: center;
	  margin-bottom: 30px;
	
  }

#index-section-1 .mobile-bucket-v2 {
	margin-bottom: 20px;
}
	}
/*Index middle*/

#middle .about { width: 100%; min-height: 800px; padding-top: 160px; padding-bottom: 160px; background: url(../images/background-stone-v1.jpg) no-repeat; background-size:cover;}

#middle .about .text-box-v1 {  padding-bottom:60px;}
#middle .about .text-box-v1 p { font-family: 'robotolight'; font-size:22px; color:#525252; }


#middle .portfolio { width: 100%; min-height: 400px; padding-top: 100px; padding-bottom: 0px;   background-color: #F3F2ED;}

#middle .portfolio p { font-size:17px; color:#333;}
#middle .portfolio .item-image { font-size: 0; padding-top:30px;
line-height: 0;
margin: 0 0 38px;
position: relative;
text-align:center;
}
#middle .portfolio img { vertical-align: middle; border: 0; box-sizing: border-box; max-width: 100%; height: auto;}

 .btn-grey-v2  { font-family: 'robotolight'; letter-spacing: 2px; border-radius: 50px;  background-color: #333; color: #fff; padding: 10px 18px; text-transform:uppercase; font-size: 11px; margin-top: 4%; display: inline-block;}
#middle .portfolio .btn-grey-v2:hover  { background-color: #5C5C5C; color: #fff;  text-decoration: none; font-weight: 500;}

 .btn-grey-v3  { font-family: 'robotomedium'; letter-spacing: 0px; border-radius: 50px;  background-color: #EAE8E0; border: 1px solid #434343; color: #434343; padding: 6px 15px; text-transform:uppercase; font-size: 11px; margin-top: 4%; display: inline-block;}




#middle .portfolio .img-corners-top-left { width:19px;
height: 19px;
text-align: left;
float: left;
background-image: url("../images/elements/corner-tl-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}


#middle .portfolio .img-corners-top-right { width:19px;
height: 19px;
text-align: right;
float: right;
background-image: url("../images/elements/corner-tr-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}

#middle .portfolio .img-corners-bottom-left { width:19px;
height: 19px;
text-align: left;
float: left;
background-image: url("../images/elements/corner-bl-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}


#middle .portfolio .img-corners-bottom-right { width:19px;
height: 19px;
text-align: right;
float: right;
background-image: url("../images/elements/corner-br-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}

#middle .case-study { width: 100%; min-height: 400px; padding-top: 100px; padding-bottom: 100px; background: url(../images/gears.png) no-repeat #434343; background-position:50% 25%; background-size: 80%; color: #fff}
#middle .case-study img { width:100%; margin-top: 20px;}

#middle .contact { width: 100%; min-height: 800px; padding-top: 100px; padding-bottom: 100px; background: url(../images/background-stone-v3.jpg) no-repeat; background-size: cover; background-position:right; }

#middle .idf { width: 100%; padding-top: 20px; padding-bottom: 30px; background-color: #76746b;color:#ffffff; }

#middle .idf .btn-wh-v2  { font-family: 'robotolight'; letter-spacing: 2px; border-radius: 50px; border: solid 2px #fff; background-color: solid; color: #fff; padding: 15px 20px; text-transform:uppercase; font-size: 12px; margin-top: 1%; display: inline-block;}
#middle .idf .btn-wh-v2:hover  { background-color: #ffffff; color: #483333;  text-decoration: none; font-weight: 800;}

@media (max-width: 991px) {
  .changeOrder {
    display: flex;
    flex-direction: column;
  }
  .changeOrder .one {
    order: 1;
  }
  .changeOrder .two {
    order: 2;
  }
}

.form-contact .form-control { height:60px; background:transparent; -moz-box-shadow: 0px 3px 5px rgba(0,0,0,0);
-webkit-box-shadow: 0px 3px 5px rgba(0,0,0,0);
box-shadow: 0px 3px 5px rgba(0,0,0,0);  }

.form-contact input  { width:100%; font-size: 20px; padding-left:0px; font-family: 'robotolight'; border-radius: 0; border: 0; border-bottom: 1px solid #525252; }

.form-contact textarea { width:100%; height: 200px; resize:none; background-color: transparent; border: 0; border-bottom: 1px solid #525252; color: #333; font-size: 20px;}

.bottom-nav { width:100%;  padding: 0 20px 15px 20px; min-height: 50px;  background-color: #434343;
color:#fff; 
font-size: 12px; font-family: quicksandbold;
}
.back-transparent { background-color: transparent;}
.bottom-nav .white-line { border-top:#fff solid 0px; margin-top:0px;}


.bottom-nav .header-logo { width: 142px; height: 13px;  margin-top:4px; background: url(../images/logo/logo-jc.svg) no-repeat; background-size: 142px 13px; cursor: pointer;  float: left; }

.bottom-nav .section01 { text-align: left;}
.bottom-nav .section03 { }

@media (max-width: 768px) {
	html, body { background: none; background-color: #f3f2ed;}
.bottom-nav .section01 { text-align: center; padding-bottom: 10px;}
	.bottom-nav .header-logo  { float: none; margin: 0 auto;}
	.bottom-nav .section03 { padding-top: 10px;}
	.bottom-nav .white-line { border-top:#fff solid 0px; margin-top:0px;}
	.bottom-nav { border-top: 0px solid #FBB03A;}
	.bottom-nav .white-line02 { border-top: 0 solid #fff; margin-top: 0;
}
}

@media (max-width: 768px) {
#middle .about { padding-top: 50px;}
#middle .contact { padding-top: 50px;}
#middle .about { background: #F3F2ED;}
#middle .portfolio { background: #f3f2ed; }
#middle .contact { background: #F3F2ED;  min-height: 380px;}
}





/*FOOTER*/

.f-link a:link, .f-link a:visited, .f-link a:active { color:#ffffff;}
footer .section02 { text-align: center;}
footer .section03 { text-align: right; position: relative;}
footer .section02 img {margin: 0 3px;}

@media (max-width: 768px) {
	footer { font-size:11px; text-align: right;}
	footer .section03 { text-align: center;}
}

/*ABOUT PAGE*/
#about-container { min-height: 400px; padding-top:100px; padding-bottom:100px; background: url(../images/background-stone-v2.jpg) no-repeat; background-position: center; background-size:cover;}

.blue-text-title {color:#0A6D8C; font-family: 'robotomedium'; font-size: 19px; }
.position-text {  font-family: 'robotomedium'; font-size: 14px; color:#696969;}

@media (max-width: 1000px) {
#about-container { min-height: 400px; padding-top:100px; padding-bottom:100px; background: url(../images/background-stone-v2.jpg) no-repeat; background-position: left; background-size:cover;}
.icon-bulb { width:30%; padding-bottom: 30px;}
	
}
@media (max-width: 768px) {
#about-container { background: #F3F2ED;  padding-top:50px;}
 .blue-text-title {color:#0A6D8C; font-family: 'robotomedium'; font-size: 20px; }
.position-text {  font-size: 16px; }
}

/*PROJECTS*/

#projects-container {min-height: 400px; padding-top:100px; padding-bottom:0px; background:#F3F2ED;   }

#projects-container p { font-size:17px; color:#333;}

#projects-container .item-image { font-size: 0; padding-top:30px;
line-height: 0;
margin: 0 0 38px;
position: relative;
text-align:center;
	margin-top:20px;
}
#projects-container img { vertical-align: middle; border: 0; box-sizing: border-box; max-width: 100%; height: auto;}

#projects-container .btn-grey-v2  { font-family: 'robotolight'; letter-spacing: 2px; border-radius: 50px;  background-color: #333; color: #fff; padding: 15px 25px; text-transform:uppercase; font-size: 12px; margin-top: 4%; display: inline-block;}
#projects-container .btn-grey-v2:hover  { background-color: #5C5C5C; color: #fff;  text-decoration: none; font-weight: 500; }

#projects-container .bottom-ad { min-height: 50px; width: 100%; border-top: 0px solid #d1686a; padding: 0px 20px 20px 20px; color: #fff;
background-image: url("../images/bg-bottom-background.png"); background-repeat: none; background-size: cover; margin-top: 0px}
#projects-container .bottom-ad .title { font-family: 'robotomedium'; font-size: 42px;color: #fff; line-height: 1.25;}
#projects-container .bottom-ad .sub-text { font-family: 'robotomedium'; font-size: 18px;color: #fff; line-height: 1.25;}


#projects-container .bottom-ad .btn-wh-v2  { font-family: 'robotomedium'; letter-spacing: 2px; border-radius: 50px; border: solid 2px #fff; background-color: solid; color: #fff; padding: 8px 15px; text-transform:uppercase; font-size: 11px; margin-top: 1%; display: inline-block;}
#projects-container .bottom-ad .btn-wh-v2:hover  { background-color: #ffffff; color: #483333;  text-decoration: none; font-weight: 800;}
#projects-container .bottom-ad .button-container {  display:inline-block; text-align: left; margin-top: 35px;
}
#projects-container .bottom-ad img { width: 320px;}
#projects-container .ad-alignment { text-align: left;}
#projects-container .ad-alignment-2 { text-align: right;}

#projects-container .img-corners-top-left { width:19px;
height: 19px;
text-align: left;
float: left;
background-image: url("../images/elements/corner-tl-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}

#projects-container .img-corners-top-right { width:19px;
height: 19px;
text-align: right;
float: right;
background-image: url("../images/elements/corner-tr-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}

#projects-container .img-corners-bottom-left { width:19px;
height: 19px;
text-align: left;
float: left;
background-image: url("../images/elements/corner-bl-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}


#projects-container .img-corners-bottom-right { width:19px;
height: 19px;
text-align: right;
float: right;
background-image: url("../images/elements/corner-br-dark.svg");
background-repeat: no-repeat;
background-size: 19px 19px;
}


@media (max-width: 991px) {
#projects-container .ad-alignment { text-align: center;}	
	#projects-container .ad-alignment-2 { text-align: center;}
.changeOrder {
    display: flex;
    flex-direction: column;
  }
  #projects-container .changeOrder .one {
    order: 1;
  }
  #projects-container .changeOrder .two {
    order: 2;
  }
	
}
@media (max-width: 768px) {
	#projects-container .ad-alignment, #projects-container .ad-alignment-2, #projects-container, #projects-container .bottom-ad .sub-text, #projects-container .bottom-ad .title, #projects-container .bottom-ad .button-container { text-align: center;}
}


/*PORTFOLIO*/
#portfolio-container {min-height: 400px; padding-top:80px; padding-bottom:0px; background:#F3F2ED;   }

#portfolio-container p { font-size:17px; }
#portfolio-container .item-image { font-size: 0; 
line-height: 0;
margin: 0 0 38px;
position: relative;
}
#portfolio-container .item-image img { vertical-align: middle; border: 0; box-sizing: border-box; max-width: 100%; height: auto;}
#portfolio-container .col-md-4 { margin-bottom:100px;}
#portfolio-container .sorting { text-align:center; margin-top:50px; margin-bottom:50px;}
#portfolio-container .sorting ul{ display:inline-block; margin-bottom: 26px;}
#portfolio-container .sorting .nav-tabs {
    border-bottom: 0px solid #ddd;
}
#portfolio-container .sorting ul li a:hover {cursor:pointer;}
#portfolio-container .sorting ul li a { border-radius: 30px; font-size:18px; border: 0px solid #E1E1E1; padding:10px 30px;}
#portfolio-container .sorting ul li a:hover {  background-color:#E9E9E9;} 



/*BOTTOM AD*/
#portfolio-container .bottom-ad { min-height: 50px; width: 100%; border-top: 0px solid #d1686a; padding: 0px 20px 20px 20px; color: #fff;
background-image: url("../images/bg-bottom-background.png"); background-repeat: none; background-size: cover; margin-top: 0px}
#portfolio-container .bottom-ad .title { font-family: 'robotomedium'; font-size: 42px;color: #fff; line-height: 1.25;}
#portfolio-container .bottom-ad .sub-text { font-family: 'robotomedium'; font-size: 18px;color: #fff; line-height: 1.25;}


#portfolio-container .bottom-ad .btn-wh-v2  { font-family: 'robotomedium'; letter-spacing: 2px; border-radius: 50px; border: solid 2px #fff; background-color: solid; color: #fff; padding: 8px 15px; text-transform:uppercase; font-size: 11px; margin-top: 1%; display: inline-block;}
#portfolio-container .bottom-ad .btn-wh-v2:hover  { background-color: #ffffff; color: #483333;  text-decoration: none; font-weight: 800;}
#portfolio-container .bottom-ad .button-container {  display:inline-block; text-align: left; margin-top: 35px;
}
#portfolio-container .bottom-ad img { width: 320px;}
#portfolio-container .ad-alignment { text-align: left;}
#portfolio-container .ad-alignment-2 { text-align: right;}






@media (max-width: 768px) {
	#portfolio-container { padding-top:50px;    }
	#portfolio-container h5 { font-size:15px; line-height: 20px; font-family:'quicksandbold'}
	#portfolio-container .ad-alignment, #portfolio-container .ad-alignment-2, #portfolio-container, #portfolio-container .bottom-ad .sub-text, #portfolio-container .bottom-ad .title, #portfolio-container .bottom-ad .button-container { text-align: center;}

}

/*PORTFOLIO DETAILS PAGE*/
#p-detail-container { min-height: 400px; padding-top:100px; padding-bottom:300px; background: #F3F2ED;}
#p-detail-container .pic-select img { width:100%;}
#p-detail-container .pic-select-height img { max-height:800px;}
#p-detail-container .pic-select { position:relative;}
#p-detail-container .rollover-v1{ width:100%; height:100%; position:absolute; top: 0; background:#0A6E8C; opacity:0; background-image: url(../images/icons/icon-search.png); background-repeat: no-repeat; background-position: 50% 50%; background-size:50px;;}
#p-detail-container .rollover-v1:hover{ cursor:pointer; width:100%; height:100%;  
opacity:0.8; transition: opacity .2s ease-in;
  -moz-transition: opacity .2s ease-in;
  -webkit-transition: opacity .2s ease-in;
  -o-transition: opacity .2s ease-in; }

 
#p-detail-container  .sub-text { font-size:11px;}
#p-detail-container .header-v1 { margin-bottom:100px; text-align:center;}

@media (max-width: 768px) {
#p-detail-container { padding-top:50px; font-family:robotolight;}
#p-detail-container .header-v1 { margin-bottom:50px;}
}
@media (max-width: 991px) {
#p-detail-container .pic-select { margin-bottom: 50px;}		
}
/*EXPERIENCE*/
#experience-container {min-height: 400px; padding-top:100px; padding-bottom:100px; background:#F3F2ED;  }
#experience-container .inside {  margin-left:auto; margin-right:auto;
}
#experience-container .shadow-img  {
 filter: drop-shadow(3px 5px 3px #ccc);
}
#experience-container .textContainers { background: rgba(255, 255, 255, .9); margin: 0 0 10px 0; padding:10px;  }
#experience-container p.exprienceLabel { font-size:14px; line-height:12pt; color:#fff; background-color:#0A6D8C; padding:5px; display: inline-block;}

#experience-container .text-header {
 color: #106E8D; font-family: quicksandbold; font-size: 29px; line-height: 1.2; padding: 0px 10px 10px 0;		
}
#experience-container  .text67 {
font-size: 18px;
}

@media (max-width: 992px) {
	.shadow-img {display:none;}
	#experience-container .text-header {
 color: #106E8D; font-family: quicksandbold; font-size: 23px; line-height: 1.2; padding: 0px 10px 10px 0;
}

@media (max-width: 768px) {
#experience-container { padding-top: 50px;}	
}
#experience-container .margin-top-v1 { margin-top:15px;}
#experience-container .margin-top-v2 { margin-top:8px;}