/* CSS Document */

html{/*background-image:url(../../images/index/test-cog2.jpg);*/
background-color:#333;
background:#15263c;
/*background: linear-gradient(to bottom, #153156, #0c1e3b);
background-position:0 -100px;
background-repeat:no-repeat;
background-attachment: fixed;
background-size:cover;
background-repeat:no-repeat*/
}

/*/nav{
background-color:#153156;
box-shadow:none;
}*/

.sections{
padding:0.5em 0  ;

}

#global-search{
display:none;
}


.bodyGrad{
/*background: linear-gradient(to bottom, #153156, #0c1e3b);*/
}

#scrollBlock {

width:100%;
/*clear:both;*/

}

#scrollBlock .fadein{
min-height:100% !important;
height:100%;

/*opacity:0;*/
}

#scrollBlock .section{
background:#fff;

}

div#feature div#flippers{ 
position:relative


}

select.selector{
padding:0;
max-width:15em;
display:inline;

}

.select2{
border:1px solid #ccc;
border-radius:3px;
padding:0;

min-height:2em;

}


div#feature #feature_content{ 
max-width:76.125em;
margin:0 auto;
text-align:right;
margin-top:5em;
padding:2em;

}

.shadow{
text-shadow: 1px 1px 2px rgba(0,0,0,0.9);
}


.colOne{
position:relative; width:100%;  max-width:42.6%
}

.colTwo{
position:relative; width:100%; max-width:20.4%
}


.colThree{
position:relative; width:100%; max-width:31.7%
}

/*## FLIP ##*/
#numFlips  li{
display:inline-block;
height:100%;
margin:0;
position:relative;
width:100%;
margin-right:-4px;
margin-left:1em
}
#numFlips  li ul li{
display:inline-block;
margin:0;
margin-right:-4px;
margin-left:1em;
margin-bottom:1em;
}
#numFlips  li.inlineBox{
position:relative; width:29.20%;
}

.back .title{
line-height:1.5em; border-radius:0.5em; 
}

.question option:first {
    color: #990;
	font-style:italic
}


/* entire container, keeps perspective */
.flip-container {
	perspective: 1000;
	transform-style: preserve-3d;
	position:relative;
	
	

	
}

dl.question dt label{
background:#b9cdd6;
}

dl.question dt{
width:30%;
}

dl.question dd{
width:65%;
}

.flip-container, .front, .back {
	width: 100%;
	border-radius: 1em
	
	
}

/* flip speed goes here */
.flipper {
	
	transition: 0.8s;
	transform-style: preserve-3d;
	position: relative;
	
}

/* hide back of pane during swap */
.front, .back {
	backface-visibility: hidden;
	transition: 0.6s;
	transform-style: preserve-3d;
	position: absolute;
	
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	
}

.flip-container:before {
	content: "";
	display: block;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}
/* front pane, placed above back */
.front {
	z-index: 2;
	color:#fff;
	
	/* for firefox 31 */
	transform: rotateY(0deg);

}

.front div, .back div{
padding:1em 0.6em;
}

/* back, initially hidden pane */
.back {
background:#eee;
transform: rotateY(180deg);
cursor:pointer;
}

.back:hover {
box-shadow:0px 0px 1em rgba(88,144,0,0.9);

}












#main-links li svg{

vertical-align:middle
}


#main-links li:hover{
opacity:0.6;
/*padding-top:2.5em;*/
box-shadow:2px 2px 3px rgba(0,0,0,0.3)
}


#main-links li h2{
position: absolute;
display:inline;

width:100%;


    bottom: 1em;
    left: 0;
	text-align:center
}


#main-links li{
width:24.5em;
display:inline-block;
margin-right:1em;
height:9em;
vertical-align:text-bottom;
position:relative;
padding:1.5em 0;
cursor:pointer;
-webkit-transition: opacity 0.5s, box-shadow 0.5s; /* Safari */
    transition: opacity 0.5s, box-shadow 0.5s;
}






#secondary-links li svg{

vertical-align:middle
}


#secondary-links li:hover{
opacity:0.6;
/*padding-top:2.5em;*/
box-shadow:2px 2px 3px rgba(0,0,0,0.3)
}


#secondary-links li h2{
position: absolute;
display:inline;

width:100%;


    bottom: 1em;
    left: 0;
	text-align:center
}

#secondary-links li{
width:24.5em;
display:inline-block;
margin-right:1em;
height:7em;
vertical-align:text-bottom;
position:relative;
padding:1.5em 0;
cursor:pointer;
-webkit-transition: opacity 0.5s, box-shadow 0.5s; /* Safari */
    transition: opacity 0.5s, box-shadow 0.5s;
}



#global-searchbar,#search_button{display:none;}


.front .switch{position:absolute; bottom:-0.5em; right:0em; cursor:pointer;}


