body, html { 
	font-family: Arial, Tahoma, sans-serif;
	font-size: 14px;
	color: #888;
	/*background: url(../../images/space/blue-blur2.png);
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;*/
    height: 100%;	
    /*min-height: 570px;*/
    background-color: rgba(115, 115, 115, 1);
} 
body { 
    /*min-width: 950px;*/
    /*overflow-x: hidden;*/
}

h1 {    
	font: 21px 'Ubuntu Condensed', 'Arial', 'Helvetica', sans-serif;
    overflow: hidden;
    margin-top: 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #F3F3FE;
} 

div { 
	border: 0px solid #AAA; 
}

img.logo { height: 50px; float: left;  margin-top: -16px; }

div.container { 
	width: 98.2%; 
	margin-top: 1px;
	height: 100%;
	border-radius: 6px;
	padding: 10px;
}

div.container-fluid { 
    height: 100%;
    margin-top: -20px;
}
div.header { 
	height: 35px;
	margin: 1px 0 2px 0;
	width: 100%; 
	/*background-color: rgba(24, 44, 109, 0.46);*/
}
div.left-box-body p { margin: 10px 10px 0 0px;  } 
div.box { 
	margin: 0 auto;
	height: 100%;
    background-color: rgba(113, 129, 150, 0.6);
	color: #333;
	border-radius: 6px;
} 
div.left-box { 
	float: left;
    background-color: rgb(252, 250, 247);
	border-radius: 0 0px 0px 0;
    width: 450px;
    height: 100%;
    overflow: auto;
}
/* hide-controls */
div.fullbox.hide-controls div.left-box { 
    margin-left: -450px;
}

div.fullbox.hide-controls div.right-box { 
    margin-left: 5px;
}

div.fullbox.hide-controls #map-toggle { 
    visibility: hidden;
}
div.fullbox.hide-controls nav.navbar { 
    margin-top: -53px;
}
div.fullbox.hide-controls { 
    height: 99.7%;
}
div.fullbox.hide-controls div.wrapper-content {     
    height: 100%;
}
/* ------- end hide-controls -------*/

/* ------- hide-map -------*/
div.fullbox.hide-map div.left-box { 
    width: 96.5%;
}

div.fullbox.hide-map div.right-box { 
    margin-left: 97%;
}

div.fullbox.hide-map #menu-toggle { 
    visibility: hidden;
}
div.fullbox.hide-map nav.navbar { 
    margin-top: -53px;
}
div.fullbox.hide-map { 
    height: 99.7%;
}
div.fullbox.hide-map div.wrapper-content {     
    height: 100%;
}
/* ------- end hide-map -------*/

div.left-box-body { 
    padding-left: 15px;
}
div.verticalad { 
    width: 160px; 
    height: 600px;
	background-color: rgba(240, 240, 248, 0.6);
	margin-top: 38px;
    position: fixed;
    right: 0px;
    border: 1px solid black;
    top: 5.4%;
} 
div.horisontalad { 
    width: 728px; 
    height: 90px;
	background-color: rgba(240, 240, 248, 0.6);
    position: fixed;
    right: 10%;
    border: 1px solid black;
    bottom: 6%;
} 
div.right-box {
	margin: 1px;
	background-color: rgba(240, 240, 248, 0.8);
    margin-left: 455px;
    height: 100%;
}	
div.right-box-body { 
    height: 100%;
}
.map-active { 
	position: fixed;
	top: 0;
}	
#map { 
    height: 100%;
    width: 100%;
    display: block;
}

div.content { 
	width: 100%; 
	min-height: 60px;
	position: relative;
	overflow: auto;
	margin: 5px 0 6px 0;
	background-color: rgba(255, 255, 255, 0.8);
	margin-top: 10px;
	display: inline-block;
    padding-left: 20px;
} 
div.footer{ 
    height: calc( 100% - 98.2% );
    width: 100%;
    margin-left: 20px;
    font-size: 10px;
    margin-top: 2px;
    float: right;
    padding-left: 10px;
} 
div.footer a { 
    color: white;
    font-weight: bold;
    text-decoration: underline;
} 
div.ads { 
    height: 300px;
    width: 100%;
    background: #FCFAF7;
}
/*.form-control { 
    width: 96.6%; 
    margin: 6px 2px 2px 0px; 
    font-size:12px;
}
.ui-menu .ui-menu-item a { 
    font-size: 12px; 
}*/
.btn span.glyphicon { 
    margin-right: 5px; 
}
a#add_subtrip { 
    margin-top: 2px;
    float:right;
}
div.subtrip { 
    padding-left: 0px;
    margin-top: 10px;
    padding: 0;
}
a.subtrip-remove, a.subtrip-clean { 
    color: #888;
}
div.fat { width: 100% } 
div.trip-options, div.trip-optimization { 
    float: right;
    width: 100%;
}
div.trip-options ul, div.trip-optimization ul { 
    list-style: none;
    margin-left: -32px;
} 
div.trip-options ul li label, div.trip-optimization ul li label {
    font-weight: normal;
    font-size: 12px;
}
.input-group { 
  padding-bottom: 3px;
}

div.trip-optimization { 
    margin-top: 15px;
}
div.control-buttons { 
    margin-top: 15px;
    clear: both;
    padding-top: 35px;
}
span.input-group-addon img.waypoint {
    height: 16px;
}
span.input-group-addon img.viapoint {
    height: 16px;
}
span.waypoint { 
    background-color: #E4EBF6;
}
span.green { 
    background-color: #5CB85C;
    color: white;
    font-weight: bold;
    min-width: 30px;
} 
.bs-callout-info h4, .bs-callout-info h5 { 
   color: #246180;
}
 .bs-callout-info h5 { 
    font-size: 17px;
}
li.details { 
    border-left: 4px dotted rgb(57, 158, 25);
    padding-left: 20px;
    margin-left: 13px;
}

