/*
Theme Name: wj_2017
Theme URI: #
Author: WJ
Author URI: #
Description: #
Version: 0.1
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: black, gray, white, light, fixed-layout, responsive-layout
Text Domain: WJ
*/

/*
ABOUT FORMATING
http://cssguidelin.es/
*/

/**
*CONTENTS
*
*SETTINGS
*@font-face................Loading external fonts.
*
*BASE
*Headings..................h1-h6 styles
*HTML styling..............<a>, body....
*
*
*OBJECTS
*wj_logo div
*carousel section -> NOT USED right now + Jumbotron_section
*Jumbotron_index_wj
*vertical separator
*spacing for pages -> .single_main
*cards
*cards + send button
*Wrappers

*About Me: language flags + AXE SUD
*About Me: Software icons
*About Me: Rating stars
*
*Drop shadow for images
*arrowed_list
*





/*------------------------------------*\
  #SETTINGS
\*------------------------------------*/

@font-face {
  font-family: "Poppins";
  src: url("https://williamjohnson.eu/wp-content/themes/wj_2017/fonts/poppins/poppins-regular.ttf") format("truetype");
  font-weight: normal;
}

@font-face {
  font-family: "Poppins";
  src: url("https://williamjohnson.eu/wp-content/themes/wj_2017/fonts/poppins/poppins-light.ttf") format("truetype");
  font-weight: 300;
}

@font-face {
  font-family: "Poppins";
  src: url("https://williamjohnson.eu/wp-content/themes/wj_2017/fonts/poppins/poppins-bold.ttf") format("truetype");
  font-weight: 700;
}





/*------------------------------------*\
  #BASE
\*------------------------------------*/

body {
  background-color: #FFF;
  padding-top: 30px; /*To counter fixed top navbar covering content*/
}

h1, h2, h3 {
  -webkit-animation: color-change 10s infinite;
  -moz-animation: color-change 10s infinite;
  -o-animation: color-change 10s infinite;
  -ms-animation: color-change 10s infinite;
  animation: color-change 10s infinite;
}

