﻿
#refper {
  display: none;
}

  p.link {
    margin-bottom: 2px;
    padding-bottom: 2px;
    font-size: 90%;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: rgb(49,101,195);
  }

  p.synopsis {
    margin-top: 2px;
    padding-top: 2px;
    padding-bottom: 6px;
    font-size: 90%;
  }

#ulinks * h2 {
  font-size: 16px;
  margin-top: 0px !important;
}

a.modal-link {
  color: rgb(49,101,195) !important;
  font-weight: bold;
  text-decoration: none !important;
}

#ulinks * p {
  margin-left: 10px;
}



          table.display * td {
              padding-left: 6px;
          }

a.btn-primary {
  color: #fff !important;
}

                caption {
                  padding: 0px !important;
                }


                a.tooltipstered {
                  text-decoration: underline !important;
                }

		#background_flags {
			text-align: center;
		}

		#affiliates {
			margin: auto;
		}

		.dv_table {
			display: table
		}

		.dv_tr {
			display: table-row;
			margin-top: 0px !important;
			padding-top: 0px !important;
		}

		.dv_td {
			display: table-cell;
			margin-top: 0px !important;
			padding-top: 0px !important;
			vertical-align: top;
		}

		.tooltipster-content a {
			color: darkblue; !important;
		}

		.emphasis {
			font-weight: bold;
			color: darkblue;
		}

		.y2 {
			font-weight: bold;
		}

		.overlay {
			fill: none;
			pointer-events: all;
		}

		.focus circle {
			fill: none;
			stroke: steelblue;
		}

		#chart_refper {
			margin: 0 !important;
		}

		.lineWorld {
			fill: none;
			stroke: #020281;
			stroke-width: 2px;
		}

		.lineUSA {
			fill: none;
			stroke: #9ACCFF;
			stroke-width: 2px;
		}


		rect.BAR_USA {
			fill: #9ACCFF;
		}

		rect.BAR_WORLD {
			fill: #020281;
		}


		.axis path,
		.axis line {
			fill: none;
			stroke: #000;
			shape-rendering: crispEdges;
		}

		#chart2 * text,
		#chart * text {
			font-size: 14px;
		}



		#custom_radio * p,
		#conversion_hp p,
		#conversion p {
			margin: 0px !important;
		}

		h1 {
			margin-top: 0;
		}

		#button_menu {
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}

		#button_menu button {
			text-align: left !important;
		}


		#dash_note {
			margin-top: 20px;
			margin-bottom: 20px;
			background: rgb(245, 245, 220);

			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}



		#radiogroup0 fieldset legend,
		#radiogroup1 fieldset legend,
		#conversion_hp fieldset legend,
		#conversion fieldset legend {
			font-size: 16px !important;
                        border-top: 0px !important;
                        margin-bottom: 8px !important;
		}


		#radiogroup0 fieldset,
		#radiogroup1 fieldset,
		#conversion_hp fieldset,
		#conversion fieldset {
                        border-top: 0px !important;
                        padding-top: 0px !important;
		}

		#conversion_hp,
		#conversion {
			margin-top: 20px;
			margin-bottom: 20px;
                        line-height: 1 !important;

			background: rgb(233, 235, 93);

			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}


		#conversion_hp {
                  margin-top: 0px;
                }

		#custom_radio2 #radiogroup0 {
			text-align: left;
			display: inline-block;
			margin-top: 20px;
			background: lightblue;
			width: 40%;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}

		#custom_radio2 #radiogroup1 {
			text-align: left;
			display: inline-block;
			margin-top: 20px;
			margin-left: 20px;
			background: lightblue;
			width: 40%;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}

		#custom_radio2 {
			margin: auto;
			text-align: center;
			width: 100%;
		}

		#custom_radio #radiogroup0,
		#custom_radio #radiogroup1 {
			margin-top: 20px;
			background: lightblue;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}
		
		#maps {
			margin: auto;
		}

		#map_arrows {
			margin: auto;
			background-image: url('../img/map_arrows.svg');
			background-repeat: no-repeat;
			background-position: center;
		}