.front .switch svg, .front .switch svg path, .front .switch svg rect{fill: rgba(255,255,255,0.5);
-webkit-transition: fill 0.5s,transform 0.5s, margin-bottom 0.5s; /* Safari */
    transition:fill 0.5s, transform 0.5s, margin-bottom 0.5s;}
.front .switch:hover svg, .front .switch:hover svg path, .front .switch:hover svg rect{fill: rgba(255,255,255,1);  margin-bottom:0.5em;}


#sectors li svg, ul#sectors li svg path, ul#sectors li svg rect{fill: #ddd;
-webkit-transition: fill 0.5s,transform 0.5s, margin-bottom 0.5s; /* Safari */
    transition:fill 0.5s, transform 0.5s, margin-bottom 0.5s;}
#sectors li {	cursor:default; text-align:center;}
#sectors li:hover svg, #sectors li:hover svg path, #sectors li:hover svg rect{fill: #666;  margin-bottom:1em;}

/*#index-search{position:relative;box-sizing: border-box;  margin:2.5em auto; background-color:rgba(21,49,86,0.7); padding:2em; border-radius:0.5em; max-width:54em; }*/
#index-search{position:relative; box-sizing: border-box;  margin:0 auto 2.5em auto; background-color:rgba(0,0,0,0.0); padding:1em 0; border-radius:0.5em; max-width:54em; width:100% }
#index-search ul{padding:0; margin:0; }
#index-search ul li{display:inline-block; position:relative; width:90%; max-width:19em;  padding:0; margin:0.75em; }
#index-search ul li a{color:#fff }
#index-search ul li a:hover{color:#fff }
#index-search label, #index-search input{margin:0; box-sizing: border-box; padding:0;  width:100%; height:2.5em; border:none; border-radius:0.2em; box-shadow:inset 1px 1px 2px rgba(0,0,0,0.3)}
#index-search input[type=search]{border:none;}
#index-search input{padding:0 0.75em;}
#index-search input[type=submit]{vertical-align:middle; margin:0; padding:0; box-shadow:2px 2px 3px rgba(0,0,0,0.3); cursor:pointer; border-radius:0.2em; padding:0; height:2.5em;  width:2.5em; background-image:url(/images/layout/search_btn.svg); background-repeat:no-repeat; background-position:center; background-size:70%; 
-webkit-transition: background-color 0.5s, box-shadow 0.5s; /* Safari */
    transition: background-color 0.5s, box-shadow 0.5s;}
#index-search input[type=submit]:hover{box-shadow:none; background-color:#3c97d4; background-image:url(/images/layout/search_btn.svg); background-repeat:no-repeat; background-position:center; background-size:70%;  }

/*Buttons*/
/*.button{color:#fff; padding:1.5em 3em; margin:1em; display:inline-block; cursor:pointer; border:none; box-shadow:none; border-radius:1em; background-color:rgba(0,0,0,0.2);
-webkit-transition: box-shadow 0.5s;
    transition: box-shadow 0.5s;}
.button:hover{color:#fff; box-shadow:0px 0px 1em rgba(0,0,0,0.6);}

.button-small{color:#fff; display:inline-block; cursor:pointer; border:none; box-shadow:none; border-radius:2em; background-color:rgba(0,0,0,0.1);
-webkit-transition: box-shadow 0.5s; 
    transition: box-shadow 0.5s;}
.button-small:hover{color:#fff; box-shadow:0px 0px 1em rgba(0,0,0,0.6);}

.button-mini{color:#fff; display:inline-block; padding:0.5em 0.5em 0.3em 0.5em; box-shadow:2px 2px 0px rgba(98,97,108,0.6); cursor:pointer; margin:1em 0;}
.button-mini:hover{color:#fff; box-shadow:1px 1px 0px rgba(98,97,108,0.6);}

*/


.arrow-down {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right: 20px solid transparent;
	
	border-top: 20px solid #fff;
}


.arrow-down-right {
	width: 0; 
	height: 0; 
	border-left: 20px solid transparent;
	border-right:20px solid transparent;
	-ms-transform: rotate(315deg); /* IE 9 */
    -webkit-transform: rotate(315deg); /* Chrome, Safari, Opera */
    transform: rotate(315deg);
	border-top: 20px solid rgba(0,0,0,0.4);
	position:absolute;
	right:0
}

.bounce {
 
  -moz-animation:bounce 1s infinite;
   -ms-animation:bounce 1s infinite;
 -webkit-animation:bounce 1s infinite;
}

@-webkit-keyframes bounce {
  0%       { bottom:3.2em; }
  25%, 75% { bottom:3.4em; }
  50%      { bottom:3.6em; }
  100%     {bottom:3em;}
}

@-moz-keyframes bounce {
  0%       { bottom:3.2em; }
  25%, 75% { bottom:3.4em; }
  50%      { bottom:3.6em; }
  100%     {bottom:3em;}
}