@-webkit-keyframes color-change {0%{color: #000;} 50%{color: #7600BA;} 100%{color: #000;}}

@-moz-keyframes color-change  {0%{color: #000;} 50%{color: #7600BA;} 100%{color: #000;}}

@-ms-keyframes color-change   {0%{color: #000;} 50%{color: #7600BA;} 100%{color: #000;}}

@-o-keyframes color-change    {0%{color: #000;} 50%{color: #7600BA;} 100%{color: #000;}}

@keyframes color-change     {0%{color: #000;} 50%{color: #7600BA;} 100%{color: #000;}}

h1 {
  font-family: "Poppins", "Arial", sans-serif;
  font-weight: 300;
  font-size: 4rem;
}

h2, h3, h4, h5, h6, p {
  font-family: "Poppins", "Arial", sans-serif;
  font-weight: 300;
}

h4, h5, h6, p , ol, ul, li, a {
  font-family: "Poppins", "Arial", sans-serif;
  font-weight: normal;
}

a {
  color: #7600BA;
}

a:hover, a:focus, a:active {
  color: #000;
  text-decoration: none;
}

nav {
  background-color: #FFF;
  box-shadow: 0px 1px 1px #FFF;
}

footer {
  inherit-color: #FFF;
  border-top:  0.0625rem solid #E5E5E5;
  padding: 4rem 0rem;
  margin: 4rem 0rem 0rem 0rem;
}

textarea, input {
  border: 2px solid #000;
}

/*no_style for send button <input> tag*/
input.wpcf7-submit {
  background-color: inherit;
  border: none;
}


/*------------------------------------*\
  #OBJECTS
\*------------------------------------*/

/*WJ logo*/
#wj_logo_navbar {
  width: 44px;
  height: 0px;
  position: relative;
  top: -10px;
}

#jumbotron_index_wj  {
  background-image: url('https://williamjohnson.eu/wp-content/themes/wj_01/img/wj_logo/BG_jumb_index.svg');
  background-size: 1000px 250px;
  background-repeat: repeat;
}

#wj_logo_footer, #wj_logo_jumbotron {
	max-width: 170px;
	text-align: center;
}

#wj_logo_nav_cell_01, #wj_logo_nav_cell_02, #wj_logo_nav_cell_03, #wj_logo_nav_cell_04, #wj_logo_nav_cell_05, #wj_logo_nav_cell_06, #wj_logo_nav_cell_07, #wj_logo_nav_cell_08, #wj_logo_nav_cell_09, #wj_logo_nav_cell_10, #wj_logo_nav_cell_11, #wj_logo_nav_cell_12, #wj_logo_nav_cell_13, #wj_logo_nav_cell_14, #wj_logo_nav_cell_15, #wj_logo_nav_cell_16, #wj_logo_nav_cell_17, #wj_logo_nav_cell_18, #wj_logo_nav_cell_19, #wj_logo_nav_cell_20, #wj_logo_nav_cell_21, #wj_logo_nav_cell_22, #wj_logo_nav_cell_23, #wj_logo_nav_cell_24, #wj_logo_jumb_cell_01, #wj_logo_jumb_cell_02, #wj_logo_jumb_cell_03, #wj_logo_jumb_cell_04, #wj_logo_jumb_cell_05, #wj_logo_jumb_cell_06, #wj_logo_jumb_cell_07, #wj_logo_jumb_cell_08, #wj_logo_jumb_cell_09, #wj_logo_jumb_cell_10, #wj_logo_jumb_cell_11, #wj_logo_jumb_cell_12, #wj_logo_jumb_cell_13, #wj_logo_jumb_cell_14, #wj_logo_jumb_cell_15, #wj_logo_jumb_cell_16, #wj_logo_jumb_cell_17, #wj_logo_jumb_cell_18, #wj_logo_jumb_cell_19, #wj_logo_jumb_cell_20, #wj_logo_jumb_cell_21, #wj_logo_jumb_cell_22, #wj_logo_jumb_cell_23, #wj_logo_jumb_cell_24, #wj_logo_foot_cell_01, #wj_logo_foot_cell_02, #wj_logo_foot_cell_03, #wj_logo_foot_cell_04, #wj_logo_foot_cell_05, #wj_logo_foot_cell_06, #wj_logo_foot_cell_07, #wj_logo_foot_cell_08, #wj_logo_foot_cell_09, #wj_logo_foot_cell_10, #wj_logo_foot_cell_11, #wj_logo_foot_cell_12, #wj_logo_foot_cell_13, #wj_logo_foot_cell_14, #wj_logo_foot_cell_15, #wj_logo_foot_cell_16, #wj_logo_foot_cell_17, #wj_logo_foot_cell_18, #wj_logo_foot_cell_19, #wj_logo_foot_cell_20, #wj_logo_foot_cell_21, #wj_logo_foot_cell_22, #wj_logo_foot_cell_23, #wj_logo_foot_cell_24 {
  stroke: #fff;
  stroke-width: 1px;
  stroke-opacity: 1;
  stroke-linejoin: round;
}

#wj_logo_nav_cell_01:hover, #wj_logo_nav_cell_02:hover, #wj_logo_nav_cell_03:hover, #wj_logo_nav_cell_04:hover, #wj_logo_nav_cell_05:hover, #wj_logo_nav_cell_06:hover, #wj_logo_nav_cell_07:hover, #wj_logo_nav_cell_08:hover, #wj_logo_nav_cell_09:hover, #wj_logo_nav_cell_10:hover, #wj_logo_nav_cell_11:hover, #wj_logo_nav_cell_12:hover, #wj_logo_nav_cell_13:hover, #wj_logo_nav_cell_14:hover, #wj_logo_nav_cell_15:hover, #wj_logo_nav_cell_16:hover, #wj_logo_nav_cell_17:hover, #wj_logo_nav_cell_18:hover, #wj_logo_nav_cell_19:hover, #wj_logo_nav_cell_20:hover, #wj_logo_nav_cell_21:hover, #wj_logo_nav_cell_22:hover, #wj_logo_nav_cell_23:hover, #wj_logo_nav_cell_24:hover, #wj_logo_jumb_cell_01:hover, #wj_logo_jumb_cell_02:hover, #wj_logo_jumb_cell_03:hover, #wj_logo_jumb_cell_04:hover, #wj_logo_jumb_cell_05:hover, #wj_logo_jumb_cell_06:hover, #wj_logo_jumb_cell_07:hover, #wj_logo_jumb_cell_08:hover, #wj_logo_jumb_cell_09:hover, #wj_logo_jumb_cell_10:hover, #wj_logo_jumb_cell_11:hover, #wj_logo_jumb_cell_12:hover, #wj_logo_jumb_cell_13:hover, #wj_logo_jumb_cell_14:hover, #wj_logo_jumb_cell_15:hover, #wj_logo_jumb_cell_16:hover, #wj_logo_jumb_cell_17:hover, #wj_logo_jumb_cell_18:hover, #wj_logo_jumb_cell_19:hover, #wj_logo_jumb_cell_20:hover, #wj_logo_jumb_cell_21:hover, #wj_logo_jumb_cell_22:hover, #wj_logo_jumb_cell_23:hover, #wj_logo_jumb_cell_24:hover, #wj_logo_foot_cell_01, #wj_logo_foot_cell_01:hover, #wj_logo_foot_cell_02:hover, #wj_logo_foot_cell_03:hover, #wj_logo_foot_cell_04:hover, #wj_logo_foot_cell_05:hover, #wj_logo_foot_cell_06:hover, #wj_logo_foot_cell_07:hover, #wj_logo_foot_cell_08:hover, #wj_logo_foot_cell_09:hover, #wj_logo_foot_cell_10:hover, #wj_logo_foot_cell_11:hover, #wj_logo_foot_cell_12:hover, #wj_logo_foot_cell_13:hover, #wj_logo_foot_cell_14:hover, #wj_logo_foot_cell_15:hover, #wj_logo_foot_cell_16:hover, #wj_logo_foot_cell_17:hover, #wj_logo_foot_cell_18:hover, #wj_logo_foot_cell_19:hover, #wj_logo_foot_cell_20:hover, #wj_logo_foot_cell_21:hover, #wj_logo_foot_cell_22:hover, #wj_logo_foot_cell_23:hover, #wj_logo_foot_cell_24:hover {
  stroke-width: 2px;
  box-shadow: 5px 5px 5px #FFF;
}

/*carousel section -> NOT USED right now*/
#carousel_section, #jumbotron_section {
  margin-bottom: 4rem;
}

/*Jumbotron_index_wj*/
.Jumbotron_index {
	/*background-color: ;*/
}


/*vertical separator*/
.vertical_separator {
  margin: 4rem 0rem;
  border:  0.0625rem solid #E5E5E5;
}

/*spacing for pages -> .single_main*/
.single_main {
  margin-top: 2rem;
}


/* Cards */
.card {
  transition: box-shadow 0.5;
  border-radius: 0px;
  margin-bottom: 2rem;
  padding-bottom: 1rem;
}

.card:hover {
  box-shadow: 0px 1px 2px #DDD;
}

.card-block {
  height: 8rem;
  padding: 2rem;
  overflow: hidden;
}

/* Card image zoom */
.card_img_top_container {
  max-height: 200px;
  border: 0px #FFF;
  overflow: hidden;
}

.card_img_top_container:hover {
  border: 2px #F00;
  transition: border 1s ease;
}

.card-img-top {
  transform: scale(1);
  transition: transform 0.5s ease;
  border-radius: 0px; /*to override bootstrap*/
}

.card-img-top:hover {
  transform: scale(1.05);
  transition: transform 1s ease;
}

/* CARD + SEND buttons animation */
.btn_card, .btn_wj, .wpcf7-submit {
  font-weight: bold;
  color: #fff;
  background-color: #7600BA;
  border: 0px solid #fff;
  text-align: right;
  border-radius: 0px;
}

.btn_card {
  position: absolute;
  bottom: 7rem;
  right: 2rem;
}

.btn_card:hover, .btn_wj:hover, .btn_card:active, .btn_wj:active, .btn_card:active:hover, .btn_wj:active:hover {
  background-color: #000;
  border: 0px solid #fff;
}

.btn_card:after, .btn_wj:after {
  transition: all 0.25s ease;
  content: " >";
  opacity: 0;
  font-weight: bold;
  margin-right: -10px;
}

.btn_card:hover:after, .btn_wj:hover:after {
  margin-right: 0px;
  opacity: 1;
}



/* About Me: Software icons*/
.softw_AI, .softw_PS, .softw_AE, .softw_Fl, .softw_Id, .softw_Blender, .softw_Wordpress, .softw_HTML, .softw_CSS, .icon_degree {
  background-image: url('https://williamjohnson.eu/wp-content/uploads/2015/12/Icons_sprite.png');
  background-repeat: no-repeat;
  height: 32px;
  width: 32px;
  float: left;
}

.softw_AI               { background-position: 0px 0px; }
.softw_PS               { background-position: -32px 0px; }
.softw_AE               { background-position: -64px 0px; }
.softw_Fl               { background-position: -96px 0px; }
.softw_Id               { background-position: -128px 0px; }
.softw_Blender      { background-position: -160px 0px; }
.softw_Wordpress  { background-position: -192px 0px; }
.softw_HTML           { background-position: -224px 0px; }
.softw_CSS             { background-position: -256px 0px; }
.icon_degree         { background-position: -48px -128px; }



/* About Me: language flags + AXE SUD*/
.flag_UK, .flag_France, .flag_Germany, .flag_Italy, .icon_Axe_Sud {
  background-image: url('https://williamjohnson.eu/wp-content/uploads/2015/12/Icons_sprite.png');
  background-repeat: no-repeat;
  height: 32px;
  width: 48px;
  float: left;
}

.flag_UK          { background-position: 0px -32px;   }
.flag_France   { background-position: -48px -32px;  }
.flag_Germany { background-position: -96px -32px;  }
.flag_Italy     { background-position: -144px -32px; }
.icon_Axe_Sud { background-position: 0px -128px; }


.softw_lvl, .lang_lvl {
  font-weight: bold;
  margin: 0rem 0rem 0rem 0.5rem;
}

.list_lang>li, .list_softw>li {
  margin: 0px 0px 1rem 0px;
}

.list_empl>li {
  margin: 0px 0px 1.5rem 0px;
}


/* About Me: Rating stars*/
.rating_star {
	color: #FFB325;
	font-size: 1.2rem;
}

/*About Me Employer Icons*/
.icon_MG, .icon_MT {
  background-image: url('https://williamjohnson.eu/wp-content/uploads/2015/12/Icons_sprite.png');
  background-repeat: no-repeat;	
  height: 32px;
  margin: 0.25rem 0rem;	
}

.icon_MG {  width: 192px;  background-position: 0px -64px;}
.icon_MT {  width: 32px;  background-position: -192px -64px;}

/*Space h2 title from previous section*/
.col-md-4  h2:nth-child(n+3), .container .row:nth-child(n+3) {
	margin-top: 2rem;
}

/*drop shadow for images*/
.drop-shadow {
	box-shadow:	  -0.1rem 0.25rem 0.25rem #DDD;
}

.arrowed_list {	list-style-type: none; padding-left: 1rem; }

.arrowed_list li:before {
	font-weight: bold;
	/* Actual ARROW unicode
	content: "\279C"; */
	content: ">";
	position: relative;
	left: -0.5rem;

}