xp-dev.com Git - YouAndWeb_TwoToc/blob - client/app/main/main.scss

   1 body {
   2     font-family: 'Helvetica Neue', 'Helvetica', 'Arial', sans-serif;
   3     font-size: 16px;
   4     font-weight: 200;
   5     color: #666;
   6     background-color: #FFF;
   7 }
   8
   9 .thing-form {
  10   margin: 20px 0;
  11 }
  12
  13 #banner {
  14   border-bottom: none;
  15   margin-top: -20px;
  16 }
  17
  18 #banner h1 {
  19   font-size: 60px;
  20   line-height: 1;
  21   letter-spacing: -1px;
  22 }
  23
  24 .btn-lg, .btn-group-lg > .btn, .btn {
  25   border-radius: 0;
  26   border: 0;
  27   font-family: "Oswald";
  28   outline: none !important;
  29 }
  30
  31 .btn-default {
  32   background: #000;
  33   border: 0;
  34   color: #FFF;
  35 }
  36
  37 .bg-grey {
  38   background-color: #EDEFED;
  39 }
  40
  41
  42
  43 #homeSlider {
  44   width: 100%;
  45   /*height: 2000px;*/
  46   overflow: hidden;
  47   position: relative;
  48   .carousel, .carousel-inner, .carousel-inner > .item {
  49     height: inherit;
  50     top: 0;
  51   }
  52   .carousel-inner > .item > img, .carousel-inner > .item > a > img {
  53     width: 100%;
  54     top: 0;
  55     /*filter: blur(1px);*/
  56     @include center-center();
  57   }
  58   .carousel-control.right, .carousel-control.left {
  59     height: 100%;
  60     width: 10%;
  61     min-width: 40px;
  62   }
  63   .carousel-caption {
  64     bottom: 50%;
  65     width: 65%;
  66     text-align: center;
  67     h4 {
  68       font-family: "Oswald", sans-serif;
  69       font-size: 45px;
  70       text-shadow: 0 0 20px #000;
  71       font-weight: bold;
  72     }
  73   }
  74 }
  75
  76 #homesearch {
  77   position: absolute;
  78   bottom: 30%;
  79   left: 50%;
  80   margin-left: -250px;
  81   width: 500px;
  82   padding: 25px 70px;
  83   background-color: rgba(0,0,0,0.5);
  84
  85   input, button {
  86     border-radius: 0;
  87   }
  88   button {
  89     background: #000;
  90     color: #FFF;
  91     font-family: "Oswald";
  92     border: 0;
  93   }
  94 }
  95
  96 .datepicker-group ul li > div > table {
  97   outline: none;
  98 }
  99
 100 .hero-unit {
 101   position: relative;
 102   padding: 30px 15px;
 103   color: #F5F5F5;
 104   text-align: center;
 105   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.1);
 106   background: #4393B9;
 107 }
 108
 109 h1, h2 {
 110   font-family: 'Oswald', sans-serif;
 111   color: #333;
 112   font-weight: 300;
 113 }
 114
 115 h1 {
 116   font-size: 26px;
 117 }
 118 h2 {
 119   font-size: 22px;
 120 }
 121 h3 {
 122   font-size: 18px;
 123 }
 124 h1.title {
 125   margin: 30px 0 0;
 126 }
 127 h3.title {
 128   margin: 10px 0 0;
 129 }
 130
 131 hr {
 132   border-top: 1px solid #666;
 133   margin-top: 50px;
 134 }
 135
 136 .box-default {
 137   background-color: #EDEFED;
 138   padding: 30px;
 139 }
 140 .box-user {
 141   h1 {
 142     margin: 0 0 10px;
 143     text-transform: uppercase;
 144   }
 145   .glyphicon.userinfo {
 146     font-size: 24px;
 147     background: #FFF;
 148     color: #EDEFED;
 149     border-radius: 50%;
 150     margin-right: 10px;
 151     padding: 5px;
 152     vertical-align: middle;
 153   }
 154   .rating.userinfo {
 155     font-size: 28px;
 156     color: #FFF;
 157     margin-left: 4px;
 158     vertical-align: middle;
 159   }
 160   .box-comment {
 161     font-size: 12px;
 162     background: #D6D6D6;
 163     padding: 15px;
 164     position: relative;
 165     margin-bottom: 20px;
 166
 167     p {
 168       margin: 0;
 169     }
 170
 171     ul {
 172       margin-bottom: 0;
 173       b {
 174         color: #000;
 175       }
 176       .rating {
 177         color: #FFF;
 178       }
 179     }
 180   }
 181   .box-comment:after {
 182     right: 100%;
 183     top: 15px;
 184     border: solid transparent;
 185     content: " ";
 186     height: 0;
 187     width: 0;
 188     position: absolute;
 189     pointer-events: none;
 190     border-color: rgba(214, 214, 214, 0);
 191     border-right-color: #D6D6D6;
 192     border-width: 10px;
 193   }
 194 }
 195
 196 .main-container {
 197   min-height: 100%;
 198   height: auto !important;
 199   margin-bottom: 0 auto 40px;
 200   margin-top: 20px;
 201 }
 202 .main-container-footerApp{
 203   min-height: 100%;
 204   height: auto !important;
 205   margin: 0 auto 70px;
 206   margin-top: 20px;
 207 }
 208 .main-container-home {
 209   min-height: 100%;
 210   height: auto !important;
 211   margin: 0 auto 0px;
 212   margin-top: 20px;
 213 }
 214 .main-container.container {
 215   padding-bottom: 40px;
 216 }
 217
 218 .navbar-text {
 219   margin-left: 15px;
 220 }
 221
 222 .navbar-brand {
 223   background: url('/assets/images/logo.png') no-repeat;
 224   background-size: 70%;
 225   color: transparent !important;
 226   height: 130px;
 227   margin: 0;
 228   width: 160px;
 229 }
 230
 231 .navbar .container {
 232   position: relative;
 233 }
 234
 235 .navbar .navbar-left {
 236   width: 560px;
 237   margin: 0 auto !important;
 238   float: none !important;
 239
 240 }
 241
 242 .navbar-default {
 243   border: 0;
 244 }
 245
 246 .navbar-default .navbar-nav.navbar-right li a {
 247     font-family: 'Oswald', sans-serif;
 248     font-weight: 500;
 249     height: auto;
 250     padding: 2px 5px;
 251     font-size: 14px;
 252     line-height: 20px;
 253     text-transform: uppercase;
 254     border: 2px solid transparent;
 255     margin: 10px 2px 0;
 256     color: #000;
 257     transition: border-color 0.2s ease-out;
 258 }
 259 .navbar-default .navbar-nav.navbar-right li a:hover {
 260   border-color: #000;
 261 }
 262
 263 .navbar > .container .navbar-brand {
 264   margin-left: 0;
 265 }
 266
 267
 268
 269
 270
 271 .navbar.open {
 272     -webkit-transform: translate(0, 0);
 273     transform: translate(0, 0);
 274 }
 275
 276 .navbar, main {
 277     -webkit-transition: -webkit-transform 0.3s ease-out;
 278     transition: transform 0.3s ease-out;
 279 }
 280
 281 .navbar h4,
 282 .navbar-default .navbar-nav.navbar-left li a {
 283     font-family: 'Oswald', sans-serif;
 284     font-weight: 300;
 285     height: auto;
 286     padding: 0 20px 10px;
 287     font-size: 20px;
 288     line-height: 20px;
 289     padding-top: 80px;
 290     cursor: pointer;
 291 }
 292 .navbar-default .navbar-nav.navbar-left li.active a {
 293     background: #000;
 294     color: #FFF;
 295 }
 296
 297 .navbar h4 {
 298     background-color: white;
 299     color: #3367D6;
 300 }
 301
 302 .navbar-default .navbar-nav.navbar-left {
 303     padding: 0;
 304     margin: 0;
 305     list-style-type: none;
 306 }
 307
 308 .navbar-default .navbar-nav.navbar-left li a {
 309     display: block;
 310     text-decoration: none;
 311     color: black;
 312     transition: background-color 0.2s ease-out;
 313     white-space: nowrap;
 314 }
 315
 316
 317 .navbar-default .navbar-nav.navbar-left li::before {
 318     content: none;
 319 }
 320
 321 /*
 322 .navbar-default .navbar-nav.navbar-left li a:hover {
 323     background-color: rgba(90, 90, 90, 0.2);
 324 }
 325 */
 326
 327
 328 .navbar-default .navbar-nav.navbar-left li.active a {
 329     background-color: rgba(0, 0, 0, 1);
 330     color: #FFF;
 331 }
 332
 333 @media all and (min-width: 320px) {
 334   .navbar h4,
 335   .navbar-default .navbar-nav.navbar-left li a {
 336       padding: 0 10px 8px;
 337       font-size: 18px;
 338       line-height: 18px;
 339       padding-top: 80px;
 340       cursor: pointer;
 341   }
 342 }
 343
 344 @media all and (min-width: 768px) {
 345   .navbar-default .navbar-nav.navbar-left li a {
 346       padding: 0 20px 10px;
 347       font-size: 20px;
 348       line-height: 20px;
 349       padding-top: 80px;
 350       cursor: pointer;
 351   }
 352   .navbar .navbar-right {
 353     position: absolute;
 354     float: none;
 355     margin-right: 0 !important;
 356     top: 0;
 357     right: 0;
 358   }
 359   .navbar-default  {
 360       z-index: 1;
 361       position: relative;
 362       top: 0;
 363       bottom: 0;
 364       width: 100%;
 365       height: 130px;
 366       background-color: #FFF;
 367       color: #fefefe;
 368       overflow-y: auto;
 369       z-index: 9;
 370   }
 371 }
 372
 373