1html, body, div, span, applet, object, iframe, 2h1, h2, h3, h4, h5, h6, p, blockquote, pre, 3a, abbr, acronym, address, big, cite, code, 4del, dfn, em, img, ins, kbd, q, s, samp, 5small, strike, strong, sub, sup, tt, var, 6b, u, i, center, 7dl, dt, dd, ol, ul, li, 8fieldset, form, label, legend, 9table, caption, tbody, tfoot, thead, tr, th, td, 10article, aside, canvas, details, embed, 11figure, figcaption, footer, header, hgroup, 12menu, nav, output, ruby, section, summary, 13time, mark, audio, video { 14 margin: 0; 15 padding: 0; 16 border: 0; 17 font-size: 100%; 18 font: inherit; 19 vertical-align: baseline; 20} 21 22/* HTML5 display-role reset for older browsers */ 23article, aside, details, figcaption, figure, 24footer, header, hgroup, menu, nav, section { 25 display: block; 26} 27 28body { 29 line-height: 1; 30 font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 31 32} 33 34ol, ul { 35 list-style: none; 36} 37 38blockquote, q { 39 quotes: none; 40} 41 42blockquote:before, blockquote:after, 43q:before, q:after { 44 content: ''; 45 content: none; 46} 47 48table { 49 border-collapse: collapse; 50 border-spacing: 0; 51} 52 53 54html, body { 55 width: 100%; 56 height: 100%; 57 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 58} 59 60[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) { 61 cursor: unset; 62} 63 64#navigation { 65 width: 100%; 66 min-height: 10px; 67 position: relative; 68 z-index: 999; 69} 70 71#homebackground { 72 width: 100%; 73 /* height: 100%; */ 74 margin-top: -65px; 75 /* background: blue; */ 76} 77 78.bg img { 79 width: 100%; 80 position: relative; 81 margin-top: -240px; 82} 83 84.bg { 85 position: relative; 86} 87 88#navb { 89 padding-top: 15px; 90} 91 92.bg-transparent { 93 background: transparent !important; 94} 95 96.navbar-brand img { 97 width: 220px; 98 position: absolute; 99 top: 10px; 100} 101 102.cloud-top img { 103 width: 100%; 104 position: absolute; 105 top: 140px; 106 107} 108 109.homepageconterimage img { 110 width: 75%; 111 position: absolute; 112 transform: translate(-50%, -50%); 113 left: 50%; 114 top: 70%; 115} 116 117#about { 118 width: 100%; 119 min-height: 50px; 120 background: #fff; 121 padding: 70px 0px; 122 margin-top: 0%; 123 position: relative; 124} 125 126.banner-content { 127 position: relative; 128 z-index: 99; 129 color: #fff; 130 font-size: 39px !important; 131 font-weight: 700; 132 padding-bottom: 25px; 133 padding-top: 150px; 134 text-align: center; 135} 136 137.banner-subcontent { 138 position: relative; 139 text-align: center; 140 z-index: 99; 141 color: #fff; 142 font-size: 23px; 143 font-weight: 200; 144} 145 146.about-text { 147 width: 90%; 148 margin: auto; 149} 150 151.navbar-dark .navbar-nav .nav-link { 152 color: #fff !important; 153 154} 155 156.navbar-dark .navbar-nav .nav-item { 157 padding: 0px 5px; 158} 159 160.clearfix { 161 clear: both; 162} 163 164p { 165 font-size: 17px; 166 line-height: 28px; 167 color: #000; 168} 169 170a { 171 text-decoration: none; 172} 173 174.dark p { 175 font-size: 18px; 176 line-height: 28px; 177 color: #fff; 178} 179 180.blue a { 181 color: #fff; 182 font-size: 24px; 183 text-decoration: none; 184} 185 186 187.tohide { 188 display: none; 189} 190 191.toshow { 192 display: block; 193} 194 195.btn-primary { 196 border-radius: 30px; 197 padding: 10px 50px; 198 background: linear-gradient(#46ccd9, #49a1e2); 199 border: none; 200 box-shadow: 2px 2px 5px rgba(51, 51, 51, 0.23); 201} 202 203.btn-primary:hover { 204 background: linear-gradient(#46ccd9, #49a1e2); 205} 206 207.btn-playground { 208 padding: 5px 20px; 209} 210 211.btn-playground a { 212 font-size: 18px; 213} 214 215.launch-playground-icon { 216 height: 20px; 217 vertical-align: sub; 218} 219 220.styraText { 221 display: inline-flex; 222} 223 224.styraText p { 225 padding-top: 10px; 226} 227 228.box-1 { 229 width: 100%; 230 min-height: 100px; 231 background: #fff; 232 border-top-left-radius: 20px; 233 border-top-right-radius: 20px; 234 position: relative; 235 overflow: hidden; 236} 237 238.boxTop { 239 width: 100%; 240 min-height: 160px; 241 background: linear-gradient(#47cdd8, #48a7e0); 242 position: relative; 243} 244 245.boxTop h3 { 246 color: #fff; 247 font-size: 16px; 248 font-weight: 600; 249 line-height: 24px; 250 padding-top: 25px; 251} 252 253.boxBottom { 254 box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.16); 255 border-bottom-left-radius: 20px; 256 border-bottom-right-radius: 20px; 257 min-height: 70px; 258} 259 260.boxTop-heading { 261 position: absolute; 262 left: 37%; 263 top: 50%; 264 transform: translate(-30%, -50%); 265} 266 267 268#declarative-policy { 269 width: 100%; 270 min-height: 100px; 271 background: #f8f8f8; 272 margin-top: -7px; 273 padding-bottom: 50px; 274} 275 276.declarativeBOx { 277 width: 100%; 278 height: 150px; 279 background: #fff; 280 border: 1px solid #eaeaea; 281 position: relative; 282 transition: 0.3s all ease-in-out; 283 -webkit-transition: 0.3s all ease-in-out; 284 -moz-transition: 0.3s all ease-in-out; 285 -o-transition: 0.3s all ease-in-out; 286 cursor: pointer; 287 margin-bottom: 25px; 288} 289 290.declarativeBOx:hover .downArrow img { 291 opacity: 1; 292} 293 294.declarativeBOx:hover { 295 transition: 0.3s all ease-in-out; 296 -webkit-transition: 0.3s all ease-in-out; 297 -moz-transition: 0.3s all ease-in-out; 298 -o-transition: 0.3s all ease-in-out; 299 border: 1px solid rgba(52, 114, 230, 0.45); 300 box-shadow: 0px 0px 20px rgba(51, 51, 51, 0.22); 301} 302 303.declarativeBOx a { 304 padding: 24px 30px 24px 30px; 305 text-decoration: none; 306 float: left; 307 width: 100%; 308 height: 100%; 309} 310 311.envoy a { 312 padding: 24px 30px 24px 50px; 313} 314 315.envoy img { 316 width: 70px; 317} 318 319.declarativeInnerBOx { 320 position: relative; 321 margin-top: 20px; 322} 323 324.declarativeEnvoy { 325 line-height: 48px !important; 326} 327 328.downArrow { 329 text-align: center; 330 margin-top: 10px; 331} 332 333.downArrow img { 334 width: 25px; 335 height: 25px; 336 opacity: 0; 337} 338 339.declarative-policy-contentBox { 340 width: 100%; 341 min-height: 200px; 342 background: #fff; 343 border-top: 8px solid #46aede; 344 border-left: 1px solid #eaeaea; 345 border-right: 1px solid #eaeaea; 346 border-bottom: 1px solid #eaeaea; 347 position: relative; 348 z-index: 9; 349} 350 351.declarative-policy-contentBox-header { 352 width: 18%; 353 margin: 5% auto; 354} 355 356.colorRed { 357 color: #f92672; 358} 359 360.colorYellow { 361 color: #e6db74; 362} 363 364.colorViolet { 365 color: #814ae4 366} 367 368.declarative-left { 369 width: 100%; 370 min-height: 50px; 371 padding: 30px; 372 position: relative; 373} 374 375 376.declarative-right { 377 height: 100%; 378} 379 380.subparagraph { 381 padding-top: 15px; 382} 383 384.text-left { 385 text-align: left 386} 387 388.codeSample { 389 width: 100%; 390 min-height: 30px; 391 background: #6872e4; 392 position: relative; 393 padding: 5px 25px; 394} 395 396 397.declarativeText { 398 font-size: 22px; 399 font-weight: 600; 400 line-height: 60px; 401} 402 403 404.declarativeImage { 405 float: left; 406 width: 60px; 407 margin-right: 10px; 408} 409 410.gray-top-image img { 411 margin-top: -30px; 412 width: 100%; 413} 414 415#gray { 416 margin: 70px 0px; 417 position: relative; 418 z-index: 99; 419} 420 421h2 { 422 font-size: 40px; 423 font-weight: bold; 424 padding-bottom: 15px; 425 line-height: normal; 426 color: #000; 427} 428 429h3 { 430 font-size: 30px; 431 font-weight: bold; 432 padding-bottom: 15px; 433 line-height: normal; 434 color: #000; 435} 436 437.dark h3 { 438 font-size: 25px; 439 font-weight: bold; 440 padding-bottom: 15px; 441 line-height: normal; 442 color: #fff; 443} 444 445.subText { 446 font-size: 21px; 447 font-weight: 300; 448 padding-bottom: 15px; 449 line-height: normal; 450 color: #404040; 451} 452 453#declarative-policy-tabs { 454 width: 100%; 455 min-height: 100px; 456 position: relative; 457 background: #fff; 458 padding-bottom: 70px; 459} 460 461.declarative-policy-tabs-graphic { 462 background-image: url(../img/declarative-graphic-1.png); 463 position: absolute; 464 left: -170px; 465 top: 0%; 466 width: 360px; 467 height: 400px; 468 background-repeat: no-repeat; 469 background-size: cover; 470 z-index: 99; 471} 472 473.declarative-policy-tabs-graphic-2 { 474 background-image: url(../img/declarative-graphic-2.png); 475 position: absolute; 476 right: 0px; 477 top: 50%; 478 width: 630px; 479 height: 660px; 480 background-repeat: no-repeat; 481 background-size: cover; 482 483} 484 485.tab-innerContainer p { 486 font-size: 16px; 487} 488 489.declarative-table { 490 width: 100%; 491 min-height: 100px; 492 position: relative; 493 z-index: 9; 494 495} 496 497.btn-primary span { 498 font-weight: 600; 499} 500 501.nav-tabs { 502 border-bottom: none !important; 503 margin-left: 45px; 504} 505 506.tab-content > .tab-pane { 507 width: 100%; 508} 509 510 511.tab-content { 512 box-shadow: 1px 1px 8px rgba(51, 51, 51, 0.25); 513 position: relative; 514 border-radius: 20px; 515 padding: 25px; 516 margin-top: -5px; 517 background: #f7f7f7; 518} 519 520.tab-content p { 521 color: #333; 522} 523 524.nav-pills .nav-link { 525 color: #333; 526 padding: 20px; 527 line-height: 22px; 528 border-bottom: 1px solid #eee; 529} 530 531.nav-pills .nav-link.active, .nav-pills .show > .nav-link { 532 background-color: #e5e6eb; 533 color: #333; 534 padding: 20px; 535 line-height: 22px; 536} 537 538.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 539 color: #fff !important; 540 font-size: 18px !important; 541 background: linear-gradient(#47ced8, #49a1e1) !important; 542 border-top-left-radius: 20px; 543 border-top-right-radius: 20px; 544 border: none !important; 545 padding: 15px 20px; 546 line-height: 40px; 547 display: inline-flex; 548} 549 550.verticle-tabs { 551 position: absolute; 552 left: -270px; 553 top: 170px; 554} 555 556.verticle-tabs .nav-tabs .nav-link.active { 557 color: #fff !important; 558 font-size: 17px !important; 559 background: linear-gradient(#47ced8, #49a1e1) !important; 560 border-top-left-radius: 20px; 561 border-bottom-left-radius: 20px; 562 border: none !important; 563 padding: 35px 50px 35px 30px; 564 line-height: 27px; 565 margin: 10px 0px; 566 cursor: pointer; 567 568 569} 570 571 572.colorGray { 573 color: #404040 574} 575 576.verticle-tabs .nav-tabs .nav-link { 577 color: #000; 578 font-size: 17px; 579 background: linear-gradient(#f7f7f7, #f7f7f7); 580 border-top-left-radius: 20px; 581 border-bottom-left-radius: 20px; 582 border: none !important; 583 padding: 35px 50px 35px 30px; 584 display: inline-flex; 585 line-height: 27px; 586 box-shadow: 1px 1px 8px rgba(51, 51, 51, 0.25); 587 margin: 10px 0px; 588 cursor: pointer; 589} 590 591.verticle-tabs .nav-tabs .nav-item { 592 width: 250px; 593} 594 595.whitebox { 596 width: 100%; 597 min-height: 100px; 598 background: #fff; 599 box-shadow: 2px 3px 6px rgba(51, 51, 51, 0.25); 600 position: relative; 601 border-radius: 20px; 602 padding: 25px; 603 margin-bottom: 15px; 604 605} 606 607 608.nav-tabs .nav-item { 609 margin-bottom: -1px; 610 position: relative; 611 margin: 0px 10px; 612} 613 614.nav-tabs .nav-item img { 615 width: auto; 616 height: 40px; 617 margin-right: 6px; 618} 619 620.nav-tabs .nav-link { 621 color: #000; 622 font-size: 18px; 623 background: linear-gradient(#f7f7f7, #f7f7f7); 624 border-top-left-radius: 20px; 625 border-top-right-radius: 20px; 626 border: none !important; 627 padding: 15px 20px; 628 display: inline-flex; 629 line-height: 40px; 630 box-shadow: 1px 1px 8px rgba(51, 51, 51, 0.25); 631 632} 633 634.nav-tabs .nav-width { 635 width: 170px !important; 636 max-width: 170px; 637} 638 639.envoyLogo { 640 width: 55px !important; 641} 642 643#curveImage { 644 width: 100%; 645 min-height: 50px; 646 background: #fff; 647 padding: 70px 0px; 648} 649 650 651#curveImage img { 652 width: 100%; 653 background-repeat: no-repeat; 654} 655 656#architectural-flexibility { 657 width: 100%; 658 min-height: 100px; 659 background: #fff; 660 position: relative; 661} 662 663.architectural-flexibility-graphic-left { 664 background-image: url(../img/arc-left.png); 665 position: absolute; 666 left: -110px; 667 top: 35%; 668 width: 270px; 669 height: 210px; 670 background-repeat: no-repeat; 671 background-size: cover; 672 z-index: 99; 673} 674 675.architectural-flexibility-graphic-right { 676 background-image: url(../img/arc-right.png); 677 position: absolute; 678 right: 0px; 679 top: 18%; 680 width: 220px; 681 height: 550px; 682 background-repeat: no-repeat; 683 background-size: cover; 684 z-index: 99; 685} 686 687 688.directBox { 689 width: 100%; 690 min-height: 100px; 691 background: #fff; 692 position: relative; 693} 694 695.service-circle { 696 width: 10rem; 697 height: 10rem; 698 border-radius: 50%; 699 background: linear-gradient(#0094c8, #005fb1); 700 margin: auto; 701 position: relative; 702 z-index: 9; 703} 704 705.service-mediumcircle { 706 width: 13rem; 707 height: 13rem; 708 border-radius: 50%; 709 background: linear-gradient(#0094c8, #005fb1); 710 margin: auto; 711 position: relative; 712 z-index: 9; 713} 714 715.topBox { 716 width: 200px; 717 height: 50%; 718 background: linear-gradient(#eb88fe, #a687f3); 719} 720 721.bottomBox { 722 width: 200px; 723 height: 50%; 724 background: linear-gradient(#47d0d8, #48a0e2); 725} 726 727.service-smallCircle { 728 width: 6rem; 729 height: 6rem; 730 border-radius: 50%; 731 background: #fff; 732 margin: auto; 733 position: relative; 734 z-index: 9; 735 margin-top: 5px; 736} 737 738.service-smallCircle img { 739 position: absolute; 740 left: 50%; 741 top: 50%; 742 transform: translate(-50%, -50%); 743 width: 60%; 744} 745 746.service-text { 747 position: absolute; 748 left: 50%; 749 top: 50%; 750 transform: translate(-50%, -50%); 751} 752 753.service-graphics { 754 position: relative; 755} 756 757.service-graphic { 758 position: relative; 759} 760 761.service-innertext { 762 position: absolute; 763 left: 50%; 764 top: 50%; 765 transform: translate(-50%, -50%); 766} 767 768.service-graphic img { 769 width: 36.2%; 770 margin-top: -23%; 771} 772 773.service-graphics img { 774 width: 36%; 775} 776 777.blackColor { 778 color: #000; 779} 780 781.space-left { 782 margin-left: 18px; 783 784} 785 786.space-right { 787 margin-left: -30px; 788} 789 790.service-graphics-text { 791 margin-top: 15px; 792} 793 794.policy-text p { 795 width: 85%; 796 margin: auto; 797} 798 799#policy-authoring { 800 width: 100%; 801 min-height: 100px; 802 background: #fff; 803 padding: 70px 0px; 804} 805 806h4 { 807 font-size: 23px; 808 color: #000; 809 font-weight: 600; 810} 811 812.center-align-content { 813 justify-content: center; 814} 815 816 817#footer { 818 width: 100%; 819 min-height: 100px; 820 background: #b7b7b7; 821 padding: 100px 0px; 822} 823 824.footer-text { 825 font-size: 22px; 826 color: #fff; 827 padding-bottom: 20px; 828} 829 830.footer-logo img { 831 width: 60%; 832} 833 834.social-icon-link { 835 padding: 0; 836} 837 838.social-icon-link img { 839 height: 2rem; 840 width: auto; 841 padding: 0; 842} 843 844.social-icon-title { 845 display: none; 846} 847 848.footer-bottom { 849 font-size: 14px; 850 color: #fff; 851} 852 853.marginTopNegative { 854 margin-top: -70px; 855} 856 857.policy-sharing { 858 position: relative; 859} 860 861.policy-sharing h4 { 862 /* position: absolute; 863 bottom: 0px; 864 left: 25%; */ 865} 866 867 868@media screen and (min-width: 1201px) and (max-width: 1400px) { 869 870} 871 872@media screen and (min-width: 993px) and (max-width: 1100px) { 873 .declarativeImage { 874 width: 40px; 875 } 876 877 .envoy img { 878 width: 50px; 879 } 880 881 .declarativeText { 882 font-size: 17px; 883 line-height: 34px; 884 } 885 886} 887 888@media screen and (min-width: 1101px) and (max-width: 1200px) { 889 .declarativeImage { 890 width: 40px; 891 } 892 893 .envoy img { 894 width: 50px; 895 } 896 897 .declarativeText { 898 font-size: 17px; 899 line-height: 34px; 900 } 901 902} 903 904@media screen and (min-width: 993px) and (max-width: 1200px) { 905 906 .nav-tabs .nav-link { 907 padding: 15px 10px; 908 line-height: 18px; 909 } 910 911 .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 912 padding: 15px 10px; 913 line-height: 18px; 914 } 915 916 .envoy img { 917 width: 50px; 918 } 919 920 /* .envoyLogo{ 921 width: 50px !important; 922 } */ 923 .nav-tabs .nav-width { 924 width: 140px !important; 925 max-width: 140px; 926 } 927 928 .nav-tabs .nav-item img { 929 width: 20px; 930 height: 20px; 931 } 932 933 934} 935 936@media screen and (min-width: 992px) and (max-width: 1024px) { 937 .declarativeImage { 938 width: 40px; 939 } 940 941 .envoy img { 942 width: 50px; 943 } 944 945 .declarativeText { 946 font-size: 17px; 947 line-height: 34px; 948 } 949 950 .declarativeInnerBOx { 951 952 margin-top: 30px; 953 } 954 955 .banner-content { 956 text-align: center; 957 padding-top: 100px; 958 font-size: 31px !important; 959 } 960 961 .bg img { 962 margin-top: -180px !important; 963 } 964 965 .boxTop-heading { 966 top: 53%; 967 } 968 969 .boxTop h3 { 970 line-height: 19px; 971 } 972 973 .col-lg-2 { 974 -ms-flex: 0 0 20%; 975 flex: 0 0 20%; 976 max-width: 20%; 977 } 978 979 .nav-tabs { 980 margin-left: 35px; 981 } 982 983 .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 984 padding: 15px 10px; 985 font-size: 17px !important; 986 line-height: 30px; 987 } 988 989 .nav-tabs .nav-link { 990 padding: 15px 10px; 991 } 992 993 .nav-tabs .nav-link { 994 font-size: 17px; 995 line-height: 30px; 996 } 997 998 .nav-tabs .nav-width { 999 width: 160px !important; 1000 max-width: 160px !important; 1001 } 1002 1003 .nav-tabs .nav-item img { 1004 width: 30px; 1005 height: 30px; 1006 } 1007} 1008 1009@media screen and (min-width: 768px) { 1010 .mobile-view-Banner img { 1011 display: none; 1012 } 1013} 1014 1015@media screen and (max-width: 320px) { 1016 .bg img { 1017 margin-top: -270px; 1018 } 1019 1020 .declarative-policy-contentBox-header { 1021 width: 35%; 1022 } 1023 1024 .declarativeBOx { 1025 height: 100px; 1026 } 1027 1028 .declarativeBOx a { 1029 padding: 10px 10px 10px 20px; 1030 } 1031 1032 .declarativeInnerBOx { 1033 margin-top: 30px; 1034 } 1035 1036 .declarativeImage { 1037 width: 20px; 1038 } 1039 1040 .declarativeText { 1041 font-size: 12px; 1042 line-height: 20px !important; 1043 } 1044 1045 .envoy img { 1046 width: 30px; 1047 } 1048} 1049 1050@media screen and (min-width: 321px) and (max-width: 400px) { 1051 .declarativeBOx { 1052 height: 100px; 1053 } 1054 1055 .declarativeBOx a { 1056 padding: 10px 10px 10px 10px; 1057 } 1058 1059 .declarativeInnerBOx { 1060 1061 margin: 30px auto; 1062 width: 85%; 1063 } 1064 1065 .declarativeImage { 1066 width: 20px; 1067 } 1068 1069 .declarativeText { 1070 font-size: 11px; 1071 line-height: 20px; 1072 } 1073 1074 .envoy img { 1075 width: 30px; 1076 } 1077 1078 .declarative-policy-contentBox-header { 1079 width: 40%; 1080 } 1081 1082 .declarativeEnvoy { 1083 line-height: 17px !important; 1084 } 1085 1086} 1087 1088@media screen and (min-width: 350px) and (max-width: 400px) { 1089 .bg img { 1090 margin-top: -308px; 1091 } 1092} 1093 1094@media screen and (min-width: 401px) and (max-width: 450px) { 1095 .bg img { 1096 margin-top: -340px; 1097 } 1098 1099 .declarativeBOx { 1100 height: 100px; 1101 } 1102 1103 .declarativeBOx a { 1104 padding: 10px 10px 10px 20px; 1105 } 1106 1107 .declarativeInnerBOx { 1108 margin-top: 30px; 1109 margin-left: 20px; 1110 } 1111 1112 .declarativeImage { 1113 width: 20px; 1114 } 1115 1116 .declarativeText { 1117 font-size: 15px; 1118 line-height: 20px; 1119 } 1120 1121 .envoy img { 1122 width: 30px; 1123 } 1124 1125 .declarative-policy-contentBox-header { 1126 width: 31%; 1127 } 1128 1129 .declarativeEnvoy { 1130 line-height: 18px !important; 1131 } 1132} 1133 1134 1135@media screen and (min-width: 451px) and (max-width: 500px) { 1136 .bg img { 1137 margin-top: -400px; 1138 } 1139 1140 .declarativeBOx { 1141 height: 100px; 1142 } 1143 1144 .declarativeBOx a { 1145 padding: 10px 10px 10px 10px; 1146 } 1147 1148 .declarativeInnerBOx { 1149 1150 margin: 30px auto; 1151 width: 74%; 1152 } 1153 1154 .declarativeImage { 1155 width: 20px; 1156 } 1157 1158 .declarativeText { 1159 font-size: 14px; 1160 line-height: 20px; 1161 } 1162 1163 .envoy img { 1164 width: 30px; 1165 } 1166 1167 1168 .declarativeEnvoy { 1169 line-height: 17px !important; 1170 } 1171 1172 .declarative-policy-contentBox-header { 1173 width: 30%; 1174 } 1175 1176 .declarativeEnvoy { 1177 line-height: 18px !important; 1178 } 1179} 1180 1181@media screen and (min-width: 501px) and (max-width: 550px) { 1182 .declarativeBOx { 1183 height: 100px; 1184 } 1185 1186 .declarativeBOx a { 1187 padding: 10px 10px 10px 10px; 1188 } 1189 1190 .declarativeInnerBOx { 1191 1192 margin: 30px auto; 1193 width: 60%; 1194 } 1195 1196 .declarativeImage { 1197 width: 20px; 1198 } 1199 1200 .declarativeText { 1201 font-size: 14px; 1202 line-height: 20px; 1203 } 1204 1205 .envoy img { 1206 width: 30px; 1207 } 1208 1209 .declarative-policy-contentBox-header { 1210 width: 25%; 1211 } 1212 1213 .declarativeEnvoy { 1214 line-height: 17px !important; 1215 } 1216 1217 .bg img { 1218 margin-top: -430px; 1219 } 1220 1221} 1222 1223@media screen and (min-width: 551px) and (max-width: 575px) { 1224 .bg img { 1225 margin-top: -445px; 1226 } 1227 1228 .declarativeBOx { 1229 height: 100px; 1230 } 1231 1232 .declarativeBOx a { 1233 padding: 10px 10px 10px 10px; 1234 } 1235 1236 .declarativeInnerBOx { 1237 1238 margin: 30px auto; 1239 width: 55%; 1240 } 1241 1242 .declarativeImage { 1243 width: 20px; 1244 } 1245 1246 .declarativeText { 1247 font-size: 17px; 1248 line-height: 20px; 1249 } 1250 1251 .envoy img { 1252 width: 30px; 1253 } 1254 1255 .declarative-policy-contentBox-header { 1256 width: 25%; 1257 } 1258 1259 .declarativeEnvoy { 1260 line-height: 17px !important; 1261 } 1262} 1263 1264@media screen and (min-width: 576px) and (max-width: 600px) { 1265 .bg img { 1266 margin-top: -475px; 1267 } 1268 1269 .declarativeBOx { 1270 height: 100px; 1271 } 1272 1273 .declarativeBOx a { 1274 padding: 10px 10px 10px 10px; 1275 } 1276 1277 .declarativeInnerBOx { 1278 1279 margin: 30px auto; 1280 width: 57%; 1281 } 1282 1283 .declarativeImage { 1284 width: 20px; 1285 } 1286 1287 .declarativeText { 1288 font-size: 17px; 1289 line-height: 20px; 1290 } 1291 1292 .envoy img { 1293 width: 30px; 1294 } 1295 1296 .declarative-policy-contentBox-header { 1297 width: 30%; 1298 } 1299 1300 .declarativeEnvoy { 1301 line-height: 17px !important; 1302 } 1303} 1304 1305@media screen and (min-width: 601px) and (max-width: 650px) { 1306 .bg img { 1307 margin-top: -475px; 1308 } 1309 1310 .declarativeBOx { 1311 height: 100px; 1312 } 1313 1314 .declarativeBOx a { 1315 padding: 10px 10px 10px 10px; 1316 } 1317 1318 .declarativeInnerBOx { 1319 1320 margin: 30px auto; 1321 width: 57%; 1322 } 1323 1324 .declarativeImage { 1325 width: 20px; 1326 } 1327 1328 .declarativeText { 1329 font-size: 17px; 1330 line-height: 20px; 1331 } 1332 1333 .envoy img { 1334 width: 30px; 1335 } 1336 1337 .declarative-policy-contentBox-header { 1338 width: 30%; 1339 } 1340 1341 .declarativeEnvoy { 1342 line-height: 17px !important; 1343 } 1344} 1345 1346@media screen and (min-width: 651px) and (max-width: 700px) { 1347 .bg img { 1348 margin-top: -555px; 1349 } 1350 1351 .declarativeBOx { 1352 height: 100px; 1353 } 1354 1355 .declarativeBOx a { 1356 padding: 10px 10px 10px 10px; 1357 } 1358 1359 .declarativeInnerBOx { 1360 1361 margin: 30px auto; 1362 width: 57%; 1363 } 1364 1365 .declarativeImage { 1366 width: 20px; 1367 } 1368 1369 .declarativeText { 1370 font-size: 17px; 1371 line-height: 20px; 1372 } 1373 1374 .envoy img { 1375 width: 30px; 1376 } 1377 1378 .declarative-policy-contentBox-header { 1379 width: 30%; 1380 } 1381 1382 .declarativeEnvoy { 1383 line-height: 17px !important; 1384 } 1385} 1386 1387@media screen and (min-width: 701px) and (max-width: 750px) { 1388 .bg img { 1389 margin-top: -605px; 1390 } 1391 1392 .declarativeBOx { 1393 height: 100px; 1394 } 1395 1396 .declarativeBOx a { 1397 padding: 10px 10px 10px 10px; 1398 } 1399 1400 .declarativeInnerBOx { 1401 1402 margin: 30px auto; 1403 width: 57%; 1404 } 1405 1406 .declarativeImage { 1407 width: 20px; 1408 } 1409 1410 .declarativeText { 1411 font-size: 17px; 1412 line-height: 20px; 1413 } 1414 1415 .envoy img { 1416 width: 30px; 1417 } 1418 1419 .declarative-policy-contentBox-header { 1420 width: 25%; 1421 } 1422 1423 .declarativeEnvoy { 1424 line-height: 17px !important; 1425 } 1426} 1427 1428@media screen and (min-width: 751px) and (max-width: 767px) { 1429 .bg img { 1430 margin-top: -655px; 1431 } 1432 1433 .declarativeBOx { 1434 height: 100px; 1435 } 1436 1437 .declarativeBOx a { 1438 padding: 10px 10px 10px 10px; 1439 } 1440 1441 .declarativeInnerBOx { 1442 1443 margin: 30px auto; 1444 width: 57%; 1445 } 1446 1447 .declarativeImage { 1448 width: 20px; 1449 } 1450 1451 .declarativeText { 1452 font-size: 17px; 1453 line-height: 20px; 1454 } 1455 1456 .envoy img { 1457 width: 30px; 1458 } 1459 1460 .declarative-policy-contentBox-header { 1461 width: 25%; 1462 } 1463 1464 .declarativeEnvoy { 1465 line-height: 17px !important; 1466 } 1467} 1468 1469 1470@media screen and (min-width: 575px) and (max-width: 767px) { 1471 .boxTop h3 { 1472 line-height: 17px; 1473 } 1474 1475} 1476 1477@media screen and (max-width: 575px) { 1478 1479 /* .bg img{ 1480 margin-top: -260px; 1481 } */ 1482 .boxBottom, .boxTop { 1483 width: 280px; 1484 margin: auto; 1485 } 1486 1487 .boxTop { 1488 border-top-left-radius: 20px; 1489 border-top-right-radius: 20px; 1490 } 1491 1492 .boxTop-heading { 1493 position: relative; 1494 padding: 30px 15px; 1495 text-align: center; 1496 left: 0; 1497 top: 0; 1498 transform: none; 1499 } 1500 1501 1502} 1503 1504@media screen and (min-width: 1024px) and (max-width: 1200px) { 1505 .banner-content { 1506 text-align: center; 1507 padding-top: 100px; 1508 font-size: 31px !important; 1509 } 1510 1511 .bg img { 1512 margin-top: -180px !important; 1513 } 1514} 1515 1516@media screen and (min-width: 1201px) and (max-width: 1400px) { 1517 .banner-content { 1518 text-align: center; 1519 padding-top: 130px; 1520 font-size: 37px !important; 1521 } 1522 1523 .bg img { 1524 margin-top: -225px !important; 1525 } 1526} 1527 1528@media screen and (min-width: 768px) and (max-width: 991px) { 1529 .declarative-right { 1530 margin-left: 15px; 1531 margin-right: 15px; 1532 } 1533 1534 .declarative-policy-contentBox-header { 1535 width: 30%; 1536 } 1537 1538 .declarativeInnerBOx { 1539 margin-left: 30px; 1540 } 1541 1542 .navbar-brand img { 1543 width: 155px; 1544 } 1545 1546 .nav-tabs .nav-link { 1547 border-radius: 20px; 1548 margin-bottom: 10px; 1549 } 1550 1551 .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 1552 border-radius: 20px !important; 1553 } 1554 1555 #navb { 1556 padding-top: 15px; 1557 position: absolute; 1558 top: 85px; 1559 width: 100%; 1560 left: 0px; 1561 background: rgba(255, 255, 255, 0.90); 1562 } 1563 1564 .nav-tabs .nav-item { 1565 margin: 8px 10px !important; 1566 } 1567 1568 .verticle-tabs { 1569 top: 230px; 1570 } 1571 1572 .banner-content { 1573 padding-top: 90px; 1574 text-align: center; 1575 font-size: 23px !important; 1576 padding-bottom: 10px; 1577 } 1578 1579 .bg img { 1580 margin-top: -140px; 1581 } 1582 1583 .banner-subcontent { 1584 1585 text-align: center; 1586 font-size: 18px !important; 1587 } 1588 1589 .navbar-dark .navbar-nav .nav-link { 1590 color: #777 !important; 1591 } 1592 1593 .navbar-dark .navbar-nav .nav-item { 1594 padding: 10px 15px; 1595 } 1596 1597 1598 .blue a { 1599 font-size: 18px; 1600 } 1601} 1602 1603@media screen and (max-width: 767px) { 1604 .downArrow img { 1605 display: none !important; 1606 } 1607 1608 .declarative-left { 1609 padding-top: 0px; 1610 } 1611 1612 .declarative-right { 1613 margin-right: 0px; 1614 margin-bottom: 0px; 1615 } 1616 1617 .declarative-policy-contentBox { 1618 border-bottom: none; 1619 border-left: none; 1620 border-right: none; 1621 } 1622 1623 p { 1624 1625 line-height: 23px; 1626 } 1627 1628 #policy-authoring { 1629 padding: 0px 0px 50px; 1630 } 1631 1632 #declarative-policy-tabs { 1633 padding-bottom: 0px; 1634 } 1635 1636 #about { 1637 padding: 70px 0px 0px; 1638 } 1639 1640 .mobile-view-Banner img { 1641 display: block !important; 1642 } 1643 1644 .banner-content { 1645 font-size: 22px !important; 1646 padding-top: 100px; 1647 padding-left: 15px; 1648 padding-right: 15px; 1649 line-height: 28px; 1650 } 1651 1652 .policy-text p { 1653 width: 85%; 1654 1655 } 1656 1657 .about-text { 1658 width: 100%; 1659 } 1660 1661 1662 .verticle-tabs { 1663 position: relative; 1664 left: 0px !important; 1665 top: 0px !important; 1666 } 1667 1668 .nav-tabs .nav-link { 1669 padding: 13px 14px; 1670 font-size: 18px !important; 1671 line-height: 14px; 1672 border-radius: 5px !important; 1673 } 1674 1675 .nav-tabs .nav-item { 1676 margin: 8px !important; 1677 display: inline-flex; 1678 } 1679 1680 .nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active { 1681 /* padding: 8px 15px !important; */ 1682 font-size: 18px !important; 1683 line-height: 13px !important; 1684 border-radius: 5px !important; 1685 } 1686 1687 .nav-tabs { 1688 margin-left: 20px; 1689 } 1690 1691 .whitebox { 1692 overflow: auto; 1693 } 1694 1695 .architectural-flexibility-graphic-left, .declarative-policy-tabs-graphic, .architectural-flexibility-graphic-right { 1696 display: none; 1697 } 1698 1699 /* .nav-tabs{ 1700 margin-left: 0px; 1701 } */ 1702 .nav-tabs .nav-item img { 1703 width: 14px; 1704 height: 14px; 1705 margin-right: 5px; 1706 } 1707 1708 .verticle-tabs .nav-tabs .nav-link.active { 1709 line-height: 22px !important; 1710 } 1711 1712 .nav-tabs .nav-width { 1713 width: 139px; 1714 max-width: 139px; 1715 } 1716 1717 .tab-content { 1718 margin-top: 15px; 1719 } 1720 1721 1722 .bg img { 1723 display: none; 1724 } 1725 1726 .envoyLogo { 1727 width: 20px !important; 1728 } 1729 1730 #homebackground .banner-content { 1731 font-size: 29px; 1732 text-align: center; 1733 position: relative; 1734 z-index: 1; 1735 } 1736 1737 #homebackground .banner-subcontent { 1738 font-size: 18px; 1739 line-height: 24px; 1740 text-align: center; 1741 padding: 0px 15px; 1742 } 1743 1744 .navbar-brand img { 1745 width: 180px; 1746 } 1747 1748 #navb { 1749 padding-top: 15px; 1750 position: absolute; 1751 top: 65px; 1752 width: 100%; 1753 left: 0px; 1754 background: rgba(255, 255, 255, 0.90); 1755 } 1756 1757 .navbar-dark .navbar-nav .nav-link { 1758 color: #777 !important; 1759 } 1760 1761 .navbar-dark .navbar-nav .nav-item { 1762 padding: 10px 15px; 1763 } 1764 1765 #about { 1766 margin-top: 0px; 1767 } 1768 1769 .blue a { 1770 font-size: 14px; 1771 } 1772 1773 h2 { 1774 font-size: 30px; 1775 } 1776 1777 h4 { 1778 font-size: 18px; 1779 } 1780 1781 .policy-sharing h4 { 1782 position: relative; 1783 bottom: 20px; 1784 left: 0; 1785 } 1786} 1787 1788@media screen and (min-width: 1024px) { 1789 1790 .col-lg-2 { 1791 max-width: 20% !important; 1792 width: 20% !important; 1793 flex: 0 0 20% !important; 1794 } 1795 1796 .mobileView { 1797 display: none; 1798 } 1799 1800 .tab-pane .nav-tabs { 1801 margin-left: 40px; 1802 } 1803} 1804 1805.live--block-container .CodeMirror { 1806 height: auto; 1807 width: 100%; 1808 background: #fff; 1809 box-shadow: 2px 3px 6px rgba(51, 51, 51, 0.25); 1810 position: relative; 1811 border-radius: 20px; 1812 padding: 0; 1813 margin: 0; 1814 font-size: 1rem; 1815 cursor: pointer; 1816} 1817 1818.live--block-container .CodeMirror-lines { 1819 cursor: pointer; 1820} 1821 1822.CodeMirror-cursor, div.CodeMirror-cursor { 1823 opacity: 1; 1824 display: none; 1825} 1826 1827.live--icon-bar--outer { 1828 display: none; /* TODO: Fix this at some point? */ 1829} 1830 1831.code-tab-content { 1832 box-shadow: none; 1833 border: none; 1834 padding: 0; 1835 margin: 0; 1836} 1837 1838@media screen and (max-width: 1023px) { 1839 .desktopView { 1840 display: none; 1841 } 1842 1843 .code-tab-content { 1844 box-shadow: none; 1845 border: none; 1846 padding: 0; 1847 margin-left: 10px; 1848 margin-right: 10px; 1849 margin-bottom: 15px; 1850 } 1851 1852 .tab-content { 1853 background-color: #fff; 1854 } 1855} 1856 1857@media (min-width: 992px) { 1858 .social-icon-link { 1859 padding: 0; 1860 } 1861 .social-icon-link img { 1862 padding: 0; 1863 } 1864} 1865 1866/* 991px is when the mobile nav-bar shows up */ 1867@media screen and (max-width: 991px) { 1868 .social-icon-title { 1869 display: inline; 1870 } 1871 1872 .social-icon-link { 1873 padding: 0.5rem 1rem; 1874 } 1875 1876 .social-icon-link img { 1877 display: none; 1878 } 1879} 1880