/*Homepage - I know Michael, I wrote far too many lines*/

/*Asenine*/
@font-face {
    font-family: 'Asenine Wide';
    src: url('../fonts/ASENW___.eot');
    src: url('../fonts/ASENW___.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/ASENW___.woff') format('woff'), 
         url('../fonts/ASENW___.ttf') format('truetype'), 
         url('../fonts/ASENW___.svg#ASENW___') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*Japanese Font*/
@font-face {
    font-family: 'noto sans jp';
    src: url('../fonts/notosansjp.eot');
    src: url('../fonts/notosansjp.eot?#iefix') format('embedded-opentype'),
         url('../fonts/notosansjp.woff') format('woff'),
         url('../fonts/notosansjp.ttf') format('truetype'),
         url('../fonts/notosansjp.svg#noto_sans_jp_regularregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.itemid-550,
.itemid-550 h3,
.itemid-550 .hp {
    font-family: 'noto sans jp';
}
/*Thank You page*/
.body .container {
    border: none;
    border-radius: 0;
    box-shadow: none;
}

/*shitty fix*/
.customcontainer,
.share-container {
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
}
.body .container-fluid {
    padding-right: 0;
    padding-left: 0;
    max-width: 100%;
}
.container-fluid {
    padding-right: inherit;
    padding-left: inherit;
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
}
.subnav-wrapper {
    margin-bottom: 0;
}
.marge,
.more .custom {
    padding-top: 50px;
    padding-bottom: 50px;
}
.marge.grey {
    background: #eee; 
}
.more p {
    padding-left: 25px;
    padding-right: 25px;
}
.iconic-features img:hover {
    -webkit-transform: scale(1.08);
    transform: scale(1.08);
}
.iconic-features img {
    -webkit-transition: all 1s ease-out 0s;
    transition: all 1s ease-out 0s;
}
#fields h3,
#multi h3,
#router h3,
#more h3 {
    font-size: 24px;
    line-height: 28px;
    font-weight: normal;
    color: #5091CD;
    margin-bottom: 4px;
}
#fields h3,
#router h3 {
    margin-top: 0;
}
#multi h3 {
    margin-top: 20px;
}
figure {
    margin-bottom: 20px;
}
.lead {
    font-size: 20px;  
    font-family: 'Open Sans', sans-serif;
  	line-height : 24px;
}
#more .lead,
#multi .lead,
#router .lead {
  	text-align: left;
}

/*Tags Info buttons*/
.info {
    margin-top: 20px;
}
.tag.developer:before {
    color: #91c5ea;
    content: "8";
}
.tag.integrator:before {
    color: #89c764;
    content: ":";
}
.tag.designer:before {
    color: #fec34d;
    content: ";";
}
.tag.developer:before,
.tag.integrator:before,
.tag.designer:before {
    padding-right: 5px;
}
.tag {
    color: #5091CD;
    margin-right: 15px;
    overflow-wrap: normal;
}
.tag:before {
    font-family: "IcoMoon-joomla";
}
.tags {
    text-align: left;
    margin-top: 2px;
}
#more .tags,
#multi .tags {
    text-align: center;
}
#content .jdocs {
    margin-top: 7px;
}
#content .jdocs a {
    margin-left: 4px;
    border: none;
}
.jdocs .btn {
    border-radius: 50px;
}

/*same height*/
#multi .row-fluid,
#more .row-fluid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
#multi .row-fluid.info,
#more .row-fluid.info {
    display: table;
}
#multi .span4,
#more .span4 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column; 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
}
#multi p,
#more p {
    -webkit-box-flex: 1;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
}
#multi p.lead,
#more p.lead {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 0;	
  	flex: 0 1 0;
}

/*3.8*/
#router > .row-fluid,
#fields > .row-fluid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex; 
    -webkit-box-align: center; 
    -ms-flex-align: center; 
	align-items: center; 
    -webkit-box-pack: center; 
    -ms-flex-pack: center; 
	justify-content: center;
}

/*modals*/
.modal_link strong {
  	color: red;
 	font-size: 120%;
  	line-height: 0;
}

/*Bottom feature list*/
ul.category-modulefeatures-home {
    padding-right: 10px;
  	margin: 0;
}
ul.category-modulefeatures-home li:before {
    color: #8fc6e3;
    content: "G";
    display: table-cell;
    font-family: "IcoMoon-joomla";
    padding-right: 10px;
}
ul.category-modulefeatures-home li {
    display: table;
    color: #777;
    margin-bottom: 5px;
}
.more {
    background: #eee;
}
.more .btn-primary {
    border-radius: 50px;
    box-shadow: 0 3px 15px -10px rgba(0, 0, 0, 1);
    margin: 14px;
}
.more p {
    margin-top: 9px;
}
#content p,
#multi p {
    text-align: justify;
}