/* Make indicators responsive */ 
@media only screen and (max-width: 675px) {

  #cimt_canada {
    width: auto;
  }

  #cimt_usa {
    width: auto;
  }

  #background_flags {
    text-align: left !important;
  }

  .pill_middle {
    background-color: rgba(189,189,202,1) !important;
  }

  .pill_affiliate_Canada {
    margin-top: 0px !important;
  }

  .country_row {
    min-height: auto !important;
    padding-bottom: 0px !important;
  }

  .dv_td {
    display: block !important;
    min-height: auto !important;
    min-width: auto !important;
    max-width: none !important;
  }

  .direction_hint {
     height: auto !important;
     margin: auto !important;
     overlow: visible !important;
     position: relative !important;
     width: auto !important;
   }

  .to_estimate2,
  .from_estimate2,
  .middle_estimate2,
  .pill_from, 
  .pill_middle,
  .pill_to {
     width: auto !important;
  }

  .to_estimate2,
  .from_estimate2,
  .from_estimate,
  .middle_estimate,
  .to_estimate {
    position: relative !important;
    margin-top: 10px;
    top: auto !important;
  }

  .to_estimate2,
  .from_estimate2 {
    margin-left: 0px !important;
  }

  .middle_estimate2 {
    margin-left: 4px !important;
    margin-right: 4px !important;
  }

  #standard_nav2,
  #standard_nav {
    display: table-cell;
    padding-bottom: 1em;
  }

  #standard_nav2 a,
  #standard_nav a {
    display: block-inline;
    margin-right: 0.5em;
    padding-bottom: 6px !important;
    margin-bottom: 6px !important;
  }

  #Layer_1 {
     display: none !important;
  }

   #lmi-map,
   #usa01,
   #canada_flag,
   #usa_flag,
   #flags img {
     display: none;   
   }



   #flags {
     margin-top: 10px;
   }


  #map_arrows,
  #dashboard {
    background-image: none !important;
  }
}




		#flags {
			text-align: center;
		}

		#flags img {
			width: 600px;
			margin: auto;
		}



		#dashboard {
			margin: auto;
			/*			border-style: dotted;			*/
			background-image: url("../img/US-CANflags.jpg");
			background-repeat: repeat;
		}

		.glyphicon-copy::before {
			content: "\e205";
		}


		@font-face {
			font-family: 'Glyphicons Halflings';
			src: url('fonts/glyphicons-halflings-regular.eot');
			src: url('fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('fonts/glyphicons-halflings-regular.woff') format('woff'), url('fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
		}



		#chart_title {
			font-weight: bold;
		}


		div.chartbuttons {
			padding-left: 15px;
			padding-bottom: 6px;
		}


		#chart_title {
			padding-left: 0px;
                        margin-top: 0px !important;
                        margin-bottom: 0px !important;
                        font-size: 16px !important;
                        line-height: 1.4375 !important;
		}


		td.uom {
			text-align: center !important;
		}

		.circle_selected {
			height: 120px;
			width: 120px;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			border-radius: 50%;
			background: #1C578A;
			color: white; 
			font-size: 110%;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}



		.circle_unselected {
			height: 120px;
			width: 120px;
			display: table-cell;
			text-align: center;
			vertical-align: middle;
			border-radius: 50%;
			background: rgb(236, 236, 236);
			color: #1C578A; 
			font-size: 110%;
			cursor: pointer;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}


		.spacer {
			height: 10px;
			width: 20px;
			display: table-cell;
		}

		.topics {
			display: inline-block;
		}


		.topics_container {
			display: inline-block;
			vertical-align: top;
			overflow: auto;
			position: relative;
			width: 100%;
			left: 0px;
			top: -8px;
                        padding-bottom: 16px;
		}

                #standard_nav2 {
                        padding-bottom: 16px;
                }

		.map_container {
			text-align: center;
		}



		.from_estimate {
			text-align: center;
			width: 100%;
			position: absolute;
			left: 0px;
			top: 165px;
		}

		.middle_estimate {
			width: 100%;
			text-align: center;
			position: absolute;
			left: 0px;
			top: 290px;
		}

		.to_estimate {
			text-align: center;
			width: 100%;
			position: absolute;
			left: 0px;
			top: 395px;
		}





		.from_estimate2 {
			text-align: center;
			color: white;
			padding: 4px;
			width: 150px;
			background-color: #B01117; 
			font-size: 110%;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			position: absolute;
			top: 400px;
			margin-left: -110px;
		}



		#arrow_up2 {
			margin-left: -90px; 
		}

		#countries a {
			font-weight: normal;
		}

		.middle_estimate2 {
			text-align: center;
			color: rgb(0, 0, 160);
			font-weight: bold;
			font-size: 95%;
			margin: auto;
			width: 350px;
			background-color: rgba(255, 255, 255, .8);
			padding: 4px;
			text-shadow: 0px 0px 6px white;
			border-radius: 12px; 
		}

		.to_estimate2 {
			position: absolute;
			top: 400px;
			text-align: center;
			color: white;
			padding: 4px;
			background-color: #2156A6; 
			font-size: 110%;
			width: 150px;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			margin-left: -45px;
		}





		.pill_from {
			color: white;
			padding: 4px;
			background-color: #B01117; 
			font-size: 110%;
			margin: auto;
			width: 150px;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}


		.pill_to {
			color: white;
			padding: 4px;
			background-color: #2156A6; 
			font-size: 110%;
			margin: auto;
			width: 150px;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}

		.pill_middle {
			background-color: rgba(255, 255, 255, .8);
			color: black;
			padding: 4px;
			font-weight: bold;
			font-size: 110%;
			margin: auto;
			width: 200px;
			text-shadow: 0px 0px 6px white;
			border-radius: 12px; 
		}




		.pill_affiliate_Canada {
			margin-right: 6px;
			margin-top: 10px;
			color: white;
			padding: 8px;
			background-color: #B01117; 
			font-size: 110%;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}

		.pill_affiliate_USA {
			margin-top: 10px !important;
			background-color: #2156A6;
			color: white;
			padding: 8px;
			background-color: #2156A6; 
			font-size: 110%;
			margin: auto;
			border-radius: 12px;
			border: 4px solid white;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
		}



		#table02 {
			width: 100%;
		}

		#table02 tbody td {
			text-align: right;
                        white-space: nowrap;
		}

		#table02 thead th {
			text-align: right;
			font-weight: bold;
		}



		#table02 tbody th {
			text-align: left; 
			max-width: 170px;
                        font-weight: normal !important;
		}

		#table_title {
                    margin-top: 0px !important;
                    margin-bottom: 0px !important;
                    font-size: 16px !important;
                    line-height: 1.4375 !important;
		}

		.country_row {
			padding-top: 10px;
			padding-bottom: 10px;
			text-align: center;
		}

		#canada_flag {
			width: 155px;
			height: 155px;
		}

		#usa_flag {
			width: 155px;
			height: 155px;
		}

		.state {
			fill: rgb(198, 203, 230);
                        cursor: pointer;
		}

		.states {
			stroke: rgb(31, 87, 166);
			stroke-linejoin: round;
		}

		.province {
	           fill: rgb(238, 198, 182);
                   cursor: pointer;
		}

		.provinceSelected {
			fill: rgb(142, 0, 0);
		}

		.stateSelected {
			fill: rgb(0, 0, 142);
		}

		.provinces {
			stroke: rgb(175, 31, 35);
			stroke-linejoin: round;
		}

		#arrow_down {
			margin-left: 10px;
		}


		#us_building {
			position: relative;
			left: -75px;
			top: 50px;
		}

		.canada_building {
			position: relative;
			left: 75px;
			top: -60px;
		}

		.canada_building_only {
			position: relative;
			left: 75px;
			top: 0px;
		}




		.CDN_aff_estimate,
		.CDN_aff_label {
			padding-top: 10px; 
			//font-weight: bold;
			font-size: 100%;
			text-align: center;
		}

		.US_aff_estimate,
		.US_aff_label {
			padding-top: 10px; 
			font-size: 100%;
			text-align: center;
		}

		#curSelection {
			padding-top: 10px;
			padding-bottom: 10px;

			font-weight: bold;
			font-size: 100%;
			text-align: center;
		}

		#curValues {
			color: rgb(0,0,160);
		}

		#frq_select {
			width: 100%;
		}


		#tooltip-map,
		#tooltip,
		#tooltip1,
		#tooltip2 {
			position: absolute;
			text-align: center;
			padding: 20px;
			margin: 10px;
			font: 14px sans-serif;

			border: 1px;
			border-radius: 2px;
			pointer-events: none;
			z-index: 1000;
		}



		#tooltip-map div.h4,
		#tooltip div.h4,
		#tooltip1 div.h4,
		#tooltip2 div.h4 {
			margin: 0;
			font-size: 16px;
			color: darkblue;
                        font-weight: 700;
                        line-height:  1.1;
		}


		#tooltip-map,
		#tooltip,
		#tooltip1,
		#tooltip2 {
			background: rgba(233, 235, 93, 1);
			border: 1px solid grey;
			border-radius: 5px;
			font-size: 14px;
			width: auto;
			padding: 4px;
			color: black;
			opacity: 0;
		}


		#tooltip-map table,
		#tooltip table,
		#tooltip1 table,
		#tooltip2 table {
			table-layout: fixed;
		}

		#tooltip-map tr td,
		#tooltip1 tr td,
		#tooltip2 tr td,
		#tooltip tr td {
			padding: 0;
			margin: 0;
		}

		#tooltip-map tr td,
		#tooltip1 tr td,
		#tooltip2 tr td,
		#tooltip tr td {
			text-align: center;
			width: auto;
		}



		#chartt1,
		#chartt2 {
			font-weight: bold;
			color: rgb(0,0,160);
			padding-top: 10px;
		}


		.arc text {
			font: 12px sans-serif;
			font-weight: bold;
			text-anchor: middle;
		}

		.arc path {
			stroke: #fff;
		}


		#ex1Slider .slider-selection {
			background: #BABABA;
		}

		#slider01 {
			clear: left;
		}

		.myBadge {
			font-size: 100%;

			background: rgb(245, 245, 220); 
			font-weight: normal;
			color: black;
			box-shadow: 0px 3px 14px rgba(0, 0, 0, 0.4);
			padding: 10px;
			border-radius: 12px;
		}


		.glyphicon-info-sign {
			color: darkblue;
			font-size: 120%;
		}


		#text_TRADE:hover,
		#text_INVESTMENT:hover,
		#text_EMPLOYMENT:hover,
		#text_TRAVEL:hover {
			cursor: pointer;
		}

		#rect_TRADE:hover,
		#rect_INVESTMENT:hover,
		#rect_EMPLOYMENT:hover,
		#rect_TRAVEL:hover {
			cursor: pointer;
		}



                a.info {
                position:relative;
                z-index:24;
                }

                a.info:hover, a.info:focus, a.info:active {
                z-index:25;
                }

                a.info span {
                position: absolute;
                left: -9000px;
                width: 0;
                overflow: hidden;
                }

                a.info:hover span, a.info:focus span, a.info:active span {
                display:block;
                position:absolute;
                top:1em; left:1em; width:12em;
                border:1px solid #0cf;
                background-color:#cff;
                color:#000;
                text-align: center
                }



  #CDN_aff_estimate,
  #US_aff_estimate,
  #US_aff_estimate2,
  #export_value,
  #import_value,
  #f_estimate,
  #m_estimate,
  #t_estimate {
    font-weight: bold;
    font-size: 105%;
  }


   .my_icon {
     background-image: url('background.png');
     background-repeat:no-repeat;
     background-position:right;
     color: white; 
     font-size: 20px; 
     text-align: center;  
     padding-top: 0px; 
     padding-bottom: 0px;
   }

   .page_title {
     padding-top: 12px; margin-top: 0px; padding-bottom: 12px; margin-bottom: 12px;
   }

   .main_container {
     padding-left: 0px; margin-left: 0px; margin-top: 26px; 
   }

   .topic_heading {
     margin-top: 0px; 
     width: 95%; 
     line-height: 2.3; 
     border-top-right-radius: 14px; 
     border-top-left-radius: 14px; 
     color: white; 
     font-size: 18px; 
     text-align: center;  
     font-weight: normal;
   }

   .first_indicator {
     margin-bottom: 14px;
   }

   .indicator_rank {
     font-weight: bold; padding-top: 0px; margin-top: 0px; padding-bottom: 2px; margin-bottom: 0px
   }

   .indicator_note {
     font-size: 14px; padding-top: 10px; width: 95%; text-align: center
   }

   .trade_icon { width: 80%; padding-top: 12px; padding-bottom: 12px }
   .investment_icon { width: 85%; padding-top: 6px; padding-bottom: 6px; padding-left: 20px; padding-right: 20px }
   .employment_icon { width: 90%; padding-top: 6px; padding-bottom: 6px;  padding-left: 20px; padding-right: 20px }
   .travel_icon { width: 80%; padding-top: 4px; padding-bottom: 4px }

   .trade_color { background: #005596 }
   .investment_color { background: #259057 }
   .employment_color { background: #706758 }
   .travel_color { background: #A3248F }

   .indicator_title { color: black; padding-bottom: 0px; margin-bottom: 2px; font-weight: bold; }

   .inner_icon_container { border-radius: 14px; padding-top: 6px; padding-bottom: 6px }

   .rank_seperator { margin-left: 30px; margin-right: 30px; padding-bottom: 2px; margin-bottom: 2px; border-top: 1px solid black; padding-top: 6px; margin-top: 6px; }

   .indicator_percent { font-size: 100%; font-weight: bold }

   .indicator_rank_container { border-top-right-radius: 14px; border-bottom-right-radius: 14px; width: 52%; padding-top: 6px; background: #E2E3E5; color: black;  font-size: 16px; text-align: center; vertical-align: top }


.topic_heading {
  line-height: 1.2;
  padding-top: 4px;
  padding-bottom: 4px;
}

.hp_title {
  margin: auto;
  text-align: center;
  margin-top: 6px;
}


#standard_nav2 a,
#standard_nav a {
  font-size: 15px;
  font-weight: bold;
}

.dot {
  fill: white;
  stroke: steelblue;
  stroke-width: 1.5px;
}

    .label {
      font-weight: normal !important;
      font-size: 95%;
    }

  main {
    font-size: 16px;
    line-height: 1.44;
  }


	#loading {
	   width: 100%;
	   height: 100%;
	   left: 0;
           top: 0;
	   position: fixed;
	   display: block;
	   opacity: 0.6;
	   background-color: #fff;
	   z-index: 1000000;
	   text-align: center;
	}

	#loading img {
           margin-top: 250px;
        }


	#error_msg {
	    width: 100%;
	    height: 100%;
	    left: 0;
            top: 0;
	    position: fixed;
	    display: block;
	    opacity: 1;
	    background-color: #fff;
	    z-index: 1000000;
	    text-align: center;
	}

	#error_msg p {
             margin-top: 250px;
             padding: 50px;
             font-size: 24px;
             font-weight: normal;
             opacity: 1;
             background: #ffd9d9;
             margin-left: 300px;
             margin-right: 300px;
             border: 1px solid black;
        }

#release {
  display: none;
}