@-ms-keyframes bounce {
  0%       { bottom:3.2em; }
  25%, 75% { bottom:3.4em; }
  50%      { bottom:3.6em; }
  100%     {bottom:3em;}
}


/* fonts */

div.jqcloud {
position:relative;
width:100%;

}

div.jqcloud a {
  font-size: inherit;
  text-decoration: none;


}

div.jqcloud span{
  cursor:pointer;
  -webkit-transition: margin 0.5s; /* Safari */
    transition: margin 0.5s;
	padding:2em;
	}

div.jqcloud span.w10 { font-size: 400%; }
div.jqcloud span.w9 { font-size: 380%; }
div.jqcloud span.w8 { font-size: 360%; }
div.jqcloud span.w7 { font-size: 340%; }
div.jqcloud span.w6 { font-size: 280%; }
div.jqcloud span.w5 { font-size: 260%; }
div.jqcloud span.w4 { font-size: 240%; }
div.jqcloud span.w3 { font-size: 180%; }
div.jqcloud span.w2 { font-size: 160%; }
div.jqcloud span.w1 { font-size: 120%; }

/* colors */

div.jqcloud { color: #09f; }
div.jqcloud a { color: inherit; }
div.jqcloud span:hover { margin:0.1em 0 0 0;}
div.jqcloud a:hover {  color: #0df; }
div.jqcloud a:hover { color: #0cf; }
div.jqcloud span.w10 { color: #BD1A8D; }
div.jqcloud span.w9 { color: #F26522; }
div.jqcloud span.w8 { color: #008FD4; }
div.jqcloud span.w7 { color: #ADB515; }
div.jqcloud span.w6 { color: #90c5f0; }
div.jqcloud span.w5 { color: #F7931D; }
div.jqcloud span.w4 { color: #BD1A8D; }
div.jqcloud span.w3 { color: #F26522; }
div.jqcloud span.w2 { color: #008FD4; }
div.jqcloud span.w1 { color: #ADB515; }

/* layout */

div.jqcloud {
  overflow: hidden;
  position: relative;
}

div.jqcloud span { padding: 0; }

#section1{
 padding:8em 0
}

#section1 .inner{
margin:0 auto;


}

.bounce{
position:absolute; bottom:2em; width:100%;
}



@media only screen and (max-width: 920px) {

html{
/*background-position: center bottom;
background-size:auto 100%;
background-attachment: scroll;
background-repeat:no-repeat*/
}

dl.question dt{
width:100%;
}

dl.question dd{
width:100%;
}



#main-links li{
width:100%;
display:inline-block;
margin:0 0 1em 0;
}

#secondary-links li{
width:100%;
display:inline-block;
margin:0 0 1em 0;
}

#latest li{
width:100%;

margin:1em 0;

}



nav{
/*background-color:#153156;*/

}

.sections{
margin:0;
}

.index_headline{
/*visibility:hidden*/
position:relative;

}


.colOne{
position:relative; width:100%;  max-width:100%
}

.colTwo{
position:relative; width:100%; max-width:100%
}


.colThree{
position:relative; width:100%; max-width:100%
}

.flip-container:before {
	content: "";
	display:inline;
	padding-top: none 	/* initial ratio of 1:1*/
}


/*## FLIP ##*/
#numFlips  li{
width:100%;
background:#ccc;
margin:0em;
padding:0;
}
#numFlips  li ul li{
width:100%;
background:#ccc;
margin:0em;
padding:0;
}

/* entire container, keeps perspective */
.flip-container {
	perspective: 1000;
	transform-style: preserve-3d;
	position:relative;
	cursor:pointer;
	

	
}


	/*  UPDATED! flip the pane when hovered */
	.flip-container:hover .back {
		transform: rotateY(0deg);
	}
	.flip-container:hover .front {
	    transform: rotateY(180deg);
	}

.flip-container, .front, .back {
	width: 100%;
	border-radius: 0em
	
	
}

/* flip speed goes here */
.flipper {
	
	transition: 0.8s;
	transform-style: preserve-3d;
	position: relative;
	
}

/* hide back of pane during swap */
.front, .back {
	backface-visibility: hidden;
	transition: 0.6s;
	transform-style: preserve-3d;
	position: absolute;
	
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	
}
.flip-container:before {
	content: "";
	display: block;
	padding-top: 100%; 	/* initial ratio of 1:1*/
}
/* front pane, placed above back */
.front {
	z-index: 2;
	color:#fff;
	
	/* for firefox 31 */
	transform: rotateY(0deg);

}

.front div, .back div{
padding:1em 0.6em;
}

#footer-links{
top:0;
left:1em
}

/* back, initially hidden pane */
.back {
background:#fff;
transform: rotateY(180deg);


}
#section1{
 padding:2em 0
 }
 
 #social-links img{
 width:3em
 }
 


}