/*Language Switcher - Menu*/
div.mod-languages img {
    display: none;
}
.mod-languages .btn {
    background: transparent;
    color: #fff;
    border: none;
}
div.mod-languages ul {
    border-radius: 0;
    right: 0;
    left: auto;
    max-height: 15em;
    overflow-y: auto;
}
.mod-languages .caret {
    border-top: 4px solid #fff;
    margin-right: 10px;
}
.btn-group.open .btn.dropdown-toggle {
    background-color: #1a3867;
    border-radius: 0;
}
.mod-languages a {
    padding-bottom: 8px;
    padding-top: 8px;
}
div.mod-languages .lang-block li {
    margin-left: 0;
    margin-right: 0;
}

/*banner module*/
.banner {
    background: #13233d;
    padding-bottom: 20px;
    margin-top: -1px;
}
.banner .light {
    background: #25304e;
    padding: 20px 0;
}
.banner .icons img:hover {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
    transition: transform .5s ease;
}
.banner .icons img {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: transform .3s ease;
}
.banner .icons .bas {
    margin-left: -40px;
    margin-right: -40px;
    padding-top: 140px;
}
.banner h2 {
    color: #fff;
}
.banner h2 {
    font-size: 60px;
    font-weight: normal;
    line-height: 3rem;
    padding: 50px 0 20px 0;
    margin: 0;
    font-family: 'Asenine Wide';
}
.banner h3 {
  	color: #5a6b98;
  	font-size: 40px;
  	line-height: 30px;
  	padding: 10px;
}
.banner .btn {
    background: #8fc6e3;
    border: none;
    border-radius: 50px;
    box-shadow: 0 3px 0 0 rgba(0, 0, 0, 0.1);
    font-size: 28px;
    font-weight: bold;
    margin: 20px 10px;
    padding: 15px 50px;
}
.banner .btn:hover {
    background: #85b8d3;
    -webkit-transition: background-position 0.1s linear 0s;
    transition: background-position 0.1s linear 0s;
}
.banner h2 img {
    margin-top: -6px;
    padding-right: 5px;
}

/*content HP*/
.hp {
    color: #5091cd;
    font-size: 26px;
    margin-bottom: 30px;
}
.marge .btn {
    margin: 5px;
    padding: 7px 15px;
}
#multi img,
#fields img,
#router img {
    box-shadow: 0 5px 15px -10px rgba(0, 0, 0, 1);
    margin-bottom: 10px;
}

/*anchors*/
#fields:target,
#multi:target,
#router:target,
#more:target,
#wait:target {
    margin-top: -100px;
    padding-top: 100px;
}

/*Responsive Display - Note to Michael: for your sanity, avoid looking at this part. 767 to 769 are making my life miserable*/
@media only screen and (max-width: 1199px){
	.customcontainer {
    	padding-left: 20px;
    	padding-right: 20px;
	}
}

@media only screen and (min-width: 980px) and (max-width: 1199px){
	.marge .btn {
    	padding: 7px;
	}
}
 
@media only screen and (min-width: 769px) and (max-width: 979px){
	.tag {
    	display: block;
	}
	.icons img {
    	width: 17%;
	}
}

@media only screen and (max-width: 768px){
	.customcontainer {
    	padding-left: 20px;
    	padding-right: 20px;
	}
	.container-fluid {
    	padding-left: 0;
    	padding-right: 0;
	}  
	.more .pull-right {
    	float: none;
	} 
	.info {
    	margin-bottom: 30px;
	}
  	.info,
    .tags {
    	text-align: center;
  	}
	#multi .row-fluid, 
	#more .row-fluid,
	#router > .row-fluid,
	#fields > .row-fluid {
    	display: table;
	}
	.marge.grey {
  		background: transparent;
	}
  	.banner h3 {
  		font-size: 30px;
	}
}

@media only screen and (min-width: 482px) and (max-width: 768px){
	ul, ol {
    	padding: 0;
    	margin: 0 0 0 25px;
	}
	.moduletable.banner,
	.moduletable.more,
	.more {
    	margin: 0 -20px;
	}
	.more {
    	padding-left: 20px;
    	padding-right: 20px;
	} 
	.icons img {
    	width: 20%;
    	margin-bottom: 10px;
	}  
	#more p {
    	min-height: auto;
	}
	#more img {
    	margin-top: 30px;
	}
	.banner .icons .bas {
    	padding-top: 160px;
	}
	.banner .icons .haut {
    	margin-top: -60px;
	}
	.icons img {
    	width: 18%;
	}
	.marge {
  		padding-bottom: 0;
	}
}

@media only screen and (max-width: 481px){
	.more {
    	padding-left: 20px;
    	padding-right: 20px;
	}
	.moduletable.banner,
	.more {
    	margin: 0 -20px;
	}
	.icons img {
    	width: 20%;
	} 
	#more img {
    	margin-top: 50px;
	}
	.container {
    	width: 100%;
	}  
	.banner .icons .bas {
    	padding-top: 160px;
	}
	.banner .icons .haut {
    	margin-top: -60px;
	}
	.btn-toolbar .btn-group {
    	width: 60%;
	}
	.btn-toolbar .btn-group + .btn-group {
    	margin-left: 0;
	}
}