style.css 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
  1. html {
  2. scroll-behavior: smooth;
  3. }
  4. body {
  5. background-color: #121212;
  6. font-family: Arial, sans-serif;
  7. }
  8. .main_container {
  9. display: flex;
  10. flex-direction: row;
  11. flex-wrap: wrap;
  12. margin-left: 3%;
  13. margin-right: 3%;
  14. gap: 2%;
  15. /*border: 0.5px solid rgb(208, 160, 236);*/
  16. }
  17. /*Container*/
  18. .text_container {
  19. position: relative;
  20. width: 42%;
  21. min-height: 70%;
  22. margin: 3%;
  23. display: flex;
  24. flex-direction: column;
  25. flex-wrap: wrap;
  26. justify-content: flex-start;
  27. border: 0.5px solid rgb(255, 255, 255);
  28. }
  29. .img_container {
  30. margin: 3%;
  31. min-height: 40%;
  32. width: 42%;
  33. display: flex;
  34. flex-direction: column;
  35. align-items: flex-start;
  36. border: 0.5px solid rgb(255, 255, 255);
  37. }
  38. /*Content Classes*/
  39. .main_text {
  40. order: 0;
  41. padding: 15px;
  42. margin: 3%;
  43. text-align: left;
  44. border-radius: 0px;
  45. color: white;
  46. align-self: flex-start;
  47. /*border: 0.5px solid white;*/
  48. }
  49. .main_img {
  50. position: static;
  51. justify-self: center;
  52. margin-left: 30%;
  53. width: 45%;
  54. height: auto;
  55. border-radius: 70%;
  56. object-fit: cover;
  57. /*border: 0.5px solid rgb(227, 27, 143);*/
  58. }
  59. .projects {
  60. order: 1;
  61. padding: 2%;
  62. margin: 3%;
  63. margin-top: 5.5%;
  64. text-align: left;
  65. border-radius: 0px;
  66. align-self: flex-start;
  67. color: white;
  68. /*border: 0.5px solid white;*/
  69. }
  70. .contacts {
  71. order: 2;
  72. padding: 2%;
  73. margin: 3%;
  74. text-align: left;
  75. border-radius: 0px;
  76. align-self: flex-start;
  77. color: white;
  78. /*border: 0.5px solid white;*/
  79. }