li.details a.base-info, a.air-info { 
    color: rgb(18, 146, 18);
    font-size: 14px;
    font-weight: bold;
}

div.route-details-trace ul li { 
    padding-top: 6px;
}
span.segment img { 
    margin-top: -8px;
} 
span.segment span { 
    margin-left: 4px;
}

div.green-circle, div.blue-circle { 
    width: 30px;
    height: 30px;
    border-radius: 30px;
    padding-top: 1px;
    padding-left: 7px;
    font-weight: bold;
    margin-top: -6px;
    margin-right: 6px;
    float: left;
    cursor: default;
}

div.green-circle { 
    border: 3px solid rgb(11, 138, 5);
    background-color: #DFD;
}

div.blue-circle { 
    border: 3px solid rgb(66, 139, 202);
    background-color: rgb(244,248,250);
}

div.green-circle img, div.blue-circle img { 
    margin-left: -3px;
}

a.segment-view { 
    color: #333;
}

a.segment-view span.active { 
    background-color: rgb(251, 255, 147);
    font-weight: bold;
    text-decoration: underline;
    color: blue;
}

span.showhide-details { 
    cursor: pointer;
    margin-left: 20px;
    text-decoration: underline;
    color: rgb(18, 146, 18);
    font-size: 14px;
} 

span.showhide-details:hover { 
    text-decoration: underline;
    color: blue;
}

div.route-controls { 
    float: right; 
}

img.img-airplane { 
    cursor: pointer;
}

span#refresh-span { 
    cursor: pointer;
    top: 0;
}
div.wrapper-content { 
    height: 97.5%;
    margin-top: -18px;
}
div.ex320x250  { 
    margin: 0 auto;
    margin-left: 55px;
} 
div#short_link_div { 
    margin-top: 10px;
}
span.glyphicon-trash { color: red; } 
span.glyphicon-cloud-upload { color: rgb(73, 130, 74); }
span.glyphicon-link { color: blue; } 
img.img-airplane:hover { border: 0px solid #777; border-radius: 4px;  padding: 2px; }
div.sharebuttons { 
}
.fullbox { height: 96.6%; } 
.navbar-inverse { 
    background-color: #003E18;
    border-color: #080808;
}


.modal-dialog {
  padding-top: 5%;
}
div.ownmodal  { 
  display: initial;
}

div.swipe-options { 
    position: absolute;
    top: 40%;
    font-size: 3em;
}
a.menu-toggle, a.map-toggle { 
    /*color: rgb(228, 235, 246);*/
    /*color: rgb(255, 228, 0);
    text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;
    cursor: pointer;*/
    color: rgb(43, 43, 43);
    text-shadow: -1px -1px 0 #FFF, 1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px 1px 0 #FFF;
    cursor: pointer;
}
p.portrait-hint { 
    display: none;
}
/* ---------- spinner start ------------*/
#loading { display:none; 
           position:fixed; 
           z-index: 1000;
           left:0; 
           top:0; 
           width:100%; 
           height:100%;            
           background-color: rgba( 0, 62, 24, 0.7 );
}
#loading p { 
    font-size: 36px;
    color: white;
    text-align: center;
}
#loading img { 
    max-width: 40%;
}

.spinner-container {
}

.spinner-wrap {
  display: block;
  text-align: center;
}

.spinner-kbd { 
    background-color: transparent;
    border: none;
    box-shadow: none;
}
.draggable { 
    cursor: pointer;
    cursor: -webkit-grab;
    cursor: grab;
} 
@-webkit-keyframes rotate {
  100% {-webkit-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
    transform: rotate(360deg);}
}

@keyframes rotate {
  100% {-webkit-transform: rotate(360deg);
  -ms-transform: rotate(360deg);
    transform: rotate(360deg);}
}

.spinner-element {
  color: white;
  -webkit-animation: rotate 2s linear infinite;
  animation: rotate 2s linear infinite;
}

.spinner-element-1 {
  background: none;
  margin-top: 10%;
}

/* ---------- spinner end ----------------*/

@media screen and (max-device-width: 767px) {
    .navbar-fixed-top {
        position: relative;
        top: auto;
    }
    body {
        background: none;
        margin: 0;
        padding: 0;
    }
    div.left-box { 
        width: 300px;
    }
    div.fullbox.hide-controls div.left-box { 
        margin-left: -300px;
        transition: width 2s;
    }
    div.fullbox.hide-map div.left-box { 
        width: 90.5%;
    }

    div.fullbox.hide-map div.right-box { 
        margin-left: 91%;
    }
    div.right-box {
        margin-left: 305px;
    }	
    .navbar-toggle {
        margin: 23px 0; 
    }

    .navbar-nav, .navbar-nav li, .navbar-nav li a {
        height: 80px;
        line-height: 80px;
    }

    .navbar-nav li a {
        padding-top: 0;
        padding-bottom:0;
    }
    h1 { 
        width: 40%; 
    }

    div.swipe-options { 
        top: 70%;
    }
}

@media screen and (max-device-width: 767px) and (orientation: portrait) { 
    body { 
       /*display: none;*/
    }
    p.portrait-hint { 
        /*display: block; /* показываем подсказку, что нужно повернуть устройство */
    }
    h1 { 
        width: 10%; 
    }
}

