/* gop.css Dec 2017 by Ben Blumenthal */

/* Colors:
blue: #005380
red: #A31D23
gray dark: #9BA2A6 (=K 30% of orig)
gray light: #CDD7D7, #C8D7D7
beige: #EADCBC
yellow: #FAB400

*/

/* General */
body, html {font-family: sans-serif;}
body {display:flex;flex-direction:column;height:97vh;margin:1.5vh;}
a {text-decoration: none;}

/* Main content */
.gop-content{flex: 1 0 auto;}

/* Expand/close from iframe */
.gop-hide{	display: none !important;}

.gop-screen, .gop-screen:before, .gop-fscreen {
	position:fixed;
	width: 1.5vw;
	height: 1.5vw;
	border-color: #CDD7D7 !important;
}
.gop-fscreen {
	width: 2vw;
	height: 2vw;
	border: 3px solid #CDD7D7;
	border-radius:50%;
}

.gop-screen, .gop-screen:before {
	border-top: 2px solid;
	border-right: 2px solid;	
}

.gop-screen, .gop-fscreen{
	right:0.75vw;
	top: 0.75vw;
}
.gop-screen:before {
	width: 1.1vw;
	height: 1.1vw;
	content: " ";
	z-index: -1;
	top: 1.1vw;
	right: 1.1vw;
}

.gop-fscreen:hover:before, .gop-fscreen:hover:after {
background-color: #EADCBC;
}
.gop-fscreen:before, .gop-fscreen:after {
  position: absolute;
  left: .95vw;
  top: 0.25vw;
  content: ' ';
  height: 1.5vw;
  width: 2px;
  background-color: #CDD7D7;

}
.gop-fscreen:before {
  transform: rotate(45deg);
}
.gop-fscreen:after {
  transform: rotate(-45deg);
}



.gop-tooltip {    
    position: absolute;
    background: #EADCBC;
    border-radius:4px;
    padding: 6px 12px;
	font-weight:bold;
    font-size: 12px;
    color: #000;
}
  .gop-tooltip:before {
    content : " ";
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-bottom: 10px solid #EADCBC;
    position:absolute;
    top:-5px;
    right:5px;
}

.gop-title{
	display:inline-block;
	font-size:1.3em;
	color: #ffffff;
	margin-top:5vh;
	padding: 1vh 3vw;
}

.gop-txt{
	position:relative;
	font-size: 1em;
	background: rgba(255,255,255,0.6);
	margin-top:3vh;
	padding: 3vh 3vw 10.5vh 3vw;
	text-align:justify;
	z-index:-1;
}

.gop-navround{
	display: flex;
	justify-content: flex-end;
	flex-flow: row wrap;
	margin-top:-7.5vh;
	margin-right: 3vh;
}

.gop-navnav{
	width:15vh;
	min-width: 80px;
	height:15vh;
	min-height:80px;
	background: #9BA2A6;
	border-radius:50%;
	margin-left: .5vh;
}

.gop-nav-txt{
	font-size: 0.75em;
	margin-left: auto;
	margin-right: auto;
	position: relative;	
	color: #ffffff;
	text-align: center;
	top: 50%;
	transform: translateY(-50%);
}

.gop-circleblock {
 text-align: center;
 white-space: nowrap;
 margin-top: 6vh;
}
 
.gop-circleblock:before {
 content: '';
 display: inline-block;
 height: 100%;
 vertical-align: middle;
 margin-right: -0.25em; /* Adjusts for spacing */
}

#gop-circle {
	display: inline-block;
	vertical-align: middle;
	max-width:95%; 
	height:72vh;
}

/*GOP video*/
#gop-video{
	max-width:100vw;
	max-height:95vh;
	display:inline-block;
	text-align:left;
}

/* Footer */
.gop-footer{
	flex-shrink: 0;
	display: flex;
	justify-content: flex-end;
}

.gop-nav{
	height: 15vh;
	min-height:80px;
	bottom:.75em;
	right:.75em;
	z-index:1;		    
}

.gop-credit{
	font-size: 8px;
	background: rgba(255,255,255,0.4);
/*	color: white;
*/	padding: 0.1vw;
	position: fixed;
	left:0.1em;
	bottom:0.1em;
}

/* SVG and layout */
.gop-r{background: #A31D23;}
.gop-b{background: #005380;}
.gop-g{background: #9BA2A6;}

.gop-navgov{fill:#A31D23;stroke:#C8D7D7;}
.gop-navctr{fill:#005380;stroke:#C8D7D7;}
.gop-navmid{fill:#9BA2A6;stroke:#C8D7D7;}
.gop-navcen{fill:#EADCBC;stroke:#C8D7D7;}
.gop-navtxt-w{fill:#ffffff;}
.gop-navtxt-b{fill:#000;}
.gop-navarrow{fill:none;stroke:#005380;stroke-width:7;stroke-linecap:round;}
.gop-navarrowfill{fill:#005380;}
.gop-nostroke{stroke: none !important;}
a:hover .gop-navcen, a:hover .gop-navgov, a:hover .gop-navctr, a:hover .gop-navmid, a .gop-on, a:hover .gop-navnav {
	-webkit-filter: brightness(80%);
	filter: brightness(80%);
}
a:hover .gop-screen, a:hover .gop-screen:before, a:hover .gop-fscreen {border-color: #EADCBC !important;}

/* shine on center */
.gop-shineline{fill:none;stroke:url(#shineline);stroke-width:10;stroke-miterlimit:10;}

.navcen-shine{animation: shine 8s linear 2s infinite }

@keyframes shine {
  0%   {transform: translate(0px, 0px);}
  6%   {transform: translate(240px, 240px);}
  100% {transform: translate(240px, 240px);}
}


/* Responsive stuff */

.gop-txt-40, .gop-txt-50, .gop-txt-90{width: 100%;}
.gop-bg {background: no-repeat fixed right bottom /cover;}
.gop-011, .gop-020, .gop-021, .gop-033 {background-position: center bottom;}
.gop-screen{display:none;}

@media only screen and (min-width: 740px) {

	.gop-txt-40, .gop-txt-50 {max-width: 70%;}
	.gop-txt-90{max-width: 90%;}

	.gop-bg {background: no-repeat fixed right center /cover;} 
	.gop-bg-bottom{background: no-repeat fixed right bottom /cover;}
	_:-ms-fullscreen, :root .gop-nav {margin-right:-46%;} /* IE 11 bug */
        .gop-screen{display:inline;}

	}

@media only screen and (min-width: 992px) {
	.gop-txt-40{max-width: 40%;}
	.gop-txt-50{max-width: 50%;}

	/*.gop-title{font-size:5vh;}
	.gop-txt {font-size: 3vh;}
	.gop-nav-txt {font-size: 2.5vh;}*/

	.gop-nav{position:fixed;}
}

/*Backgrounds*/
.gop-000{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/000.jpg");}
.gop-010{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/010.jpg");}
.gop-011{background-image: linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)), url("../img/011.jpg");}
.gop-012{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/012.jpg");}
.gop-013{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/013.jpg");}
.gop-020{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/020.jpg");}
.gop-021{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/021.jpg");}
.gop-022{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/022.jpg");}
.gop-023{background-image: linear-gradient(rgba(0,0,0,.15),rgba(0,0,0,.15)), url("../img/023.jpg");}
.gop-030{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/030.jpg");}
.gop-031{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/031.jpg");}
.gop-032{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/032.jpg");}
.gop-033{background-image: linear-gradient(rgba(0,0,0,.3),rgba(0,0,0,.3)), url("../img/033.jpg");}