I want to build a website in visual studio code using CSS language, but I got an error

[enter image description here][1]


[enter image description here][2]


  [1]: https://i.stack.imgur.com/VitMj.png
  [2]: https://i.stack.imgur.com/sJw7r.png


and if the photo does not open


error1:[{
	"resource": "/C:/Users/Win/OneDrive/Belgeler/css/style css 2.css",
	"owner": "_generated_diagnostic_collection_name_#1",
	"code": "css-lcurlyexpected",
	"severity": 8,
	"message": "{ expected",
	"source": "css",
	"startLineNumber": 7,
	"startColumn": 7,
	"endLineNumber": 7,
	"endColumn": 14
}]
cod: 
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');
      @import url('https://fonts.googleapis.com/css2?family=Herr+Von+Muellerhoff&family=Poppins:wght@400;500;600;700;800&display=swap');

error2:[{
	"resource": "/C:/Users/Win/OneDrive/Belgeler/css/style css 2.css",
	"owner": "_generated_diagnostic_collection_name_#1",
	"code": "css-lcurlyexpected",
	"severity": 8,
	"message": "{ expected",
	"source": "css",
	"startLineNumber": 125,
	"startColumn": 12,
	"endLineNumber": 125,
	"endColumn": 13
}]

cod:.btn-photo::after{
      display: block;
      color: #1ef0ff;
     color:rgb(98, 180, 252)
     padding:10px 15px;
     border: top left radius:35px;
     border-bottom-right-radius:35px;
     position: relative;
     overflow: hidden;
     }

":"  in its place ";"

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap');

@import url'https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800&display=swap';